In order to speed up development and use common UI patterns found in Android applications, we decided to follow the Material Design guidelines and use the tools and libraries provided with it, with minimal changes.
The color palette uses a dark green as a base to contrast with the blood samples that might be more in the reds. Also, green is usually a color associated with calm, reduces stress on the eyes and is a familiar color in medical environments.
The UI design mockups were made with Sketch, with the help of the Material Plugin.
Sketch version: 55.1
The Sketch source files are located in the doc/design subfolder. There are 3 source files.
This file is the main working file and contains the mockups for these screens:
- Add New Hospital - Error
- Add New Hospital
- Logged Out
- Login
- Mask Editing
- Meta Data
- New Sample
- Take photo
The doc/design/exports subfolder contains PNG renders fo those screens.
This is a Sketch library file generated by the Material Theme Editor from the Material Sketch plugin with a custom color palette.
(Import this file as a library in Sketch in order to continue editing the main screens.)
This is a Sketch library file provided with the Material Sketch Plugin that extends the number of available icons that could be used in the main designs.
(Import this file as a library in Sketch in order to continue editing the main screens.)