Style Guide and UI Design Principles

Material design is a set of design guidelines and principles developed by Google. Adopting material as a design guideline is beneficial for many reasons,

  • Clean, consistent look and feel across web and mobile

  • A clear set of rules for use of fonts, color, shadow, buttons, text, headings, etc.

  • Using an established common design language and rules makes it easier for developers to contribute to our UI/UX

  • Similar look and feel and components as in many other apps that users will be familiar with (WhatsApp, Gmail, Contacts). This makes it easier to train low literacy users since they would already be familiar with UI elements such as Floating Action Buttons or Navigation drawers

  • A library of plugins and frameworks are available for easy implementation

  • Frequent updates and strong support from Google

It takes a short while to become familiar with the rules of material design. The Intelehealth Web app and the Mobile app both use Material. There also are libraries of UI elements available for Angular for the web app as well.

This website provides information about Material Design and how to implement it.

When making any changes to the Intelehealth web or mobile app please make sure to consistently follow the Material Design guidelines!