Whenever likeminded creative people try to innovate trends emerge. Ideas give birth to ideas. As ideas keep combining in the heads of creative people everywhere some ideas become more sticky than others. I’ll document some of the trends in user experience design I predict will become the norm in 2012.
An example trend from previous years is the scroll down to refresh design. Created by Loren Brichter for his famous Tweetie iphone app it has since become the standard for refreshing feeds and lists in apps everywhere.
Example from mobile webKit build
Related function Panels
You’ve seen them already. Open your Facebook app and look at the button in the top left corner. Tapping the button or swiping the interface from left to right opens the menu:
This background panel is always there. Neatly integrated in iOS navigation panel.
The iOS navigation panel? At the top of all iOS apps with many views is a bar that usually has two buttons on it. This bar is called the navigation bar in the iOS SDK and intended to be used like this:
- the left side button steps you back in the app. Just like the back button in your browser.
- the right side button steps you forward. Showing the next step or function in the app.
Why is this different from a menu
Is this good or bad
Any tips on how to integrate this kind of navigation but still having a “Back” button for iOS on the navbar? Having the “panel” button on the right side off the nav bar? (but opening on the left is a little bit weird)
LikeLike
Any tips on how to integrate this kind of navigation but still having a “Back” button for iOS on the navbar? Having the “panel” button on the right side off the nav bar? (but opening on the left is a little bit weird)
LikeLike
Well the pattern is for only the first level of navigation. So you have a back button until you reach the first level screen where is changes to the menu button.
If that doesn’t work, either look at an alternative model for navigation or figure out if you can’t make your app using fewer levels of views.
Hope it helps!
LikeLike
Thanks for you quick reply, yep, i’ve figured out that even if this pattern looks really cool, it doesn’t fit so well with my app problematic.
I’m trying to build an Android & iOS app, and i want to minimise the difference between my two apps.
In this case, with android that’s ok, i can use this pattern because it has a physic back button, but with iOS it’s not the case 😦
LikeLike
I wouldn’t recommend trying to make them similar in navigation, both platforms have very different patterns for navigation so apps will work better being consistent with the platform than its sister-app.
Also, remember that most many new Android models DON’T have a back button!
I’d love to see it when it’s ‘done’. Hope it works out!
LikeLike
Of course i want to respect the navigation pattern of each platform, but as a technical point of view, i’m building a phonegap app, and i want to minimise the difference as much as i can to reach the almost “one unique code base” . All is about compromise ;-). (of course the best for is to develop and maintain a Android Native App and a iOS Native App, but i don’t have the resources to do so 😉 )
For the new android models, where did you get this information? For me all android phone must have back-button.
Guidelines from Android documentation: “The Home, Menu and Back functions are essential to the Android navigation paradigm. Device implementations MUST make these functions available to the user at all times when running applications. These functions MAY be implemented via dedicated physical buttons (such as mechanical or capacitive touch buttons), or MAY be implemented using dedicated software keys, gestures, touch panel, etc. Android 4.1 supports both implementations.”
LikeLike
Yeah I know that problem. 🙂
It’s the current gen nexus devices I saw, they don’t always allow the back button.
LikeLike