Design principles: Visual Design vs. User experience

Visual Design is the establishment of a philosophy about how to make an impact.

User Experience is the establishment of a philosophy about how to treat people.

Principles of Visual Design:

• Contrast
• Emphasis
• Variety
• Balance
• Proportion
• Repetition
• Movement
• Texture
• Harmony
• Unity

Principles of User Experience:

1. Stay out of people’s way.
2. Create a hierarchy that matches people’sneeds.
3. Limit distractions.
4. Provide strong information scent.
5. Provide signposts and cues.
6. Provide context.
7. Use constraints appropriately.
8. Make actions reversible.
9. Provide feedback.
10. Make a good first impression.

Whitney Hess

UX strategy

A UX strategy has four primary components:

• Where are you now? Define the value you’re delivering to your users today, identify known issues, and explore ways your product can realize what the business hopes to achieve.
• Where do you want to be? Specify the purpose of what you’re building and what needs it will address. Identify opportunities to enhance your product and the guiding principles that will inform product design decisions. Explore all phases of a user’s interaction with your product to identify how all product components will fit together.
• How will you get there? Plan the development of your product to accommodate continual enhancements while maintaining cohesion across the experience. Translate your plan into tangible requirements.
• How will you measure success? Define what success looks like for your product and what methods will be used to validate your product’s success.

CATRIONA CORNETT

Psychology of User Experience

• People Don’t Want to Work: they will do the least amount of work possible to get a task done;
• People Have Limitations: they can only look at so much information or read so much text on a screen without losing interest;
• People Make Mistakes: Assume people will make mistakes. Anticipate what they will be and try to prevent them;
• Human Memory Is Complicated: People reconstruct memories, which means they are always changing;
• People are Social: they will always try to use technology to be social. This has been true for thousands of years;
• Attention: Grabbing and holding onto attention, and not distracting someone when they are paying attention to something, are key concerns;
• People Crave Information: Learning is dopaminergic—we can’t help but want more information;
• Unconscious Processing: Most mental processing occurs unconsciously;
• People Create Mental Models: People always have a mental model in place about a certain object or task (paying my bills, reading a book, using a remote control);
• Using Visual Systems can help people.

Susan Weinschenk

Hierarchy of needs

In his 1943 paper, “A Theory of Human Motivation,” American psychologist Abraham Maslow proposed the idea of a psychological hierarchy of needs in human beings. This hierarchy of need principles specifies that a design must serve the low-level needs (i.e., it must function), before the higher level needs, such as desirability, can begin to be addressed.

• Physiological needs are the requirements for human survival. They include breathing, food, water, shelter, sex, clothing, sleep and comfort.
• Safety needs can be seen as a way to meet tomorrow’s physiological needs. They include personal and financial security, health, order, law and protection from elements.
• Love and belonging needs are about social interactions. We don’t want to go through life alone. Social needs include friendship, love, intimacy, family, community, belonging and relationships.
• Esteem needs include self-esteem as well as recognition from others. Esteem can come in the form of achievement, status, prestige, recognition, mastery, independence and responsibility.
• Self-actualization needs relate to becoming more than what we are, and they can come from peace, knowledge, self-fulfillment, realization of personal potential, personal growth and peak experiences.

Hierearchy of User Experience

• Functionality needs focus on meeting the most basic design requirements. For example, NFC in a customer’s mobile device must provide the capability to make a connection with another NFC object.
• Usability needs have to do with how easy and forgiving a design is to use. For example, configuring your mobile payment preferences to facilitate types of payments and choice of merchants, the interface should be tolerant of errors and mistakes.
• Reliability needs are about establishing stable and consistent performance. For example, if lack of interoperability between mobile payment partners results in a service that behaves erratically or is subject to frequent failure, reliability needs will not be satisfied.
• Confidence needs address security, customer support, contact methods, policies, and giving users control. For example, a mobile payment service must ensure privacy and security of customer’s personal and financial information. A breach in this will result in lack of trust and result in non-adoption.
• Desirability needs focus on personalization, community, flexibility, and customization. For example, if a mobile payment service allows customers to personalize and control their payment experience, and creates a seamless experience across product, services, and channels, desirability needs will be satisfied.

From: Perry Chan and Steven Bradley

Capabilities

Capabilities can be defined as combinations of people, process and technology

Excel: Insert new row (Mac)

ALT & mouse-click in row number below the one(s) you want to insert. Be careful NOT to click anywhere else in row as this will add row(s) NOT across all columns but only in one column.

User interface best practices

• Be welcoming
• Know thy user
• Let the content shine
• Make selections fast and error-free
• Provide appropriate feedback
• Minimize the pain

Ginsburg 2011: p. 192

Use scenarios

Scenarios can help uncover gaps in solutions and potential usability issues.

Motivation

• What prompted the persona to embark on the scenario

Context

• Where is the persona while the scenario takes place?
• Does the context change over the course of the scenario?
• Who else is involved?
• What other devices are involved?

Distractions

• What kinds of distractions or interruptions typically occur in the scenario?
• How does the persona deal with such distractions?

Goal

• What is the persona’s goal in the scenario?
• Is it information, an artifact, an emotion?

Ginsburg 2011: P.82

Common User Research Questions

• User needs
• Context of Use
• Perceptions (pre-conceptions)
• Pain points
• Language and nomenclatura
• Norms

Gainsburg 2011: p.40

Gestures in iOS

• Tap – To select a control or item (analogous to single mouse click)
• Drag – To scroll or pan (controlled; any direction; slow speed)
• Flick – To scroll or pan quickly (less controlled; directional; faster speed
• Swipe – Used in a table-view row to reveal the Delete button
• Double Tap - To zoom in and center a block of content or an image; To zoom out (if already zoomed in)
• Pinch Open – To zoom in
• Pinch Close – To zoom out
• Touch and Hold – In editable text, to display a magnified view for cursor positioning; also used to cut/copy/paste, and select text.

Ginsburg 2011, p.22