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 20, 2024
If you are looking for great technology-related reads, here are some offerings that I cannot recommend highly enough....

featured video

How NV5, NVIDIA, and Cadence Collaboration Optimizes Data Center Efficiency, Performance, and Reliability

Sponsored by Cadence Design Systems

Deploying data centers with AI high-density workloads and ensuring they are capable for anticipated power trends requires insight. Creating a digital twin using the Cadence Reality Digital Twin Platform helped plan the deployment of current workloads and future-proof the investment. Learn about the collaboration between NV5, NVIDIA, and Cadence to optimize data center efficiency, performance, and reliability. 

Click here for more information about Cadence Data Center Solutions

featured chalk talk

Autonomous Robotics Connectivity Solutions
Sponsored by Mouser Electronics and Samtec
Connectivity solutions for autonomous robotic applications need to include a variety of orientations, stack heights, and contact systems. In this episode of Chalk Talk, Amelia Dalton and Matthew Burns from Samtec explore trends in autonomous robotic connectivity solutions and the benefits that Samtec interconnect solutions bring to these applications.
Jan 22, 2024
26,230 views