Layers place interface content “over” other content. While this can obstruct content, it increases the available area for additional content without leaving the current context. If we apply shadows at different levels, we can simulate a three-dimensional stack of layers.
Shadows differ between platforms. Keep a close eye on how layering and elevation affect shadows on both.
Shadows should be used subtly and minimally throughout an iOS interface. Depth can display layers in order without using shadows with touch gestures and motion instead.
Layering is closely tied to shadow and elevation for Android design, and should maintain that relationship using Uniform shadow values.
Don'tmismatch shadows and layers.
Doapply the correct shadow to its matching layer.
Shadows are not meant to break up content on a page. Our levels are built to handle that.
Don'tput shadows on levels or dividers.
Douse levels and accents to break up page content.
|No guidelines exist for Windows (yet).|