! @davidmorganUX

CHOOSE YOUR BATTLES

UX design Information architecture Safety-critical systems Service design Information visualisation Trainings

! @davidmorganUX

CONTEXT OF MY WORK

Big corporation

e-Commerce, marketing & customer support

Many stake holders

Many fixed processes

Variable turn around time

Graphics and HTML in team

YOU KNOW THAT THING YOU NORMALLY DO IN TWO MONTHS…

! @davidmorganUX

YOU KNOW THAT THING YOU NORMALLY DO IN TWO MONTHS…

DO THAT IN TWO WEEKS!!

! @davidmorganUX

! @davidmorganUX

Design Iterate

IMPORTANT IN (UX) DESIGN

Evaluate

! @davidmorganUX

IT SHOULDN’T BE A PROBLEM

THOUGH.

! @davidmorganUX

DECISIONS

! @davidmorganUX

DECISIONS

Size

Stage of project

Changes

Decisions

! @davidmorganUX

DECISIONS

Size

Stage of project

Changes

Decisions

! @davidmorganUX

PARETO RULE

Vilfredo Pareto Italian economist and hipster

! @davidmorganUX

PARETO RULE

80% 20%

20% of cause(s) 80% ofe-commerce visitors profitfeatures usagebugs crashesinput the result

! @davidmorganUX

PARETO RULE

! @davidmorganUX

MORE TIME MORE DETAILOR MAKE SMART CHOICES

Leve

l of D

etai

l

Project parts

Detailed designMid-level DesignSmart Design

SO, HOW DOES THIS AFFECT MY WORK?

! @davidmorganUX

2 MAIN UX DELIVERABLES

HIGH-LEVEL DETAILED DESIGN

! @davidmorganUX

HIGH-LEVEL DESIGN GOALS

Understand scope

Understand structure and flows

Get other team members started

! @davidmorganUX

HIGH-LEVEL DESIGN

Reduced content Only header and button text

No Images, only place holders

Modular

Platform agnostic

Focus on the relevant

Small

Based on “styles”

! @davidmorganUX

THUMBFLOWSConceptual improvements

Content as navigation

Reduce a step

Provide multiple paths

Serve majority first

Align major stakeholders

First technical reality check

HTML Manuals

! @davidmorganUX

THUMBFLOWSConceptual improvements

Content as navigation

Reduce a step

Provide multiple paths

Serve majority first

Align major stakeholders

First technical reality check

HTML Manuals

! @davidmorganUX

! @davidmorganUX

DETAILED DESIGN GOALS

Understand content needs

Micro UX

Realistic representation

Receive conclusive feedback

Can brief Developers and Graphic Designers

! @davidmorganUX

DETAILED DESIGN

Real copy

Real images

Actual scale

Works in destination platform

! @davidmorganUX

DETAILED DESIGN

! @davidmorganUX

WHEN GO FROM H-L TO DETAILED

80%?

Traditional/innovative

Complicated interactions

Critical for conversion/Business

Easier to show then explain

Political0

25

50

75

100

1 2 3 4 5 6 7 8 9 10

Pages

! @davidmorganUX

WHAT ABOUT HTML PROTOTYPES?

Responsivenes

Scale

Focus

Speed

Don’t let technology dictate the design HTML VS

TEAMWORK

! @davidmorganUX

COLLABORATIVE TOOL

SVN Server

Me Colleague

! @davidmorganUX

STYLEGUIDE

! @davidmorganUX

! @davidmorganUX

QUICK WIDGETS

! @davidmorganUX

CONSTANT & IMMEDIATE SHARING

15 seconds, across the world

! @davidmorganUX

! @davidmorganUX

TAKE AWAYS

Always question HOW you work.

Fail share fast, fail share often

Use tools that are collaborative, support modularity and are easy to share

Get lost in the right details

THANKS!

! @davidmorganUX

Read my article on the ten commandments of Axure

THANKS!

! @davidmorganUX