Design Principles Flashcards
4 Most important lessons on UX design
1 - By only asking people what they want, you miss golden oppotunities.
2 - you can find these opportunities by going out in the field and learning from people.
3 - You can benefit from these opportunities by bringing prototypes with you
4 - The world is full of tinkerers, never turn down anyone ideas.
The two gulfs
The gulf of execution and the Gulf of evaluation
6 Questions when creating the gulfs
How easily can someone:
- Determine the function of the device?
- Tell What actions are possible?
- Determine mapping from intention to physical movement?
- Perform the action?
- Tell what state the system is in?
- Determine mapping from system state to interpretation?
How can you reduce gulfs?
- Use visible affordances
- Make a device that provides feedback
- Stick to industry standards
- Implement Non-destructive operations (ctrl+z) to allow experimentation from the user
- Make the resources clear
- Make the system reliable. Operations should work. NO. CRASHING.
Mental Models
Mental Models are based on user past experience and familiarity with similar systems. Aways work closely with users when developing mental models - Since you have a closer view of the system, you’ll be blind to things you are used to.
What is a slip
When you do something wrong without the intention of doing it.
What is a mistake
When you do something intentinally that results in undesirable results.
How can you improve slips?
Improve design ergonomics, make the interface bigger and more spread out
How can you improve mistakes?
Improve the affordances on your design.
How are problems solved
Solving a problem simply means representing it so as to make the solution transparent.
Human working memory
Working memory very limiting, being able to keep 7 +-2 things at once going through ones head at a time, and even that is debatable. Design as to make the least ammount of things clog over a person mind.
Distributing cognition
The process of easing cognition by distributing it in several different characteristics.
What makes a good representation?
A good representation shows all the relevant information, and nothing else. It should enable compairson, Exploration, and problem solving.
Information Equivalency
Two representations are equivalent when all the information present in one medium can be represented in the other medium.
Computational equivalency
Two mediuns of communication taking the same ammount of effort to be processed by the brain.
What are the benefits of helping people distribute cognition?
- It encourages experimentation
- Scaffold learning and reduces errors
- Show only the differences that matter
- Convert Slow calculation into Fast perception
- Support chunking
- Increase efficiency
- Facilitate collaboration
Direct manipulation
Continuous feedback is provided to the user, with leverage metaphors from what we have in the physical world.
World in miniature
Make a scale representation of what the user requires.
How do you improve a text card
Add space between lines to separate topics.
Use different sizes, typographic variation, and bold letters to bring attention to specific words.
Three goals for visual design
GUIDE people into conveying structure, relative importance, and relationships between information
PACE people acquisition of information by strategic use of placement and color.
Express a MESSAGE to the viewer, through use of verbal or non-verbal information.
Three basic tools of visual design
Typography
Layout
Colors
Six main typographic Terms
Point size Leading x-height Ascender & Descenders Weight Serif
Point size
Overall font size when compared to other fonts
Leading
Space between lines. Generally 20% of the Point size
x-height
Height of the lower case letters. Typefaces with higher x height are easier to read at smaller point sizes, which makes them ideal for low resolution displays such as mobile.
Conversely, low x-height gives elegance to the letter.
Ascender
size of the things that are above the x-height.
In general a x height and ascenders are inversely proportional
Descenders
Size of the things that are below the x-height.
In general a x height and descenders are inversely proportional
Weight
light - bold.
The thickness of the letters.
Serif
The thingies at the end of letters that give them chiselled\fancy looks.
General advice for typeface selection
Use serif for body text and Sans serif for titles.
Challanges on typeface selection
Individual differences dwarf manipulation effects
Reading requires familiarity.
Where is most information stored into letters: Lower half or Top half
Top half
Interpretation of letters
Prior experience with words influences interpretation of individual letters
Two main elements of grids
The set of collums (which contains info)
And the set of gutters (whitespace between lines)
Tip to create system templates
Design considering the longest text block
Text alignment strategies
Align to left if you want to help quick scanning
Align center for bigger impact.
Align to right when using in conjunction with labels and forms
Small tip for color
Design in grayscale first, them keep luminance values from grayscale when moving to color
Information Scent
The confidence inspired by a medium that information is trustworthy and relevant.
What are signs of users detecting bad information scent
- Constant flailing around the interface
- Low confidence on asset functions
- Constant use of undo operations
How can an Icon help
They Facilitate repeated recognition, and serve as general affordances to real world objects.
How can you improve scent
Use multi-word links
Use Speaking block navigation
Use eyetracking studies
How do people read online
They don’t.
Interlaced browsing
People generally leave many tabs open and vary from tab to tab, having short attention span on specific web pages
Please the experimenter Bias
people will tend to share false feedback that pleases the experimenter.
How to go beyond the “do you like my interface” question?
- Set a good comparison (my interface is good compared to what?)
- Ask baserate questions (how often something happens, how many clicks were performed)
- Set correlations between the variables measured.
- Set causation links based on correlations studied.
Dependent Variables
Variables that depend on what the user does.
Independent Variables.
Variables that are independent of what the user does.
Common measures in HCI
- Task Completion Time
- Accuracy
- Recall
- Emotional Response
Strategies for fairer comparisons
- Insert your new approach into the production setting
- Recreate the production approach in your new setting
- Scale things down so you’re just looking at a piece of a larger system
- When expertise is relevant, train people up.
Three major subject assignment strategies
Within-subject testing - Everyone tried everything
Between-Participant testing - Each person tries one
Counterbalancing testing - Creates environments that minimize variation between test subjects.
How to minimize learning effects
Make the first and second tasks different.
Latin square
A technique for randomly assigning order of testing among users (1 -2-3, 1-3-2, 2-1-3, et al)
The importance of random assignment
Since correlation does not imply causation, it is important to use random assignments in order to minimize biases and remove as many external factors as possible.
Counterbalance assignment
Create pre-testing conditions that balance out condition assignment . The key is to have all participants having equal chances to landing on all positions.
Offline counterbalancing
One strategy to separate users is to, after performing a pre-test, order then by lowest to high score, take pairs with nearest scores, and divide users in this pairs randomly between the testing conditions.
Danger of regression
Separate instances of testing have a probability of outputting extreme results. As more Testings are performed, data has a tendency of Regressing Towards the Mean.
In-person vs On-line studies
In-person studies allow you to better see people reactions and struggles.
Tips for In-person studies
Make clear goals. Test only what you need to.
Plan out the steps, get the set up ready
Ethical considerations
People sometimes feel pressured to perform well on studies, and so may feel guilty or bad if they fail. your job is to provide emotional feedback to them, and keep them comfortable.
How to ease the user performace on experiments
Plan an order for the tasks they will work, from easiest to hardest
Provide the training they need before testing
Plan for what you will do if users do not finish a task.
Have a “Pilot” participant, someone who will run through your study and check if they think its all right, or if there are any parts that should be changed.
Options for capturing results
Notebooks
Video Recording
Screen recording
Think Aloud Method
Ask users to talk what they are thinking while they are using the interface.
What is the first thing to do when participants arrive at the test scene?
Greet them. Explain the setup. Make. Them. Comfortable.
Process data
Observations on what users are doing and thinking
bottom-line data
Summary of what happened/ Dependent variables/ metrics
What to do at the end of the study
Debrief the session with the participants.
How do you optimize the Click rate
The clearer you write down what users ought to do, the more users do it.
Impact of distractions
Smalls distractions like extra fields can yield big changes.
Commitment Escalation
If you agree with someone to do a small thing, and then increase the task difficulty after the agreement, it`s much more likely that they will agree, unlike if you asked the full picture straight up front.
Guidelines for your experiment group size
Run experiments with equal-sized groups.
However, don`t start straight at the full-sized group. start small, then increase sample size as the experiment progress.
Three key rules for Random Assignment
Be Consistent
Be Durable
Be Independent
3 Questions to analyze your data
What does my data look like visualized?
What are the overall numbers?
Are the differences Real?
Pearson chi-squared test
X^2 = Sum(1-n)((((Oi - Ei)^2) / Ei))
WHERE
X = Pearson Chi Sqared Oi = Observed value Ei = Expected Value N = number of test results
Gaussean probability
Probability graph for “Normal” outcomes vs “Unusual” outcomes. The two end of the tails from this graph forms 5% of the distribution.
Null Hypothesis
There should not be any statistical difference through all of the different conditions you have. If there are, this falsifies the Null hypothesis.
Degrees of freedom
N-1
WHERE
N = Number of possibilities you have.
Other types of testing
T-Test for compairson of 2 conditions
ANOVA for compairson of more then 2 conditions
True or False: Data is generally collected in expected, predictable forms.
False. Data usually isn`t “normal”, appearing in various shapes that differ from the general gaussean model.
Expected value
E = R * T
WHERE
E - Expected Value
R - Ratio between results of the experiment and total of participants
T - Total of users tested on experiment
