What to look for when choosing an embedded GUI builder

When choosing an embedded GUI builder for your device, there are several factors that should be considered to ensure a seamless design and development process. Below we have listed the top four features to look for when choosing an embedded GUI builder, regardless of the application.

Intuitive workflow system

For an embedded GUI builder, an intuitive workflow that is simple for both developers and designers to use is highly desirable. An effective software tool facilitates ease of use and productivity for both parties involved. For example, with Crank Storyboard you can import directly from familiar, user-friendly tools such as Adobe Photoshop and Illustrator, or Sketch, enabling a more intuitive workflow system for designers.

Regardless of the GUI application you’re creating, it’s helpful that designers have the ability to design within the tools they know, such as Photoshop, Illustrator, or Sketch, import the design files into the GUI builder, and run on the desired hardware. This simple approach helps avoid the potential pitfalls encountered during the conversion from design to code. With Storyboard, whatever details and style you incorporate into your visuals will remain unchanged when imported into the software.

In other tools, designers are left navigating the technical issues that are generally more in the developers’ field of expertise. This includes deciphering complex programming scripts and hardware configurations, and also using preset developer-created widgets, which ends up being time-consuming and costly.

Ability to add animations

For embedded GUIs, the appearance alone isn’t what makes it a success; the ability to add proper animations and behaviors is also essential. For certain embedded GUI building tools such as Qt, animations are defined in code, such as object states and transitions based on the specifications of the QML language. The usual workflow entails coding logic in an editor, testing the changes, and tinkering until you get the experience you want.

In alternative tools, such as Crank Storyboard, there is a simple process for adding animations with the use of an animation timeline, similar to what designers and producers use in any video editing application. This setup allows you to control the animations and observe the timing relationships between elements. Also featured in Storyboard is an animation recording capability, giving you the ability to drag, drop, and change the state of objects in the visual editor for testing and playback at runtime.

Ultimately, when choosing an embedded GUI builder, you want the ability to work with your true image assets, animations, and behavior. What you should avoid is choosing a tool that simply provides an abstract source code representation of your GUI, as this is time-consuming and a hassle to decipher for non-experienced coders.

Platform scalability

Aside from questions of performance, there are two more features to look for when choosing your GUI builder, as it’s imperative that the software is well-suited to your chosen operating system and hardware. The first question is: Will the embedded GUI application actually run on your chosen operating system and hardware? Secondly, how difficult will it be to move the application onto different platforms?

If created in Storyboard, a GUI application runs on a wide variety of platform types, ranging from high-performance, multi-chip microprocessor boards to single-chip, resource-constrained microcontrollers.

While running other development kits such as the Qt embedded GUI builder on an MCU board is possible, it requires an ample amount of time and time-consuming knowledge to tune it optimally for the processing power and memory available. Also, lower-end MPUs struggle because of limited resources, leaving mid- to high-end systems as the ideal range where Qt can run effectively with less effort required for proper tuning.

In general, platform adaptability and support are both important. No matter the case, as you’re building your project and production scale and costs are increasing, it’s critical that you’re set up to switch between hardware if need be.

Efficiency and smooth operation

With certain toolkits such as Qt, the designer must collaborate with a developer to translate their design into code and deploy it to the target hardware. This can be an inefficient process as the two have to figure out how the design can be adjusted to fit into development constraints. In addition, during this process you have to deal with all the bumps in the road that come with debugging and running a real GUI application.

With Storyboard, we eliminate the need for the designer to rely on a developer. This significantly reduces the time it takes to transform a design concept into the end result. The process simply consists of the designer importing their GUI design from Photoshop, Illustrator, or Sketch, adding desired animations and behavior, and deploying it on the built-in simulator for prototyping and user testing. Once the hardware platform is chosen, the developer can integrate and test the validated design, ensuring the designer's intent is maintained.

We hope this article has given you enough information and guidance to help you make a confident decision on which embedded GUI builder is the best for you and your team. Regardless of your GUI application in mind, it’s key to look for these features when choosing your builder to ensure a smooth, streamlined process.

To try Storyboard for yourself now, sign up for our free trial.