1. Digital Media & Interaction Design LECTURE 4+5

2. Lecture 4+5 Draw requirement + Prototyping

3. Outline Draw requirement: Scenario-based design Prototype concept Why prototyping is useful Prototype Fidelity

4. Draw Requirements PrototypingEvaluation Understand User The User Center Design

5. The Importance of requirements Why: Requirements definition: the stage where failure occurs most commonly

6. Different kinds of requirements Functional: What the system should do Historically the main focus of requirements activities Non-functional: memory size, response time... Data: What kinds of data need to be stored? How will they be stored (e.g. database)?

7. Scenario-based design Scenarios: Describe the use of the system as a series of interactions between a concrete end user and the system

8. How do we find scenarios? Don’t expect the client to be verbal if the system does not exist Client understands problem domain, not the solution domain. Don’t wait for information even if the system exists “What is obvious does not need to be said” Engage in a dialectic approach You help the client to formulate the requirements The client helps you to understand the requirements The requirements evolve while the scenarios are being developed

9. Ask yourself or the client the following questions: What are the primary tasks that the system needs to perform? What data will the actor create, store, change, remove or add in the system? What external changes does the system need to know about? What changes or events will the actor of the system need to be informed about? However, don’t rely on questions and questionnaires alone Insist on task observation if the system already exists (interface engineering or reengineering) Ask to speak to the end user, not just to the client Expect resistance and try to overcome it

10. How to write a use case Name of Use Case Actors Description of Actors involved in use case Entry condition “This use case starts when…” Flow of Events Free form, informal natural language Exit condition “This use cases terminates when…” Exceptions Describe what happens if things go wrong Special Requirements Nonfunctional Requirements, Constraints

11. Activity

12. Draw Requirements PrototypingEvaluation Understand User

13. What is Prototype? Creating workable model of the interface/ system for evaluate and testing support different activity,doesn’t necessary have to be fully working Not final system but version that allows for evaluation and feedback

14. Prototypes “...Prototypes provide the means for examining design problems and evaluating solutions. Selecting the focus of a prototype is the art of identifying the most important open design questions.” Houde and Hill

15. Why it is useful ? Allow evaluate before system fully implemented, changed can be made Allow designer to refine ideas and get closer to final product Hands-on ways to get user + designer to discuses the ideas Implementing some aspects of system for evaluate and discussion Support formative evaluation Easier to modify what doesn’t work Useful for evaluate alternative design Encourage reflection in design

16. What to prototype Technical issues Work flow, task design Screen layouts and information display Difficult, controversial, critical areas

17. Fidelity The closeness between the prototype and the final system in term of functionality. Fidelity X  quality

19. Low fidelity Prototype: Distance between prototype and final system is noticeable No functionality in most,but the sense of what interaction can be like Ex: 1-Paper prototype :A paper prototype is a physical mockup of the interface, mostly made of paper. It’s usually hand-sketched on multiple pieces, with different pieces showing different menus, dialog boxes, or window elements. The key difference between mere sketches and a paper prototype is interactivity. Http://www.youtube.com/watch?v=BgJVDnUYSDg Is quick, cheap and easily changed

20. 2- Storyboarding: It is a series of sketches showing how a user might progress through a task using the device 3-Sketching : valuable because they focus attention on the issues that matter in early design without distracting anybody with details

21. Medium Fidelity Prototype: 1- Wizard of Oz prototype: is a kind of hybrid of a computer prototype and a paper prototype; The user interacts with a computer, but there’s a human behind the scenes figuring out how the user interface should respond. simulate the interaction of the system without having to implement them Effective for testing the feasibility of a complex interface

22. 2- Screen base interface Simulation of screen base interaction with Dreamweaver,flash 3- Video prototype : Enhance possible interaction and simulate through editing the way in which certain system would work-Based on scenarios http://www.youtube.com/watch?v=wbiYAqbZryA

23. Medium-fidelity tools Balsamiq Mockup Photoshop Mockingbird

24. High fidelity Prototype Full function Imagine possible interaction behavior Evaluate design idea

25. Learning Goals 1 - Understand the uses of different types of prototypes for different kinds of designs and be able to choose appropriately 2-Know the basic techniques for fidelity prototyping 3-Be able to determine and apply the relevant techniques for your project

26. Sources Id-book.com http://ocw.mit.edu/