UX Project Starter Kit


Published on

You don't have to be a UXD specialist to bring task-centric thinking into your development projects. The UXD Stack is a format for writing a brief that will get you and your team thinking from a user-centric perspective as you start your next project.

Published in: Technology, Business
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • goal: understand the business reasons for the endeavorthe difference between an artist and a designer. We’re not seeking self-expression. Our reward is in solving business problems.Understanding the business strategy and tactics helps to design the most effective solution
  • goal: understand who will be using the site. what makes them unique? how many groups will be using the site
  • understand scope of what people want to know and do while using the site
  • goal: understand what non-verbal communication is required. what’s the most appropriate style?
  • goal: understand what non-verbal communication is required. what’s the most appropriate style?
  • Goal: what “physical” means is most appropriate for conveying the content to the audience with the desired tone?What browsers / platforms are supported?Will people use mobile devices to access the site?
  • show example steps / deliverablespurpose isn’t to redefine an existing brand. Its to understand how it translates to the web
  • UX Project Starter Kit

    1. 1. UX Kick StartStart your UX projectoff on the right foot.PresentedFor ABSG-UXD, Frisco, TexasBy Mark Kraemer, Credera.comOn October 20, 2011
    2. 2. HE LLO MY NAM E IS Krae merMark @kra emer
    4. 4. Agenda: •  What is UX? •  The UX Brief •  UX Deliverables •  Kick Start
    5. 5. User experience is a term used to describe theoverall experience and satisfaction a user haswhen using a product or system.From Wikipedia
    6. 6. Our Goal is to create sites and applications thatpeople like to use.
    7. 7. Great.That’s a lot to cover. Where do I start?
    8. 8. The UX Stack is a useful framework to organizethe success criteria for your next project. What  are  we  trying  to  achieve?   Purpose   Who  do  we  need  to  achieve  the  goal?   Audience     What  message  conveys  the  reason  for  the  audience  to   Content   respond?     What  non-­‐verbal  cues  will  make  the  message  more  credible?     Form   How  is  the  message  physically  presented?     Technology    
    9. 9. Purpose:Why are stakeholders investing in this project?
    10. 10. The  more  you  understand  about  the  nature  of  your  client’s  business,  the  be<er  suited  you’ll  be  for  success.  Keeping  the  client  purpose  in  mind  will  help  avoid  resembling  the  quote  we’re  all  warned  by  in  Jurassic  Park:  “Yeah,  but  your  scienGsts  were  so  preoccupied  with  whether  or  not  they  could,  they  didn’t  stop  to  think  if  they  should.”  
    11. 11. photo  by  7-­‐how-­‐7  /  steve  on  flicrkr.com   Audience: Who are the primary (and other) users?
    12. 12. YOU <> YOUR USER
    13. 13. What are your users really doing?Ask them! Watch them? They’ll love you for it.
    14. 14. Content: What do people want to know and dowhile using the site or application?
    15. 15. Form
    16. 16. Tone
    17. 17. Argentina Form is both the logical and the emotional. Bolivia Columbia Puerto Rico Brazil Venezuela Chile Country Mexico Countries Peru Individual Lines of Panama Country Country Business Canada United States Operations Holland France Country Hungary Tasks & Greece Israel Activities Germany Country- Belgium Relevant Switzerland News & Ireland Events Netherlands Branches United Kingdom Jordan Document Luxembourg Repository & Russia Fileshare Poland Regions Individual Italy Branch Dubai APAC Custom Czech Republic EMEA Business Morocco US Applications Bahrain BGS El Salvador LA South Africa Turkey Individual Malaysia Region South Korea Philippines Vietnam China Japan India Maps & Taiwan Directions ailand Australia Regional Singapore Operations Branch- Branch Hong Kong Relevant Operations News & Events Most localization and Regional translation occurs Lines of Document Branch here on a local basis. y Repository & Business FIleshare Lines ofg Business Locally Relevant Content
    18. 18. 1.  The  Upper  Right-­‐Hand  Corner  That’s  the  prime  spot  where  diners’  eyes  automaGcally  go  first.  Balthazar  uses  it  to  highlight  a  tasteful,  expensive  pile  of  seafood.  Generally,  pictures  of  food  are  powerful  mo<vators  but  also  menu  taboos—mostly  because  they’re  used  extensively  in  lowbrow  chains  like  Chili’s  and  Applebee’s.  This  illustraGon  “is  as  far  as  a  restaurant  of  this  caliber  can  go,  and  it’s  used  to  draw  a?en<on  to  two  of  the  most  expensive  orders,”  Poundstone  says.    2.  The  Anchor  The  main  role  of  that  $115  pla<er—the  only  three-­‐digit  thing  on  the  menu—is  to  make  everything  else  near  it  look  like  a  rela<ve  bargain,  Poundstone  says.    3.  Right  Next  Door  At  a  mere  $70,  the  smaller  seafood  pla<er  next  to  Le  Balthazar  seems  like  a  deal,  though  there’s  no  sense  of  how  much  food  you’re  geXng.  It’s  an  indefinite  comparison  that  also  feels  like  an  indulgence—a  win-­‐win  for  the  restaurant.    4.  In  The  Vicinity  The  restaurant’s  high-­‐profit  dishes  tend  to  cluster  near  the  anchor.  Here,  it’s  more  seafood  at  prices  that  seem  comparaGvely  modest.    5.  Columns  Are  Killers  According  to  Brandon  O’Dell,  one  of  the  consultants  Poundstone  quotes  in  Priceless,  it’s  a  big  mistake  to  list  prices  in  a  straight  column.  “Customers  will  go  down  and  choose  from  the  cheapest  items,”  he  says.  At  least  the  Balthazar  menu  doesn’t  use  leader  dots  to  connect  the  dish  to  the  price;  that  draws  the  diner’s  gaze  right  to  the  numbers.  Consultant  Gregg  Rapp  tells  clients  to  “omit  dollar  signs,  decimal  points,  and  cents … It’s  not  that  customers  can’t  check  prices,  but  most  will  follow  whatever  subtle  cues  are  provided.”    6.  The  Benefit  Of  Boxes  “A  box  draws  a?en<on  and,  usually,  orders,”  Poundstone  says.  “A  really  fancy  box  is  be<er  yet.  The  fromages  at  the  bo<om  of  the  menu  are  probably  high-­‐profit  puzzles.”    7.  Menu  Siberia  That’s  where  low-­‐margin  dishes  that  the  regulars  like  end  up.  The  examples  here  are  the  easy-­‐to-­‐miss  (and  rela<vely  inexpensive)  burgers.    8.  Bracke<ng  A  regular  trick,  it’s  when  the  same  dish  comes  in  different  sizes.  Here,  that’s  done  with  steak  tartare  and  ravioli—but  because  “you  never  know  the  por<on  size,  you’re  encouraged  to  trade  up,”  Poundstone  says.  “Usually  the  smaller  size  is  perfectly  adequate.”  h<p://nymag.com/restaurants/features/62498/  
    19. 19. Technology
    20. 20. Technology is not just back end.What will your audience use? What  screen  are  they  using?   • ResoluGon?  Colors?   • ConnecGon  speed?   • Browser,  or  naGve  client?   Browser   • Internet  Explorer  6?  7?  8?   • Firefox?  Safari?  Opera?   • Windows?  Mac?  Other?   Device?   • Desktop?  Laptop?   • Mobile?  Tablet?   • Kiosk?  Touchscreen?  
    21. 21. The framework is universal across all communication.Think of it in terms of today’s event. <  what  was  the  goal  today?  >   Purpose   <  who  was  the  audience?  >   Audience   <  what  were  the  primary  and  secondary  messages?  >   Content   <  what  kind  of  tone  did  we  use?  >   Form   <  what  kind  of  media  /  technology  did  we  use?  >   Technology  
    22. 22. How is your current site? Applying  the  communicaGon  framework  to  your   own  site  is  a  good  way  to  consider  how  it  can   be  improved  to  be<er  serve  your  business  
    23. 23. Self-Assessment Sample Questions •  Is  your  current  site  helping  you  achieve  your  business’s  goals?   •  Does  it  reach  out  to  each  specific  audience  you  need  to  address?   •  Does  it  provide  all  the  content  /  funcGonality  they  need?   •  Is  your  brand  represented  with  the  quality  and  value  you’re  seeking?  is   the  site  a  pleasure  for  its  visitors?   •  Does  your  site  work  well  on  portable  devices?  
    24. 24. Time for group exercise!
    25. 25. Time for group exercise!
    26. 26. The brief is great.But we needmore detail!
    27. 27. Who is the target customer? What is the customer need? What is the product name? What is its market category? What is its key benefit? Who or what is the competition? What is the product’s unique differentiator? ?p=125 rm.com/ ww.gogamesto ming - http://w G amestor ssly stolen fromShamele
    28. 28. Successful elevator pitches often start with amad-lib-like template: For (customer) who has (customer need), (product name) is a (market category) that (one key benefit). Unlike (competition), the product (unique differentiator).
    29. 29. Our brand statement:Credera is a management and technologyconsulting firm committed to your success.Our clients hire us to own their toughest problemsand retain us because we fulfill our promises.
    30. 30. Purpose:
