I'm building my personal website[1] also inspired by FUI design systems. I don't think usability is an issue at all, at least with the design approach I've taken. They're just React components which you could easily feed real data. The visualizations and animations are more difficult to replicate.
Thank you for the memory of 2adv. I spent a significant amount of time in high school reverse engineering their SWF file to understand how to do animations like that in flash.
The only problem I have (on laptop) is the font combined with the text size (10pt) on the blog is a bit on the smaller side. I recommend bumping up the font of the body to at least 14pt to increase readability for most screens.
Arwes is about 20% too over the top for me or I would really be tempted to build something in it.
But the style ofyour site is almost exactly what I want. Are you open sourcing your component library/styling by any chance? Also, what does 'FUI' mean in this context?
Why? React’s component model can be an excellent abstraction for building a “normal website”—or rather, its component parts—for developers who prefer it. React can compile to static HTML, without running any JS client side, and/or can be used to mount or hydrate arbitrary subtrees however one sees fit. (I’d probably favor Preact or Solid for the latter, but React is a perfectly cromulent choice)
Rendering to static HTML is actually pretty common. Admittedly, hydrating subtrees is fairly uncommon (at least where the full tree is also rendered by React server-side), but it’s well within the “happy path” and both patterns have been heavily promoted by React from very early on.
What’s not within the “happy path” is automating any sort of partial hydration process, which is unfortunate, but it seems pretty likely RSC is going to subsume that use case for most anyone trying to solve it with React.
What would be the right tool for an entertaining highly interactive and animated (game-like, but still mostly text based) thing then?
Used to be Java applets and Flash. Now is "webapps" and WebGL.
Or is that it should have been handrolled using CSS animations and framework-less JS?
Or is it more that we're acting like it's 1995 and the web is for reading text documents only, and anything other than that is nerd blasphemy? (Not saying you're saying this, but it is something some still press; they hate the web stack being used in other ways).
This is what early internet thought "the future" looks like for the web. I am wondering why there isn't design diversity (not using the sociological meaning of the word here) for forward-looking web technologies? Somehow the conversation typically centers around AR/VR or inserting crypto into everything. VisionOS is stereotypically "clean and modern". Web design in general seems so derivative and uninspired, which is strange given that a web page is the main point of interaction for most people.
When flat design started to become a thing I was very excited. It was beautiful. But then EVERYTHING became flat and now I’m extremely bored.
Just recently I started using reddit and stumbled upon the old version of the site. Look at this subreddit, it’s absolutely gorgeous and goes very well with the theme of the discussions:
If we were speculating what UIs will look like in the future and came up with something good, why wouldn't we just do them right now? As soon as you do it's inherently no longer "the future."
UI isn’t just a theme. I can imagine a lot of different UI paradigms that either aren’t possible today or just aren’t practically feasible given development constraints.
Minority Report and iron man I are the classic examples, IMO. Interactive holograms, 3D immersion, etc. can’t wait for this era!! Coming soon, it seems (with the “giant heavy headset” caveat)
Unfortunately, it turns out that waving your hands in the air for long periods of time is exhausting. UIs that look great in movies sometimes aren't practical in real life.
I think the Minority Report ui is technically possible but you might need an OS level rewrite to handle it, Iron Man is pretty much regular sized light headset although with voice activated controls that work!
A lot of alternative visual designs run into problems with the technical realities of modern UI tooling. I'm going to talk about web tech, but Android layout works largely the same, last I checked (one trillion years ago, to be fair).
The futuristic UI look that Arwes is doing comes with a whole lot of animation, which is very cumbersome on the web. The CSS transition property is good, but it works on a very narrow range of properties, and anything involving inserting/deleting/adding elements needs a whole song and dance to trigger the animation then go clean it up when it's done. You can do it, but it's a whole lot of extra work.
Most other stylized looks involve big chonky stylized borders and background graphics. But we generally want the same style to work on mobile, and the chonkier your borders, the harder it is to cram it into reduced space. (Also CSS still doesn't have native 9-patches for some absurd reason. It used to be how everything was done, until the world agreed to stop abusing tables.)
Meanwhile the modern flat look is easy to implement in CSS and doesn't have any trouble scaling down to mobile. And it's still a good enough look, it'd even be kind of striking if it wasn't ubiquitous.
Because it doesn't serve much practical purpose. Uniquely designed websites take much more effort (and cash for companies) to create, and they look cool, but they are much harder to use for the average user
It's fine for things like advertisements - I've never gone the website for a movie but I imagine this is what those websites should try to be. Is it worth the effort?
If you're trying to make a website people use it's not worth it
> This is what early internet thought "the future" looks like for the web
And years later we got mobile-style interfaces and designs that are present on almost every device we interact with. Big elements where sometimes it's impossible to tell the state or even distinguish link from informative text - things which are often utilized in dark patterns tactics
Arwes feels pretty well done but rather from a period somewhere between 2005 and 2012, rather than "the future" but it is ofc done in a futuristic style
> Web design in general seems so derivative and uninspired
The people paid to make websites have instructions to build them for the broadest audience possible. Websites are commodities first. You wouldn't expect a pamphlet at the doctor's office to have a particularly avant-garde design.
Now that doesn't mean that we can't have more design variety for websites. But unfortunately, websites are not seen in the same way as other forms of art like video games or movies, where veering from the norm is encouraged. Additionally, the death of Flash and GUI-based web tooling in general means that the people capable of building complex designs like this have formal training in writing code. And people like that usually are not building sites for novelty use cases.
There is design diversity, but you're just not going to find it on mainstream sites or apps because they're catering to the everyman. When that occurs, you're tossing away novelty for a sense of expectation.
Much in the same way you can find a variety of art but the majority that gets attention are hyper-realistic works. It's just easier to understand for the everyman.
The future looks there comes in dark aqua tones and chirping noises when information scrolls up and down. The effort reminds me of Star Treks LCARS https://www.thelcars.com where orange blue and purple are prominent and is all touch screen. The future can be very distracting.
Windows 8 and Windows Mobile embraced this aesthetic, and I thought it the best mainstream UI we've gotten since the 32-bit era. Everything resolves back to a straight edge, because computer screens are largely square, not round. Every object has a bold, flat color so you can easily and immediately identify it. And the background is matte black. None more black. Windows Mobile on an AMOLED display was a thing of beauty. It's too bad the design regressed in Windows 10 before proper dark mode was released for desktop, because by the time we finally got the clean backgrounds that would really make stuff pop outside the start menu, they'd already ruined the whole UI (including the start menu).
Of course this latest Windows feels like Microsoft designers have fallen completely into Mac OS X redux, which to me makes computers look like some kind of ridiculous hand-carved artifact from antiquity instead of the modern, practical tools they are. Alas, what could have been.
Thank you for this walk down memory lane—2advanced was a huge inspiration for me when I started web design and learning flash, but I couldn't remember the name of the site until now. Their 2003 design is burned into my memory.
Yes! 2advanced served as an inspiration. I remember surfing it in awe of what was possible to do.
The quirkiness of the web has been somewhat lost. However, I do wonder whether that is just a factor of its expansion and whether somewhere in the depths it still lurks, waiting to be uncovered.
I’m glad that they include pictures of apps that have been made with it. I would appreciate it if there were more sample pictures, but at least there is something included.
Too many GUI and other graphical projects fail to include any images or screenshots, which is poor marketing.
I clicked straight on the first example of a real website that uses it, and, surprisingly, I really like it: https://soulextract.com
Normally I'm a "no nonsense" kind of guy for the web, actually preferring plain text as much as possible, but for creative/artistic stuff, it's different. It reminds me a bit of the extravagant flash sites of the early 2000s. Playful, and all the whimsy is part of it.
I even like the sounds this website makes. You'd think it would be cheese, but here it just works?
I really wish we had more interesting and functional examples nowadays - the web is bloated anyway, why not make more elaborate use of that bloat? Here's another example, albeit just a singular art project:
There's still no replacement for the specific thing Flash did. I get that Flash itself sucked (the power use...) but it's really damn sad we simply lost what it could do. I'd have thought we'd have a replacement by now, but no.
Incidentally, last I checked, no replacement for the marquee tag, either. That tag had a lot of features, in fact, and when I looked a couple years back there seemed to be zero projects that could actually replace it completely. A bunch of things that used to be very easy to accomplish, using that tag, now aren't. (now, maybe none of those things should ever be done, I suppose, so perhaps it doesn't matter)
What people forget is that web browsing in general sucked on the earliest mobile devices. Remember the mosaic tiling Safari would show if you tried to scroll the page faster than the browser could render it?
Taking that into consideration, Flash worked pretty damn well on Android. It wasn't doomed because of its mobile inefficiency. It was doomed because both Apple and Android knew that they could never convince developers to build for their 30% tax walled gardens if Flash remained a fee-free alternative on the open web.
Yup, building an interactive website in Flash and then being told to do it with "HTML5/CSS3" is like going from a laser rifle to a musket and gunpowder.
On all of those but especially the second two you can really see the influence The Designers Republic had on pop culture and graphic design in the late 90s and early 00’s.
It's funny how this still feels "futuristic". I'd argue sci-fi, or retro-punk (retro-sci-fi?).
The elements of design are those from the past about the future, like 80s sci-fi movie design/tropes that became stuck with the genre, along with beige CRT monitors and large floppy disks.
It's also just good UX. A lot of the web today ignores browser defaults, so when you click on a link, there is no visual indicator that you clicked it, like a link color change.
We just don't notice/care because the page usually loads quickly enough.
yeah it's interesting how the visual cues for what would give people the impression of something being futuristic have mostly settled into certain styles even as we move forward in time. what could be the possible reasons for this?
A lot of it is driven by media (movies, games), and falling back to a known style is easier than coming up with something new, which reinforces the style. Whereas if someone comes up with a new flavor, it might not even read to the audience as "futuristic", even if more thought went into it. And coming up with something that's not just a skin on tranditional designs is really hard!
could one argue AR designs should be considered more futuristic?
Fake movie UI also is not driven by the same concerns as real-world UI. It's usually much more a flashy center-piece and then just stuff around it that doesn't need to mean anything, because it's not actually intended to be read like a real UI is.
I yearn for a frosted UI which has chilly condensation which shifts around the edges. Something from TRON but mixed with John Carpenter's 'Thing' vibe which white, blue & other nordic colors.
Oh, this is pretty awesome. It looks like these old scifi browser games.
I often use exotic frameworks like TuiCss (DOS-like) and 98.css (Windows 98-like) for private projects and this framework looks perfect for it-security projects with clichéd 80s flair.. or a low-quality sci-fi mobile game.
This seems to be a thing in anime and movies. It dates from the early 1980s, when displays were mostly green. Fiction needed something different. It also works well for see-through displays which allow the audience to see the actor's face.
On stuff you actually have to interact with, it's more of a cliche now.
Perfect for building my next homepage! I'll start off with something simple, maybe add an under construction gif or two to ensure people know content is coming soon.
[1] https://x7ci.engineer/