|Intro: Tracking the elusive "good design". And cooking it. [Slides]
HW1: Waiting in Line. 3-Slide
Send me your blog url
|Reading: How We Decide, Chpt. 2, Jonah Lehrer
|Cognitive Models and Design Goals...and persuasive technologies. [Slides]
- Observations exercise
- A physical intervention...in space! 3-Slide
|Reading: Emotional Design: Why We Love or Hate Everyday Things, Donald Norman
|Requirements, Scenarios, Use-cases, and Userflows [Slides]
- Mini assignment: re-imagine an error message!
- Prepare for the interface design roundup!
Site suggestions for roundup:
Room Change for just this day
|Getting down with low -level prototyping. Usability roundup, wireframes. [Slides]
- Adding interaction to a non-interactive interface
- Critique the MOMA exhibit' Talk to Me '!
|Testing and Evaluation Part 1: Qualitative! [Slides]
||HW5: Solving a usability problem and preparing for the midterm
|Testing and Evaluation Part 2: even more Qualitative!
||HW-Midterm: Begin Midterm Prep
||HW-Midterm: More midterm!
|Testing and Evaluation Part 3: Quantitative!
& Final prep
|HW7: Final Part 1
||Optional Reading: Natural Born Cyborgs Intro and chapter 1
Guest - James Robinson (NYTimes)
|HW8: Final Part 2
|Guest Speaker: John Keefe (WNYC)
||HW9: Final Part 3
||HW10: Final Part 4
||Final presentation preparation, and prototype completion. Here are some tips on elements you might want to include
These books are only suggested as a good read - none are required for class and students will be given a copy of all readings
Common Software Tools
Userflows and wireframes:
- Omnigraffle (Mac)
- Visio (also for wireframes)
- Gliffy (and a million other web tools)
- Every single drawing program ever
- Pencil and paper
Web tools for wireframes and low-level prototypes:
On-time Attendance, participation, blogging and documentation: 30%
Assignments (including midterm): 30%
Final project: 40%
Even though this is a pass/fail class, remember this is also a group-projects class. If you choose to 'just get by' there are other people affected who might have strong opinions about it (and a mean sense of humor.)
HW Week 1: Waiting in line, revisited
Standing in line is part of life, but being bored, annoyed, uncomfortable, awkward, or frustrated is a sign of a bad situation. What can we do to make this time more interesting or utilitarian? Or perhaps we would like to eliminate the line altogether somehow? Or perhaps this time is a relief form responsibility, and removing it would be a crime. Your mission is to improve the experience of standing in line.
- Interview people standing in line around campus. What aspect is most annoying to them? The wasted time taken? The physical act of standing? The boredom? What would they like to fix?
- Using your findings, brainstorm and document at least 20 ideas for solving standing in line problem. They can be physical space solutions, physical product solutions, digital solutions, mobile solutions, web based, or solutions using human capitol. Ideas do not have to be realistic in implementation, but they do have to be realistic in usefulness. A solution requiring everyone to be a prodigy, or extremely physically fit, will not work. If you're stuck, check out the rethinking brainstorming page.
- Select one idea to present to the client (our class) as a 3-Slide. 3-side presentations are a great way to winnow down a project scope quickly without wasting resources. Download the Template, fill it in, without any extra bells and whistles, to present in class.
HW Week 2: Persuasion! Using your powers for good and evil
- With your group, go to a mall, stadium, department store, train station, or some other commercial location where you can sit for a long period of time without feeling uncomfortable. Make sure you have a clear view of at least one spot where commercial interactions are taking place – where people are buying something.
- Plan to spend at least one full hour observing and making notes on what is going on in the space around you. You can change your viewpoint a couple of different times, but give each spot long enough to get to know the patterns of activity you see between people and the goods or services they're buying.
Think about how people are arriving, how they flow though the physical space in relation to the goods, and what are the natural stopping points, talking points, and any transition points (for example, going from being a browser to being a shopper to being a buyer). What is impacting people's decision-making behavior? What do they touch, talk to, and look at? What catches their attention, and what doesn't? It might be helpful to shadow a particular person or group and record comments they make to each other about their experience. Are they enjoying themselves? What keeps them from completing a transaction? Or pushes them over the edge?
- Choose one aspect of the user behavior you observed that you would like to change. Your mission is to design a physical intervention for this space that impacts your users in some way. You can turn them into more responsible shoppers, turn them into frantic buying machines, or augment some other aspect all together. The choice is yours.
- Prepare a 3-Slide explaining your solution, and be ready to talk about the problem space you chose to tackle. What mental model does your solution rely on? What are the cognitive processes you want to take advantage of in your users?
HW Week 3: A Duo of mini HW's! HW, two ways, if you will!!
HW Week 4: Wireframin'!!
- Group Assignment: Re-imagine an error message!
Error messages are infamous for not fulfilling the user's real requirements. Often they give no information that might be actionable by the user, like "Hey, you have 30 seconds to back up your data before your computer burns down" and sometimes they give way too much information that can only frustrate the user ("The application failed to initialize 0xc0000135") Your mission is to redesign an error message to suit the requirements of a real user.
- As a group, choose a common screen-based error message - mobile, computer, projector, tablet, or any other other screen-based device.
- Using at least one data collection technique (an interview, questionnaire, research), build up a picture of the standard persona who might be seeing this message in the wild. What are their background, motivations, and frustrations? What requirements would a good version of this error message satisfy?
- Create a new version of this error message that will satisfy the requirements of the user. You can change the message any way you want, from the text, to the design, to the form of delivery. You can even choose an entire new mental model for the error message if you want.
- Bring a print out of the old error message, and a physical sketch or printed out mockup of the newly designed error message to class.
- Individual Assignment
Next week is the Interface Design roundup.
To prepare, find and list 20 to 30 digital design tips. Web usability ideas are dime a dozen on the internet, and we want tips from the most dry and academic to the most random ("Users hate red text on a website"). You can use the links in the readings section of this week's syllabus to get started.
If it's about interface design: how interfaces should be colored, spaced, typographied(?), accessed, ordered, architected, and what sort of content should be where, bring it in.
Don't worry if some of
your findings contradict each other. One person will think that 1-step check out pages are the only way to go, while that believes multiple steps make for a happier customer. This person thinks site search should always be prominent, and that person thinks any site search is a sign of bad organization. And Nielsen will disagree with everyone about everything. Get them all anyway, debate is what we're aiming for. Bring them in digital form, ready for the roundup!
HW Week 5: Qualitative testing!
- Field trip!!! Individual or Group activity:
If you haven't been yet, visit the Talk to Me exhibit at MOMA and write up a reaction for your blog. Pick a couple different displays and think about what problem space these exhibits are a reaction to. What mental models do they use, and how successful are they? How reasonable are the sorts of effort and interaction they require from the human? Is the exhibit as a whole successful in meeting its goal of "exploring the communication between people and things"?
- Re-imagine an interface! Group activity!
Choose a webpage that is mainly informative and redesign it to incorporate at least one new interactive feature. In doing so, you may wish to completely change the layout of the page to suit its new purpose. Keep the design cycle in mind:
- What sort of person will be visiting this site, and what types of actions might they want to be able to do there? You can even do a fast interview to collect some requirements if you like.
- What is the userflow to arrive and leave this page, and how will you be modifying it by adding your new interaction? You might want to diagram out the flow of relevant pages before and after your modification
- What kind of wireframe will best get your proposed idea across? A very technical, precise, well-labled wireframe might be helpful for a complex site. A hand-drawn sketch might be completely valid for getting across a simple one.
- Part 1: Mini assignment: Using your findings from your Summative Evaluation during class, brainstorm a design solution for at least one of the usability issues uncovered during the testing. Wireframe or mockup your final concept.
- Part 2: Prepare for project speed dating! Next week you will have the opportunity to interview representatives from four different web projects. Each project is hoping you'll select them as your midterm partners. Over the course of the midterm you will be completing a full analysis and evaluation of the projects' interaction design, and re-working it to better adhere to the project's overall goals and usability heuristics. That means you will want to choose a project you are interested in, but also a project that you believe you can improve and make your own. A project that you think is already perfect will not give you much room for updating.
Next week in class, arrive with a list of questions for your potential clients. Keep in mind the questions you asked yourselves when making your 3-Slides: Who is supposed to be using this project? What are their motivations and requirements? What is the overall goal of the project?
You will have a chance to look at some of their project wireframes and early code - consider asking some basic usability questions about it. If you can turn up obvious incomparabilities between the stated goal and the implemented design at the very beginning, then the process will be easier if you decide to do a complete redesign.
HW7: Final Part 1
- Research your topic's philosophic goals. What work has been done in this area before? What is the current state of the art?
- Identify the problem space you plan to solve for within that space (your project's scope)
- Identify any likely user requirements/personas/scenarios.
- Brainstorm your solution. What mental model seems most likely to appeal to your users? is it a physical or digital solution? What cognitive processes will it need to support? Will you use marketing or persuasive technology to reach your ends? Create a 3-Slide to introduce your audience to your design concept
HW8: Final Part 2
- Complete any initial testing needed to flesh out your requirements and use-cases. What other functionality does your testing tell you your design will need to support?
- Consider the marks of usability and Nielsen's design heuristics while creating any userflow diagrams and mockups required to explain your concept fully
HW9: Final Part 3
- Iteration. Use class feedback and other formative testing as you fill in any new scenarios and use-cases. Consider running an early quantitative or qualitative evaluation (analytics, usability testing, and heuristic testing). On your wireframes or any mockups you might have created
- If you haven't already, begin your high-level working prototype.
- Remember, the only difference between a high level prototype and a low-level one is that a high level prototype uses the materials of a real-world implementation. Since you are acting as designers here, the final prototype needs to be only workable enough to demonstrate the concept.
- There is no need to create an entire house when demonstrating how the doorway will work will do, and no reason to make a complex database driven back-end when simple, hard-coded html will do. The idea to keep in mind here is Proof of Concept.
HW9: Final Part 4
- Final prototype completion - keep working on that demonstrable proof of concept
- Presentation preparation. Start considering how you will convince your listeners that you have solved their problem.
COnsider using these in your final presentation. Remember, the goal here is to convince us this is the best possible solution for the problem space you chose to tackle.
- Title, names of team members
- What are the project's philosophic goals? Which of those five issues did you pick? What was the problem space within that issue were you trying to solve?
- What's your solution? Giv us a demo so we're on the same page as you
- Talk about how you got there:
- User requirements
- Use cases
- Cognitive processes
- Prove to us that your solution will work for users. Did you do any testing?
- How realistic is your solution? What are the final technology and tools that this would need to be a success?
- Contact information for folks who want to dump a lot of money on you (or have questions)