Owning a wearable is exploding leads to web design inspiration
Inspiration from Wearables
According to a statistic from The Global Wearables Market by Felix Richter states that in 2015. The total sales of wearables sum up to more than ten million units which is not a small amount. As they come in different style and sizes, wearable interface will have some limitations and styles and it is all coming back to website design. Since a wearable is consider small, the design on it should be simple as we called it a streamlined design.
Since the screen comes in a small size, is best to display things as simple as possible like putting your content into containers and containers has been made advanced by Material Design. The root concept of this is to put an idea or a small amount of content in a container and pile them up one after another and they can be arranged in different manners. We can have a look at Adidas whom done a great job of applying containers where each element has a photo collage, headline and subheader. Besides that, the elements are easily assessible just by a simple click anywhere within the box and a boxed shadow is created once u hover over any part of the information and this creates and interactive design which attracts users.
Photo Credit: Adidas
Effective Design in Tight Spaces
To make use of this upcoming trend, wearable designers are making good use of color and typography to design the layout for wearables because a small screen offer limited color and awkward shapes at times. Look at “The Lobster Movie” website below, no complicated designs are involved but only a plan background with some bold typography with a distinct call to action to create focus to the users. While this may seem simple, but a mismatch of typography and background can cause user disinterested in the content and the first impression of the website will not be able to fulfil its task to catch users’ attention.
Photo Credit: The Lobster Movie
Icon is a symbol which is good to display identity or functionality of some buttons like the trash can in your computer. Hence, icons are ideal to be used in wearables because it gives a dominant visual no matter what screen size you have be it on desktop, mobile or wearable. They provide dominant visual to the users.
Here are a few guidelines to keep in mind if you are planning to use icons in your design:
- The icon should “read” small or large
- The effectiveness of the icon should be able to work without or with color
- Icon’s lines and details need to be precise in order to render well on HD displays (vector-based icons recommended)
- Icon must deliver a strong and understandable message
Streamlined Color Palettes
Since wearables are using small size screens, massive uses of colors as used in a flat design would be a disadvantage because it would overwhelm the users. Now most websites are just using two colors excluding black and white of course. Let’s take a look at the simple beauty by Trama Studio, that uses single color palettes to highlight information in its portfolio.
Photo Credit: Trama Studio
With just a single palate and a consistent of each of the design element has a simple, minimal color palette which will draw the eye to important content.
Minimalism to the Extreme
Look at the wearables such as Apple iWatch and Fitbit, the screen is very small, smaller than your mobile phone. Hence, it is not wise to clutter it up with a lot of information but is best to apply minimalism to it to give it a more balance feel when viewing it on wearables. Do not worry if you think your design has not much to it, Minimalism is in the trend now! So, there is no worries if there is too much white space in your design. Below are photos from Fitbit and their design where they released a design update that streamlines and further minimizes the website and app dashboard design which uses simple charts and icons to display information.
Photo Credit: Fitbit
Now that you know wearables are becoming a trend, is time to get yourself one to keep track of the design being used if you want to stay in the game and also any new devices that may appear in the future will always be impact by the available screen sizes of the device.
Source: Web Design Book of Trends 2017, by UXPin
Thumbnail: Designed by Freepik