1. Design 1: Conceptual Design

2. Objectives By the end of this class, you will be able to… Given a scenario, allocate tasks among the system and the user(s). Describe conceptual design and explain why it is an important step in the design process. Create a content diagram to outline the organization of an interface.

3. What is conceptual design? Why should you do it? Process of establishing the underlying organization of a user interface Makes sure your interface is organized in a logical manner from the user’s perspective –NOT from the system perspective!

4. Example: svnX Task: Update my copy from a repository But HOW? Interface organized by underlying system

5. If you double-click the repository…

6. If you double-click the local copy…

7. Contrast with TortoiseCVS Integrates with file browser Organized by user’s task

8. TortoiseCVS Goals “To keep the interface very simple for the user. This means not having configuration dialogs that you have to go to before things work, and instead asking questions where the answers are needed for the first time. It means doing as much as possible automatically, by being clever rather than bloating the user with extra options to worry about.”

9. When should you do conceptual design? After some scenarios and use cases are established Before interface sketching begins –Need to know what a screen should contain before you design it!

10. How do you do conceptual design? Start with scenarios and use cases. Forces you to… –Divide tasks into system tasks and user tasks –Explicitly define all objects, actions, and attributes needed for a task Affinity diagramming –List each function on a sticky note –Arrange sticky notes until organization is logical –Result: a content diagram (aka affinity diagram)

11. Content Diagrams / Affinity Diagrams

15. Key Points Do conceptual design before designing actual screens Use sticky notes, cards, or drawing software to create the conceptual design