feature article
Subscribe Now

Getting All GUI

“It’s the interface, stupid” could be the key to successful designs

As kids we’re taught “don’t judge a book by its cover” and that “appearances can be deceiving.”

But we also learn that “beauty is only skin deep” and that “you get only one chance to make a good first impression.” With all these dueling aphorisms, what are we supposed to believe?

With embedded design and development, outward appearances and first impressions do matter – a lot. More and more, the outwardly visible parts of your product will determine its success. In fact, a lot of today’s products are successful purely because of their outward appearances, in spite of what’s under the hood.

Being an embedded designer used to mean concentrating on the technology inside the box; the outside was usually greasy and square and had a lot of sharp corners. Nobody ever saw our products, and fewer cared what they looked like. But all of that is changing.

Appearances have always been important. We just don’t always realize it. Remember the early Macintoshes and how different they were from the DOS or Unix computers of the day? It was really just the Mac’s graphical user interface (GUI) that got our attention. The internal 68000 processor, the DRAM architecture, and the operating system’s priority queue were all irrelevant, though we might have had some professional curiosity. The Mac just looked cool.  The user interface won us over and made the Mac seem like an entirely different class of machine relative to its contemporaries. Today’s Mac hardware has changed radically since then, even going through three completely different CPU architectures, yet the overall GUI remains the same, and that is the key to its loyal user base.

People respond to interesting user interfaces. We like them. Even the most hardcore engineer is an irrational person underneath, and irrational people make irrational buying decisions. We like shiny objects. 

This effect isn’t limited to just retail-shelf consumer items, either. Even if you design deeply embedded devices, you still need to pay attention to your user interface. It’s likely the only part that your potential customers will ever see, or remember.

When I was developing industrial robots – about as non-consumer-oriented a product as you can imagine – we had one of the best user interfaces in the business, and it won us a lot of sales. Sure, we spent 99% of our engineering effort on the real job of getting the kinematics right, but that other 1% probably made more of a difference in sales. Buyers of industrial robots expect the motion, accuracy, repeatability, and safety to be spot-on; that’s just the table stakes for entering the game. But if one robot is easier to train than another, or if its interface is more interesting and engaging, that’s a real differentiator.

Chip vendors and software vendors have gotten the GUI religion, too. They know that many of us are designing user interfaces for the first time, or that we’re creating more elaborate interfaces than before. And they’re ready to lend a hand. Atmel, for example, just updated its ARM and AVR development suite with something called QTouch Composer. As the name suggests, QTouch Composer helps you create a touch-sensitive user interface that (the company hopes) relies on Atmel’s own touch-screen controller chips. But since most of us are unfamiliar with the vagaries of touch screens, proximity sensing, and virtual button placement, QTouch Composer is a big boon. The more quickly you can create and debug your user interface, the earlier your product will hit the market and the sooner Atmel can sell you more chips. Everybody wins.

Taking another step beyond that, Mentor Graphics offers its Inflexion UI tool. Inflexion goes well beyond just getting your virtual buttons to work; it’s a whole GUI development system. You can be pretty graphically challenged and still produce a darned nice GUI using Inflexion. It’s like having Photoshop for your embedded device.

The only downside to Inflexion, if any, is that it adds a layer of interpreted code to your embedded system. See, because Inflexion is processor-agnostic, the GUI code it produces is hardware-neutral and gets interpreted at run time by a processor-specific interface layer. Think Java, but less complicated or slow. On the plus side, that also means your Inflexion-generated GUI is portable across different products, different operating systems, and different CPU families.

As with Photoshop, having the tools doesn’t mean having the talent. There’s a real art to creating good user interfaces, and most of us don’t have that skill. It’s even tougher to design a GUI that will stand the test of time. Too often, we tack on features and functions over the years as our devices get more capable while our GUI tries to stay the same. The result can be a bit awkward, with new features seemingly shoehorned in where they’d fit. This is where you need to hire a real, live professional user-interface designer (yes, this is a real job description) and let him/her/them guide you. Often, the engineers developing a product are the worst people to design the user interface, because they know too much about its inner workings. An outsider who can approach your product from the users’ perspective is an invaluable aid.

