The “U” in UX

User experience describes the user’s overall experience with a company’s service and products. A good experience leads the user to tell their circles about the company in a positive way, and vice-versa.

User research applies to all phases of the UX process – the design, development, and strategy – which basically answer the what, why, and who of users.

Design Phase – how the UX will unfold
Development Phase – how the users interact and complete their goals.
Strategy Phase – test current version of design; or show that there needs to be a redesign

 

Quantitative – results in numbers and answers questions about what users are doing; focus on statistical analysis to make generalizations and predictions; can show causal relationships. An objective observer studies in a controlled environment.

Microinteractions

These are the smallest unit of interaction that are caused by a trigger – either by the user, system, another user, data recognition, etc.

Help users recognize how to trigger something and what is triggerable that will result in an interaction. A button is a trigger. A glowing button is a more obvious trigger. Sometimes triggers are invisible, but there can be clues to suggest the interaction (these must be thoughtfully designed).

Make sure triggers are consistent. A 3D button sets a filter on this page. A second does the same. The third leads you to another page? These are all 3D buttons of the same attributes so users will think they have the same effect.

Triggers can incorporate the data behind them. For instance, a badge notification tells the user something.

Always keep in mind affordance. A 3D button should be clickable and produce an effect.

If the user has to keep triggering, make the trigger more visible. For instance, the “Publish” button can be stuck to a “frozen” header so that no matter where the user is in their canvas, they can publish right then and there instead of scrolling up.

A label can be useful for a trigger if the info isn’t conveyed through the trigger. The “shake” gesture on an iPad is often non-intuitive. If it has an effect, you may need a textual label that says “Shake”.

Designing for Users with Poor Memory

One of the main fields in cognitive psychology is memory – how we’re so bad (or good) at it. Humans can only memorize a little bit in short-term memory before it goes away. Chunking helps with this, which may be why phone numbers are split with 3 digits and then 4 digits. See the whole mess of 7 numbers 34729523 is harder to visually sparse. When we break wholes into meaningful units, we can memorize a lot more than usual too. So, 07-04-1976 may be easier to remember when seeing it as a single chunk – the declaration of independent, rather than an equal number of digits 38-94-7204 which likely has no meaning. Chunk when possible.

We also keep stories and songs as a single unit in memory. Ask a musician to start singing from the third verse of the song. They might struggle. Ask them to sing from the beginning and it’s easy. It’s because the musician didn’t memorize it based on various elements, but knows the song as a single chunk (or possibly a few chunks).

Making up your own security questions will result in more accurate entries than default security questions. For instance, they always ask who my favorite teacher in school was. Well, I usually put Shimmon or Spellicy but I can’t be certain which one I’d put. And what about case-sensitive? If I make my own, I tend to use a coded phrase anyways such as “last attack 2nd abra” which translates clearly to me as “What is Kadabra’s last attack?” which was a favorite trivia question growing up for me.

When you give instructions, especially long ones with multiple steps, don’t ever make them go away. Don’t force the user to take a screenshot because the instructions will disappear. Users can’t and don’t want to try to memorize anything. Make it easy for them!

Design Patterns: Components, Widgets, & Archetypes

Be mindful and understand what components, widgets, and archetypes are! Look up design patterns online for how users are accustomed to using these all and how they are laid out. Nothing is absolute, however. Make sure you don’t just pick out things you like about one pattern and another pattern and another pattern. It doesn’t necessarily create the best solution in the end this way.

Components – these are the smallest unit of interactivity.

  • checkboxes, radio buttons
  • field boxes, combo box
  • scroll bar, sliders
  • icons, buttons
  • labels
  • tables
  • toolbars, tabs

 

Widgets – usually consist of a combination or blend of components to create a whole

  • They can be wizards.
  • Enterprise products often have hierarchical grids (tree control).
  • Forms, lists
  • Feed (facebook) and timeline
  • Filter panel
  • Shuttle controls are common in enterprises. It’s a list – sometimes hierarchical – with another list. There’s left to right controls to add/remove items for instance. There’s only a few times where shuttle controls would be needed but it’s generally not in products anymore.
  • Login (two field boxes and a submit button, “Forgot Password?” link)
  • A dialog box by itself is even a supporting widget.
  • The date picker on a calendar.

 

