1. Use of layout and consistency in designing interfaces Michael, Paul, Jason, Augusto

2. Main Topics for Discussion  What are/is an interface?  What is layout and how should it be implemented when designing Interfaces?  How should layout be kept consistent?

3. Interfaces

4. What is Classed as an Interface?  An interface is what you see when you look at your monitor: the collection of words, pictures, buttons, menus, etc.  The interface is also sometimes referred to as the graphic user interface, which can be abbreviated to GUI.

5. Types of Interfaces  Websites  CD-ROM  DVD  Games  Mobiles  TV

10. Layout

11. What is Layout?  Layout is the way photos, graphics, text are placed on screen based or print based media which is perfect and pleasing to the eye.  Colour and the size of type or graphics make the layout more interesting and also making the media not cluttered helps.

12. Guidelines for layout  Create a very simple, easy-to-understand navigation system that doesn't take up too much space.  All else fails when user’s cant read the text.  Use colours with high contrast between the text and background.

13. Guidelines for layout 2  Use either plain coloured text backgrounds or extremely subtle background patterns.  Use large enough fonts e.g. (12 pt)  Body text 40 – 60 characters per line or 10 – 15 words.  Avoid animation text.

14. Guidelines for layout 3  Remember how users find and read information on the web.  Use 50% fewer words than you would in print.  Use objective non-promotional writing style.  Make your text and page scan-able.

15. Guidelines for layout 4  Use different approaches suited for your content.  Make sure that everything on the page is where it is for a purpose.  The basic principle to remember is that related things should be pulled closely together.  The same font style can be used throughout a document

16. Layout in Print  Layout is a big part in the print industry because it can not only be used for Magazine articles to align and columnise sections of type but also to align the most appealing images and type on posters, leaflets, flyers etc.

18. Consistency

19. What is Consistency?  “The property of holding together and retaining its shape.”  If a company has a corporate image e.g. colour, logotype, these should be kept consistent throughout the media, to make sure the media relates to the company.

20. Consistency in Print  This is shown through corporate branding or even advertising campaigns. Corporate branding relates to a style or theme, related to that company such as letter heads, business cards and logos all appearing similar.

21. What should be kept consistent?  Fonts / Typeface  Colours  Navigation  Logo  Structure

22. www.ibm.com

23. http://www.statefairwebs.com/

24. Summary  Layout Use colours with high contrast between the text and background. Use very simple, easy-to-understand navigation system. All else fails when users can’t understand the layout of the media and won’t return to view the media. So make sure that everything on the page is where it is for a purpose.

25.  Consistency Fonts / Typeface, Colours, Navigation, Logo & Structure, should all be kept consistent throughout a document. This makes the media relate to the company.

27. Useful links  www.useit.com www.useit.com  www.colorado.edu/AmStudies/lewis/Desig n/sofar.htm www.colorado.edu/AmStudies/lewis/Desig n/sofar.htm www.colorado.edu/AmStudies/lewis/Desig n/sofar.htm  www.tlc-systems.com/webtips.shtml www.tlc-systems.com/webtips.shtml

28. References http://uk.playstation.com/home/home01_generic.jhtmlhttp://www.xbox.com/en-GB/default.htm http://www.broadbandbananas.com/ skyactivemenu.jpg http://www.virtutech.com.au/ pics/new/O2_Xda_ii_b.jpg http://www.geocities.com/Colosseum/9890/http://www.amazon.co.ukhttp://www.ibm.com/us/http://www.statefairwebs.com/ http://www.cnnfn.com/.../ microsoft/microsoft.03.jpg