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 full-size slide

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

    View full-size slide

  3. The Deliverables
    Business

    View full-size slide

  4. But WILL the
    People know
    to tap it?

    View full-size slide

  5. Makers wanna
    make...
    not document

    View full-size slide

  6. How much
    of the UX process
    is expendable?

    View full-size slide

  7. Future Friendly

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  11. Crossing the
    Chasm

    View full-size slide

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

    View full-size slide

  13. Arm yourself with
    better
    communication tools

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  16. Create Props
    NOT
    Paperwork

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  22. 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 full-size slide

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

    View full-size slide

  24. 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 full-size slide

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

    View full-size slide

  26. Paper Prototypes
    Quickly ideate and validate ideas.

    View full-size slide

  27. 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 full-size slide

  28. The Page
    Description Diagram

    View full-size slide

  29. Page Tables / Content Outlines

    View full-size slide

  30. Design Systems
    Breed Modular
    Markup & CSS

    View full-size slide

  31. Wireframes*.
    Component Audits and Content Reference
    Wireframes

    View full-size slide

  32. HTML Prototypes
    (or mobile app prototypes)

    View full-size slide

  33. Style Prototypes &
    Guides

    View full-size slide

  34. Facilitation.

    View full-size slide

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

    View full-size slide

  36. Totally arbitrary
    re-prioritization of
    objectives incoming!

    View full-size slide

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

    View full-size slide

  38. Project paralysis...

    View full-size slide

  39. UX is a result...
    not a document.

    View full-size slide

  40. PREPARING
    for what’s to come

    View full-size slide

  41. You are ALL architects
    of the user experience.

    View full-size slide

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

    View full-size slide