$30 off During Our Annual Pro Sale. View Details »

Crafting Unique, Delightful Apps

Daniel Lew
October 25, 2013

Crafting Unique, Delightful Apps

Dan Lew and Chris Arvin talk about how to design and develop interesting apps.

Original Keynote files (with animations): https://db.tt/8XTh7uze

Daniel Lew

October 25, 2013
Tweet

More Decks by Daniel Lew

Other Decks in Design

Transcript

  1. Hello.
    Chris Arvin
    Design
    Dan Lew
    Dev

    View Slide

  2. Hello.
    Chris Arvin
    Design
    Dan Lew
    Dev
    We work on the Expedia app.
    We work on the Expedia app.

    View Slide

  3. Hello.
    Chris Arvin
    Design
    Dan Lew
    Dev
    We work on the Expedia app.
    We work on the Expedia app.

    View Slide

  4. Hello.
    Chris Arvin
    Design
    Dan Lew
    Dev
    We work on the Expedia app.
    We work on the Expedia app.
    BUILD
    GREAT APPS

    View Slide

  5. Hello.
    Chris Arvin
    Design
    Dan Lew
    Dev
    We work on the Expedia app.
    We work on the Expedia app.
    RICH VISUALS

    View Slide

  6. Hello.
    Chris Arvin
    Design
    Dan Lew
    Dev
    We work on the Expedia app.
    We work on the Expedia app.
    Rich Visuals
    RICH VISUALS
    FUN
    INTERACTIONS

    View Slide

  7. Hello.
    Chris Arvin
    Design
    Dan Lew
    Dev
    We work on the Expedia app.
    We work on the Expedia app.
    Rich Visuals
    RICH VISUALS
    FUN
    INTERACTIONS
    SMOOTH
    TRANSITIONS

    View Slide

  8. Hello.
    Chris Arvin
    Design
    Dan Lew
    Dev
    We work on the Expedia app.
    We work on the Expedia app.
    Rich Visuals
    RICH VISUALS
    FUN
    INTERACTIONS
    SMOOTH
    TRANSITIONS

    View Slide

  9. SAMPLE APP: MOVIES

    View Slide

  10. SAMPLE APP: MOVIES

    View Slide

  11. SAMPLE APP: MOVIES

    View Slide

  12. DEFAULT HOLO
    CUSTOMIZED UI
    VS
    Focus on imagery
    Branded action bar
    Using card metaphors

    View Slide

  13. Build on how Android looks, feels and works.

    View Slide

  14. Build on how Android looks, feels and works.

    View Slide

  15. DEFAULT HOLO
    CUSTOMIZED UI
    VS
    Fun to play with
    Builds off user’s prior
    Android experience

    View Slide

  16. DEFAULT HOLO
    CUSTOMIZED UI
    VS
    Fun to play with
    Builds off user’s prior
    Android experience

    View Slide

  17. Android apps move.
    So should your mockups.

    View Slide

  18. PROTOTYPING TOOLS

    View Slide

  19. View Slide

  20. HOLY SHIT
    HOW AM I GOING TO
    MAKE THIS?

    View Slide

  21. UNDERSTANDING
    THE DESIGN

    View Slide

  22. Interesting UI = more development.
    Think a few steps ahead.
    Work on the big stuff first.

    View Slide

  23. ViewPager Fun
    Using ViewPager.Decor

    View Slide

  24. Animation Performance
    Translation animations
    Views start at full width

    View Slide

  25. What’s going to be a challenge?
    What can we make easier?
    What do we have to cut entirely?

    View Slide

  26. Rounded Corners
    .9.png Overlay 9-patch

    View Slide

  27. Sliding Indicator
    Cut entirely

    View Slide

  28. DEFAULT HOLO
    CUSTOMIZED UI
    VS
    MOVE THIS
    TWO PIXELS
    TO THE LEFT
    UI POLISH

    View Slide

  29. Before After

    View Slide

  30. Communicate in dp – not pixels
    Adjust from what’s already in the app
    Mark directly on a screenshot

    View Slide

  31. Marking up screenshots for developers
    “Make fonts 2dp smaller”
    “Add 4dp padding”

    View Slide

  32. Hello.
    Chris Arvin
    Design
    Dan Lew
    Dev
    We work on the Expedia app.
    Examples in the Expedia app

    View Slide

  33. Movies source: goo.gl/XCyLWl
    Dan Lew: @danlew42
    Chris Arvin: @meinhyperspeed

    View Slide