The soul of elegance in Star Trek’s product design

Web and product design trends come and go, but the essentials of great design haven’t changed. I like delightful animations, but we shouldn’t confuse icing with cake. Star Trek inspired half a century of great inventions and is an excellent reference for ‘user story-driven’ design. Designing around user-stories produces the best results; Sites and apps that are very valuable and have a high x-Factor. The qualities of great design help us know good from bad and how good design can become great.

OK is the enemy of great, but great is built on good

Voltaire and James C. Collins said that ‘good is the enemy of great‘. It’s an idea that cuts two ways. Design allows products to be constructed so that they can be used to  accomplish things. We could tinker forever trying to get a ‘perfect’ design and never ship anything. Don’t be so enamoured of “great” that you don’t take positive steps in the direction of goodness. Great design is built on a multitude of good steps in a never-ending journey.

On the other side, you could copy someone else’s design or follow a design pattern to produce ‘ok’ solutions. To go beyond ‘ok’, you need to be creative, which means trying lots of alternatives, taking iterative steps to become less and less wrong. When you’ve found and eliminated everything wrong in many rounds, it may be declared awesome, but never perfect. There will always be more edge cases, new wrongnesses to address over time. Many clients naively want perfect designs in the first round. It’s not realistic.

Good is too-often short for ‘good enough’, a temptation to stop at simply exposing functionality and ignoring the possibility of great design. Great design doesn’t just work, it’s empowering. It makes the experience of doing something feel good.

When an experience feels good, the user feels smart, competent and in control. Efficient and easy are part of feeling good. It helps if things are visually appealing, but nothing feels better than products that allow you to feel in control, smart, capable, even powerful.

 

Great design isn’t too much to ask

Unless you’re banging out an MVP, functional design isn’t good enough. In many design projects, you get a functional spec and are told to make it pretty. Yes, the end result should look good, but great design has superlative user flow to accomplish tasks as it’s defining characteristic. If it looks awesome, but the flow sucks, it’s a catastrophe. That’s why you work out the flow with wireframes before you make it look awesome.

Car locks are a good example. Before power locks, every time someone left a car, they had to check that every door was manually locked, which could be 4 doors plus a hatch. That’s functional design, it works, but it doesn’t account for who’s using it and how it fits in their life. Power locks were invented in 1914, but didn’t really get applied until Packard rediscovered the idea in 1956. It doesn’t take a genius to figure this sort of thing out. They simply analyzed real use cases and discovered that people with kids wasted a lot of time locking and unlocking all the doors. Doing this sort of user research and ACTING ON IT is all that’s required to go from good to better. Iterate and you get great design.

Great design fits into a user’s life in a way that it gets taken for granted AS OBVIOUS, but it’s not obvious without research. When we dig to understand who’s going to use a product, what they most want to get done, and how it fits into their life, it’s easy to design things well. Great design raises expectations so that the merely good gets demoted to garbage. A significant contributor to great design was Raymond Loewy, the Father of Industrial Design and the most influential product designer of the 20th century. He lived by his own MAYA principle – Most Advanced Yet Acceptable, whether designing trains, toasters, the classic Coke bottle, cars, airplanes or spaceships.

“It would seem that more than function itself, simplicity is the deciding factor in the aesthetic equation. One might call the process ‘beauty through function and simplification’.”

Awesome usability is tech you can take for granted

All of the tech that the characters used was pretty great. The reason that the fictional future of Star Trek inspired the invention of cell phones, tricorders, mobile tablet computers, infographics, google translate, bluetooth headsets, media players, voice dialing, the personal computer and the space shuttle is that it showed all of these things as simple, usable, inevitable products. When science fiction makes high tech look amazing, it looks like unreachable fantasy. That doesn’t inspire real inventors. Star Trek showed advanced tech that you could believe people really used because it was simple and mundane, not fancy and weird. The idea that incredibly complex tech should be simple and easy to use is OBVIOUS when you watch Star Trek. If it was complex, the characters would never get anything done. Matt Jefferies, the original art director/designer for Star Trek is right up there with Raymond Loewy in my books.

First let’s set some context. Aside from the story-telling, or the progressive, but still sexist, gender roles or the  optimistic view of the future, please consider how Kirk, Spock and Bones ACTUALLY USE the high tech tools in the original Star Trek tv show. Even staggeringly complex things like a medical tricorder are so well designed that we, as viewers, take them for granted when the characters use them. The show never has to explain what something does or how it works. All the later series and movies blurred this point by trying too hard to make high tech LOOK AMAZING. When we design sites and apps, we want people to use them to get shit done, not to ooh and ahh over how pretty it is. Constraints lead to better design. The original series didn’t have the time, budget, materials or CGI to over complicate things so they didn’t. Their budget required simplicity, and simplicity is the soul of elegance.

