Layout

It is really important to remember that layout can make a huge difference to your app. We have provided two app layouts for you to follow: Core and Full screen.

Core layout

layout_tablet
Your app must have

  • A header at the top of the screen, which consists of a coloured line, title area and divider
  • A content area
  • A hidden toolbar with app controls which is revealed by using the bottom edge swipe

Associated building blocks
Header
Toolbar

Full screen layout

layout_full_screen
Although hidden, the menu bar is accessible to the user from the top edge at any time.

An app can either launch directly into a full screen layout or contain a full screen view.

Associated building blocks
Toolbar

One last thing

Use responsive strategies to ensure your content scales across orientations.