5 tips to improve embedded UX

How do graphics, memory usage, and power consumption affect the creation of vivid and feature-rich user experiences (UX) for IoT devices?

Creating the best user experiences on devices that aren't mobile or desktop platforms presents interesting challenges for embedded development teams. Consumers demand that their smaller IoT and wearables products deliver the rich, sophisticated UX that they get from their smartphones yet the microprocessor (MPU) and microcontroller (MCU) boards that drive them are far more resource and power-constrained than their Apple and Android brethren.

Improving embedded UX on MCUs and MPUs

As we see with our customers, the biggest barriers to achieving brilliant UX come down to understanding how to fit all the elements and behaviors of a GUI's screen into the target board's memory — without reducing performance or battery life. This includes image assets, animations, and fonts, and the underlying hardware access times, rendering pipelines, and events framework that drive it all:

• Image format and loading directly affect runtime performance, as assets may need to be decoded before rendering to the display and access times are dependent on whether they're stored in RAM or flash memory.
• Animations, including screen transitions, require processor resources to be composited and performance is highly dependent on the capabilities of the display controller, whether graphics acceleration is available, and other characteristics of the hardware and software libraries.
• The font rendering process extracts data from a font file, constructs an image at runtime, and pushes the result to the screen — each of these steps has tradeoffs described in detail in this blog.  

Based on these constraints, here are five tips to improve embedded UX:

1. To take up less screen space, replace strings with icons or images that communicate the same function
2. To reduce overhead and memory, carefully consider raw versus encoded images formats (PNG, BMP)
3. To reduce power consumption, use screen dimming layers and muted color palette designs
4. To minimize image memory, consider rendering solid shapes, fills, and polygons instead of storing and loading image files
5. To understand the high-runner memory and processor workloads, use performance monitoring tools to track and optimize right from the beginning of development

To dive deeper into these tips and learn more about how to maximize graphics capabilities, minimize power consumption, and understand the impact of form factor on GUIs for microcontrollers and microprocessors, read this article by Jason Clarke at Embedded Computing Design:

Techniques to Improve UX for Success in Embedded Markets

Interested in seeing how Crank Storyboard and NXP work together to create exceptional UX for wearable devices on the i.MX RT500 series? Sign up for this free webinar now: