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

Practical UX for Mobile: A Future Friendly Approach to Communicating Your Ideas

Practical UX for Mobile: A Future Friendly Approach to Communicating Your Ideas

Much of the conventional design process and documentation we rely on is ineffective when it comes to communicating how we want our designs to translate across a wide range of devices and screen sizes. This talk is all about producing effective, efficient deliverables for an increasingly mobile-accessed Web, and practical design methods you can put into use right away.

But there's a catch: shaking up convention doesn't always come easy. How do you move away from assembly line design processes and an over-reliance on static deliverables? How do you overcome your stakeholders' general misconceptions about mobile use cases? If you've got a chance in hell of getting away with it all, you'll need a few tricks up your sleeve.

This session will cover collaborative sketching methods perfect for breaking mental models and building design consensus. We'll investigate the seeming demise of Photoshop, and you'll hear a whole lotta talk about prototypes—including when and why to use them, and how to pick the best prototyping tool for your project. For designers and developers alike, you'll leave with a toolbox of tricks that can help you pitch your future friendly ideas.

Dennis Kardys

July 23, 2013
Tweet

More Decks by Dennis Kardys

Other Decks in Design

Transcript

  1. Practical UX
    Mobile
    A FUTURE FRIENDLY APPROACH TO
    COMMUNICATING YOUR IDEAS
    @dkardys
    for

    View Slide

  2. User Research
    Stakeholder Interviews
    Personas & Scenarios
    Card sorting
    enormous Sitemap
    Lotsa Wireframes
    Task flows
    design compS
    Prototypes
    Device testing
    usability testing
    +

    View Slide

  3. View Slide

  4. The Deliverables
    Business

    View Slide

  5. But WILL the
    People know
    to tap it?

    View Slide

  6. Makers wanna
    make...
    not document

    View Slide

  7. How much
    of the UX process
    is expendable?

    View Slide

  8. Future Friendly

    View Slide

  9. -there is a-
    Dissonance of
    Vision
    Future Friendly vs. BOSS’ Phone

    View Slide

  10. -Dan Willis
    ...the people farthest from
    understanding the
    technology are often the ones
    making the strategic
    decisions.
    —Dan Willis

    View Slide

  11. It’s up to those with the
    best understanding of
    the technology to lead
    the way.

    View Slide

  12. Crossing the
    Chasm

    View Slide

  13. The biggest challenges,
    in my experience, are to
    do with people. Specifically,
    the way that people work
    together.
    — Jeremy Keith
    —Jeremy Keith

    View Slide

  14. Arm yourself with
    better
    communication tools

    View Slide

  15. “The purpose of a design
    artifact, whether a
    wireframe, prototype or
    sketch, is to illustrate our
    thinking.”
    —Robert Hoekman

    View Slide

  16. The purpose of a design
    artifact can also be to
    transform our thinking

    View Slide

  17. Create Props
    NOT
    Paperwork

    View Slide

  18. Assumptions | Shared understanding
    Silo mentality | Convergent experience
    Page driven design | Design systems

    View Slide

  19. Prototyping the
    Experience
    wsol.com/practical-ux-for-mobile/

    View Slide

  20. Participatory Sketching
    Getting stubborn ideas out of people’s
    heads and onto paper.

    View Slide

  21. Comics & Storyboards
    Great for getting to people focus on goals and
    scenarios instead of features and screens.

    View Slide

  22. Role Playing / Bodystorming
    Performing the experience
    http://www.flickr.com/photos/xian/3763797756/in/photostream/
    http://www.flickr.com/photos/nlireland/5963130143/

    View Slide

  23. Journey Maps / Service Blueprints
    Outlining the various points where users interact with a
    product or service, across channels. Can weave together
    personas, scenarios, and tasks.

    View Slide

  24. User Journey map became
    more than just a journey with
    touchpoints, emotions,
    takeaways, etc...
    — Jeremy Keith

    View Slide

  25. It also became a representation of the
    Information Architecture and the
    content plan, with our Personas (needs,
    goals, scenarios) serving as the starting
    point for everything — sort of like the
    glue that ties it all together.
    — Jeremy Keith
    —Rian Van Der Merwe

    View Slide

  26. Find gaps in the
    experience.
    http://www.flickr.com/photos/osucommons/3385601567/

    View Slide

  27. Paper Prototypes
    Quickly ideate and validate ideas.

    View Slide

  28. KJ Method
    An efficient way to arrive at consensus when
    dealing with large or divided groups.
    http://www.netmagazine.com/features/how-run-effective-meeting

    View Slide

  29. The Page
    Description Diagram

    View Slide

  30. Page Tables / Content Outlines

    View Slide

  31. Design Systems
    Breed Modular
    Markup & CSS

    View Slide

  32. Wireframes*.
    Component Audits and Content Reference
    Wireframes

    View Slide

  33. View Slide

  34. View Slide

  35. HTML Prototypes
    (or mobile app prototypes)

    View Slide

  36. Style Prototypes &
    Guides

    View Slide

  37. View Slide

  38. Facilitation.

    View Slide

  39. Design Studio
    Design Mini Brief +
    Structured Rules for Critique

    View Slide

  40. Totally arbitrary
    re-prioritization of
    objectives incoming!

    View Slide

  41. Pace The
    Conversation
    Focus on one thing at a time
    http://www.flickr.com/photos/nlireland/5963130143/

    View Slide

  42. Project paralysis...

    View Slide

  43. UX is a result...
    not a document.

    View Slide

  44. PREPARING
    for what’s to come

    View Slide

  45. You are ALL architects
    of the user experience.

    View Slide

  46. THANKS!
    Dennis Kardys
    robotregime.com
    wsol.com
    @dkardys

    View Slide