Author Archive

A.04. Graphic Design

by jessica-b

Whenever people ask me what my major is and I say graphic design. They always have the question, what is graphic design? Does it have something to do with advertising? What are you going to do with that major? Many questions like these and more have been asked about designing. 

What should we tell people that graphic design is? The dictionary explains graphic design as a visual communication by a skillful combination of text and pictures. Graphic design encompasses so much of the world and things that we look at every day. Anywhere you go, it is on signs, posters, books, packaging, menus and so many more places.

Design is not only making something look pretty

Design is not just making things look pretty is one of the most important points to get across to non-designers. A huge part of design is presenting ideas or concepts in a beautiful way but also have it serve a function. The most accomplished designers see the importance of deep research, planning and problem solving. A good designer is able to find a perfect balance between the content and design and solving the problem at hand. Through experience I have seen many projects of people that look like they were more worried about the design than the content and you can see that they don’t fit together and something is missing. When I do see good design it is when the design was made after research and careful thinking and you can see how both are working together to make something wonderful and interesting to look at. The best projects have meaning, and people care about them.

When people ask about graphic design it is important to explain that design is not just making something pretty, it is so much more, Design is making something that has meaning, importance and makes sense. This is not an easy thing to do but if done well than people will notice the difference between good design and okay design.

The difference between designers and non-designers

After working as a Graphic Designer on campus for over 3 years now, I have had a lot of chances to learn what people expect from designers. It was a huge change to move from working under Brother Burgener (a designer who knows what he is doing) to an office that had a small sense of design.  The new office had the sense of design that most people in the world have, that design is to just make something  look “good.”  As I spent more time working there I was able to show my boss that design isn’t just cheesy catch lines and arraigning images on a poster well. Good design is well thought out and simple, but elegant ways to get the point across instead of the cheesy catch lines like, Does your resume stink, and putting a photo of a girl holding a dead fish. Design is so much more than that it has a purpose.

Another lesson that I learned while working for a boss with no design background was that you have to make your clients happy even if you don’t like the idea. While working I had to do a lot of projects for a lady who thought she new what looked good. I couldn’t convince her of anything else and her favorite font was Papyrus. Everything had to be in papyrus and she new that it looked good. I gave this client many options that were well designed and looked a lot better than what she first suggested. Sometimes non-designers think they know what looks best when they really don’t. 

In the end I had to learn to design with Papyrus. I know that the projects I did for her will never go into my portfolio and didn’t look good at all, but I had to learn to work with the client and make a poster with smelly resumes and photos of dead fish and using papyrus.  We as designers have to learn to work with what we get and make it look, as good as we can and sometimes it isn’t easy. Any designer, who can make papyrus look really good, is an amazing designer and I would love to learn from them.

 Don’t design only to look good

It is important to design for a reason and not to just use something because it looks good.  In Robert Bringhurst book Elements of typographic style; he explains how good design is thought all the way through. The design of the type is just as important as the composition and the subject. We really should use a typeface that fits our design not just because it looks good but also because it fits the concept of our design. 

Web design is just as important as print or any other parts of design. Websites are to improve communication and to help people find information. Websites were a new type of design and included headers, navigation and footers, thing that had never existed before. Since the beginning of web design, many changes have been made and now there are so many more options to choose from. So many more choices in typefaces are being offered, even though the choices are still limited, design is improving a lot.  

Same as print and other types of Graphic Design, in web design the functionality is just as important. The function of web design is very important to understand navigation. Now sites can be an interactive experience that looks good.  Designers can now solve problems involving the navigation and moving through pages of a site, which is a very new experience.

Though my experience, the best web design are the simple but easy to navigate. The sites that use all the bells and whistles of design, too many drop shadows and Photoshop filters are very crazy and not very easy to understand and not thought through.  Instead a well-designed site explores new and exciting graphics with surprising images.

 The best design will be when the designers and web developers work together to understand each other. When that happens completely, the web will be a much better looking place because there will be so many more choices and opportunities for some beautiful sites. As people experiment and learn more about web design the web will start to look better and better.

A.02 Execution and Implementation

by jessica-b

The execution and implementation of my site was a lot of work. At first I had no idea what I was doing and how to accomplish what I wanted my site to look at. It really helped to figure out some of dreamweaver and learn the simple  ways  to use HTML. 

It really helped to design my site in photoshop and then move to dreamweaver. I was able to learn how I needed to save all my images for the web using the right file formats. 

Using an external style sheet and designing with CSS was a little more work than I expected. I learned that there is a lot more to HTML than I ever imagined and you can go as in depth as you want with your styles. I noticed a difference in my site in switching browsers. It looks exactly how i want it to in firefox but as I go into something like safari the measurements change and some little things are different. 

In conclusion it took some work and a lot of learning but in the end I got the results that I wanted.

A.02 Site link

by jessica-b

Here is the link for my site all about the Arizona 5th grade science standard that teaches all about clouds. 

