LCARS: Beautiful Art, Bad UI

During lunch today, I de-activated LCAR_S here, and re-activated my old theme.

Until April of this year, I hadn’t had time to work on my personal site since late 2012. Sure, I say that the day after I created a fake startup called FART, but I realized my recently-launched re-design of this site – LCAR_S – had some big isues, and had to go for now.

 

The most notable is that the LCARS interface – while it’s a pleasant work of art by Michael Okuda – is an absolute poster-child for bad site interfaces. I was so wrapped-up in the design that I didn’t bother to subject it to the standards I’d apply to any actual site build, namely: does it suck to use?

The short answer there is YES. Because I conformed to the UI guidelines for LCARS, I entirely ignored my own experience as a developer (those guidelines are sparse, but here’s one source. I generally went with my own observations from TNG).

The primary function of this site is to provide content in a pleasant interface for others. It’s an outlet for the variety of things I do. When even the theme author can’t read a whole post without being annoyed by the design, you know it’s bad.

There are many issues:

  • Narrow, hard to read header text
  • The average viewer is not going to care about the LCARS flair, or fictitious Starfleet data on each post, such as the stardate function (in which I’m essentially just playing around with the Julian Day in PHP)
  • Inefficient use of space; borders everywhere, no central alignment or grid
  • Flat, non-intuitive interface makes it difficult for the user to know how to complete common actions by default.
  • In development, forcing an LCARS ui on every common screen breakpoint, to every element, resulted in writing some pretty heavy sass. Way heavier than is acceptable for typical site development.
LCARS UI, a crowded example.
Like, seriously.

 

From here, I’ll be re-working the LCARS interface from scratch. If I can arrive at something that combines elements of LCARS while not sacrificing usability, great. If not, it was still enojoyable exploring the LCARS interface through the viewpoint of CSS.

Author: Rami

janitor

3 thoughts on “LCARS: Beautiful Art, Bad UI”

  1. I’m looking for something like a LCARS theme for wordpress to activate on my Starfleet International Chapter’s website. I loved your thoughts on the LCARS as a whole. They were great to look at, as no one could read small things on the screen so the LCARS had to be huge to see on camera. Did you end up scraping the project?

    1. Hey Joshua – yeah pretty much. In its’ current form, the scss/css was too verbose to be practical. There’s a solid css framework here: https://github.com/Garrett-/lcars, but it has a variety of compatibility issues, and does not define many of the LCARS components. It’s a great place to start, though.

      The main problem I ran into – repeatedly – was what we both noted: readability and practicality.

      I can see a minimal LCARS UI working for a site, so I’m planning to begin a v2 starting from that perspective.

      Another issue which I’d only noticed in retrospect is that I was really trying to work on two different things:

      1. A comprehensive library of styles and interactions, incorporating every LCARS component as accurately as possible, and
      2. A usable website.

      This is definitely on the list to re-visit…one day 🙂

      1. Let me know when, I’ll donate for your efforts. I work with James Cawley on new voyages so I know how being a perfectionist is. 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *