Styles
PUBLISHED
This section provides essential information about the wearable app design in terms of the basic actions, color schemes, icons, typographic factors, and the design elements that can be incorporated into the wearable apps.
Iconography
Tizen wearable iconography consists of a few requirements to achieve a simple but elegant design. These rules cover all the icons used in the wearable device and the manager app on the mobile device. Refer to the following for information about icon sizes and other style properties.
Icon Size
Icons in the same style are used for different design elements. Although icons in many different sizes are used based on the situation, you don’t have to worry about all the different icon sizes. Simply design your icons in 170 x 170 pixels. The icons will be automatically resized for the wearable device and the manager app on the mobile device.
Icon Styles
When you design icons for Tizen wearable apps, ensure that they conform to the following style. Since white icons will be placed against the background, solid colored backgrounds are recommended to maximize visibility and glanceability.
Refer to the iconography section of The Tizen Design Guidelines (Introduction and Styles) for detailed information.
App icons on a circular type wearable device |
App icons on a rectangular type wearable device |
App icons on a manager app |
Only circular app icons can be used on the circular type wearable devices.
Colors
Tizen wearable devices have used elegant black and orange tones as the main theme. Then, dark brown theme colors have been added to the main color palette for rectangular type wearable devices, and dark blue theme colors, for circular type wearable devices.
System Theme Colors
You may design your apps based on the default themes to make them consistent with the wearable device’s system.
The following are examples of the Tizen wearable default color themes.
Color Selection for Wearable App Design
The themes applied to the system do not affect 3rd party apps installed by the user. Your app may not look consistent with the system theme if users apply custom themes to the system. Therefore, we recommend that you identify your apps using the major colors that fit best while sticking to the dimensions provided in the UI framework.
When the background has muted colors, you can choose a different font color to increase readability. Brown tones are also applied to the color elements of the buttons.
Using your own brand identity color is a good idea as well. Use color sets that not only reflect your brand image but also colors that match the color tone and characteristics of the wearable device as a whole.
Wearable Writing Style Guidelines
The compact nature of wearable device requires clear and concise writing.
Users should be able to glance at on-screen text and immediately understand the meaning without scrolling.
Find the Main Idea of Your Message
Determine the key message and remove unnecessary information.
The clarity of your message is determined by its place in the UI flow. Make sure you understand :
- what sort of text it is (Pop-up? Description? Warning? Confirmation?)
- what appears around it on the same screen
- what action a user has taken to display this text
- what will happen in the UI flow on the screens that follow
Your device is now looking for the wearable device. This may take several minutes. It may be difficult to locate your wearable device if it is indoors.
Finding %s (Device name)…
Remove Nonessential Information
Determine the essential part of your message and remove unnecessary information.
Unnecessary information can include :
- advice and guidance for the user
- further details about why a problem is occurring
- extra details about a particular item
Try to create the shortest text possible while retaining the text’s original meaning.
Alarm set for %d hours and %d minutes from now.
Alarm set.
Switching from wireless charging to cable charging…
Switching to cable charging…
Reduce Grammar
Use reduced grammar whenever possible in the wearable UI. Articles and other grammar can be removed if it does not lead to a loss of meaning.
The types of words that can be removed include articles (a, an, the), determiners (this, that, their), and forms of the verb “to be.”
A subscription may be required to allow your mobile device to use this feature. This may result in additional charges.
Subscription may be required. Extra charges may apply.
Understand the Context
Check the context and ensure you have all the necessary information. For example :
- Stating “Swipe left” or “Swipe right” becomes unimportant if an obvious visual cue appears alongside it.
- Can the text appear in more than one place? If so keep it generic or create a slightly different text for each situation.
- Does the text appear on a wearable device or on a mobile device? In some instances, it may be important to clarify which device a notification or pop-up is referring to.
Stay Positive
Avoid using negative words. Wearable devices should be fun to use. They should not blame or accuse the user of making a mistake.
Do not emphasize negative aspects of interaction with the wearable device. Instead, use language that lets users know that they are dealing with a capable, reliable, and powerful device that is good to own.
Don’t disconnect your charger before the installation is finished. This might result in the installation failing.
Before unplugging your charger, wait for the installation to finish.
Be Active
Use the active voice whenever possible. It saves space and is easier to understand.
Please, Sorry and Thanks
Only include “Please” if omitting the word from the text makes it sound rude or demanding.
“Sorry” should not be used on a wearable device. It may only appear as part of the S Voice app or in message templates that the user can send to their contacts.
“Thanks” should be avoided.
Contractions
Contractions are recommended.
Unable to show email for security reasons. You can view the email on your phone.
Can't show email for security reasons. View it on your phone.
Device Naming
Refer to the wearable device itself as the model name.
Always use “phone” to refer to the smartphone that your wearable device syncs with and connects to.
Enable/Disable
'Enable' and 'Disable' should only be used as verbs. If you need to describe the state of a particular function once it has been enabled or disabled, use 'On' and 'Off' instead.
Turn on call forwarding?
Enable call forwarding?
Call forwarding is enabled.
Call forwarding on.
Shortened Terms
Wearable devices use a number of shortened terms :
Full version | Wearable version |
---|---|
Application | App |
SIM card | SIM |
With | w/ |
And | & |
Kilometer, Centimeter, Mile | km, cm, mi |
Minutes, Hours, Seconds | min, hr, sec |
Currencies | ISO currency code |
Days of the week | Mon, Tue, Wed, Thu, Fri, Sat, Sun |
Other Tips
If you are still struggling for space, some of these quick fixes can save space:
- Use a dash without spaces when indicating ranges (17-20cm)
- Always use digits to represent a number (6s ago)
- Remove the space between digits and units of measurement (2MB)
- Remove commas from all text