Archetypes

  • shopping carts (metaphor)
  • menu pages/headers
  • workflow
  • Master-Detail, such as an email inbox with preview messages
  • shopping catalog
  • portals (where content is aggregated)
  • search results
  • tool and canvas (see PhotoShop)
  • workspaces (often for coding)

 

How to Make Users Learn Faster

…with practice of course. Know what tasks or actions the user will make frequently.

…when it’s task-based. Present a clear goal and have users complete step by step. Let them know where they are in the process!

…when risk is low. Undo buttons allow for more exploration. Maybe this could be a button that says “Undo” or “Reset”. If this is a clear action the user can trigger, this can eliminate any stress the user has to go through when they think “am I doing the right thing?” or “what if I’m filling this out wrong?”

…when the vocabulary (terminology) is known. Be consistent with the terms you use! Even little things like “document” or “file”. Do they “set” it or “activate” it? Do they “close out the application” or “shut down the application”? People have general pre-conceived notions about these terms.

Interaction Design: We Have Cognitive Dissonance

I take the Apple commute bus to and from work each day. One day, I saw my bus from far away. As I got on the bus, I did not recognize the driver, but that’s happened a lot of times before. As I chose my seat, I was hoping the bus wouldn’t get full and I would need to sit with someone. This almost always happens but didn’t happen that day. I also noticed that the back of the seats looked different. After 15 minutes, I fell asleep and was in and out. As we approached San Francisco, I looked up and saw we were in traffic and fell back to sleep. I didn’t recognize the house style that was outside. The bus hitting the first stop woke me up, as usual, and I looked up and realized I had been on the wrong bus – it lead me to the mission district which is a 20 minute drive from where my house is (and almost an hour for public transportation). There were so many clues to indicate that I was on the wrong bus and I dismissed them all. I thought I saw a blue “19” from far away on the bus dashboard, but it was a green “MD”. I wish there was some indication inside the bus that I can tell whether I was on the right bus, but I assume they don’t expect people to be so..foolish? This is cognitive dissonance. I was making every excuse to explain why the bus driver, the bus itself, how crowded it was, as simply “unusual” circumstances but never questioned I was on the wrong bus.

How often does this happen in user interfaces? Maybe you click SEND rather than DELETE (location of the buttons’ fault?). Sometimes you find yourself doing what you’re not intending to do. We love running on auto-pilot using just the primitive side of your brain. When we need to use that frontal cortex because you’re analyzing all the info coming into your senses, it makes it hard to multi-task. So there needs to be a balanced.

Consider each time you require your users to learn something, especially something complex. This requires the frontal cortex, analyzing stimuli, and synthesizing information. This can be stressful and draining. Allow users to go on auto-pilot as much as possible, but never lead them astray.

As users, we have learned behaviors and often do the same thing when we approach user interfaces. This is why consistency is so important in design. If you design something that looks like a field box with a scrollbar, expect users to tap into it to try to type.

Innovative and Beautiful Product Design

Beautiful and original product design shouldn’t go unmentioned however. Although most of these products are no actually on the market, the visual appeal and innovative design are instantly attractive and can well enhance the user experience.  A successful end product would combine both usefulness and beauty.

Check out this Visual Desktop Charger. Designer Sun Kyung Kim reasons that people like visual indicators, so why not apply that to the everyday task of charging our mobile devices? This is a case in which the details are the design itself. How does it appeal to the customer? Everyone needs and owns chargers, so there’s the obvious function. Then, the customer considers how it looks and feels – the innovative design.

Source:  yankodesign

Source: yankodesign

Have you seen the Laser Projected Keyboards yet? They allow you to type on any flat surface and the projector is tiny – just a little larger than a matchbook. Problems the product is facing include the disturbance from shadows, lack of ergonomics, and the lack of tactile “home” position. Will there be a market for it? It’s been around for a few years now and there doesn’t seem to be a big hype about it.

laserkeyboard

Victor Soto independently designed the iRing that acts as a wireless controller for iPods and other apple products.

iRing

With Toast Messenger, you can write a note your breakfast! “Don’t forget to walk the dog!” “Meeting tonight. Won’t be back until 7:30” “Your lunch is on the second shelf!”    But it’s just a design concept, and not actually on the market.

toast1