Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.
The hitchhiker’s guide
To UXing without a UXer
Chrissy Welsh
Creative Lead & Director
Why do this talk?
The ELEPHANT in the room!
“I want to build great
things... I start out with
good intentions but it
always turns out rubbish...
what happened?”
A B
Great Experience
Easy Interfaces
Happy Users
What will you learn?
• How important it is to have one vision 

• How to think like a user

• Why you should wireframe and...
The Vision
The Vision - Do you have one?
Print this out...
“What one thing do
you want it to do well?”
The User - Who are they?
• Really think & write out
who will use your app/
website

• Write out their age,
education job e...
The User - What are they doing?
• Where are they going?

• What are they trying to
achieve?
Why, crazy lady, are you
making me name
imaginary people?
Example “I just want to buy what I want and get out”
James Dent
32 years old
Product Manager
Key Goals
Knows what he wants...
What does it look like in real life?
This?
...or this?
Wireframes
Why wireframe?
• Fast layouts 

• Easy to see if you have everything you need

• Fast to iterate on

• Cheaper than changi...
Why wireframe?
Having one
idea is great
Iterating on an
idea is better
Trying multiple
ideas gives you
the best solution
What does it look like... really?
What does it turn into?
What if I want to use software?
Some Tools - listed
• Pen & Paper - Super Fast
• Balsamiq Mockups - Fast if you’re scared of paper
• Axure - Less fast but...
Prototypes
Prototypes - also for mobile!
Real Examples
What if I want to use software?
Other ways to gather data?
...another cool way
“Greatness doesn't
take shortcuts”
What if I can’t evaluate it fairly?
Find a friend!
Here’s what it looks like
And when it doesn’t go as expected?
Keep it or bin it?
The end?
• How important it is to have one vision 

• How to think like a user

• Why you should wireframe and how to do it

• How ...
Chrissy Welsh (@chrissywelsh)
Question Time
The hitchhiker's guide to UXing without a UXer - Chrissy Welsh - Codemotion Milan 2016
The hitchhiker's guide to UXing without a UXer - Chrissy Welsh - Codemotion Milan 2016
The hitchhiker's guide to UXing without a UXer - Chrissy Welsh - Codemotion Milan 2016
The hitchhiker's guide to UXing without a UXer - Chrissy Welsh - Codemotion Milan 2016
The hitchhiker's guide to UXing without a UXer - Chrissy Welsh - Codemotion Milan 2016
The hitchhiker's guide to UXing without a UXer - Chrissy Welsh - Codemotion Milan 2016
Prochain SlideShare
Chargement dans…5
×
Prochain SlideShare
Lo sviluppo di Edge Guardian VR - Marco Giammetti - Codemotion Milan 2016
Suivant
Télécharger pour lire hors ligne et voir en mode plein écran

0

Partager

Télécharger pour lire hors ligne

The hitchhiker's guide to UXing without a UXer - Chrissy Welsh - Codemotion Milan 2016

Télécharger pour lire hors ligne

Sometimes you are tasked with building great things by yourself or in a small team. Bootstrapped start-ups don’t always have the budget for a dedicated Uxer to help you design the best apps, software or websites. This guide will get you started developing the right way and stop you making classic mistakes. Before you even consider touching your dev environment I will show you how to “Start with one idea”, “Think like a user” and set out your user journeys.

  • Soyez le premier à aimer ceci

The hitchhiker's guide to UXing without a UXer - Chrissy Welsh - Codemotion Milan 2016

  1. 1. The hitchhiker’s guide To UXing without a UXer
  2. 2. Chrissy Welsh Creative Lead & Director
  3. 3. Why do this talk?
  4. 4. The ELEPHANT in the room!
  5. 5. “I want to build great things... I start out with good intentions but it always turns out rubbish... what happened?”
  6. 6. A B Great Experience Easy Interfaces Happy Users
  7. 7. What will you learn? • How important it is to have one vision • How to think like a user • Why you should wireframe and how to do it • How to make a throwaway prototype • How to evaluate your work • & Finally when to scrap it and start again
  8. 8. The Vision
  9. 9. The Vision - Do you have one?
  10. 10. Print this out... “What one thing do you want it to do well?”
  11. 11. The User - Who are they? • Really think & write out who will use your app/ website • Write out their age, education job etc. • Name them - for example Arthur Dent
  12. 12. The User - What are they doing? • Where are they going? • What are they trying to achieve?
  13. 13. Why, crazy lady, are you making me name imaginary people?
  14. 14. Example “I just want to buy what I want and get out” James Dent 32 years old Product Manager Key Goals Knows what he wants to buy Doesn't want to browse Behaviors Gets bored quickly Wants quality products We Must Clearly show key features Show only relevant offers We must never Provide fluffy product descriptions Overwhelm with choice
  15. 15. What does it look like in real life?
  16. 16. This?
  17. 17. ...or this?
  18. 18. Wireframes
  19. 19. Why wireframe? • Fast layouts • Easy to see if you have everything you need • Fast to iterate on • Cheaper than changing code
  20. 20. Why wireframe? Having one idea is great Iterating on an idea is better Trying multiple ideas gives you the best solution
  21. 21. What does it look like... really?
  22. 22. What does it turn into?
  23. 23. What if I want to use software?
  24. 24. Some Tools - listed • Pen & Paper - Super Fast • Balsamiq Mockups - Fast if you’re scared of paper • Axure - Less fast but High Fidelity • Photoshop - Use if a client is going to look at it • Illustrator - If you dont like Photoshop • InvisionApp - Link those bad boys!
  25. 25. Prototypes
  26. 26. Prototypes - also for mobile!
  27. 27. Real Examples
  28. 28. What if I want to use software?
  29. 29. Other ways to gather data?
  30. 30. ...another cool way
  31. 31. “Greatness doesn't take shortcuts”
  32. 32. What if I can’t evaluate it fairly?
  33. 33. Find a friend!
  34. 34. Here’s what it looks like
  35. 35. And when it doesn’t go as expected?
  36. 36. Keep it or bin it?
  37. 37. The end?
  38. 38. • How important it is to have one vision • How to think like a user • Why you should wireframe and how to do it • How to make a throwaway prototype • How to evaluate your work • & Finally when to scrap it and start again What we have covered
  39. 39. Chrissy Welsh (@chrissywelsh) Question Time

Sometimes you are tasked with building great things by yourself or in a small team. Bootstrapped start-ups don’t always have the budget for a dedicated Uxer to help you design the best apps, software or websites. This guide will get you started developing the right way and stop you making classic mistakes. Before you even consider touching your dev environment I will show you how to “Start with one idea”, “Think like a user” and set out your user journeys.

Vues

Nombre de vues

474

Sur Slideshare

0

À partir des intégrations

0

Nombre d'intégrations

0

Actions

Téléchargements

11

Partages

0

Commentaires

0

Mentions J'aime

0

×