1 / 14

Design Principles

Design Principles. The good and the bad Alyssa Mendiola Summer 2009. Contrast. Contrast is a marked difference A well designed site has contrast, which can be a difference in.. Color Images Fonts Size. Contrast.

sherry
Download Presentation

Design Principles

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Design Principles The good and the bad Alyssa Mendiola Summer 2009

  2. Contrast • Contrast is a marked difference • A well designed site has contrast, which can be a difference in.. • Color • Images • Fonts • Size

  3. Contrast • This website has clearly takes the principle of contrast to the extreme. There are too many colors flashing, causing visual overload. There is also too many different fonts present. Everything is different, bright flashy and there is too many different kinds of patterns. The eye can’t focus on any one object because there is too much going on. Web designers should limit their colors as well as their text styles. The Bad

  4. Contrast • This website is very subdued, the bright green text is different from the muted gray background and white text. The eye instantly focuses on the green words since there is such a difference in intensity from the rest of the website. The Good

  5. Repetition • The repeating of something so that it is the same as before. • It unifies your design • Repeat elements such as • Color • Font Style • Graphics • Size

  6. Repetition • This website had the right idea that repeating pictures unifies a website, but this one is distracting. The site would have been better if they had forgone the tile format and had one picture in the background. It would also be easier on the eyes if the text repeated some colors from the picture, thereby unifying the site. The Bad

  7. Repetition • This site repeated the orange color with great success. Even though there is a lot going on the site, each panel is tied to those surrounding it by using the same orange in the text and navigational buttons. The purple is also repeated, to a lesser degree, tying the site together even more. The repeated colors don’t stress the eyes and makes it easy to read. The Good

  8. Alignment • Linear or orderly arrangement • Creates cohesion • Centered text is hard on the eye

  9. Alignment • The center alignment on this page makes it hard to read. The eye gets tired and since each line starts in a different place, there is no consistent place for the eye to start the next line. The page is mostly text and while the center alignment does not hurt the navigation area located on the left side, it is detrimental to the body of the website. The Bad

  10. Alignment • This website has everything lined up nicely. It is easy to read and looks neat and professional. Everything is left justified, allowing the eye to read the text easily. Even the pictures line up with the text boxes creating a crisp sharp looking site. The Good

  11. Proximity • Closeness • The way items are grouped and spaced allow the viewer to recognize the organization.

  12. Proximity • This webpage is a horrible example of proximity. The site has navigation links and logos all over the page. Nothing is in proximity to each other, making it look unorganized and sloppy. The Bad

  13. Proximity • Everything is arranged neatly. In addition to the proximity the pictures and text provide, the red boxes act to further categorize and arrange the content. The viewer can quickly see how the site is organized. The Good

  14. Resources • The Bad • http://www.miauk.com • http://www.photographertoronto.com • http://www.drjoye.com • http://www.mci.edu/com/index.html • The Good • http://www.urbanlegends.com • http://www.funology.com • http://www.geocaching.com • http://www.questacon.edu.au

More Related