- Visibility of system status.
- Match between system and the real world.
- User control and freedom.
- Consistency and standards.
- Error prevention.
- Recognition rather than recall.
- Flexibility and efficiency of use.
- Aesthetic and minimalist design.
- Help users recognize, diagnose, and recover from errors.
- Help and documentation.
Showing posts with label interaction design. Show all posts
Showing posts with label interaction design. Show all posts
Wednesday, January 7, 2015
Day 77 - Ten Usability Heuristics for User Interface Design
Jakob Nielsen's 10 most general principles (or heuristic rules of thumb) for interaction design:
Tuesday, October 21, 2014
Day 68 - Interaction Design Tip - One Time Actions
You may need to have users perform an action one time and communicate that the action will not be performed again. For example if the user is doing an install.
- In this case the solution would be a button labeled "install".
- The button can have a subtle animation when pressed.
- Transform the button into a label specifying the result of the action, e.g. "Installing".
These steps can be generalized into other one time actions by using buttons and labels to communicate the status of the actions.
Monday, October 20, 2014
Day 67 - Interaction Design Motion - Disney Animation Principles
With mobile app platforms and emerging technologies becoming more immersive and dynamic, it's important to understand animation as a ux or interaction designer.
These are Disney's 12 Rules of Animation:
These are Disney's 12 Rules of Animation:
- Squash and stretch
- Anticipation
- Staging
- Straight ahead / pose-to-pose
- Follow through / overlapping-action
- Slow in and out
- Arcs
- Secondary action
- Timing
- Exaggeration
- Solid drawing
- Appeal
Labels:
animation,
Disney,
interaction,
interaction design,
IxD,
motion,
rules
Monday, August 4, 2014
Day 40 - Interacton Design Techniques - Progressive Disclosure
Progressive disclosure is an interaction design technique that initially only shows users the most important actions required.
A print dialog box is a classic example of progressive disclosure. When you hit 'print' you're presented with a dialog box with a small set of choices. There's typically more print features and functionality that are initially hidden as to avoid end user confusion.
Using progressive disclosure techniques the user sees tasks unfolding via a dynamically expanding UI (e.g. a form grows with more choices). This can help users form a correct understanding of the task.
Start by showing the UI controls for the first step of the task, and when the user's done with that step present them with the second step, and so on. Users should have the ability to easily go back and change answers and change their mind about earlier choices.
Hiding advanced functionality early from novice users can lead to increased success of it's use later on.
While progressive disclosure techniques are applied in many products empirical research is required if you're going to employ these techniques.
Example of progressive disclosure:
A print dialog box is a classic example of progressive disclosure. When you hit 'print' you're presented with a dialog box with a small set of choices. There's typically more print features and functionality that are initially hidden as to avoid end user confusion.
Using progressive disclosure techniques the user sees tasks unfolding via a dynamically expanding UI (e.g. a form grows with more choices). This can help users form a correct understanding of the task.
Start by showing the UI controls for the first step of the task, and when the user's done with that step present them with the second step, and so on. Users should have the ability to easily go back and change answers and change their mind about earlier choices.
Hiding advanced functionality early from novice users can lead to increased success of it's use later on.
While progressive disclosure techniques are applied in many products empirical research is required if you're going to employ these techniques.
Example of progressive disclosure:
Friday, August 1, 2014
Day 38 - 10 Mobile Interaction Design Tips
Taking complexity and making it easy is hard. Focus, iteration, testing, and polish is required for good app design. Keep these mobile tips in mind when designing an app.
- Stay focused on the goal.
- Start with sketching, not a computer. It's not about drawing it's about design.
- Match the interactions and affordances to your platform. Pay attention to developer design guides, conventions, and patterns.
- Less is more so keep it simple. Limit and consolidate the number of elements for a clean design.
- Provide the user with cues and meaningful feedback about their interaction whether the user makes mistakes or not.
- Create hints for users so you can lead them through a design.
- Build a visual and approachable hierarchy.
- Sliders should convey movement or progress.
- Remember to consider international users. Great icons don't require text. Just be careful of cultural bias.
- Empower your user with mobile interfaces that accommodate to their skills. Your app should adapt with a learning process progression so that users can do things faster once they understand the basics. Let go of the hand holding and give them shortcuts so that the app alters itself to a user's comfortable experience.
Take notice of some of the best mobile interactions you've experienced as wells as the poor ones. Think about the apps you interact with daily on your device and how you engage with them. As a writing exercise list them out.
Labels:
affordance,
interaction design,
interactions,
mobile
Sunday, June 1, 2014
Day 11 - Characteristics of Good Interaction Design
Here are a few characteristics of good interaction design:
- Understanding.
- Meaning.
- Value.
- Engagement.
- Responsiveness.
- Speed.
Subscribe to:
Posts (Atom)
