UX14 - It's All About The Details (Vasudha Chandak)

“The details are not the details. They make the design.” — Charles Eames.

The difference between an awesome and Okish product are these details. No matter what type of app or website you’re developing, by taking a microscopic approach to user experience and interface design, you can make things clearer, useful and give your users a WOW experience. Small details go a long way. Micro-interactions is about those critical details that make the difference between a friendly experience and traumatic anxiety.

This talk focuses on a fresh way in designing the delightful details by

1. Focusing on the structure of micro-interactions: Triggers-Rules-Feedback-Loops & Modes.

2. Real life examples of WOW experiences.

3. Identify opportunities for adding the delightful details in your websites and apps.

Transcript

1. What is Micro-Interactions According to Saffer, it’s a product use case boiled down to a single moment, focused on a single task. Unlocking your smartphone is a micro-interaction; so is the chiming sound that plays when you boot up Windows or OS X.
2. Structure of Micro- Interactions • A Trigger initiates a micro-interaction. • The Rules determine what happens. • Feedback lets people know what’s happening. • Loops and Modes determine the meta-rules of the micro- interaction.
3. Commonly use Micro- Interactions • AOL’s You’ve Got Mail • Autocomplete • Autocorrect • Blue Screen of Death • Control-Alt-Delete • Cut and Paste
4. Micro- Interactions are good for • Accomplishing a single task, • Connecting devices together, • Adjusting a setting, • Viewing or creating a small piece of content like a status message, • Turning a feature or function on or off etc
5. Rules for creating great details • Don’t Start From Zero. You almost always know something about the user, the context, or the platform that can change the product for the better. Start from that. • Bring The Data Forward. What information is inside the micro-interaction that you can pull forward so that users can see it at a glance? Why do I need to go inside my finance app to see how much amount is left for the month?
6. • Speak Human. Feedback is for human beings, so address them as such. Use the words your users use. • Use Long Loops. How does your product adapt over time? What’s it like when the user comes back tomorrow? Or the 10th time? • Prevent human error. Don’t allow (or better yet, fix) actions that would break the micro- interaction.