Design is not a skin to be added later or a flat image to be imagined in to a fully fledged product. 'Traditional' software ux design is broken: here I propose a new way taking a leaf out of the eXtreme Programming methodology and making it our own...
3. @hedshot
Title position here
Your title sit over itYOUR HOST TODAY…
MIKE RAWLING
LEAD UX AT UNRULY.CO, LONDON:
TEAM-OF-ONE & UX COACH:
INTERACTION DESIGNER, UI ENGINEER, UI DESIGNER, UX RESEARCH,
USER RESEARCH, TEST PARTICIPANT RECRUITER, USABILITY TESTER,
MICRO-COPY WRITER, TRAINER, MENTOR ETC…
UX history dating back to ’98 – pre “UX”!!!
Consulted, designed, engineered, leader of, coached, trained big & small teams and initiatives for:..
Tesco, Wiley Publishing, Camelot, Konami, LoveFilm and Granada Television, ITV and Unruly.co…
6. @hedshot
Title position here
Your title sit over it
@hedshot
WARNING - MAY CONTAIN
UNRULY CULTURE…
...and of course, err, creative cultural appropriation and mixing…;)
8. @hedshot
Title position here
Your title sit over itTHIS EVENING…
• THE PROBLEM WITH PRODUCT DESIGN
• A SOLUTION
• SOME TECHNIQUES TO MAKE THAT HAPPEN
The details are not the details.
They make the design.
C.Eames
9. @hedshot
Title position here
Your title sit over it
PRODUCT DESIGN & DEV IS BROKEN…
{NOTES}:
• AGENCY DESIGN PROCESS SEPARATE FROM
• TECH AND DESIGN TEAMS SPEAK DIFFERENT LANGUAGES
• SOMETIMES PRODUCT DEVELOPMENT CAN’T DELIVER WHAT 3RD PARTY DESIGN AGENCIES PROVIDE THAT’S BEEN
SIGNED OFF WITH CLIENT
• WE DESIGN AND BUILD THE MOST BEAUTIFUL THING THAT CLIENT WANTS, USERS DON’T WANT IT AFTER ALL…
• TECHNICALLY ORIENTATED COMPANIES ( - START-UPS - ) BUILT PRODUCT AND THEN GET ‘DESIGN’ IN TO POLISH IT
• PRODUCT DESIGN IS CONTINUOUS AND MORE LIKE FARMING THAN BUILDING CONSTRUCTION
• I HAVE HEARD *DESIGNERS* USE THE METAPHOR OF DESIGN AS THE INTERIOR DECORATION IS HOW DESIGN
RELATES TO THE REST OF THE PRODUCT – THIS IS VASTLY INCORRECT – AND MORE AKIN TO BUILDING
ARCHITECT!
11. @hedshot
Title position here
Your title sit over it
@hedshot
THE PROBLEM
Fails with modern software products that:
• immediately updateable client<>server applications, like SAAS,
• regularly updated model, like Apps or phone OS software
13. @hedshot
Title position here
Your title sit over it
@hedshot
THE PROBLEM
Worst case, teams often have to…
• Design first:
gain client sign-off then pass an PSD ‘spec’ to ‘dev’ then leave…
• Build/dev first:
get in design to ‘skin’ the product after it’s essentially finished…
15. @hedshot
Title position here
Your title sit over it
A SOLUTION
But we can learn some things from product and industrial design of complex products
like automotive design where successful exterior body designers also work closely with
handling, engine, fluid and air dynamics and NVH teams:
16. @hedshot
Title position here
Your title sit over itA SOLUTION
It goes both ways –
• ‘Design’ can’t be just an afterthought of engineering team but equally,
• Design can’t work in a vacuum, leaving engineers unable to fulfil the
designers visions…
26. @hedshot
Title position here
Your title sit over itCROSS-DISCIPLINARY PAIRING…
https://www.linkedin.com/groups/Pair-design-3315113.S.5968946180594364420
+
+ +
+ +
+
27. @hedshot
Title position here
Your title sit over itSTART SIMPLY BUT BOLDLY
Set Vision in text and general design feel - at most!!
•Understand Audience
•Identify core principles and guidelines
•Start a list of potential features.
•That’s it..
28. @hedshot
Title position here
Your title sit over it
@hedshot
UX COACH
UX Coach: mentor, train and coach to help the team to help themselves – so
they themselves are immersed in user intelligence and knowledge
29. @hedshot
Title position here
Your title sit over it
@hedshot
UX COACHING
UX Coach: Most difficult skill is to give away knowledge in this context but…
Don’t worry, no one else can do your job (however much they think they can)
30. @hedshot
Title position here
Your title sit over itUX -> FACILITATOR
DON’T
Be the Lone Ranger – Seek to marinade
the whole team in user intelligence
DO
Deputise team members in research
activities
31. @hedshot
Title position here
Your title sit over it
@hedshot
USER INTEL
UX or product designers present always to marinade the team in user intel
throughout
40. @hedshot
Title position here
Your title sit over it
CAN’T DRAW WON’T DRAW
(PROGRAMMER:…)
• “I CAN’T DRAW – LET ALONE ‘DESIGN’!”
• “DESIGN IS FLUFFY!”
• “DESIGNERS DON’T KNOW SH*T”
• “I’M NOT A DESIGNER”
• “WTF?”
LATER…
• “…BUT THAT’S NOT THE BEST DESIGN”
• “..I WON’T DO IT LIKE THAT…”
• “THAT’S JUST TOO WACKY/UNUSABLE/UNUSUAL/
CUSTOM/ETC…”
• “I COULD DO BETTER…”
“I CAN’T DRAW”
OK, SO HOW?
42. @hedshot
Title position here
Your title sit over it
ENTER: DESIGN CHARRETTES*!!
• ALLEGEDLY BASED REGULAR CRITIQUES AT AN ART ACADEMY IN
PARIS – POSSIBLY BEAUX ARTS
(ALSO CALLED ‘DESIGN STUDIO’)
• ABOUT REGULAR ‘CRITIQUES’
• STUDENTS RACE TO FINISH…
• USEFUL AND EFFECT URGENCY IN THE PROCESS!
*DOCUMENTED IN THE BOOK: LEAN UX, BY JEFF GOTTHELF
OK, SO HOW?
48. @hedshot
Title position here
Your title sit over itSTATIC DOESN’T CUT IT
Goodbye Design Phase!
Static design and doesn’t cut it: design straight into prototypes Axure or
HTML or POP or whatever tool.. #nopsd
51. @hedshot
Title position here
Your title sit over it
@hedshot
PROTOTYPES
Prototypes become testable living breathing document for:
•usability/ux testing
and user validation
AND….
52. @hedshot
Title position here
Your title sit over it
@hedshot
PROTOTYPES
Prototypes become testable living breathing document for:
•usability/ux testing
and user validation
And Client sign off!!
55. @hedshot
Title position here
Your title sit over it
@hedshot
SET OUT GUIDELINES
…Branding Guidelines? Interaction guidelines like the BBC’s…??
http://www.bbc.co.uk/gel
56. @hedshot
Title position here
Your title sit over it
BEYOND BRANDING GUIDELINES, BEYOND INTERACTION GUIDELINES: LIVE UX GUIDELINES
SET OUT GUIDELINES
57. @hedshot
Title position here
Your title sit over it
@hedshot
Actually sit with engineers to actually code this with them…
SET OUT GUIDELINES
59. @hedshot
Title position here
Your title sit over it
@hedshot
OK, SO HOW?
Many people show *clients*:
…the results of testing or design but
involving them in it is critical AND…
Many people show their team of:
*Devs, engineers, testers, product owner..
….the results of testing or design but
actually involving them in it is critical
too…
67. @hedshot
Title position here
Your title sit over it
@hedshot
DO THIS EVERY DAY OR WEEK
• Colocation in time and space
• - with close collaboration!
• UX Coach
• Communicate:
• Drafting Together: in charrettes
• Prototype the product itself
• Beyond brand guidelines: live ux guidelines
• Test Together
69. @hedshot
Title position here
Your title sit over it
@hedshot
THANKS FOR LISTENING!
MemberVideo Council Whitelisted
Winner Best Content
Distribution Service
Michael.rawling@unrulymedia.com
@hedshot
70. @hedshot
Title position here
Your title sit over it
@hedshot
PROPS!
Orange bus
seniorgif.com
Team unicorn
Dark parodies
Umbrella corporation
Memegenerator.net
Carter reid
Bodies in the crawlspace
Hollywood
Meme Center
destroyer.tumbler.com
Someecards
SHIELD
Star Trek
Elvis.ro
Gliphy
Gifsoup.com
The department of homeland security
Lolcats everywhere
Random Kittens
Ghosthunters
The Muppets
icanhascheeseburger.com
soundbible.com
Marvel
Anyone else I forgot!!
Sony
Playstation
The NY transit auth.
The Wachowskis
Jeff Gothelf
Jon Innes
Thoughtworks
Manalo Blahnik
Jaguar
Disney
Bentley
Ryan Gosling
Clint Eastward
Etc…
Notas del editor
Video
Technology
Social media
OK! So who’s here?
Raise your hands if….you’re from the US? From Europe? APAC countries? Anywhere else?
Raise your hands if….you’re working on the product site? Who’s in implementation? Any UX specialists? Any chickens here?
Software product design is broken.
History of Product Design has been about The Big Bang, the release of product, the One Shot delivery of a tangible product to a customer – chair, book, poster, tablet, car…and you can’t change it once it’s left the high street store…
Fail!
Robust, usable, beautiful and rigorous design in truly long lived software products has been *rare*, so far…
Involve whole team at project/product initiation: it goes both ways – design can’t be just an after thought of engineering team but equally, designing an impossible, imaginary product in the ‘real world’…unrealistic
Change of ethos & culture…
Requires a rather holistic approach…
‘Continuous (technical) Design and Continuous Integration’ was conceived to be about about system architecture – the design of a technical system including hardware, databases, code and services etc. in the constantly shifting environment of websites and development.
‘Continuous (technical) Design and Continuous Integration’ was conceived to be about about system architecture – the design of a technical system including hardware, databases, code and services etc. in the constantly shifting environment of websites and development.
Designing and development often lasts years. Consists of *lots* of updates which are not just patches or tweaks:
the **whole** product evolves, changes, pivots
All the team in one place, at the same times, in the same period of time
Sit closely, all start at once…really ‘bounce ideas’ off all team members – get immediate feasibility
Sit closely, all start at once…really ‘bounce ideas’ off all team members – get immediate feasibility
was ‘Continuous Design and Integration’ was conceived to be about about system architecture – the design of a technical system including hardware, databases, code and interfaces etc. in the moving environment of websites and dev. Designing and development often lasts years. Consists of *lots* of updates which are not just patches or tweaks: the whole product evolves, changes
was ‘Continuous Design and Integration’ was conceived to be about about system architecture – the design of a technical system including hardware, databases, code and interfaces etc. in the moving environment of websites and dev. Designing and development often lasts years. Consists of *lots* of updates which are not just patches or tweaks: the whole product evolves, changes
A wide range of roles participating in a persona workshops: CEOs, Developer, Designers, Product owners, testers, customer service, sponsors, stakeholders: everyone should input and participate
Personas posterised in the **development** area
OK! Who here has…
Raise your hands if….you’ve heard of agile?
Raise your hands if….you’ve used of agile?
Can you tell me what it is?
Do you like it?
Do you hate it?
Add persona names to your features, to your user stories
Go in and slay the dragon?
You’ve go two weeks to do this design job….
Various first stage results from a cross-disciplinary Design Studio session
Various middle stage results from a cross-disciplinary Design Studio session
Various end results from a cross-disciplinary Design Studio session
Working prototypes over beautifully complete photoshopped mock-ups
Keynote
Invision…
Omnigraffle
Pen and paper!!
POP
So we’re trying a technique I call super los res-prototype where the ideas for application elements are presented by the actual sketches we make that we’ve scanned and embedded in a sequence of HTML pages
Here we used Balsamic Mock-ups screen-grabs to up the res from our previous very hand sketched version to make a consistent but obviously still sketchy and still ‘in development’ looking prototype
So we’ve all come across brand guidelines, right….
Live guidelines that acts as a code and implementation reference to the developers, a record of interaction guidelines for the UX guys and UI design guidelines radiator for UI designers – and even a sign off document for clients/stakeholders/sponsors!
This does work well in web-code based applications but I wonder how it would work for others: I’m sure there’s a way branding variables, interactions and animation timing could be codified for other apps to in some form
Even beyond interaction guidelines like the BBC’s…but real representations of interactive features *Live UX Guidelines* - coded guidelines that literally shares production code with product
Involve the whole team, intimately in the UX process
Pair with any and all members of the team to perform UX tasks like writing test scripts and test moderation
User interview scripts templates for anyone to get out there and test
Capture queries anyone in the team has using informal boards and post-its that feed into the following weeks testing
Record and radiate significant / useful feedback from users to the team
Remote testing e.g. try it now and usertesting.com: fast and easy
Team can use and monitor the results from these tools themselves
So to wrap up:
OK! So who’s here?
Raise your hands if….you’re from the US? From Europe? APAC countries? Anywhere else?
Raise your hands if….you’re working on the product site? Who’s in implementation? Any UX specialists? Any chickens here?