Upgrade to Pro — share decks privately, control downloads, hide ads and more …

The Collaborative UX Designer's Toolbox

The Collaborative UX Designer's Toolbox

Materials from "The Collaborative UX Designer's Toolkit" workshop presented at UX London, May 30 2014. http://2014.uxlondon.com/speakers/lane/#workshop

You can find the opportunity statement and persona 4x4 worksheets at bit.ly/uxl-worksheets, and the set of six UX Recipe Cards at bit.ly/ux-recipe

Lane Halley

May 30, 2014
Tweet

More Decks by Lane Halley

Other Decks in Design

Transcript

  1. @thinknow • Stimulate necessary conversations • Advance with a shared

    vision • Create engaged teams • Generate trust • Cultivate a culture of learning How can we...?
  2. @thinknow Attention Distance Time pressure HiPPO Confusion Ego Changing mandate

    Lack of ownership Silos Collaboration Challenges Lack of information
  3. @thinknow • More businesses moving online • Broadband internet •

    Connected devices (smartphones) • Low start up costs A digitally wired global economy
  4. @thinknow Design Thinking empathy, creativity and rationality Agile Development self-organizing

    teams, quality code, iterative & incremental delivery Lean Startup products people want, learning experiments
  5. @thinknow Learning experiments Iterative design & delivery Collaborative teams different

    patterns of generalists and specialists Customer information rich information about customer behavior
  6. @thinknow Learning experiments TEST WITH USERS DEFINE EXPERIMENT prototype observations

    and metrics oppportunity statement DECLARE ASSUMPTIONS Metrics Solution persona User Problem REVISE REVISE
  7. @thinknow Customer information Adapted from work by: @clevergirl, @luxrco quantitative

    qualitative generative evaluative Optimizely Analytics A/B Metrics Pirate Metrics Support tickets Surveys Net promoter score Starbucks Interviews Contextual Inquiry Hallway usability five users on friday usability lab
  8. @thinknow • Huge, connected device landscape • Every company is

    a digital company • We create businesses, not just SW • A good user experience must span all touchpoints A great opportunity for UX
  9. @thinknow User advocate Strategist Design advocate Facilitator Synthesizer The UX

    Designer’s Role Problem-solver Maker Generator Trainer Conscience
  10. @thinknow “Do what you do now, but do less of

    it and do it continually.” @williampietri
  11. @thinknow Memory So we get paid Raise money Distributed team

    Feedback Prove we did it Large team Milestones Coders not hired yet Enforces clarity Reasons to document
  12. @thinknow storyboards,   wireframes,   visual  design journey  maps Artifacts

    document shared beliefs personas, scenarios opportunity  statement, hypothesis, business  canvas user  stories PEOPLE USES FEATURES NEEDS BUSINESS  OPPORTUNITY
  13. @thinknow • User Research • Personas • Interaction flow •

    Screen design • Visual look • User testing 1 week
  14. @thinknow • User Research • Personas • Interaction flow •

    Screen design • Visual look • User testing 1 day
  15. @thinknow • User Research • Personas • Interaction flow •

    Screen design • Visual look • User testing 1 hour
  16. @thinknow • Persona 4x4 • Opportunity statement • Six-ups •

    Project brief • Wireframe walkthrough • Customer conversations A few of my favorite recipes
  17. @thinknow Thanks @davehendee, @carbonfive, @originate Wireframe Walkthrough WHAT • Collaborative

    design critique • Build team consensus • Understand trade-offs HOW • Post sketches on the wall • Tell a story • “What happens when...” • Annotate and add stickies
  18. @thinknow Picking the right tool for the job Question What’s

    the objective? What might we do? How is this going to work? Where do we start? How do we build it? Does it work? Activity Opportunity statement, persona 4x4, project brief, conversation guide Six-ups, dot-voting, scenarios, storyboards, experience map Layouts, sketches, wireframe walkthrough Prototype, experiment, MVP User stories, Story map Hallway usability, five on friday, rainbow spreadsheet
  19. @thinknow Opportunity statement Problem: Custom bike shoppers find it difficult

    and time-consuming to learn about options, configure and price the bike they want to buy. Solution: A Web application that lets custom bike shoppers explore different components, envision different combinations and dynamically understand price.
  20. @thinknow Peter explores bike profiles on the CHOOSE BIKE PAGE

    Sees info about what he can do here Sees multiple bike images w/ basic info & price Uses controls to pan through them Chooses a bike to see in more detail Peter sees the bike he picked on the CONFIGURE BIKE PAGE Sees large image of bike he chose Sees list of parts with info and prices Sees the total price etc... create a scenario
  21. @thinknow Peter explores bike profiles on the CHOOSE BIKE PAGE

    Sees info about what he can do here [Content box] Sees multiple bike images w/ basic info & price [Carousel] Uses controls to pan through them [Carousel] Chooses a bike to see in more detail [Carousel] Peter sees the bike he picked on the CONFIGURE BIKE PAGE Sees large image of bike he chose [Bike config picture] Sees list of parts with info and prices [Bike config list] Sees the total price [Bike config list] etc... name the UI elements
  22. @thinknow Header Talk to us Marketing message(s) Bike images Bike

    config picture Bike config list Footer organize elements & layouts
  23. @thinknow Live style guide • Describes typography, colors, patterns and

    widgets • System-of-record for front-end of patterns and styles • Code examples to help engineers to implement quickly and accurately Thanks @wardpenny
  24. @thinknow Monday APRIL MAY week 18 Tuesday Wednesday Thursday Friday

    reflect & define specify build & refine build & refine customer feedback Credit: @chemphill, @carbonfive project cadence
  25. @thinknow • Stimulate necessary conversations • Advance with a shared

    vision • Create engaged teams • Generate trust • Cultivate a culture of learning Now you know how to...