← Back to Notebook
Labs · Draft standard

Elbow: making the Star Trek interface do something

LCARS looks like the future and means nothing. Here's a draft spec that gives every shape a job, plus a wall panel you can poke at, one idea at a time.

LCARS is the Star Trek computer: black screen, big candy-colored bars, a fat orange elbow swooping from the left side across the top. It has looked like the future for almost forty years. It was also built on a TV budget to look clever from across a soundstage, and on the show the numbers on the buttons are random.

So I asked a question I should have asked as a kid: could you actually use it?

What the internet already knows

Less than you'd think. There are plenty of LCARS skins: CSS kits, Home Assistant themes, a Pi-hole display on a Raspberry Pi. They copy the shapes and skip the rules, because there aren't any. One designer who tried to build a usable one put it plainly: it's "quite hard to build an LCARS interface that is both pretty and somewhat usable." The only written rule I found is a fan's: the frame always goes thick to thin at each turn.

The Home Assistant crowd lives with the results. Grid lines vanish against black. Cards break after updates. People switch back to the boring theme to edit, then switch to the starship one to show off.

There's no usability research on it at all. And Paramount owns the look and has pulled apps over it before. So this is inspired by, under its own name.

The idea: keep the shapes, give them jobs

Look at LCARS long enough and a working interface is already hiding in it. The side rail could be navigation. The top bar could say where you are. The elbow, where the two meet, could be home. Red Alert, where the whole screen turns red, is the best status signal in science fiction: you can read it from the next room. The show just never committed to any of it.

Elbow commits. It's a draft spec (version 0.3, fifteen rules) and a working wall panel for an imaginary house. The panel is below in pieces, one idea at a time. Click into any of them and poke. It's meant for wall tablets, home dashboards and status screens: things you glance at, tap once, or watch numbers move on. It's not for your taxes.

1. You can see how deep you are

Every menu in Elbow is a frame inside a frame, and each level down is drawn thinner. The root rail is 150 pixels wide with a 30-pixel bar. One level in, 16. Then 10. Then 6, a pinstripe. Each step also moves one shade down the frame colors. You never need breadcrumbs, because the ancestors stay on screen as fat, then thinner, then thin brackets around where you are.

The numbers on the segments finally mean something. They're addresses, and they add up: 5.2.1 is Systems, then Climate, then Upstairs. Type 5, 2, 1 and you're there. Esc climbs back out, one thicker frame at a time. Four levels is the limit. If you need a fifth, your house is too complicated.

On a phone there's no room for frames side by side, so you go inside instead, the way the show does it: the frame stays put and only what's in it changes. The levels you came through shrink to thin bars at the top, thinner the deeper you go. Tap one to climb out. I checked: the show never once puts tabs along the bottom, so neither does Elbow.

Open this full screen

2. Big buttons, with the price on the ring

The transporter room had the right idea: a few huge buttons for the few things that matter. Elbow keeps them, and adds the circled numbers the show loved, except now they're true. The number in each chip is live: how many things that button will change right now. Hit Morning when the morning lights are already on and the chip says 0.

The ring around the number is the price. White: it happens now, and you can undo it. Gold: hard to undo, so press and hold while a sweep crosses the button (lock the house, open the garage). Red: it reaches a human being, so hold even longer. Energize responsibly.

Open this full screen

3. Data, stolen from the science station

I was rewatching TNG and paused on a science screen: Planetary scan = Theta Eight. I took pictures of my TV like a lunatic. The frame splits in two, with a pair of thin bars running across. Above the bars, the facts, KEY = VALUE in tall blue capitals. Below, a picture of the planet inside square brackets, with a scale and tick marks down one side, a catalog number in the corner and a sample count in the other. It's the most usable screen in the series, and it's on for four seconds.

So that's the data layout. The top segments pick what you're scanning (power, outside temperature, battery, the live sensor log). The bottom segments pick the range. The spec sheet up top is the tooltip: drag across the chart, or arrow through it, and the Reading = line follows. And that striped block on the divider bars, pure decoration in the show, is the cursor here. It slides along the bars to mark the hour you're reading.

The chart rules are boring on purpose. One series per chart. Bars start at zero. Gridlines are grey, never a frame color. Numbers you'd read out loud are white or Data blue. The sensor log is the famous LCARS waterfall of numbers, except every row starts with an address you can go visit.

Open this full screen

4. More colors that still mean something

The first draft had five colors, one per job, and it looked like a road sign. The show has dozens. The fix is families: five jobs, several tints each. Frame is amber, apricot, sand and clay. Action is lavender, lilac and violet. Data is ice, frost and steel. The family carries the meaning. The tint only tells neighbors apart, so you get the show's candy-store rhythm without any color lying to you.

That also makes themes safe. The data scan above is in Science, the pink-and-blue lab look. Every tint changed, and no job moved. Red alert still repaints everything at once. Try it on the Weather page: one tap, the whole frame turns red, and the header says why in words.

Open this full screen

The whole panel

All seven sections in one place. Click in, then press 1 to 7. Weather has the hail button. (Colorado. Hail. This one's personal.)

Open this full screen

The rules, short version

  1. The frame is navigation. Rail segments are sections, the bar says where you are, and the elbow is home.
  2. The frame never holds content. The black field does.
  3. Thickness is depth. Each level is a thinner frame inside its parent. Four levels, tops.
  4. Shape is what you can do. Segments navigate, pills act, big buttons do the main jobs, and square blocks only report.
  5. Five color families, many tints. The family is the meaning. Color always comes with a shape or a word.
  6. Every number is real: an address, a live value or an ID.
  7. Condition is the whole frame, and the header says why.
  8. Condensed capitals for labels, a readable face for sentences.
  9. Black gaps are the grid.
  10. Animate only when something changes.
  11. Type an address to go there. Esc goes up a level.
  12. On a phone, it's a PADD. The sidebar stays, the frame closes into a C with status along the bottom, and menus go inside one level at a time.
  13. The split frame: summary above the double bar, detail below, and the junction is the cursor.
  14. Charts: one series, zero-based bars, grey grids, a bracket with an ID and a count.
  15. Themes change tints, never jobs.

The full text, with numbers and a checklist, is in the spec. What changed and why, including every time I said "that feels weird," is in the update log.

What's still open

  • Big tables. LCARS has never met a spreadsheet it liked. The eight-row log is as far as it goes so far.
  • The name. "Elbow" is a placeholder that's growing on me.
  • A real install. The next step is a Home Assistant version on an actual wall, wired to hailAlert, my hail early-warning script, so red alert means real hail.

Sources