Fantastical UI Design from Sci-Fi Movies

Looking at Dino Ignacio's work made me start thinking about fantasy-based UI design. The first time I really became aware of motion graphics cooking up digital UI's was probably way back during Minority Report or one of the Matrix movies. Being over ten years ago, you can see how primitive it looks now:

It's obvious the operator isn't really doing anything, unless there's some value to aimlessly moving an on-screen tile back and forth. But the first time I saw it, it was fairly mind-blowing, monochromatic though it was.

Fast-forward to today and sci-fi movie UI is nothing short of jawdropping.

In the theatre we see it flash across the screen in too-short instances that never give us the time to appreciate them. But thankfully the motion graphics houses that create them turn them into "sizzle reels" readily found on YouTube and Vimeo, where we can freeze-frame them and pore over them at will. Here's Territory Studio's stunningly beautiful Guardians of the Galaxy interfaces:

What's also interesting is how they're able to vary their style from movie to movie. If you look at Territory's UI work from another film, Prometheus, you can see how much more organic, almost healthcare-based that work looks. Even in scenes that don't have a medical nature, the aesthetic resembles something out of a futuristic hospital:

The other thing I find satisfying about Territory's work is how chunky the designs look. If you're not sure what I mean, look at the UI designs in Ender's Game, done by The CG Bros; something as simple as their far thinner line weights give it a much more elusive, gossamer feel that I find more difficult to parse:

Of course, the best-known fantastical UI designs for the latest generation of moviegoers is probably the gesture-based computers Tony Stark uses in the Iron Man films. I think their on-screen power comes from the fact that they're not sitting on glass rectangles, nor do they exist in sci-fi settings; instead they're cast in recognizable settings like modern-day offices and shop spaces—and made to flood these spaces, their total immersive power reflecting Stark's immersion in his work:

While that clip was a watchable sub-three-minutes, for those with the time, there's a longer 17-minute clip here.

And I take back what I said about Minority Report and the Matrix films being the first motion graphics UI designs I remember in movies: How could I forget the Terminator's red-hued heads-up display? An entire generation of software-using moviegoers has not; as you can see, tons of folks have endeavored to recreate "Terminator Vision," using Adobe AfterEffects, here.

3 Comments

The 'moving tiles around' interface actually makes sense in a traffic control situation: Those tiles represent things like craft and/or clearances and you are 'moving' a craft from the main inbound lane to 'Holding Pattern C' and assigning it a birth at 'Terminal 2' once a landing slot becomes available.

While these are all slick and appealing in a certain way, they all traffic in the same tired tropes of 'future UI' that we've seen countless times before. Over the past 40 years, the constant trend in UI has been to get brighter, simpler and less technical. Why then does 'future UI' keep getting darker, and more complicated--awash in meaningless charts, lines and numerical readouts?

'2001' was one of the few movies to take this contrary strategy, and it holds up better than almost any sci-fi movie since. Recently, Spike Jonze's "Her" also thought more deeply about these trends. Presciently, the computers in 'Her' look and act a lot less like, well... computers.