Partners

Blog

6 min read

If you're in the process of evaluating embedded GUI software design and development options, then you've come to the right place.

Perhaps you've never heard of Crank, or our leading embedded GUI software tool, Crank Storyboard. Well, that's not surprising considering we've been the secret sauce of embedded graphics teams of Fortune 100 companies for over a decade. But yes, we've helped major consumer, industrial, medical and automotive names win design awards for touch screen devices around the world. Coca-Cola, Vorwerk Thermomix, and John Deere all continue to rely on Crank to help create future-proof embedded graphics that customers WANT to touch.

The quick answer is that there's no comparison - Qt is a large C++ library of functionality that includes many things and designed to let you do many things, while Storyboard is a purpose-built platform for fast UI development and highly optimized performance. Not to mention that Storyboard also integrates with Qt, so it's not like the two are mutually exclusive.

Yet, the popularity of Qt is hard to ignore so it's worthwhile to go beyond the quick answer and explain exactly what makes Storyboard different.

#1: Designer-supported workflow

If you're a UI designer, it's safe to say that you would rather focus on creating the best user experience than figuring out Qt object properties, sizes of data types, and build specs.

Storyboard makes sure both designers and developers are supported with tools and workflows that are familiar (hello, Photoshop!) and require little effort to learn:

By allowing designers to work within Adobe Photoshop, import the results, and run on the actual hardware, Storyboard eliminates the compromises traditionally made when converting from design to code. If you have a button colored, shaded, and cornered just as you like it, it'll look exactly the same in Storyboard.

In contrast, Qt forces designers to think and act like a developer, requiring them to not only understand markup language and text editors but also use widgets that have the same look and feel as every other application written in Qt. Qt widgets are customizable, of course, but that incurs time and cost and it would be nearly impossible to find a designer willing to do it.

Plus, custom widgets aren't as easily maintained as using the Photoshop re-import and graphical compare tools in Storyboard. These let you iterate designs, compare differences between versions, and select the objects you want, all within a visual, WYSIWYG interface. This reduces the time and frustration of going back and forth between designer intent and developer reality.

Qt Creator is an integrated development environment (IDE) first and foremost, offering pre-packaged UI elements and requiring that you operate like a developer - quickly moving from the visual interface into text editors, properties, and C++ code. Qt Creator does ease UI layout for a developer but it doesn't provide nearly all the design, layout, and animation capabilities that a designer needs to create amazing UIs.

#2: Ability to add animations

The look of a UI is half the story, the other half is adding animations and behavior. Those familiar with Qt will know that animations are specified in code, such as object states and transitions defined through the methods and properties of the QML language. The typical workflow involves coding up logic in an editor, testing the changes, and iterating until you get the experience you want.

In Storyboard, animations are added using an animation timeline similar to what you would find in any video editing tool. This makes it easy to manipulate what the animations are doing and see the timing relationships between elements. Storyboard also provides an animation recording capability, letting you drag, drop, and change the state of objects in the visual editor for playback at runtime.

Storyboard also uses Lua scripts for more sophisticated object behavior and such things as event handling between the front and back ends of the application.

So, would you rather work with the true image assets, animations, and behavior (Storyboard), or an abstract source code representation of your UI?

#3: Resource usage and performance

The reason is simple: a Storyboard app is simply a data model and engine, both optimized with a reduced semantic set and tuned by us to squeeze the best possible performance out of the specific operating system and hardware it's running on, including specialized architecture and graphics acceleration. There's also no resource-hungry Javascript engine to deal with.

In other words, we've spent the time to ensure that the Storyboard engine runs fast and that your application consumes the least amount of resources - the golden ticket when it comes to embedded computing. Storyboard also has a plugin-based architecture, meaning you can configure the app even further to reduce memory consumption.

Read more about Storyboard Lite here, included in our June 2019 release, designed to help design and development teams still think big and brilliant, while consuming a small footprint on resource-constrained devices.

Conversely, Qt has a large memory footprint and, typically, pulls in many framework libraries to bloat application size further. While it does offer hardware-based graphics acceleration, support is limited to a few platforms and sometimes relies on software fallbacks to get things done, which is less performant and offers little insight into performance characteristics.

But can't I just tune Qt to make it work?

Now you might be thinking that Qt is also tunable, letting you customize build configurations, how libraries are linked, memory allocation, and so on. While this is technically possible, you do need two things to succeed:

Knowledge and experience with QML, C/C++, compilers, and target-specific performance measurement and testing

Time

To give you an idea of the time needed, visit the Qt site and estimate how long performance tuning will take for your app.

#4: Platform scalability

Beyond performance, there are two more things to consider when talking about how well a UI framework suits your chosen operating system and hardware platform.

Will the app actually run?

How difficult will it be to move the app onto different platforms?

Out of the box, a Storyboard app runs on a variety of platform types, from high-performance, multi-chip microprocessor (MPU) boards to single-chip, resource constrained, microcontrollers (MCU). This is possible due to the optimized, platform-specific architectures and Storyboard engine discussed earlier.

Running Qt on an MCU board is possible, but it would take some time and knowledge to tune it effectively for the processing power and memory available. Lower-end MPUs also struggle due to resource limitations, leaving mid- to high-end systems as the range where Qt can run with less tuning effort.

Platform portability and support are important, as today's product may be running Linux on an MPU but tomorrow it could be ThreadX on an MCU, as production scale and costs increase. Qt is a rather large library with many dependencies, so you should consider its suitability for not only your current hardware but future plans as well.

Still with us? Good for you, but we're not done yet. Keep reading here....

Jason is a co-founder and VP of Sales of Sales and Marketing at Crank Software. With over 20 years of embedded systems experience (with a focus on embedded graphics), and an engineer by trade, he is a mountain biking enthusiast and can be found on the trails behind the Crank office on a regular basis.