Blog | Crank Software

Software best practices for wearable UX development

Written by Jason Clarke | Apr 6, 2021 2:44:52 PM

Smartphones changed the way we interact with technology, making smart technology commonplace in everything from Fitbits to freezers. More recently, a perfect storm of innovation in microchips, software development, and energy efficiency has set the stage for the next important era in computing’s history: wearables.

The way we receive, use, and share data is dramatically changing as a result. In fact, we’re already using digital means to verify who we are, move us into action, reflect our wellbeing back to us, communicate with each other, record the world around us, and control our environment. This could explain why the use of wearable technology has more than tripled in the last four years and why it is projected to grow from nearly $27 billion in 2019 to $64 billion by 2024.

While this wearable revolution amounts to many new business opportunities, it also constitutes a paradigm shift in how we interact with technology. Let’s look at the ways in which effective wearable UX development and design for embedded computing must adapt to address the new challenges of this booming device market.

Small screens and easier navigation

To accommodate small wearable devices, screens are having to dramatically decrease in size. This affects the user’s ability to access information including locating it, understanding it, and remembering it. Screen size also has a major impact on information design and GUI development.

  • The first rule of thumb is to simplify and declutter. Users want to get quickly in and out of the functions they need. For this, they need easy navigation. It’s a good idea to get rid of anything in a wearable GUI that isn’t absolutely necessary. To do this: Use simple buttons and swipes, and avoid any text input. The user should be able to gain access to the information they want in ideally two clicks and/or swipes.
  • Scrolling or wrapped menus help declutter the GUI since users only see one to two menu items on-screen at a time. (We have a webinar that shows how we implement this technique in Storyboard.)
  • Glanceability is another important consideration — users need to be able to glance at their wearables while in motion and get the information they need.
  • The best way to ensure users don’t have to stare at their screens for long lengths of time is to use minimal text in high contrast and bright colors. Avoid using serif and script fonts when using a fewer number of pixels to keep text highly legible.
  • Simple icons instead of text can have a positive impact too — it’s much faster to recognize an icon versus reading a text string.

Hardware impacts on wearable UX development

The chip or board running a wearable device is going to be more limited than a desktop or even a typical embedded processor. Plus, to be useful on a person’s body, it must stay cool and use little power. And for that, choosing the right hardware is critical. Not all GUI development teams have input into hardware choice, but they should have a say in its functional requirements, which may include everything from 3D gestures through haptic feedback to Wi-Fi connectivity.

It’s best to carefully consider processor-intensive tasks as needed. While animations can provide an effective and rich user experience, they may consume more cycles and power than you realize. It's good practice to use CPU and memory performance measurement tools to determine exactly how resources are being consumed and tweak animations accordingly (such as by reducing the number of frames or the complexity of the images). Something else to keep in mind: these high-intensive tasks can also make a device run extra hot. No one wants users burned – literally.

Also consider using hardware acceleration, where available, to offload the CPU from performing these high-running tasks.

Size constraints

Memory and flash storage in wearable devices is a tricky balancing act between capacity and price. The bigger the chip, the more expensive it is. Both resources must be used judiciously, and GUI development teams (as one of the biggest consumers of both RAM and flash) should be highly considerate of their usage. A good place to start is with GUI frameworks that are memory efficient and customizable for small devices such as Crank Storyboard, which includes tools for understanding and minimizing your memory use.

Other suggestions include:

  • Ditching the high-def images and using smaller resolution images with higher compression. Or better yet, the use of vector graphics that can scale during GUI development but rasterized on export consumes much less memory. (After all, GUIs can still be attractive with solid shapes and fills or gradients instead of custom-crafted PNGs.)
  • If further memory is required, consider dropping down screen and GUI asset color fidelity. For more tips, Thomas, our VP of R&D and co-founder, has a webinar that talks about optimizing memory for embedded GUIs.
  • We also suggest making sure an application frees up as much memory as possible as soon as the program is finished with it. Free data lists, terminate applications, and flush caches as soon as they’re not needed, but first profile your memory use and run user UX tests to determine which of these techniques won’t impact the device’s perceived “snappiness”.

Now, you may be wondering, what if a wearable needs to store much more than it can fit in flash? In these cases, it’s best to rely on a connection to a more powerful device such as a smartphone or desktop computer. Plan for how and when to dump any collected data to connected devices, and a way to notify the user with time to spare before their storage becomes full.

Power efficiency

While the modest form factor of a wearable device makes it easier to carry or keep on the body, a small device contains a small battery, which makes energy a precious resource. Embedded GUI development teams must pay careful attention to make every minute of battery life count.

The most obvious strategy for saving power is to use sleep mode as much as possible, only waking a device when there’s an event, such as a button push or physical movement. It’s important to have a GUI framework that can create code that’s close to the metal, for the sake of battery life as well as a device’s responsiveness and memory consumption. That’s a design consideration we’ve used for Storyboard: the more efficient the code, the less power it will draw. Don’t sacrifice the all-important GUI workflow, though – wearable UX designers should not be forced to learn C/C++. GUI tooling needs a scripting environment that’s designer-friendly but highly efficient like Lua, used by Storyboard.

Another thing to keep in mind is how a GUI interacts with screen technology. With an LCD display, the most controllable power draw is the screen’s backlight. Dimming the backlight when not active or in low light can save a lot of juice. With an OLED or AMOLED screen, there is no backlight. Instead, each pixel is its own LED (light-emitting diode). That means white and bright colors draw much more power than black and dark colors. Consider adding a dimming layer to the GUI when the screen isn’t being actively used or use a muted design palette to draw less power. Both strategies have the added bonus of avoiding display burn-in, which happens when high-contrast images in full-power mode end up leaving a ghost shadow.

Summary

To the average user, a wearable looks like a simple device; however, the trade-offs in designing and developing it are complex. User interfaces, in particular, need to be well thought out.

As we see more companies getting into wearable user experiences, we also see them encountering unique challenges. Developing them successfully requires specific expertise and strong partnerships.

We’re here to help and this webinar with NXP gives you an in-depth overview of the wearables market, hardware considerations, and more GUI development tips: