At Open Night, I presented design tips for developers who would like to create great Android apps. If you missed it, here’s the info for you!

Material design

Let’s start by describing material design. It is a comprehensive guide for visual, motion and interaction design across different platforms. Material design doesn’t only please the eye – the design language is powerful in a way that it also creates a hierarchy and meaning to the user.

The goal of material design is to create a visual language that describes principles of good design. Material is grounded in tactile reality, inspired by the study of paper and ink yet technologically advanced and open to imagination and magic.

Material design includes:

  • Material theme
  • Widgets for cards and lists
  • Custom animations
  • Icons
  • Style and colour

 

MOTION PROVIDES MEANING

Motion provides meaningMotion provides meaning
 

In material design, motion provides meaning. Motion and movement keeps the user grounded in the UI while adding context and meaning. Motion shows how an app is organized and what it can do.

There should always be a different between elements that vanish and those that slide out of sight.

Animation 

Animation
 

One principle of material design is that everything should behave as if it had its own heft, weight and momentum.

The movement and interactions are meant to more closely mimic the way you’d interact with a card, a piece of paper or a switch.

Style and colour

The importance of colour schemes your app’s colour palette may be defined by using a custom pallet suited to your brand. The colour pallete includes primary and accent colours that blend and compliment each other. You can find recommended colour palettes on the Material Design site.

Accent colours

Good guidelines for using colours: Use the “accent colour” options for your primary action button and components like switches or sliders.

App design with complementary colours

What you need to avoid: Don’t use the accent colour for app bars or larger areas of colour. Avoid using the same colour for the floating action button and the background.

Icons

 Material Design icons
 

When creating interface icons, the biggest thing to remember is consistency – the goal is to create icons that are instantly recognizable at any size. System icons are used to represent common actions like trash, print, and save.

Each icon is reduced to its minimal form, with every idea edited to its essence. The designs ensure readability and clarity, even at small sizes.

For more details on material design and tips, visit material.io/guidelines