Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Know, do, feel: A useful pre-visual checklist for UI design

uxaustralia
August 11, 2017

Know, do, feel: A useful pre-visual checklist for UI design

A simple and focussing way to begin any UI design is with words. Three important words. Know, Do and Feel. I'll discuss three questions: “What do people using this need to know", “What do they need to be able to do”, and “What might we want them to feel”.

Presented by Jemi White at UX Australia 2017

uxaustralia

August 11, 2017
Tweet

More Decks by uxaustralia

Other Decks in Design

Transcript

  1. •  Fast pace. ⌚ •  User vs Business vs Developer

    needs. •  Hard to stay focussed on real life context of each product. I design in Agile/Lean product teams.
  2. “Always design a thing by considering it in its next

    larger context - a chair in a room, a room in a house, a house in an environment, an environment in a city plan.” Eliel Saarinen, architect and designer 1873-1950
  3. People, in moments, on the way to achieving their goals.

    In each moment, we need to know things, in order to choose to do things, given what we feel. A UI’s context
  4. Know Prioritised information a person needs for making a decision.

    States •  State of the system. •  Effects of what was done. •  Future effects of what they’re doing.
  5. Feel The emotional state a person might be in. Eg.

    “I’m worried”. Inferences or assumptions a person might make. Eg. “This feels hard”.
  6. A man, aged 30-45, living in a city, wants some

    new clothes. •  Searches for clothing stores online •  Decides he likes the range on a site •  Finds something he loves •  Checks out and pays •  Gets a confirmation of his order •  Clothes arrive •  Clothes don’t fit •  Return clothes •  Better fit arrives •  Wears the new clothes
  7. A man, aged 30-45, living in a city, wants some

    new clothes. •  Searches for clothing stores online •  Decides he likes the range on a site •  Finds something he loves Know ◦  If it will fit. ◦  How much it costs. ◦  Whether it’s on sale. ◦  What other people think of it. ◦  The brand. ◦  What else it goes with. Do ◦  Choose a size. ◦  Add to cart. Feel ◦  Excited. ◦  Like he owns it already. ◦  That shipping will be free.
  8. A man, aged 30-45, living in a city, wants some

    new clothes. •  Searches for clothing stores online •  Decides he likes the range on a site •  Finds something he loves •  Checks out and pays •  Gets a confirmation of his order •  Clothes arrive •  Clothes don’t fit •  Return clothes •  Better fit arrives •  Wears the new clothes
  9. Model - and iterate on what I know about user

    goals and behaviour. Share - and discuss these models with others. Contextualise - my UIs. Focus - on what’s important in each moment for people using my products. Moment mapping
  10. “Everything we think we know about the world is a

    model. Every word and every language is a model... None of these is or ever will be the real world.” Donella Meadows, “Thinking in systems”