Designing Mobile Apps: A Lesson on Layers

Designing mobile apps with the infinite canvas of a tablet or smartphone can often feel like you are artfully solving a puzzle. One of the most effective features of the mag+ toolset is the template containing predefined layers. mag+ gives designers three main layers to work with.


B-Slides: Main Content Layer

This is the main background layer. Content on this layer rotates, but does not re-orient depending on tablet orientation —it simply crops differently. So depending on the device orientation, different parts of your first page are visible.

B-Slides: Pinned Blocks Layer

This layer is used for objects that you want on the background layer, but that you also want to move with the rotation of the screen when the user rotates the device so that it is always shown.

A-Main Tower Layer

This is the free-scrolling top layer that moves in a vertical manner. Content on this layer looks so elegant when placed on top of interesting B-layers. This layer can also be hidden when a user double taps.

We love to see what our clients come up with when designing in layers. RANGE Magazine is an excellent example of creative use of layers. In fact, the second issue of RANGE Magazine recently won a design award from the Dallas Society of Visual Communications. If you are curious about layers, I suggest you download this app for creative inspiration.  You can watch a highlights video.