1. Interaction design, Q2 review IS 403: User Interface Design Shaun Kane

2. The rest of the course Still 5 assignments and 2 quizzes left Resubmit assignments! Extra credit slots Improvement counts Let me help (office hours, appointments, looking at assignments)

3. Some comments on A4… Lots of comments == good Tackle the hard problems –Search / result / detail pages are difficult –Login / error pages not so much Understand your use / understand users Presenting your first ideas vs. your best ideas Demonstrate your graphic design skills

4. Some comments on A4… Lots of comments == good Tackle the hard problems –Search / result / detail pages are difficult –Login / error pages not so much Understand your use / understand users Presenting your first ideas vs. your best ideas Demonstrate your graphic design skills Alignment

5. Questions to ask Does some other site/app do what my site/app does? If so, is mine different? Is it better or worse? OK to copy (but do so creatively)

6. Some examples of interaction design… (we’ll do more next Thursday)

7. My cool site Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam nec egestas ligula. Duis tempor nec ante vel ornare. Quisque porta luctus velit, ut mattis neque pellentesque sollicitudin. Nulla porttitor nisl ut nisi vestibulum ullamcorper. Fusce vitae feugiat mi. Aenean faucibus, metus ac congue dictum, dolor nisl rutrum dolor, vel posuere metus lacus id tellus. Vestibulum in feugiat felis. Vivamus ac hendrerit ligula. Ut volutpat tellus ac ultricies egestas. Sed scelerisque tempus lorem nec sagittis. Sed sed elit volutpat, vestibulum urna non, dapibus lacus. Phasellus vehicula magna quam, eu venenatis magna elementum at. Cras gravida varius purus vel mollis. Mauris a ligula varius, congue dui sed, pellentesque felis. Search

8. My cool site Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam nec egestas ligula. Duis tempor nec ante vel ornare. Quisque porta luctus velit, ut mattis neque pellentesque sollicitudin. Nulla porttitor nisl ut nisi vestibulum ullamcorper. Fusce vitae feugiat mi. Aenean faucibus, metus ac congue dictum, dolor nisl rutrum dolor, vel posuere metus lacus id tellus. Vestibulum in feugiat felis. Vivamus ac hendrerit ligula. Ut volutpat tellus ac ultricies egestas. Sed scelerisque tempus lorem nec sagittis. Sed sed elit volutpat, vestibulum urna non, dapibus lacus. Phasellus vehicula magna quam, eu venenatis magna elementum at. Cras gravida varius purus vel mollis. Mauris a ligula varius, congue dui sed, pellentesque felis. Search

9. Wig store Colors Red Green Yellow Styles Straight Curly Search Wig

10. Wig store Colors Red Green Yellow Styles Straight Curly Search Wig What am I looking at now? How do I get straight and green? How do users think about what they want?

11. Back Name Age Birthday Height Weight Favorite Pokemon Zodiac sign OK Cancel Alignment Birthday – What goes where? Birthday and age are redundant Birthday as dropdown Birthday as popup Zodiac should be dropdown

12. Home Name Age Birthday Height Weight Favorite Pokemon Zodiac sign Create account Back vs. Cancel? Too much work Use verbs for buttons Reading order

13. Q2 What did we cover? –Color –Typefaces –Grids –Robin Williams perspective on design –Kids! –Design process

14. Source materials Lectures and slides (everything we’ve covered in class) Readings –Color –Type –Williams’ perspective on design –Guest speakers

15. What you’ll have to know Vocabulary / terminology How to identify design elements / themes –“How does this use the principle of contrast?” Apply it –“Use the principle of contrast to improve this design”

16. Example Qs? Why uppercase vs. mixed case? NO: What are the various types of color schemes with examples? What does RGB stand for? Name 3 of Robin Williams’s design principles

17. Design feedback Work with a partner Get feedback on your designs Feedback from me