Speaker: Shane Morris @shanemo
- lack of whitespace causes clutter - very flat - colour balance across the page drawing the eye to one location. - promote symmetry. - where is the logical starting point in the page. Queues. - What do we want people to see and in what order? - Uppercase is harder to read due to outline versus mixed case text. - What is lower down on the page? - Avoid spilt navigation 1. Graphics come last, not first. 2. Set goals - User, business, usability, experience. 3. "You are not your user 4. test early and often 5. Go with the flow Start with navigation and flow of the tasks Layout steps 1. Map out the workflow - What would a first time user do. 2. List your content - Widgets - quince.infragistics.com Pattern Library 3. Layout the elements in order - left-right, top-bottom. 4. Check natural grouings - Keep releated concepts together. Presentation 1. Remove every unnecessary element. 2. Minimise Variation - Err on the side of consistency. 3. Colours "Red and green should not be seen without a colour in between." "Angry fruit salad." Rate 1 to 5 for visual design skills and use that many colours. Neutral background colours are safest. (white, grey, black, navy blue,) Pull colours from a suitable photo. kuler.adobe.com colourlovers.com About 10% of males have some form of colour blindness. Vischeck.com How many diffent type faces shoul I use? 3. Line stuff up. - Beware unintended relationships 4. Space and Size things evenly 5. Indicate Grouping - Group boxes - Similirity - Proximity - Alignment - Empty Space Visual Hierarchy 6. Adjust Visual weight Hot colours, Size, Contrast Irregular Shapes Misalignment 3D Animation.