The included sketch file is labeled, layered, and fully modifiable. The file helps improve your design workflow by taking advantage of symbol overrides. Similar to other sticker sheets out there, we created this document in an atomic design approach for rapid design and prototyping. Most people will find this file useful for mocking up concepts - to either pitch their idea or create a prototype for development. The sketch file includes colors, typography, icons patterns and mockups.
Garmin devices are always either 16 or 64 colors - and they are individually saved and labeled as a “layer style.”
*Note: The 16 color palette reserves one slot for ‘transparent’ and one for the user’s profile color, providing a total of 14 available colors rather than 16.
These devices use both Chronos Semibold and Roboto Condensed. Roboto Condensed is used for headlines while Chronos Semibold is used for numerical characters. Keep in mind that Chronos Semibold only has numerical characters if you use alpha characters - they will be set as the default font in your computer. Each headline style is saved as “text style” and on 6 different color styles (not using a layer style as this functionality is not currently available in sketch). We did this so you have enough colors to be replaced by the colors you have in your own app.
The iconography provided are the most popular icons found in these devices. If you have suggestions regarding other iconography we might’ve missed, please let us at know at firstname.lastname@example.org.
When creating a native app, our best practice is to follow the device guideline in order to reduce cognitive load and avoid the risk of trying to build a mental model every time users open the app. We recommend you take a peek at Garmin’s user interaction section for some rules around behaviors and patterns.
Please note that the buttons should always try to maintain their core basic functionality within your app. If you are going to have a button do something other than it’s core functionality it is best to represent that action with bumpers and an icon. For example within the music controls you have Library, Skip, Play/Pause.
If you have questions about this file, or feedback, we'd love to hear from you. Send as a note in our contact form.