Advanced Interaction Design

A2: Selecting an item

A2.1

Tuesday 4/11

Your assignment is to select one item from among a set. You can pick the set size and domain. Is it a song from among a thousand? A day of the year? A country in the world? A picture from a lifetime? A how-to video on youtube?

*Sketch* (no fonts, colors, or pixels) two alternative interface designs for selecting that element. The interfaces should be designed for a vertically-oriented tablet. When sketching, that's a vertical 8.5x11 sheet of paper.

Post a quick snapshot of your interfaces.Think creatively.

Rubric

1. Two alternative interface design sketches were submitted.
2. The designs were sketched on paper.
3. Sketch 1 presents an interface that aids the selection of an item from a set.
4. Sketch 1 has enough detail to understand the interactions involved.
5. Sketch 1 is designed to be vertically-oriented.
6. Sketch 1 and 2 uses one color and font style.
7. Sketch 2 presents an interface that aids the selection of an item from a set.
8. Sketch 2 has enough detail to understand the interactions involved.
9. Sketch 2 is designed to be vertically-oriented.
10. Sketch 2 uses one color and font style.

NOTE: The interfaces should enable people to search and/or filter in ways that match the user's task and goals. Simply moving an element from one location to another doesn't constitute a significantly different interface.

A2.2

Thursday 4/13

This assignment builds on the previous one. In this assignment, you can continue the same domain or change things as much as you like. All that matters is the quality of the work you submit. And that will be...

• ~3 sentences summarizing a persona and their task.
• A one-minute video of a low-fi prototype showing a design that accomplishes that task.

The goal of the video and the design is to show the user interface. Your design should be all analog. (You are welcome to use a printout of a photo or similar if helpful, but don't do any design work digitally.) Use a sharpie or other writing implement that can be seen clearly on both video and on the wall. (e.g., no pencil; it's too hard to see.) Keep the video low-fi also: no music or cute gimmicks. Show us the interface and how it accomplishes the task.

Every design decision you make should be a strong, creative solution for the persona and their task.

Rubric

1. Description of the persona focuses on user goals.
2. A summary of task is present and clearly fits with the persona.
3. The prototype is analog/sketched.
4. The prototype is sketched using sharpie or writing implement that can be seen clearly (no pencil).
5. The prototype presents an interface that aids the selection of an item from a set.
6. The user interface is designed to be vertically aligned.
7. The user interface clearly addresses the task.
8. The video showcases the prototype and how it accomplishes the task.
9. The video does not include music or any other gimmicks.
10. The video is 1 minute long.

A2.3

Tuesday 4/18

Iterate once again on the previous assignment, focusing on a specific persona & task for which you designed this assignment – this time, at a higher fidelity. Include:

• ~3 sentences summarizing a persona and their task.
• A one-minute video prototype showing a design that accomplishes the task via some digital wireframing software (Balsamiq, Sketch, etc...), but again, focus on the basics – No fonts/colors. Show the interface and how it accomplishes the task.
• Include a pdf of your design

Rubric

1. Description of the persona focuses on user goals.
2. A summary of task is present and clearly fits with the persona.
3. A pdf with the prototypes is submitted.
4. The prototype is a digital prototype.
5. The digital prototype uses one color and font style.
6. The design presents an interface that aids the selection of an item from a set.
7. The user interface is designed to be vertically aligned.
8. The user interface clearly addresses the task.
9. A video showing the design is submitted.
10. The video clearly shows how the digital prototype accomplishes the task.

A2.4

Thursday 4/20

For this assignment, make 2 videos.

• With your persona trying to find a solution to their problem in the real world (on their own). This must be the best way it's possible today.
• With a professional (expert's) help.

Rubric

1. The persona is clearly described/evident from the videos.
2. The task is clearly described/evident from the videos.
3. The task involves selection of an item from a set.
4. Video 1 showcases a usability problem encountered in the real world while accomplishing the task.
5. The usability problem showcased in Video 1 is clear and well founded.
6. Video 1 showcases the user trying to solve the problem/accomplish the task on their own.
7. Video 1 showcases the best possible solution to users problem in today’s world.
8. Video 2 showcases a solution that uses external help to accomplish the task.
9. The solution showcased in video 2 clearly solves the user’s problem found in video 1.
10. The solution showcased in video 2 is more usable/intuitive than the current best solution to accomplish the task (which must be to select an item from a set), at least for the persona.

A2.5

Tuesday 4/25

Continuing off of 2.4, the goal is to revise your video prototype from feedback from your peers on Thursday 4/20. Submit:

• Persona (User and Task)
• Video 1 from 2.4 (The best that your user can do currently from the real world)
• Video 2: New and improved user interface

Rubric

1. Description of the persona focuses on user goals.
2. The persona described is realistic and does not represent an idealized user.
3. A summary of task is present and clearly fits with the persona.
4. The task involves selection of an item from a set.
5. Video 1 showcases a usability problem present in the best possible solution to users problem in today's world.
6. The usability problem showcased in Video 1 is clear and well founded.
7. Video 2 showcases a digital prototype of a user interface that addresses the problem identified in Video 1.

For the digital prototype in Video 2:
8. The user interface in video 2 is more intuitive/provides a better experience compared to the one in video 1, at least for the persona and task (which must be to select an item from a set) described.
9. The digital prototype is an improved version of the one in Video 2 of A2.4. ( Unless the perona/task changed from A2.4; 0 only if there is no improvement and the persona/task remained the same)
10. The design accounts for interactions of a vertically aligned tablet (touch, no mouse).
11. The design accounts for all information necessary for the users to complete the task successfully.
12. The design allows for a change in user's choice.
13. There are no major usability problems (That make it unable to accomplish the task).
14. The input methods/interactions the design uses is appropriate for the task picked.
15. The design is optimized for the form factor of a tablet (uses the screen space wisely). The content drives the layout, not the other way around.
16. The prototype uses one color and font style.
17. The prototype has a clear grid from top to bottom.
18. There are no awkward line-breaks or uneven gaps between blocks. The prototype uses whitespace to give elements room to breathe. Whitespace should not be so large that connected elements get lost.
19. The prototype has no unnecessarily repeated elements, or extraneous information.
20. The prototype has good visual hierarchy - Large blocks should contain the information most valuable to a user's task.