User story-driven design

Just like at Pixar, ‘Story is King’ guided the designs for Star Trek. Most modern science fiction tries too hard to look cool, as if ‘How do we make things with lush eye candy that look space age?’ was the design ethos. In Star Trek, the designs are streamlined around the needs of the story. When story says ‘Characters need to talk while travelling to planets and space ships’, it translates into a mobile flip phone with one button. ‘Characters are going to get hurt and afflicted with a wide range of space sicknesses’ translates into a medical tricorder you wave over someone to get a diagnosis. ‘Characters need to travel long distances quickly to advance the plot’ translates into the transporter. In every case, the Star Trek design contained ONLY what was needed for the characters to move the story forward. When designing user experiences for real people, we need to know what a user’s story is before we can design products, apps and sites that support their story. If we don’t design around authentic user stories, we end up cluttering the interface with extraneous features or giving too much focus to edge cases.

Case 1: Communicators

communicatorStar Trek communicators inspired Martin Cooper to invent cell phones at Motorola. When Star Trek was created, most phones were pain in the ass rotary dialers stuck to a single wall outlet. Most houses had ONE of these things strategically placed so that you could hear it and get to it quickly because nobody had answering machines. I’m inviting you to grasp how creative they had to be in 1966 to imagine a personal phone you carried around, voice dialed and gave you the freedom to communicate anywhere, at any time. Let’s look at the process and the result.

  • Problem: The stories needed a way for people to communicate when they are moving around and separated by great distances.
  • Approach: A small, thin, lightweight handheld device that allows voice communication over great distances.
  • User Interface: Almost none. Just open it and talk. Voice dialing or direct connection to Uhura to set up conference calls.
  • Result: An awesome product that the characters (and viewers) instantly took for granted because it was so good. The point of a communicator is not to show off. It facilitates communication in the simplest way when the story called for it. It included real time translation to talk to aliens. Products only exist to help the plotline of our lives move forward. Everything else is superfluous.  When the real thing was built, it was almost exactly like the communicators on the show. Even the term ‘communicator’ is still superior to the terms ‘telephone’ or ‘cell phone’.
  • Have We Got There? 50 years later, we’re still working on it. We’re close with reliable voice dialing via Cortana, Google Now and Siri. Google translate isn’t there yet. It’s arguable that we have gone off track by packing too much in smartphones. Star Trek separated the communicator and tricorder into two devices for very good reasons. Capt Kirk never worried about the battery dying in his communicator, much less interuptions from twitter feeds, facebook posts or other extraneous garbage.
  • Takeaway: Design the product around the user stories to determine functional and aesthetic needs. Hit those points in the simplest way.

Case 2: Medical Tricorders

If nothitricorderng else blows you away, Star Trek’s approach to medicine should. Medical science has come a long way, but in the grand scheme, it’s still poking around in the dark. How do diseases and viruses spread, take root, cause damage? How do we prevent or stop them without side effects? What is optimal diet and exercise for me individually? Why can’t I sleep better? What exactly is going on with my body right now? Medical science still has to depend on theories and guesswork. When I go to a clinic or hospital, they ask me where does it hurt, how much, do I have allergies or a history of this or that? What if I answer wrong because I’m throwing up or distracted by a broken arm or I can’t answer because I’m knocked out? It’s kind of ridiculous.

Star Trek ruined me for all of this. Dr. McCoy pulled out a tricorder and moments later announced ‘His heart rate is through the roof. She’s got early stage glaucoma. There’s a retro virus running through his system.” Armed with immediate, CORRECT medical information, he could fix almost anything if he could get the person to sick bay. Simple as could be.

Scientists and engineers have been inspired ever since to create better medical devices. We’re still working on it. The Tricorder XPrize is a direct link to the original Star Trek. “Imagine a portable, wireless device in the palm of your hand that monitors and diagnoses your health conditions.

