UI design Flashcards
What is good design according to Dieter Rams?
Innovative Makes a product useful Aesthetic Makes product understandable Unobtrusive Honest Long-lasting Thorough down to last detail Eco friendly As little design as possible
What’s an overview of user-centred design?
- Good conceptual model
- Predictable actions
- Simple task structure
- Designed for error
- Standards used where applicable
What’s a conceptual model?
The underlying belief held by a person about how something works, eg. folder and files- phased out to just pictures and albums in good conceptual model. Example of poor conceptual model is door saying push with a pull handle.
What’s simple task structure?
Complexity of simple things- print screen button
Simplicity vs functionality
Doesn’t necessarily mean fewer features
Linked to good conceptual model
Simplicity perception depends on user
Allow tasks to be completed in most effective and enjoyable way
What’s predictability?
Norman- signifiers (perceivable sign of appropriate behaviour)»_space; affordances (qualities of an object that a user can observe and deduce the way of interacting with it from)
How can errors be dealt with?
Learning achieved via trial and error bc possibilities limited, too many choices and users will give up
What are standards?
Help build extensible and understandable systems
How can extent of good design be measured?
The ables- scalable, maintainable and flexible
possible via standard interfaces
What about emotions?
User perception of product connected to their emotions- more forgiving to beautiful product- design the experience
What is a user interface?
Everything designed into a device with which a user may interact
What are the key points of good UI design?
Well designed when it behaves exactly as expected
- consistency (similar operations in same way)
- careful choice of default values (minimise no of choices made by novice users)
- provide help (only sparing and highly context specific)
- recoverability (ensure UNDO always works)
- user familiarity (copy well known features from other programs)
- metaphors (to establish the user’s conceptual model)
What are the constraints of good UI design?
- users don’t read manual
- users don’t read more than 2/3 lines at a time
- users don’t like making choices
- users don’t like being frightened
- users don’t like being confused
- users always click ok
What are user types?
Common categories: geeks, teenagers, experienced users, naive users
Dichotomy between people raised with computers and new users trying to use them
Should create profile of user type testing application- what are their goals, skills and experience?
Design strategy to exploit these to efficiently satisfy their goals
UI should work well for all user types
What does Norman think is better?
Activity-centred design>human-centred design as it’s good not great, accepted without criticism
What is a use case/activity based planning?
Describes typical user activity from start to end- motivates design and provides basis for testing
What does a use case consist of?
Definition of user’s goal, list of pre-conditions, criteria for successful completion, list of main steps in activity flow, extensions/alternatives to use case
e.g. storyboard, UI flow
What’s UI flow notation?
37 Signals' (Basecamp) Screens at top Actions under solid line Alternative actions under dotted line Arrows to indicate flow
What is the UI design process?
Define set of representative user types
Identify most important activities/use cases
Assume user model based on how you think each user will expect to accomplish each activity
Design UI based on current user model (metaphors, familiar behaviours, simple)
Implement prototype
Test each use case with each user type and iterate
Refine user model and iterate until program model matches user model
What is the document-view architecture?
When the presentation is kept separate from the information- can change screen representation without changing the underlying architecture
What is the best way of presenting information?
Graphical methods (ie bar charts) >> digital methods (ie numbers) bc they present trends and relative values- only use digital when precision required- even then use graphical highlighting Use colour for highlighting but no more than 4-5 colours and be consistent
What is the user conceptual model?
User’s mental model of what is happening
Good UI design encourages every user to adopt same mental model
How can a user conceptual model be elicited?
Present 5-6 people with with scenario (using simple prototypes, screen mock ups or sketches) and task to complete
Ask them questions to understand how they’d set about the task
Infer their mental model
What are the main forms of user input?
Direct manipulation- typing, gestures, e.g. graphics programs: fast, intuitive but hard to implement
Menu selection, e.g. mobile phone: avoids errors n little typing but tedious and only simple options
Form fill-in, e.g. stock control: data entry but significant screen space
Command language, e.g. travel booking: good for experienced users but hard to learn
Natural language, e.g. Siri: accessible but unreliable
How does context affect user experience?
Desktop- long, complex tasks, rich presentation and functionality
Mobile- short, simple tasks, prioritised presentation features
Wearable- v short, notifications
How can we make sure that the user’s mental model is consistent with the underlying program model?
Compromise
Metaphors, wizards (guide through pre-stored use-cases one step at a time) to guide user to model
Modify program model to match user expectations
What is service blueprinting?
Onstage- customer actions, backstage- backstage contact actions (like a flowchart left to right up and down of conversation)
Why progress indicator?
Waiting is worst part of any user experience
Should be dynamic- confirms something is happening, and informative- how much is remaining/has been done
What are the stages of user experience?
Discovery Installation First experience- guided through first use, build conceptual model Repeat experience- quickest way to fulfil purpose Error handling Help reference Maintenance Support Feedback
What are the properties of good error messages?
Polite, concise, consistent, constructive, appropriate to skill level, accurate, informative
