I’ve spent some time thinking about why these Fantasy UIs are so fascinating despite the fact they seem not very user friendly.
My conclusion was that fantasy Interfaces are very much like the early web. Lots of moving parts (dancing banana gifs) and you had to figure out the navigation on each website you visited. Today, everything looks and feels the same and we lost the creative spirit of interface building.
Figuring out the interface might not be best practice. But at the same time, I remember sharing websites with friends purely based on how fun the navigation and overall controls were.
We lost the Art of interface building and turned it into a complete science. There are arguments for both sides.
My wish is that... Hopefully.. one day, someone will contact us with a project that allows us to build the first fantasy UI for a real-world SaaS product.
It was turned into a literal science by Xerox, IBM, and Microsoft (through the 90s) that involved actual study of the human body, perception, haptics, material science, light, psychology, human biases and preconceptions, holistic purpose, advances in micro mechanical engineering, usability studies, panel testing, and actual research (for just one example out of thousands, read the story behind the creation of the trackpoint [0]). Then different types of people wearing different hats became involved in the decision making process and the target consumer base shifted in a certain direction and “science” didn’t cut it any more.
Modern UI/UX is absolutely not driven by any science apart from sales conversion rates.
Is also a big contributor to this field.
Fantasy UIs are often flashed up as eye candy to communicate high complexity for power users that an outside observer (i.e. movie viewer) can only dream of properly mastering yet still able to grasp the "key message".
They could (and for hacker movies, sometimes do) just use a command line, but then it's hard to convey what they're doing to an audience. For a similar reason, important text in a fantasy UI is impractically large, so it's visible when the UI itself is only a fraction of the movie screen.
In the realm of VST/AU plugins (virtual music instruments and effects), the art of interface building is alive and kicking, and the different interfaces add (a) to the excitement, (b) to be able to differentiate quickly among dozens (or 100s) of different plugins you use, (c) helps test/create novel interaction ideas...
Here are example VST UIs:
But also there are a few which are remarkable: the 3 synths from Madrona labs, the prosaic and convenient UI from Valhalla's plugins, up to the complex patchbay interface of something like VCV Rack, for instance.
VSTs balance a number of interesting perspectives in their UI. They are facing a very challenging domain (audio synthesis, analysis, manipulation in creative and often real-time interaction), have a complex user base (ranging from pros who really would prefer to be using their actual rack effects, to audiophiles who are pretending they've got a garage of classic synths, to modern electronic musicians who are digital natives), and have essentially zero strong UI non-skeumorphic conventions (knobs, sliders, presets, A/B switches, modules).
It's totally the wild west of UI.
https://www.fabfilter.com/products/pro-q-3-equalizer-plug-in
Upon opening, it displays an empty field with a live frequency readout of the sound on the channel. You can click anywhere in the frequency range and it generates an EQ/filter node underneath your mouse. It's as easy as thinking about the aspect of the sound that you want to alter, and immediately having your tone-shaping underneath your fingers. You reach out and grab it.
It's most-used features (gain, frequency, Q) are all changed by dragging the node or a modifier key (Cmd). These can all be done simultaneously in what feels like a unified gesture. The default filter type is context-dependent, based on where I grab on the spectrum. So if I grab a new node in the sub-bass frequencies it will automatically provide me a high-pass filter to start filtering all unwanted low-end. Ditto for the top-end, shelving filters, etc.
The fine-controls all appear in a secondary window just beneath your mouse that follows the filter node with you as you drag it, so you won't find yourself moving back and forth across the entire screen to tweak controls. When you click on another node the fine-controls appear nearby and the controls for the first node disappear, keeping the GUI empty and very easy to read.
These features may seem simple and obvious now that I've explained them, but an EQ is easily the most-used tool in my toolbox, and FabFilter's design choices have made the process quicker, easier, and far more intuitive than any other interface out there. It really puts a lot of pleasure back into the process that would be reduced fighting with inferior interfaces.
For comparison, most software EQs are either skeumorphic to resemble classic hardware EQs like this:
https://www.uaudio.com/uad-plugins/equalizers/pultec-passive...
or a hopelessly cramped and slow panel with every available parameter on display:
https://www.waves.com/plugins/h-eq-hybrid-equalizer#h-eq-hyb...
I cannot praise FabFilter enough for the elegance, flexibility, and musicality of their products.
I suggest you make a concept of fantasy UI for a real-world SaaS product, and make it so good that somebody would want it. Put it on your website, post it to HN. Then your wish will be fulfilled in no time.
On the other hand, it could be a much more difficult task than you imagine.
Most SaaS problems are boring as all hell. Move some files around, ensure legal compliance, leave an audit trail. Good luck making that shit epic.
These designs all have quite a bit of 'hair'. There are some basic functional elements and then, like a salad, it is garnished with all those numeric registers and shifting rulers, and linear elements.
Since you are a designer, I'm sure you've had those moments with a wip composition that has all the visual metadata still visible and possibly found it more 'visually exciting' than the final cleaned-up product. Same thing happens with architectural design drawings. The 'compact/minimal intensity' of a conceptual sketch is, imo, partly due to the fact that relationships between elements are more explicit in the early stages and the composition feels more 'dynamic'. Same design in final form will simply not evoke the same emotional response and is rather 'static'. (my take on this.)
But...from a consulting and a developer perspective, the marginal utility for increasingly artistic and engaging UI seems to be fairly low from a cost/ROI perspective. If you could figure out a truly compelling reason to spend 100 more budget hours to build that cool doodad and make it work across 100 devices and 10 browsers, great! But truth be told, it is already hard to build interfaces with moving elements that work across the 57 iPhone screens, 60 Windows screens, 10 browsers, well you get my point...
There are still many mind blowing projects out there with cool interfaces though...we did not lose the art of interface building. It just isn't where you are looking for it.
This is exactly the problem. The artistic part of design is gone and turned into another utilitarian measurable. The same thing has been happening in architecture, designs getting simpler and more usability focused but they held on to some kind of artistry better than web designers. When we design a building people are happy to spend a little extra to make it beautiful but not so with websites.
Is it possible to somehow let the end user design a ui/ux that works for them?
If only... Most modern companies seem to ignore any kind of science and thoughtful consideration of their UIs. The only considerations seem to be: (1) looks good on screenshots, and (2) is modern (for some arbitrary definition of modern). The only "scientific" tool they emply A/B testing, blindly and massively.
Look at some reports about beta testing for Windows 95 and you'll see how far we've fallen.
Which optimizes for metrics that aren't beneficial to the end user.
Imagine what a non programmer thinks when they see a programmers dark text editor. Thats the same feeling most people get when they see data viz on a dark BG since it’s so uncommon.
How about they are just beautiful? Aesthetically pleasing? We don't have to overcomplicate things.
Complex-tight layouts will feel cluttered to people who have more difficulty with differentiation, visually processing contrast - or aren't motivated/driven/interested to understand what they're looking at. If you can expect the audience who needs to learn the interface will be motivated to learn it, then it can work.
I've had similar desire to see higher quality, more complex "fantasy" UIs and I could see parts of projects benefitting from such an interface - however I'm a long way off from having the funding and experimental budget to move in that direction. Maybe I'll be blessed enough that it can happen in 5 years.
Your best bet is to build internal tools. Interfaces aimed at consumers have to be appealing to the broadest market possible, which severely restricts how creative you can be and how much you can expect your users to learn. By contrast, internal tools have an expert, captive audience. As an added bonus you have direct access to your users, which makes it a lot easier to get feedback and iterate.
I agree, but I think there’s a bit more to it than that.
An extremely condensed history of software UI design might look something like this:
Programmer UIs
Designer UIs
Semi-automatic, data-driven UIs
Eventually we responded to that problem by bringing in more expertise in related areas: usability and accessibility, graphic design and typography, and so on. People started thinking more explicitly about information architecture and the flows a user would follow as they navigated an interface and overall a more task-focussed and user-friendly style of UI. Both the look and feel and the practical operation of systems became much better. IMHO, this was the closest we’ve experienced to a “golden age” of UIs so far.
The big problem with that was that doing those things well did require all those other skills, which weren’t native to software developers and didn’t necessarily translate in an obviously quantifiable way to the financial bottom line. With the arrival of CSS3 on the web and flat design as a trend in desktop and mobile OSes, suddenly programmers could make UIs again. Import some glorified stylesheet that gave you a colour scheme and some basic layout and typography, throw in a few rounded corners or font weights for street cred, and you never need to hire anyone with real design skills again, right?
Around the same time, the use of telemetry in software and tools for testing multiple variants of websites in real time were gaining popularity. Now the programmers didn’t even have to make a subjective decision about what colour to use for their action button, because The Mighty Data would dictate such things.
Somewhere around there, much of the industry lost its soul, and much of the software we produce just became bland, homogenous, heavily instrumented mediocrity. It didn’t look interesting and, to add insult to injury, caused a regression in ease of use as well thanks to some glaring usability problems with the popular visual style of the day. And while it’s certainly true that the increased use of hard data rather than subjective personal preference has its advantages, it will only ever tell you some numbers that compare designs you already have. It can never tell you that all of your designs really suck and you should start over with a different concept, only which one sucks 17% less than the others.
The most unfortunate thing, to me, is that with the technologies we now have routinely available, we could do so much better, even in a lot of everyday business software. If a picture is worth a thousand words, what is the worth of a system that lets you interactively explore your whole data set, freely swapping between a range of different textual and graphical views that are relevant to whatever problem you’re interested in solving, combining or filtering your data to focus on areas or relationships of interest, highlighting patterns or outliers that might be important, all while the user experiments with different changes to see what the results are, before sharing all of that in real time with colleagues around the world who have been doing the same thing so everyone can decide which ideas are worth acting on next? And sure, go ahead and add some distinctive and pretty graphics to make it enjoyable to use at the same time. If the rest of the system is well-designed, this shouldn’t hurt, and we used to understand that building a brand image and engaging people using our stuff had value of their own.
Of course, no A/B test is ever going to tell you how to do anything like that in any particular application, and your average programming specialist isn’t going to offer the best ideas either. If we want to build UIs that are powerful, easy to use and perhaps even fun, we need those creative types of thinking and those other design skills too.
My impression of most of the user interfaces we encounter on the other hand is that they are build for the lowest common denominator and much of what the previous poster called "the science" is about how quickly the "on boarding" works, so how quickly someone can do a certain task when they are not familiar with the interface.
What seems to be never tested is, when people are very profficent, how long does it take them to do tasks. I understand why that is the case, it's much easier to do a quick study with some new users to test out a UI, but to design several UIs and then let people become very profficent with them first (possibly taking months) to then do a study comparing the interfaces is much more involved. So instead we extrapolate from the novice user studies to advanced users.
It took a ux expert "some time thinking" to realize these fantasy UIs are not not UX friendly.
I think that answers your question. These UIs are not meant be usable. Who cares about the UX of them?
Now translate that to us trying to show a future design or a more advanced but ancient design than what we have today. You could go minimalistic and it’s just a bunch of blank buttons and the operator just knows what they do. What a piano might look like to someone who isn’t familiar with pianos. That can have a certain type of appeal, but if your intention is to show the device as both advanced AND important, then it’s a big challenge to make the UI stand out. You could also make the UI baroque with unnecessary embellishments to show that it is so fancy and advanced that it hasn’t reached the point of mass production where economic forces would have dictated that it be simplified. Why have a holographic display that just renders a swirly button when you can have a simple push button? Well, because we are going all out creating this singular object. It’s a way to emphasize the device.
I think The Martian had some very cool UIs because they managed to walk the middle road: they seemed like they were actually designed for function but were also clearly more advanced than what we use today. But by that metric they were also much closer to what we have today.
Another factor to all this is that UI is dictated by its medium. What kind of hardware can we use for UIs? Well so far we have physicals dials, buttons, toggles, and switches. We also have touch screens. In more of the real of sci fi we have motion capture and voice interfaces, both starting to slowly be adopted as the cost comes down. And in the pure speculative we have things like holographic interactions, nanobotic renderings, and a broad category of telepathy (that last one is really good for stories about the hero simply learning to believe in themselves because long training is for suckers). But how many types of materials and devices and materials have we not yet discovered? Ones that could be used to create a UI in a completely novel way. Maybe it’s a blood contrast that gets injected into your bloodstream and makes it easier to track your motion precisely. Maybe it’s magnets or RFID chips embedded in your fingers that allow you to interact with a theramin type device more intuitively. Maybe it’s direct to retina projection that an outside observer can’t even see. Maybe it’s a smart UI that is programmable ahead of time and it’s activation is simply timed. Maybe it’s something that reads its inputs by facial recognition and emotion detection. Maybe some material that once our hands are coated in it can make them feel whatever physical controls are supposed to be there without having to pay foe them to physically manufactured.
The point is that as long as fantasy UIs are going to be constrained to only a few mediums, the only way to set them apart is to make them either super fancy, super grungy, or super minimalistic/magical. Making them utilitarian and usable makes them look contemporary.
Ever try using a transparent UI? It's absolutely maddening.
Looks cool on the screen, but is pretty much unusable IRL.
https://www.pushing-pixels.org/2016/01/21/a-window-into-anot...
I think they'd rather bring you into the world by showing the UI and interactions while also showing the actors. With a opaque device, we know they're using it, but we don't get to see any detail about it. And a camera angle behind the actor that shows the UI can be awkward. So I think it's really just a compromise to be able to show the UIs, interaction, and the actors from the front at the same time.
I wouldn't ever use one for privacy, and I think the only realistic way transparent devices would be useful is if they tint the glass so it's maybe 50% opaque.
Or how you can be in a room full of people, but for some reason the holographic display only works for you. And good thing all you want to do is pan and zoom, because that's about as much expressivity you get. It would be hilarious to have a scene where they struggle to get it to work, a future equivalent of "Can everyone see my screen?"
>Goodbye privacy
Why would the designers for the show spend anytime about that concept, the state of privacy protection in a future fictitious show is not core to the storyline, ratings, and chance of the show being renewed.
Wound up constraining what desktops you could choose, and how you had to set up your terminal colors. And since I prefer dark text on a light background, it didn't work for me from the beginning.
I imagine those programs still have those settings, but I don't see that behavior in screen-shots of programs any more.
Of course, a second monitor can do this too and without the downsides, but sometimes you're away from your desk and it's a nice workflow.
Hmm, I guess I don't do this anymore. Since getting giant 4k TV/monitor. So, guess it had use in constrained screen realstate times
Functional transparency example would be AR. For example navigation or car HUD on computer aided glasses.
https://www.youtube.com/watch?v=w-tFdreZB94
https://www.youtube.com/watch?v=a6cNdhOKwi0
To me, what makes these fantasy UIs compelling is that they are usually extremely context-aware and content-aware. We haven’t quite worked out how to make real world computers work that way yet.
We’re still very much tied to paradigms that are ultimately easier for the computer (apps, windows, menus, files) as opposed to things that are natural to humans. If I have one hope for ML, it’s that hopefully it will bring some context-awareness to computing so that the content becomes the user interface.
A vast virtual plane that you could scroll and zoom around, drag your files/content around, make groups with marked delineations like a map. Obviously there would be some kind of grouping and minimap if you zoomed out enough. Documents should be represented such that you would simply zoom into them to access their content, you wouldn't open files or start applications, everything would be represented visually and the editing tools you need would be presented as you zoom close enough. A document would be represented as pages you could flip through or spread out for a larger overview. Videos could be simply viewed or spread out into frames/segments with editing tools.
Content would not be a "text file" or an "image file", it would just be a delineated piece of content, which you could add whatever type of content to, by calling up the relevant tools.
There would be no discrete applications as such, just content and flexibility, I want it to be seamless and integrated. In some ways similar to UIs seen in Minority Report and other sci-fi movies, but without the Hollywood flash and gimmickry.
I'm aware that there are a lot of complications and practical limitations, but it's an idea I've toyed with for a while, and I'm not sure I've seen people really attempt something like it for practical use, only bits and pieces.
Apparently those businesses are doing OK providing that kind of SaaS, even though the things you can actually do on their boards might be much simpler than what full-power desktop software or more specialised SaaS can offer. And this does make sense: once you can put basic text and basic drawing in some sort of freeform layout and share that display with others remotely, you already have a useful collaboration tool.
Providing built-in support for more sophisticated visuals like tables or specific types of diagram might make things more efficient, as could making good use of shortcut icons, gestures, hotkeys and so on. However, these are incremental improvements. They might bring big improvements in productivity in some cases, but they’re still helping to solve the same fundamental problem in the same fundamental way.
So it seems that at least some developers are already experimenting with the concept you’re suggesting, if only in a relatively simple form so far.
The heavily personalized ads the main character encounters are interesting as well.
I don't have much to add except that I wonder why something similar hasn't been done already? I mean, it's an UI that works fine in RTS games, so why wouldn't it work for application windows?
In RTS games you have keyboard shortcuts to return to your unit groups, bases etc to mitigate that, but there you're supposed to jump between points of interest while for general use you tend to keep the same point of interest for a long time...
There’s a sci-fi element but very much grounded in current day technologies so it’s the furthest thing away from the typical Marvel FUI.
One of the hardest challenges is making the UI “read” in film - that is getting the point of the action across while trying to remain truthful to some sort of sense of functionality. Oh, and also making it look interesting and/or feel original :)
Here’s an unused direction for that “call center” UI based on NeXT/Win95- I’ve actually since shifted to something quite different (more of a backend web app feel from the mid 2000s I’d say) for the final look but still thought it’d be fun to share this initial glimpse:
https://twitter.com/ftrsprvln/status/1336366361635786752?s=2...
I've been compiling visually interesting/fantasy computer animations for youtube videos made with pygame.
So far I've found
1. Matrix Effect
https://gist.github.com/MrKioZ/c07b9377d20bab53af6ebcdfbdeab...
2. Star Field effect
https://codeboje.de/starfields-and-galaxies-python/
3. Earth Animation
https://makersportal.com/blog/2018/8/16/rotating-globe-in-py...
https://www.pushing-pixels.org/2018/04/05/screen-graphics-of...
There are meaningless percentages with silly labels, animated histograms, so much useless movement, scrolling nonsense, and sometimes even a world map, blinking stuff -- all crammed into one screen. And best of all, the useless extra data is often rendered extra useless with a font size that is too tiny to read without a magnifying glass.
There are movies with nice, (semi) plausible fantasy UIs too! For example, The Midnight Sky (damage assessment, map views etc.), Chappie (firmware upgrade, policebot PoV, etc.), Interstellar (flight controls, robot "debug" displays etc.).
Star Trek LCARS screens have been generally well thought of, but not always. There are weird numbers and "display nonsense" here and there. But, I can believe a starship could be steered with such a touch UI with clearly distinguishable big buttons and clear separation of functions.
There are probably two categories:
- UIs that are live on the set, and the talent interacts with them
- UIs that are added in post, so essentially animated clips that align with the on screen action.
Adobe After Effects come to mind for the 2D UI. {{3D app of choice for the 3d visuals}} Not sure what else are used for these output. Would be crazy if some of them get built with common web technology.
It created "fantasy" UIs that actually worked.
Some were pretty cool.
Most were completely unusable.
There are a ton of videos to watch. Does anyone know offhand what tools are used? Or if there are good select videos to watch?
https://www.youtube.com/watch?v=AItTqnTsVjABut another factor was that the change was just to deep of a cut, and the world was just not ready for it. People were overwhelmed when they were expected to suddenly use magic corners and gestures instead of clicking a button. If it would have been a slower change, it might have worked out better.
In fact it is not as bad as it sounds, if you can filter out the presentation form over contents.
For me it was worth watching, as he makes really strong points, resonating with my expectation about UI.
I do not think he has this in written form.
Proof:
https://www.deviantart.com/xevz/art/FVWM-2-5-14-X-org-6-8-2-...