Some very successful products have been designed GUI-first. In addition to the Mac, there’s the iPhone: entirely unremarkable as a cell phone, but an impressive breakthrough in GUI design. Nobody buys an iPhone for the cellular performance or the ARM processor; they buy it for the GUI and the apps. Now almost all smartphones look and act as similar to an iPhone as the law allows. Before that, the Palm Pilot was reputedly designed from a block of wood that inventor Jeff Hawkins carried around in his shirt pocket. The shape, size, and usage model came first; the internal hardware and software came later.

When we see Tom Cruise as Pre-Crime Chief John Anderton or Brent Spiner as Lt. Cmdr. Data waving their hands at their computers, it’s the user interface we remember, not the presumably advanced hardware behind it all. Product design is like theater: there’s a very big building behind the stage with rehearsal spaces, advanced lighting, prop storage, painted scenery flats, and more. But it’s all there to put on a good show for the audience. What’s behind the curtain is all in support of the show on the stage. Put on a good show, and your audience will come back for more. 

Photograph by Rama, Wikimedia Commons

3 thoughts on “Getting All GUI”

  1. Great article, Mr. Turley. Definitely it’s no longer possible (probably it never was) to let UI in a second plane. It’s time to think of seriously in user interfaces and, better, before start HW and SW design.

  2. It’s interesting you showed an IMSAI 8080 in your column. It’s only interface comprised switches and LEDs. It was easy to rearrange the red and blue switch paddles to provide an octal rather than a hexadecimal arrangement of bit groups. The 8080 op codes naturally broke into logical octal groups, which made codes easy to memorize. Programmers familiar with hexadecimal numbers forced them on even the early hobbyist computers. So we had poorly thought-out interfaces even in the ’70’s.

  3. It’s interesting you showed an IMSAI 8080 in your column. It’s only interface comprised switches and LEDs. It was easy to rearrange the red and blue switch paddles to provide an octal rather than a hexadecimal arrangement of bit groups. The 8080 op codes naturally broke into logical octal groups, which made codes easy to memorize. Programmers familiar with hexadecimal numbers forced them on even the early hobbyist computers. So we had poorly thought-out interfaces even in the ’70’s.

Leave a Reply

featured blogs
Jul 6, 2020
If you were in the possession of one of these bodacious beauties, what sorts of games and effects would you create using the little scamp?...
Jul 3, 2020
[From the last episode: We looked at CNNs for vision as well as other neural networks for other applications.] We'€™re going to take a quick detour into math today. For those of you that have done advanced math, this may be a review, or it might even seem to be talking down...
Jul 2, 2020
In June, we continued to upgrade several key pieces of content across the website, including more interactive product explorers on several pages and a homepage refresh. We also made a significant update to our product pages which allows logged-in users to see customer-specifi...

featured video

Product Update: What’s Hot in DesignWare® IP for PCIe® 5.0

Sponsored by Synopsys

Get the latest update on Synopsys' DesignWare Controller and PHY IP for PCIe 5.0 and how the low-latency, compact, power-efficient, and silicon-proven solution can enable your SoCs while reducing risk.

Click here for more information about DesignWare IP Solutions for PCI Express

Featured Paper

Cryptography: How It Helps in Our Digital World

Sponsored by Maxim Integrated

Gain a basic understanding of how cryptography works and how cryptography can help you protect your designs from security threats.

Click here to download the whitepaper

Featured Chalk Talk

Accelerate HD Ultra-Dense Multi-Row Mezzanine Strips

Sponsored by Mouser Electronics and Samtec

Embedded applications are putting huge new demands on small connectors. Size, weight, and power constraints are combining with new signal integrity challenges due to high-speed interfaces and high-density connections, putting a crunch on connectors for embedded design. In this episode of Chalk Talk, Amelia Dalton chats with Matthew Burns of Samtec about the new generation of high-performance connectors for embedded design.

More information about Samtec AcceleRate® HD Ultra-Dense Mezzanine Strips: