Choosing the right GUI framework for your microcontroller (MCU) target can be a make it or break it decision for achieving your product goals. Your GUI framework needs to be able to produce a great-looking UI. But, it can’t take all the resources needed for the product to be functional. We’ve put together this blog to offer some guidance to help in your decision making.
Before you select a GUI framework, you should have at least a short list of target hardware. Since there is a wide variety of MCU platforms, not all hardware may be supported by a particular vendor. That’s why it’s useful to know your target hardware.
(Still, you shouldn’t make the mistake of narrowing your search too early. Vendors that you might at first glance seem unsuitable may be easily able to support your hardware or already have it on their roadmap.)
You also need to have a rough visual design of the product, This will help you identify the must-have features to realize your product vision. And if possible, you should have details on flash, RAM and display size for your target. These are your constraints for developing the GUI.
Key Factors to Consider When Selecting a Framework
Typically there are three layers of costs with the major frameworks:
- Development licensing for the tooling
- Royalty licensing for the shipped product
- Support agreement costs
Since there are so many variables it is difficult to do a general comparison of these products as the pricing will depend on product volume and size of the development team.
Though it may seem the costs are significant, you will save on up-front development costs and maintenance costs down the road. You will also be able access GUI development experts who have been down the road before.
You can get an evaluation license to check out the features. Use it to develop a demo application so you can determine the feasibility of using the product.
Flash and RAM Size
With MCU targets there tends to be a tradeoff between optimizing for RAM size or for flash size. When choosing a framework, you should have a general idea of your potential main bottleneck -- in other words, what you need to optimize for. Here’s a look at some typical features.
Features for optimizing ram usage by using flash:
- Exporting uncompressed images
- Bitmap fonts or using images instead of fonts
Features for optimizing flash usage by using RAM:
- 9-patch image support
- Native draw routines (rectangles, rounded rectangles, circles arcs)
- Selective glyph export for fonts
- Modular design to remove unneeded components
The size of the display is a major factor in RAM and flash usage. Typically, you can look at RAM usage to render one frame as pixel width x pixel height x color depth. Considering that the dimensions of the screen are fixed, the only factor you can play with is color depth. You generally have two choices: 32-bit color (e.g. ARGB8888) and 16-bit color (e.g. RBG565).
You can choose the 16-bit color to cut the RAM usage in half, which also allows you to reduce image sizes. The tradeoff is decreased rendering quality. This is most noticeable with gradients, as you will get a banding of colors.
Top GUI Frameworks for MCU Platforms
To help you make an informed choice, we’ve explored three major GUI frameworks:
- Qt for MCUs
- Crank Software’s Storyboard
- TARA Systems’ Embedded Wizard
In reviewing these vendors, we took a look at the prebuilt demos and worked through developing a sample application in each framework.
Overall, the prebuild demos for each vendor performed well, which was expected. But a good framework is more than a good demo. You’ll need to look closer to uncover what the company is willing to show off and what they may be avoiding. Compare the demo to elements in your own visual design to see what is worth taking a closer look at.
Qt for MCUs
Company: The Qt Company, headquartered in Helsinki, Finland
Though The Qt company is the new kid on the block in the MCU space, they have been a powerhouse in GUI development for years. Qt for MCUs is a new product that they are building from the ground up with MCU in mind.
What we liked:
- Tight integration for compiling/deploying to hardware.
- C++ API helps with ended to end development.
- Reuses tooling from Qt product.
Company: Crank Software/Ametek, headquartered in Ottawa, Canada
Storyboard is a two-part product. Designer allows you to graphically lay out and connect functionality. Storyboard Engine is a rendering engine that runs on the target. Also included is support to hook in Lua scripts and C callbacks.
What we liked:
- Photoshop/Sketch importers make it easy to start with pixel-perfect GUI
- Lightweight Lua scripting allows for quick iterations of GUI, and allows you to leverage open source Lua scripts
Company: TARA Systems, headquartered in Munich, Germany
Tara Systems has been around longer than embedded GUIs, so it is no surprise that Embedded Wizard is a popular toolset. The embedded wizard concept of design “bricks” makes it easy to create and organize a GUI.
What we liked:
- Brick concept has code living next to the graphic elements for easy-to-navigate code
- Chora language code snippets are easy to learn and compile to C++
Company: MicroEj, headquartered in NANTES, France
MicroEJ has put thought into IoT devices that need to connect to the cloud, and have provided the frameworks to do just that.
What we Liked:
- Supported on a large number of targets
- Rich libraries of IoT protocols
Company: ST Microlectronics, headquartered in Geneva, Switzerland
In 2018, ST Microlectronic acquired a rich GUI framework, which they provide free for STM32 hardware. This is a great solution for budget-conscious development for STM32 hardware. The downside is that it is unsupported.
What we liked:
- Already bundled with the BSP for STM32
The Bottom Line
Choosing a GUI framework for your MCU target takes great care because the right decision can help drive product success, but the wrong choice can stymie your ability to achieve your product goals.
If you liked this blog, don’t miss the rest of our series Developing with Microcontrollers.