1. CS 3120 USER INTERFACE DESIGN, IMPLEMENTATION AND EVALUATION (UIDIE) Dr. Ben Schafer www.cs.uni.edu/~schafer/3120

2. 2 Getting to know you “Mugshots” Information Sheet

3. Getting Started Name : Dr. Ben Schafer Hometown : Ames originally but … Class : 15 th year (plus 5 as an undergrad) Previous languages/comfort: Too many to list. But Java and Python are the ones I use the most. Anything you should know about me : My handwriting can be messy My voice can get loud.

4. So what is this course all about? A taste of what you’ll be doing… UI Hall of Fame/Shame

5. UI Hall of Fame or Shame? How do I open the door? Door #1

6. How do I open the door? Door #2

7. How do I open the door? Door #3

8. Door #1

9. Door #2

10. Door #3 No instructions needed!

11. Shame, Shame, and Fame Simple things should be simple to operate –Instructions / explanations are a sign of failure! Affordances Visibility

12. UI Hall of Fame or Shame?

13. Hall of Fame People are better at recognizing what they’re looking for than recalling it Promote recognition over recall

14. UI Hall of Fame or Shame?

15. Hall of Shame Who reads documents five lines at a time? Match between the system and the real world. Ok, technically you only READ one line at a time. However, who SKIMS five lines at a time?

16. UI Hall of Fame or Shame?

17. UI Hall of Fame or Shame? (What if I told you they do different things?)

18. Hall of Shame A picture isn’t ALWAYS worth 1000 words. The designers had good intentions, but they were caught between several design principles. –Match between the system and the real world –Differentiate between actions

19. So what’s this all about? A taste of what you’ll be doing… UI Hall of Fame/Shame The study of a form of Software Engineering The study of the field of HCI.

20. Human-Computer Interaction (HCI) A discipline concerned with the design, evaluation and implementation of interactive computing systems for human use Interdisciplinary –Computer Science; Psychology; Sociology; Anthropology; Visual and Industrial Design; … design implementationevaluation

21. Current HCI we will study Human psychology –Short-term & long-term memory –Problem-solving –Attention Design principles –Conceptual models; knowledge in the world; visibility; feedback; mappings; constraints; affordances

22. Current HCI we will study Understanding users and tasks –Tasks, task analysis, scenarios User-centered design –Low, medium, and high-fidelity prototypes Evaluating designs –Without users: cognitive walkthroughs; heuristic evaluation; action analysis –With users: qualitative and quantitative methods

23. Course Logistics Textbooks –The Design of Everyday Things (3 rd ), Donald Norman –Designing with the Mind in Mind(2 nd ), Jeff Johnson –Task-Centered User Interface Design, Clayton Lewis and John Rieman (online) Class website –http://www.cs.uni.edu/~schafer/3120/ –Syllabus, project guide, lecture notes, etc.

24. Course objectives Become an informed observer of people, objects, and how they interact Learn principles of human psychology that form the basis of user-centered design Learn to apply a task-centered user interface design method Learn user interface evaluation methods

25. Meeting the objectives Class activities –Lecture: introduce design/evaluation concept –Exercises: practice and learn the concepts –Studio: most Friday’s you will bring a deliverable which we critique as a group. Group project –Will require a significant amount of time! –Is worth a significant portion of your grade!

26. Evaluating your progress Project65% Final Exam15% Quizzes 7.5% Class participation12.5% November 16th 4 unannounced/Count 3 Daily Hall of Fame/Shame 10 % indiv. / 55% group

27. The Project Done in groups ~4 members Projects must have at least two real users (who are not members of the team) Find a project that you can get excited about Find people with shared goals, vision, and work style Get started now! –If you have a project, start selling it

28. Project Timeline (1) WeekTasks 1It Bugs Me! 2Groups Formed?? 3Project proposal 4Visit Plan 5User visit report due, task analysis 6Revised proposal 7Initial Prototype 8Walkthrough scenarios

29. Project Timeline (2) WeekTasks 9Cognitive Walkthrough 10Heuristic Evaluation 11First running prototype due, user evaluation plans due 13User evaluation reports/ Change list 14Presentation plans 15Final implementation, project presentation

30. Next Steps Reading: –For next session, read DMM, Chapter One –Get started reading DOET (Finish by Sept. 9th ) Project: –Begin brainstorming ideas. –“It Bug’s Me” Activity Next class: –Basic human psychology –Design concepts and principles