The Adventures of Cindy Li

@media2006: Good Design vs Great Design

June 15 , 2006

Speakers

Cameron Moll
Veerle Pieters
Jon Hicks

Define Design in just 1 sentence
cameron: Design is about communication but design cannot exist without a medium of some sort. Outdoor sign-age, multimedia.
V: way of communicating emotional its expresses feelings so its design
j: design is not printed because its been a lot of debate how ugly design or no design wins it misses the point that design is about communication

Design is very subjective

you may not think of is great design
design is about approaching a problem with many routes

How important is it to be original and creative when designing something?

Cameron: creativity and originality ... is over rated.
Failing to be inspired by the people around us
Good designers look at other sources in the same genre
where great designers are surrounded by everything around them for inspiration that are separate from the genre
Veerle: Originality is important to make it better.
Jon: Its nice to be able to be original but that isn’t necessary to be doing. Maybe the best way is to follow the conventions already set.

Is it possible to have great design on a budget?

Jon: No, because I think designing something is as much as thinking type
The interface is better than 3 months ago
Cameron: I think what separates good design and great design is their ability to respond to the timeline. That time line is always shorter
great designers are able to create something
Veerle: Great design you need extra time. To make the design great you need extra time and that affects the budget
Jon: more money
Veerle: great designers can come up w/something good though
Jon: if you were a great designer you wouldn’t take that long

Cameron on grids

the beauty of a grid lies in the fact it does the work for you.
A grid will ease the decision for you

3 steps

• Assess: the content characteristics What are the content characteristics? Extra long headlines? Photo? Ad formats? user information? Look at the characteristics
• Violate that grid when necessary. It needs to be flexible enough. Perhaps its a photo that takes over 3 columns “it’s important to understand that the grid… should never subordinate the element

U then have columns that divide across the page you have modules
You’ve got flow lines that are horizontal

Methods in web design

note there are more.. but I limited it to 5

• 1. Fixed width, uniform Example: new york times inspired by the onion Now if we look at the grid structure of this there are 11 columns of this that divide the content and with that you have spatial zones if we overlay that for the zones you’ve got side bar analysis and bars If you dig in you will see the same structure for the site try sticking in a background image and turn that on and off as you coding. By using a background image it facilitates to that grid
• 2. Fixed width, hierarchal Example: national gazette (jason saint-maria) this is based on the placement of elements On the left or right you have two grids that are 100 pixels away The reason for this is on the left and right side bars. We’ve allowed proper sizing for the ad sizes. In the middle required the photo. Let’s look at this as a content structure The content shifts to the left
• 3. Fluid width, uniform Here is the site for this conference. This is fluid width. 4 columns and the top being joined but the bottom has 3 columns. We’re making it easier by making the grid work
• 4. Fluid + fixed width blanks screen, the underlying site has 5 columns on the bottom, one across, then two split and the top joined. why so bizarre? this is probably the 15th iteration where we tested a variety of layouts so that it is specific to the content.
• 5. modular scale: it is not random or chaotic but in web design that deserves some attention. Think of astronomy the scale would be like star charts, Music has some refined ratios Major 3rd 4:5 Dim. 5th/Aug.4th 1: 2 Minor 6th: 5:8 Something that dictates These five understand grid apply it to web design Talking type: Jon Hicks Typography is its the most subtle “Every typeface has a language which language is right?” Context Who is speaking using fonts “Never mind the bollocks here’s the sex pistols” type can be the design itself It can make it or ruin it Its not appropriate Not looking so hot now, eh? Comic sans is great for designs too! Activity farm “Farmer Gow’s” Throughout all their branding they used comic sans They chose it appropriately Design using Meta Design using trebuchet Harmonizing fonts Americans love serif type Europeans love sans-serif type Swiss created helvetica Great typography is not… choosing a “cool font” Great typography is… invisible is to aid reading it isn’t intended to be noticed it is about the space around the letters and text A list apart Jason did the typography It is focused on the typography so for example it is ready to scan subtraction.com even though there aren’t real text Then everything in the actual content to create visual hierarchy There are lots of rules Those tiny little sparks There is an element All these examples I found on one blog Denis Raden… has examples good designers-good typefaces great designers: great typography Improving typography: Sign up for type catalogues Get excited about typefaces and learn the language It gives you an idea of what type… The elements of typographic style Veerle What makes a great design, purely judging on the use of color? We choose vibrant colors but sometimes gray can be stylish too It depends on the purpose of design Contrast is important but you have to use it in the right proportion You want extra contrast in the design because you want to evoke an aggressive effect. Make sure you have enough rest points. To get the right balance Westtoer These colors are important role because it gives extra guidance in the website Corporate sections and consumer section Use the same color for the main navigation and excellence the diff sections have different audience consumer and professional hiking and biking The challenge is use the colors in the right proportions without over doing it otherwise it seems to be a color book The other slides showing biking section so here the orange takes over the design a little more Details are important in the design you will feel the girly touch Design matters: its very difficult to decide what makes good design Which do you do first? Grid, color, or typography Jon: b/w layout to suggest the areas.. color last for me Cameron: Something evolves with the client, what to emulate I’ve got 15 mins.. typography its collaborative I generally start with the grid If there is a house guide sometimes the colors are already there.