When Star Trek was created, medicine was a lot more guesswork than it is today. Let’s look at the process and the result for Star Trek medicine.

  • Problem: The stories introduced a lot of hazardous situations, alien diseases and injuries that the ship’s doctor would need to deal with. We don’t have a budget for a big hospiral on the ship, so the doctor needs to be able to diagnose anywhere and treat anything in one small room.  We don’t want the doctor reciting gobbledygook, so the gadgets will boil it down to a comprehensible bottom line so he can clue in the audience.
  • Approach: Three devices. 1. A tiny wireless medical sensor. 2. A larger handheld gadget with the smarts and display to intrepret the sensor data and display it to the doctor. 3. A medical table with sensors to show vitals and diagnose anyone lying down on it.
  • User Interface: Almost none. Just wave the sensor over a patient and read the results.
  • Result: It worked great in the show, and inspired the invention of the everything from the FitBit, wireless heart-rate monitors, ultrasound scans, diagnostic medical tables and MRI machines.
  • Have We Got There? We’re still a long way off but we’ve made a lot of progress. Everyone developing advanced medical tech acknowledges Dr McCoy’s tricorder as the ultimate goal. We’re aiming for it because it was the right design. Truly great design seems obvious in retrospect.
  • Takeaway: Before designing solutions, sometimes we need to rethink the problems. The human body is too complex to have a readout for everything, but scanning everything and reducing it down to ‘what’s anomalous and interesting’ is very usable.

Case 3: Tablet Computers

tabletsWhere did the idea for tablets came from? Once again, Star Trek called it back in 1966 and nailed it in the early 90s. The captain is on the bridge or his ready room, sitting in his chair, looking over reports, signing off on assignments and taking notes. Of course they never show you what’s on the screen because they couldn’t. Like everything else in Star Trek, it just worked. It was enough to imply what it did from how people actually used it.

  • Problem: There’s a lot of information involved in running a spaceship with hundreds of crew working together. The crew need a mobile way to share information, take digital notes, and get things done.
  • Approach: Its arguable that the 1966 version was bit bulky, but it had the absolute simplicity of design and usefulness that inspired the 90s Star Trek PADD.
  • User Interface: Pen and touch computing.
  • Result: The mundane way Kirk and Picard reviewed science reports and signed off on crew assignments made it hard to even notice what a great invention it was.
  • Have We Got There? We’re mostly there. The Samsung Note and Microsoft Surface were the first products to really nail it. The only problem is user acceptance. The Palm Pilot, the Treo, Windows Mobile, the iPad, Samsung Note and Microsoft Surface are all direct descendants of the Star Trek tablet. Unfortunately, most can’t believe Samsung and Microsoft outclass the iPad. When Apple gets religion on this, it will be a done deal.
  • Takeaway: Even simple things can be improved. There can be product pain that we’ve taken for granted so long that it’s hard to imagine fixing it. The plain old notebook is okay, but it’s not great. Ever try to backup, share or search through hand-written notes or sketches? Too painful to bother with paper. Samsung Note and MS Surface let me take notes with a pen in my crappy handwriting on a nice-sized device that are editable, colorable, searchable, shared to the cloud, accessible from a PC and convertible to text. Go beyond good.

Case 4: Wireless Headsets

uhura_02

Once again Star Trek succeeds through simplicity. Not only did they have the scandalously progressive inter-racial command crew with African, Chinese and Russian representation at the height of the Cold War, they worked together like a smooth oiled machine. Lt Uhura was the elegant communication officer, often a vital link what was going on. Part of that elegance was her wireless headpiece so she could look at displays and operate equipment while listening to voice data.

  • Problem: Uhura needs to be hear incoming transmissions while looking at displays and operating equipment.
  • Approach: In line with Uhura’s elegance, she has a wireless earpiece to listen with one ear while still being able to talk to the bridge crew.
  • User Interface: Almost nothing. She touched her earpiece to switch channels or volume, but otherwise, it just worked.
  • Result: The story moved forward effortlessly, so that viewers can concentrate on what’s going on, not how they are doing it.
  • Have We Got There? Yes. Bluetooth headsets rock are a lifesaver when trying to type, take notes, walk around or do anything while talking wirelessly. Even more useful than was shown in the tv show.
  • Takeaway: Focus on story. For Star Trek, they didn’t want to slow viewers down by having wires everywhere and complex tech. We care about what’s going on because the tech gets out of the way. Don’t design products as if using its features is inherently interesting.

Case 5: Video Chat & Streaming Video

enterprise_kirk_television

