User Experience (UX)
Design for the Indie Dev
@JulioBarros
There is a lot of advice out there. Some of it common sense but...
I'm not a designer
I'm also not rich.
Don't have experience writing games.
I'm an aspiring indie
6S Slide Show iCardSort
20 years proffesional dev experience
Felt the need to adapt design advice to...
Goal as Indie
Sustainable business creating products of value.
Nothing against games.
Don't have a hit driven personality....
About you
• Aspiring indie
• Getting started
• Engineering is your super power
Assuming you are not marketer, or sales per...
You are not a designer.
We hear this all the time. You are a developer not a designer.
Can you even draw?
You are not a designer.
We need to change this.
Great drawing and art skills not a prerequisite.
Design is more about prob...
Optimizing ...
• Engineering
• Business
• Marketing / Sales
• Product Manager
• Graphic design
• UX design
When we "solve"...
UX is your product
User's experience is his perception of your product.
No one cares or knows as much as you do.
You can n...
We are all (UX)
designers.
As Indies, .... We need to start thinking of ourselves as designers.
Don't need to compete with...
Why are professionals
better?
• Experience
• Perspective
• Focus
Practice - Experience, training
Perspective / Distance - ...
We can get better
You may not be great but you can get better
You have 'do it' skills
By getting better you will attract b...
The Approach
• Manage Fear
• DevelopVision
• Cultivate Feedback
Based on Jared Spool - vision, feedback, culture for corpo...
Fear
afraid of failure, of success, ...
afraid you'll build something no one will use or pay you for
afraid you are not go...
Fear of being wrong
People will laugh
We'll be ostracized from the village
The lions will eat us
Lions Raw (roar) - http://www.flickr.com/photos/matthew_norris/
4591355259/
I'm taking a chance
I'm afraid you will laugh at me ... luckily not too many lions Austin
Most people
... won't notice. To...
Cognitive Biases
• Survivorship bias
• Confirmation bias
• Loss aversion
• Information bias
• Bias blind spot
• ~100 others...
Blind Men and the
Elephant
Famous old story.
Schrödinger's Elephant
We think we're the ones that can see everything clearly.
Schrödinger's Elephant
But we have our own biases and blind spots.
DevelopVision &
Cultivate Feedback
Now that we are open to learning we address vision and feedback.
Think before you code.
Classic advice you always hear.
Usually said in a condescending way (I told you so) when you mess u...
Think before you code.
Of course you have to think but it is not enough and it is not
everything.
Based on waterfall
Assum...
Waterfall
Design (Software engineering) advice assumes you have known
knowns
Make a plan follow the plan
Awesome if you ar...
My interpretation of
"Lean"
Read - Eric Ries
Iterative development
Learn from the smallest possible changes
Get to a desir...
Each Step
No plan survives first contact with the enemy/customer.
Right or wrong learn from your actions
Do the minimum pos...
Iterate
Idea generation
1. Generate lots of ideas
2. Choose the "best" ones
3. Present them to someone
4. Analyze their feedback
Exercise
Write ideas for 2 minute
Write 20 ideas without stopping
Take a minute to evaluate them
Feature or product ideas
...
Validation
What are you building?
Does anyone care?
What makes it great?
What does this app really do?
Where / how will pe...
Product Definition
Statement
"An easy-to-use photo management application
for amateur photographers."
Apple on iPhoto in th...
Create a story for it
Use case
Helps with marketing
Base it on product statement without mentioning features or purpose
or...
Draw it out
May not be artists but are all visual thinkers.
Drew as children? Did we forget? Don't draw? You mean you don'...
How to Draw
• Start with a circle. Thats the user.
• Draw a squarish shape for everything in the
story.
Can be
- completel...
Exercise
Look at your list.Write a product statement,
a story (scene description) and a quick
drawing.
Answer their questi...
Exercise
Share your statement, story or drawing with
your neighbor. Listen to their response.
Don't explain or argue. LIST...
CustomerValidation
Who are your customers?
Can you find them?
Can you get them interested?
personas / usecases
How do they ...
Web devs have it easy
• Keywords
• Ad words
• Test landing pages
Adwords tools
We don't have access to iTunes search terms...
Form a UX (support)
group
Get together to discuss and examine each others designs and ideas.
Like CocoaHeads, NSCoder, Mee...
Design Sketches
Its not the tools or even the resulting
drawing but the process.
How are they going to win using your app?...
Exercise
Draw 6 approaches 1 per minute
Generic UX Tips
• Don't make the user choose
• Don't make them read
• Start them off so they can't fail
• Expect and toler...
Choose what works for you.
We are told "IB is not a design tool"
What is the purpose of wireframe or mockup?
To help you think and to help you communicate.
You don't have a client or a te...
Rough out the UX first then come back to making it attractive.
User Testing
• Develop test plan
• Find participants
• Conduct tests
• Analyze results
User testing as integral part of de...
Test Plan
• What do you want to learn?
• What tasks do you want to them to
perform?
• What do you need logistically?
frequ...
Participants
• Spouse
• Friends and coworkers
• Associates
• Strangers
craigslist,
coffee shops
user groups, clubs, church...
Conducting tests
• Get an assistant
• Thank and reassure participant
• Don't explain or apologize
• Ask participant to tal...
Beware of
• asking about the future.
• asking how they would design a feature.
• direct questions.
• loaded questions.
Kee...
Wrap up
• Thank them for participating
• Answer any questions. Ask for thoughts.
• Offer them a small gift if you like
• O...
User testing as part of
your dev process
• Test constantly
• Watch and listen
Exercise
User Test your app (or a competitor's)
Graphic Design
• Importance
• Proximity
• Alignment
• Contrast
• Repetition
... Get an artist.
You now have a compelling a...
Still, test the design
A/B Test
5 Second Test
Quick first impressions test.
What does that make
you think of?
Iterate, Iterate, Iterate
But don't forget to ... Ship.
Ship
“The perfect is the enemy of the good”
-Voltaire
“Art is never finished, only abandoned”
- Leonardo DaVinci
“Perfect i...
Summary
UX is everything
Fear,Vision, Feedback
Pictures, Stories
I've already won. So have you.
Resources
And many many more ... These will get you started.
Contact Info
Julio Barros
Julio@E-String.com
@JulioBarros
http://www.E-String.com
Ux4 indiedevs
Upcoming SlideShare
Loading in …5
×

Ux4 indiedevs

721 views

Published on

Published in: Technology, Business
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
721
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Ux4 indiedevs

  1. 1. User Experience (UX) Design for the Indie Dev @JulioBarros There is a lot of advice out there. Some of it common sense but I don't agree with all of it.
  2. 2. I'm not a designer I'm also not rich. Don't have experience writing games.
  3. 3. I'm an aspiring indie 6S Slide Show iCardSort 20 years proffesional dev experience Felt the need to adapt design advice to my situation. Part workshop part conversation.
  4. 4. Goal as Indie Sustainable business creating products of value. Nothing against games. Don't have a hit driven personality. Want to build apps that enhance people's lives.
  5. 5. About you • Aspiring indie • Getting started • Engineering is your super power Assuming you are not marketer, or sales person, or artist, and probably not a designer
  6. 6. You are not a designer. We hear this all the time. You are a developer not a designer. Can you even draw?
  7. 7. You are not a designer. We need to change this. Great drawing and art skills not a prerequisite. Design is more about problem solving than art. Real world Problem solving is trade offs and optimizations
  8. 8. Optimizing ... • Engineering • Business • Marketing / Sales • Product Manager • Graphic design • UX design When we "solve" we are "optimizing" certain factors ... Software - correctness and efficiency Business - profitability, cash flow, etc. Graphic designer - aesthetics UX designer - user's experience
  9. 9. UX is your product User's experience is his perception of your product. No one cares or knows as much as you do. You can not outsource UX You need to own it. You must own the user experience.
  10. 10. We are all (UX) designers. As Indies, .... We need to start thinking of ourselves as designers. Don't need to compete with professionals just get better.
  11. 11. Why are professionals better? • Experience • Perspective • Focus Practice - Experience, training Perspective / Distance - They are not invested in the product Time - They are getting paid for it Notice: Talent not on the list
  12. 12. We can get better You may not be great but you can get better You have 'do it' skills By getting better you will attract better people around you
  13. 13. The Approach • Manage Fear • DevelopVision • Cultivate Feedback Based on Jared Spool - vision, feedback, culture for corporations Manage Fear - be willing to be wrong, to change and learn Develop Vision - know what you want for yourself, business and product Cultivate Feedback - listen to but don't do everything you are told
  14. 14. Fear afraid of failure, of success, ... afraid you'll build something no one will use or pay you for afraid you are not good enough afraid person X will find out you suck
  15. 15. Fear of being wrong People will laugh We'll be ostracized from the village The lions will eat us
  16. 16. Lions Raw (roar) - http://www.flickr.com/photos/matthew_norris/ 4591355259/
  17. 17. I'm taking a chance I'm afraid you will laugh at me ... luckily not too many lions Austin Most people ... won't notice. Too busy with their own issues. ... will forget ... will give you credit for trying There will be a few haters. No matter what. Do you want to be right or effective?
  18. 18. Cognitive Biases • Survivorship bias • Confirmation bias • Loss aversion • Information bias • Bias blind spot • ~100 others on Wikipedia survivor - x did y and z happened - what about everyone else that did y?
  19. 19. Blind Men and the Elephant Famous old story.
  20. 20. Schrödinger's Elephant We think we're the ones that can see everything clearly.
  21. 21. Schrödinger's Elephant But we have our own biases and blind spots.
  22. 22. DevelopVision & Cultivate Feedback Now that we are open to learning we address vision and feedback.
  23. 23. Think before you code. Classic advice you always hear. Usually said in a condescending way (I told you so) when you mess up.
  24. 24. Think before you code. Of course you have to think but it is not enough and it is not everything. Based on waterfall Assumes everything can be figured out by thinking
  25. 25. Waterfall Design (Software engineering) advice assumes you have known knowns Make a plan follow the plan Awesome if you are on a cost plus contract Waterfall is risky for an indie - build a product no-one wants.
  26. 26. My interpretation of "Lean" Read - Eric Ries Iterative development Learn from the smallest possible changes Get to a desirable product as quickly as possible You are not Apple Focus on speed not cost
  27. 27. Each Step No plan survives first contact with the enemy/customer. Right or wrong learn from your actions Do the minimum possible to test your assumptions Think code test analyze, think code test analyze
  28. 28. Iterate
  29. 29. Idea generation 1. Generate lots of ideas 2. Choose the "best" ones 3. Present them to someone 4. Analyze their feedback
  30. 30. Exercise Write ideas for 2 minute Write 20 ideas without stopping Take a minute to evaluate them Feature or product ideas Judged on quantity not quality Rank your features. You can’t do everything all at once. Force prioritization.
  31. 31. Validation What are you building? Does anyone care? What makes it great? What does this app really do? Where / how will people use it?
  32. 32. Product Definition Statement "An easy-to-use photo management application for amateur photographers." Apple on iPhoto in the HIG You've read the HIG right?
  33. 33. Create a story for it Use case Helps with marketing Base it on product statement without mentioning features or purpose or product till the end.
  34. 34. Draw it out May not be artists but are all visual thinkers. Drew as children? Did we forget? Don't draw? You mean you don't draw well. Are you afraid?
  35. 35. How to Draw • Start with a circle. Thats the user. • Draw a squarish shape for everything in the story. Can be - completely abstract - show real objects and their relationships - realistic scene from previous story
  36. 36. Exercise Look at your list.Write a product statement, a story (scene description) and a quick drawing. Answer their questions politely. Don't explain or argue. LISTEN. If they get it completely wrong it is a sign you need to rethink you statement, story, drawing.
  37. 37. Exercise Share your statement, story or drawing with your neighbor. Listen to their response. Don't explain or argue. LISTEN.
  38. 38. CustomerValidation Who are your customers? Can you find them? Can you get them interested? personas / usecases How do they think? Who is going to use it and why? Act it out
  39. 39. Web devs have it easy • Keywords • Ad words • Test landing pages Adwords tools We don't have access to iTunes search terms. Not to mention the app approval part
  40. 40. Form a UX (support) group Get together to discuss and examine each others designs and ideas. Like CocoaHeads, NSCoder, Meetup but focused on UX testing and validating assumptions.
  41. 41. Design Sketches Its not the tools or even the resulting drawing but the process. How are they going to win using your app? Pick the absolutely most critical features only Choose your metaphors (user model)
  42. 42. Exercise Draw 6 approaches 1 per minute
  43. 43. Generic UX Tips • Don't make the user choose • Don't make them read • Start them off so they can't fail • Expect and tolerate errors • Be polite and helpful • Simplify and focus Error messages that help instead of hurt
  44. 44. Choose what works for you. We are told "IB is not a design tool"
  45. 45. What is the purpose of wireframe or mockup? To help you think and to help you communicate. You don't have a client or a team. Sketches are abstract enough to help thinking. Prototypes are concrete enough to gauge experience. Wireframes and mocks can help but IMO are not worth it.
  46. 46. Rough out the UX first then come back to making it attractive.
  47. 47. User Testing • Develop test plan • Find participants • Conduct tests • Analyze results User testing as integral part of dev process Not looking for statistical significance Short Informal Not beta testing
  48. 48. Test Plan • What do you want to learn? • What tasks do you want to them to perform? • What do you need logistically? frequency, criticality, readiness,
  49. 49. Participants • Spouse • Friends and coworkers • Associates • Strangers craigslist, coffee shops user groups, clubs, church forget the NDA
  50. 50. Conducting tests • Get an assistant • Thank and reassure participant • Don't explain or apologize • Ask participant to talk aloud don't apologize don't explain. watch and listen. give time but offer encouragement
  51. 51. Beware of • asking about the future. • asking how they would design a feature. • direct questions. • loaded questions. Keep quiet, watch and listen. They want to please you. They are biased. Asking is better than nothing but watching is best.
  52. 52. Wrap up • Thank them for participating • Answer any questions. Ask for thoughts. • Offer them a small gift if you like • Offer to keep them updated on the app
  53. 53. User testing as part of your dev process • Test constantly • Watch and listen
  54. 54. Exercise User Test your app (or a competitor's)
  55. 55. Graphic Design • Importance • Proximity • Alignment • Contrast • Repetition ... Get an artist. You now have a compelling app, clear vision, decent UX. Good designers have something they can sink their teeth into and know you are for real.
  56. 56. Still, test the design
  57. 57. A/B Test
  58. 58. 5 Second Test Quick first impressions test.
  59. 59. What does that make you think of?
  60. 60. Iterate, Iterate, Iterate But don't forget to ... Ship.
  61. 61. Ship “The perfect is the enemy of the good” -Voltaire “Art is never finished, only abandoned” - Leonardo DaVinci “Perfect is overrated. Perfect doesn't scale, either.” - Seth Godin “Real artists ship” - SJ The only thing that matters is traction. Ship half a product not a half assed product - 37Signals Expect some to love it and some to hate it.
  62. 62. Summary UX is everything Fear,Vision, Feedback Pictures, Stories I've already won. So have you.
  63. 63. Resources And many many more ... These will get you started.
  64. 64. Contact Info Julio Barros Julio@E-String.com @JulioBarros http://www.E-String.com

×