Jessica Engström

The girl with the Batman/Spider-Man tattoo

NAVIGATION

Windows 8 app bar recap

So in short this is what you should think about while designing your app bar.

* Most used buttons to the far sides of the app bar

* Group similar buttons together

* Use menus and flyouts to save space

* Persistent buttons to the right
* If you have more than 3 persistent or more than 1 group, split them up

* Contextual buttons always to the far left side, and never shown before they are usable
* Make the app bar sticky when you show contextual buttons

* Additional (hidden/inactive) buttons should never move persistent buttons, place them to the side of them.


appbarrecap

 

 

There are of course some exceptions to the rules ;)

“New, “add”, anything that is used to create or add an item should always be placed to the far right. It should always use the + sign, and this is the only buttons allowed to use that.

”Delete” and “Remove” should always be to the left of “new” and “add” (so second to the right edge)  

“Select all” should always be to the far left.


So there you have it, Windows 8 app bar all demystified :P

 

 

This is “Demystifying Windows 8 app bar” part 8 of 8.

Posted in UX/UI with : Design, Windows