In the world of scratchy-sounding dial phones, the idea of interactive video chat was pretty far out.

  • Problem: Travelling around the galaxy, the crew meet a lot of aliens. Sometimes they need to be able to negotiate face to face without going all the way over to a potentially hostile ship or planet.
  • Approach: Huge view screen so Kirk can stay in the command chair, the bridge crew can see and they can conduct a civilized sit down talk with whoever shows up.
  • User Interface: Not much. Uhura has access to dozens of feeds and can direct any of them to the main screen at a moment’s notice.
  • Result: The problems of allowing face to face negotiation in space are neatly side-stepped so the story flows. The characters never have the think about the tech.
  • Have We Got There? Yes. Many awesome things were inspired by the Star Trek viewscreen. Low-cost, low power huge flat screens. Streaming video. Two way video chat. Skype. Facetime. Quicktime. VLC. GotoMeeting.
  • Takeaway: Always reverse-engineer. Start with what you want to occur and work backward. What needs to exist to allow the end result? What needs to be built to allow for that? What underlying back-end will that require? Design based on ‘how we achieve this’ instead of ‘what can I build with these components’.

Case 6: Infographics & Physical Interfaces

star trek infographic

When watching Star Trek, there was a certain inevitability about many design elements that I’ve since learned are the hallmark of great design. One of the things that we take for granted now is the value of compelling infographics. They didn’t have CGI, but they did do a pretty good job with what they had.

  • Problem: A starship is one hell of a big, complex piece of technology with tons of things that can go wrong. How do you monitor the whole ship for  problems? How do you visualize it? How do you visualize the vitals of a human body?
  • Approach: Color coded displays of the areas of the ship indicating various conditions, making it easy for engineering or the bridge crew to quickly spot and start acting on any problems. For sick bay, a very clear set of bars that are normalized around the middle of the screen. If anything deviates from normal, it jumps out the medical staff.
  • User Interface: Hardly anything. In the original series, they appear to be information-only. In the Next Generation, they are actionable through a touch screen.
  • Result: Given the clarity of the infographic displays, it’s believable that they could spot problems with the ship or someone in sickbay quickly enough to act immediately. Swift action increases the safety of the ship in peril or a person who could be dying. Perfect fit for the story problems.
  • Have We Got There? Kind of. We have infographics galore but we still struggle to get the best representation to be meaningful. When I look at designing charts, graphics or infographics, I always compare the clarity of what I do to that color coded Enterprise display.
  • Takeaway 1: Information isn’t valuable unless it is delivered in a way that makes sense and is actionable. Beautiful charts aren’t any good if they don’t highlight what’s important. Are we doing better than last month?  Do I see things that help me take actions?
  • Takeaway 2: Current touch screens aren’t good enough yet. Physical interfaces (like in the the original Star Trek) aren’t antiquated. They are just hard to do with current technology. Every device in Star Trek is stripped down to essentials. I have never met anyone, anywhere who prefers typing on a touchscreen to a real keyboard. The future is physical. Samsung and others are experimenting with touchscreens that give you force feedback when you slide over on-screen buttons. That’s just the beginning. Sooner or later, there will be sensory feedback and even holography so that devices have the effect of physical buttons and controls again. Sliding fingers around  flat screens is just the best we can do today. The future is software-driven physical interfaces that look and feel like real buttons, sliders and objects.

 

Summary – Design for a Civilized World

Aside from the specific takeaways I’ve highlighted above, we can learn a lot from Star Trek and Gene Roddenberry’s design ethos.  Star Trek started with the premise of a future where we had solved our problems really well. Even if you find the premise or the acting or the story-telling not to your taste, you’ve got to love that they show a possible future where we get along, take care of the Earth and technology serves us wisely, instead of distracting and separating us. While we have highly imperfect solutions to our problems, we have a shared goal we can point to. When I look at new apps, sites or inventions, I ask myself the following question: ‘Is this thing either a part of a civilized future for humanity or ON PATH to creating a civilized future?‘ From that perspective, some things that are popular now are rough early drafts of great things to come and other popular things are just trendy crap we’ll be better seeing the back side of.

 

 

If you like this article, share it.
If you’re interested in my work, check out my Portfolio & Case Studies.

Contact me if you need a great UX Design Director/Manager

 

About William Stewart

William Stewart is the Product Design Director at UX Factor Design. His inspired design leadership empowers rockstar research, UX and UI work from his teams; When combined with agile research, testing, & impeccable taste, he has repeatedly created outstanding gains (up to 10x) in business value for his employers. He takes as much pride in coaching his teams to grow into true rockstars as designing products that positively affect billions of users. His UI & UX designs are featured in museums & magazines such as AIGA. ★★★★★ Contact him at UX Factor Design (uxfactor.ca) to discuss high level design leadership.