www.jessicabutlerdesign.com

A.02 Design

by jessica-b

I am working on getting my site up using the css and dreamweaver stuff. This has been a very interesting experience for me. I have never done any website design stuff before and it has taken a lot of work to understand. 

At the moment this is what my site looks like up when it is live. I am still trying to figure out some kinks in the navigation bar and header. I am missing a black bar on a couple pages on the header and the padding disappears in the navigation buttons after the page are visited. I also noticed I misspelled something when making my home button a link so that isn’t working either. I think I will be able to figure out how to fix these things it will just take some figuring out.

 

Here is a screen caption of my live site

Here is a screen caption of my live site

 

 

You can visit my site at www.jessicabutlerdesign.com if you want to see what i have done so far. 

I had a question about my design. I am planning on adding pictures on the side of the information. Illustrations showing more in depth information. So that will be there but, do you guys think that the white background is okay. I like how simple and clean the site looks but i don’t know if it will be too simple. I like the white because of the cloud theme. One more question, is my text too small or is it okay for the site? Or is it too long of a text line?

Imagery and site mock up change

by jessica-b

After the comments I received about my last site mock up I have made a few changes to the design of my site.

I made it so that Cloud class would appear on each page as it changes, the type of cloud changes when you go to that page of the site. I changed a lot of the brown to black to make it look a lot cleaner.

As for the imagery, I made it so that the focus in the header was more the clouds and sky. I made it so there would be a lot less ground and a better looking sign.  I also made some of the colors more vibrant in the sky so that the white clouds stand out more.

 

main page

main page

 

Secondary page

Secondary page

A.02 Imagery

by jessica-b

I decided to create my own imagery for my cloud website. This was a fun project even though a little scary, I am defiantly not an illustrator.

A sample of my site imagery

A sample of my site imagery

My images are simple and childlike but hopefully are fun. Images for clouds are interesting because it is hard to illustrate the differences between the cloud types but I think i can do it. I’ve included a sample of the feel I want my site.

A.02 Typography

by jessica-b

I decided that I wanted to use a simple san-serif font. I feel like san-serif fonts feel younger and will relate more to 5th graders. 

Along with using a san-serif I want to have some fun type in the header that is fun and interesting. I decided on something that looks like a fifth graders doodle on a school paper.

Some type for my header

Some type for my header

As I tried different types of fonts I ended up using something simple and not too crazy since my header is pretty busy. 

I noticed that typography on a website needs to be a lot larger than in print and needs more leading.  I want to use paragraphs instead of bullets, it will work better for my type of information.

A.02 Mock-up

by jessica-b

I really enjoyed this step in the process of designing the site. I want this site to be bright colors and fun illustrations. 

The main page is titled Cloud class and will be the introduction to teaching the kids all about clouds. They will be able to find out what a cloud is on the main page and then they can click on any of the types of clouds and will learn about each one. 

When they click onto the types of clouds, the main head bar will change a little bit with each page. The main page will be more different that the rest, but as they get into the types of clouds, the background will stay the same but the types of clouds will change and the name on the sign. I wanted this to be all about the cloud type so there isn’t as much “stuff” in the image. 

I wanted to make it simple and easy to read for the 5th graders but also for me. This is the first time designing a site and I want to have something I can do without loosing my mind, and get more complex after that.

This is what I am thinking about for my main page.

This is what I am thinking about for my main page.

cloudclasspage2

This is my secondary page idea.

A.02 Gray Box

by jessica-b

I think this was a very helpful step, it helped me to understand more about how my navigation will work and the actual design. Now when I go to code the design will be a lot easier.

This really helped me with a visual outline for my site. I want it to be catchy for the 5th graders, but also easy to read and to learn from. I wanted a large header with an image that will show what the site is all about. on each page the image on the bottom will change to the type of cloud and will be very educational but fun to look at. 

I think this will be a good site to teach 5th graders science without them getting bored.

This is my idea of a fun science website.

This is my idea of a fun science website.

Lab No.10 Thumbnails

by jessica-b

In this lab I was able to draw thumbnails of well designed websites. It was also important to understand the anatomy of the sites i was drawing and to understand them better while drawing thumbnails that could communicate.

12 Sketches

Here are the 12 sites

While doing these thumbnails it really helped me to look at and understand more about the anatomy of a website. It helped me to find some fun and creative websites that really worked for there purpose but also in the process I found some really bad sites that didn’t accomplish anything. 

By drawing thubnails of sites I was really able to take apart each website and find the best places to put information, body type, search bars, headers, navigation and more. This lab also helped me to understand how creative you can really be. You do not have to stick to only one the normal format that many websites stick to. 

I also found it interesting to see how some sites were designed in other languages and how they were designed differently.

Now I think I will be able to understand how much more creative I can be with the design of my own websites. It is also always a good idea to know what is out there to help you be a good designer.  I hope that my thumbnails are able to communicate the message of the websites that I drew. It isn’t always the easiest thing to do.