lean ux

what that means for us…for UX Brighton, 8 March 2011

i used to work in an “advertising” agency

§off-site§creative first or§ux first

now, I help build software for finance

§on-site§delivery driven

hello…

2

just enough / good enough

§good enough§generically across the project

§ just enough§personas (and their use in stories)§sketching and documentation§design

§the end product

3

define your quality standards§what does done look like?

§does the kano model have some answers?

good enough

4

very satisfied

very dissatisfied

winfail

excitementperformance

hygiene

development quality is easy(ish) to define§what are the coding standards

§what is acceptable (bug wise)

good enough

5

creative quality?§what creative standard are we striving to achieve (chevrolet, toyota, porsche, audi ferrari…)

good enough

6

interaction quality?§what level of “usability” is good enough

good enough

7

just enough / good enough

§good enough§generically across the project

§just enough§personas (and their use in stories)§sketching and documentation§design

§the end product

8

Personas

what is appropriate§generic library§“sketch”§primary / secondary

9

City Personas EDITION 1

FX ONLY :: LAB49 INTERNAL DISTRIBUTION ONLY

personas

then use them!§as [persona…], I want to [goal…], so that [reason]

§most use:“as a user I…”

§use your personas“as bob jones, I…”“as bob, mary or fred, I…”

10

City Personas EDITION 1

FX ONLY :: LAB49 INTERNAL DISTRIBUTION ONLY

just enough / good enough

§good enough§generically across the project

§just enough§personas (and their use in stories)§sketching and documentation§design

§the end product

11

does anyone like producing documents that don’t get read?§can you get away with just sketches…

sketching and documentation

12

The interactive sketching notation is an emerging visual language which affords the representation of interface states and event-based user actions. Through a few simple and standardized rules, what the user sees (drawn in greys and blacks) and does (drawn in red) are unified into a coherent sketching system. This unification of both interface and use, intends to enable designers to tell more powerful stories of interaction.

Interactive  Sketching  Notation Version 0.1

Event BindingEvents

Transitions

Advanced Notations Rapid Tactics

Page OrganizationEmphasis TechniquesConcept Title. Each page can contain a title in the top left. For multi-page concepts, use roman numerals as a suffix.

To Element. A rounded starting point denotes an event bound to a par-ticular drawn element.

Unspecified Transition. A default transition is instant without delay.

Basic Condition. If something is to be met before the next screen.

Condition with Else. Conditional representation of an IF/ELSE combination.

Automatic Sequence. Use a black arrow(s) if there is a sequence of screens that are shown automati-cally to the user in an order.

Delay. The time it takes before a transition starts.

Duration. The time it takes for a transition to complete.

Effect. Two possible effects include: FADE, and SLIDE.

Events are initiated when users perform various actions on an interface. Think of events as causes and screens as effects. For the purpose of this notation, some relevant events could include:

To Area. An event is bound to a specific area on the screen.

To Anywhere. An event is attached to the full window.

Emphasis. Indicating an important element with a 10% grey.

Drag&Drop. Quickly show a drag and drop interaction.

Delta Box. Only draw items which changed, suggesting that previous screen ele-ments will also appear.

Zooming. Draw at least one corner to zoom in and close up on what is impor-tant in the interface.

Multi Clicks. Use the same screen to show two or more clicks at the same time.

Selected State. Showing a selected item with a 30% grey.

Unspecified Event. A simple arrow that represents a CLICK action by default.

Specific Event. To represent a user action with an event, note it above the arrow.

Combined Events. Sometimes users perform more complex actions such as holding a key and clicking.

Real World Actions. User actions can also happen outside of an interface.

CLICKDBLCLICKRCLICKMOUSEOVERMOUSEOUTMOUSEMOVEMOUSEUPMOUSEDOWNCHANGE

FOCUSBLURKEY: XKEYUP: XKEYDOWN: XLOADUNLOADSCROLLSUBMIT

Variations. Each concept can have multiple varia-tions which are referred to alphabetically.

Credits: Linowski Interaction Design http://www.linowski.ca/sketching & all those who shared their work on Wireframes Magazine.This work is licenced under the Creative Commons Attribution-Share Alike 2.5 Canada License http://creativecommons.org/licenses/by-sa/2.5/ca/

linowski

sketching and documentation

§we have, but only under in certain conditions

§when sketches don’t work we spike prototypes - sometimes within the app!

§requirements are “acceptance tests”

13

just enough / good enough

§good enough§generically across the project

§just enough§personas (and their use in stories)§sketching and documentation§design

§the end product

14

design

a beautiful photoshop file…

15

design

but, the application…

16

§if phase 2 happens, how much of your detailed ux work will actually get used, or (realistically) will it all be changed again based on new things you’ve learnt - if so - why do it?

§thank youmark@found.me.uk

@uxplant

finally…

17