Download
life the universe and gui design n.
Skip this Video
Loading SlideShow in 5 Seconds..
Life, the Universe and GUI Design PowerPoint Presentation
Download Presentation
Life, the Universe and GUI Design

Life, the Universe and GUI Design

90 Views Download Presentation
Download Presentation

Life, the Universe and GUI Design

- - - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

  1. Life, the Universe and GUI Design By Mike Miserendino

  2. 42

  3. What is the question?

  4. Where do we start?

  5. Requirements

  6. Requirements Sources • Research • User Interviews • Focus Groups • User Groups

  7. Interview • Ask lots of questions • Have the user do most of the talking • Mix questions types from yes/no to those requiring an explanation

  8. GUI Guidelines and Standards • Contains basic design guidelines • Provides a consistent look and feel • Helps maintain company standards • Builds foundation for UI specifications

  9. User Interface Specification • Blueprint for all user interfaces • Contains user interface layouts and overall application map • Describes function of all user interface components • Details the layout, behavior, and flow of all UI content • Establishes detailed requirements • Provides verification testing

  10. User Interface Map

  11. Display Definition

  12. Menu Layout

  13. Page Layout

  14. Functionality

  15. Toolbar Definition

  16. Architectural Specifications • Modeled from User Interface Specification and business logic • Provides basis for Interface Control Document

  17. Interface Control Document • Maps user interface to application • Derived from UI Specification • Satisfies UI requirements • Standard reference for the GUI developers so that they can look up and understand the interface methods exposed by the Back-End components

  18. Insert ICD Sample Here

  19. User Interface Design • Good UI design has everything to do with the user's tasks, goals, cognitive processes, and behavior. • Simple • Functional • Clean

  20. Design Inspiration • Print Ads • Graphic Design • TV / Movies • Real life models

  21. Advertisement Clippings

  22. Okudagram • Display type invented by Michael Okuda for starship console displays seen in Star Trek. • http://www.lcarscom.net/

  23. Sketches • Roughs of user interfaces or controls • Add functional notes as needed • Notepad or graph paper • Colored pens

  24. Sketching

  25. Wall Layouts • Use Velcro backed cutouts or pinups of controls • Sticky notes • Easy to layout and modify • Excellent for brain storming • Difficult to back up – manual copy • Not space efficient

  26. Dry Erase Board • Cheap • Quick • Easy to modify • Limited size • Manual backup

  27. Interactive Sketch Board • Dry erase board with PC or printer • Capability to save to file or hard copy • Slow • Expensive

  28. Prototyping for Design • Simple functions available • Time consuming • Limited access • Reuse during prototyping phase

  29. UI Models • Deductive User Interface • Inductive User Interface

  30. Deductive User Interface • Most elements in software today require the user to study them and deduce their behavior • Typically found in traditional applications

  31. Deductive User Interface

  32. Inductive User Interface (IUI) • Also called inductive navigation, the IUI model suggests how to make software applications simpler by breaking features into screens or pages that are easy to explain and understand. • Informal tests suggest that users can perform tasks as quickly in this model as in traditional interfaces, and may find things more easily.

  33. Microsoft Money

  34. Microsoft Money

  35. Design Considerations • Navigation • Input Devices • Use of Controls • Color • Text

  36. Navigation

  37. Navigation • Some UIs are like a maze. • Mazes make good puzzles. • People are not particularly good at remembering long sequences.

  38. Input Devices • Keyboard • Mouse • Tablet • Touch screen

  39. Control Clutter

  40. Order

  41. Visible • If something is important enough to be displayed to the user, make sure that the user will be able to see it.

  42. Visible

  43. Visible

  44. Consistency • "consistency makes the interface familiar and predictable“ (The Windows User Interface Guidelines for Software Design, Microsoft Press)

  45. Consistency

  46. Consistency