Increase theefficiency ofmanaging assets forour remarkable
in-store experience"
    31. 31. Audience: Personas
    32. 32. Audience: Field Study
    33. 33. Content: Use Cases & Process Flow
    34. 34. Content: Site Maps
    35. 35. Content: Wireframes Flexible,  easy-­‐to-­‐update   paper  prototypes     Depict  layout,  but  stay  (mostly)   silent  about  visual  design     Shared  reference  point  for  future   development  acGviGes  
    36. 36. Content: Wireframes
    37. 37. Form: Branding WorkshopGet Matt’s materials at http://bit.ly/bigdefend
    38. 38. Form: Comps p final-round com live site
    39. 39. Technology: Click-Through Prototype “Movie-­‐set”  Func<onality   • Provide  breadth  and/or  depth  of   funcGonality   • Use  actual  browser  code  (XHTML,  CSS,   JS,  images)  to  render  screens   • No  back-­‐end  connecGvity   • Gives  stakeholders  confidence  and   clarity  of  expectaGons   • IKIWIUI  =   “I  know  it  when  I  use  it”  
    40. 40. Time for group exercise!
    41. 41. Every journey startswith a single step.What single, simpleaction will start yourproject movingforward?
    42. 42. Time for group exercise!
    43. 43. Questions?
    44. 44. Thanks! Think  of  more  quesGons  later?     Call  +1  (214)  232-­‐3890,  or  write  mkraemer@credera.com    h<p://blog.credera.com/topic/management-­‐consulGng/the-­‐uxd-­‐stack/