The fly-in app menu for designers and developers

E9bf8f6d5480ea2a2623df7dccfd1f70?s=47 Cyril Mottier
October 26, 2012

The fly-in app menu for designers and developers

On using the fly-in app menu/side navigation in your Android applications. Presented at DroidconUK 2012 in London, England.

If you didn't [hear|see] the talk, these slides probably won't make sense.

Software: Keynote, Illustrator, Photoshop
Font: Exo (http://www.fontsquirrel.com/fonts/exo) & Panefresco (http://www.fontsquirrel.com/fonts/panefresco)
Colors: #edefe6, #666666, #f91b22, #597313 & #81a735, #3699bd & #3fc8ec.

E9bf8f6d5480ea2a2623df7dccfd1f70?s=128

Cyril Mottier

October 26, 2012
Tweet

Transcript

  1. 3.
  2. 8.

    WHICH PRETTY MUCH LOOKED LIKE THIS COMPANY Feature 1 Feature

    2 Feature 3 Feature 4 Feature 6 Feature 5
  3. 9.

    Two winters later... The overall app layout doesn’t fit our

    needs anymore. Let’s think about something new! „ „
  4. 10.

    ? ? ? Two winters later... The overall app layout

    doesn’t fit our needs anymore. Let’s think about something new! „ „
  5. 12.

    They COMP Feature 1 Feature 2 Feature 3 Feature 4

    Feature 5 Feature 6 Feature 7 Feature 8 COMPLETELY redesigned the app
  6. 14.

    Fly-in app menu Slide-out menu hidden side menu ribbon menu

    side navigation navigation drawer slide menu
  7. 15.
  8. 16.
  9. 17.
  10. 18.
  11. 19.
  12. 20.
  13. 21.

    A panel that “slides out” from underneath the left of

    the main content area, revealing a vertically independent scroll view VISUALLY SPEAKING:
  14. 22.
  15. 23.
  16. 24.
  17. 35.

    I use the fly-in app menu in my application because

    it’s the navigation pattern à la mode „ „
  18. 36.
  19. 38.

    1 tabs 2 dashboard 3 side menu SIMPLE extremely quick

    learning curve EASY ACCESS a feature is one click away UP TO 4 FEATURES made for apps with a simple hierarchy
  20. 39.

    1 tabs 2 dashboard 3 side menu VISUALLY APPEALING landing

    page of your app UP TO 6-9 ITEMS great features playground
  21. 40.

    1 tabs 2 dashboard 3 side menu NOT EASY TO

    USE average joe doesn’t understand it at first glance DYNAMIC content can increase seamlessly RESPONSIVE scales up greatly to fit all supports
  22. 45.

    2 3 1APP FEATURES main features of an app USER

    STATUS location, login state, etc. NOTIFICATIONS profile notifications
  23. 47.

    VS The sliding ActionBar debate fixed Sliding ActionBar is a

    part of the UI users need to identify to GOOGLE’S POINT OF VIEW
  24. 48.

    ActionBar is attached to an app screen not to the

    app itself MY POINT OF VIEW VS The sliding ActionBar debate fixed Sliding
  25. 58.
  26. 59.
  27. 60.
  28. 61.
  29. 65.
  30. 66.
  31. 82.

    SOLUTION Clear the stack when a root Activity is traversed

    using FLAG_ACTIVITY_CLEAR_TASK API 11 and above only
  32. 83.

    SOLUTION Get rid of the system back stack & manage

    everything on your own at the Fragment level
  33. 84.

    SOLUTION Get rid of the system back stack & manage

    everything on your own at the Fragment level Good luck !!!