[HN Gopher] Arwes - Futuristic Sci-Fi / Cyberpunk Graphical User...
___________________________________________________________________
Arwes - Futuristic Sci-Fi / Cyberpunk Graphical User Interface
Framework
Author : keiferski
Score : 950 points
Date : 2020-08-26 13:31 UTC (9 hours ago)
(HTM) web link (arwes.dev)
(TXT) w3m dump (arwes.dev)
| dvaun wrote:
| This reminds me of an older sequence of space games titled
| "FreeSpace" that were created by Volition. The interface
| components are very nice!
|
| I might just use this for my blog...
|
| Edit: An additional framework that may pair well with this is
| augmented-ui[0]. That received quite a bit of attention a year
| ago[1].
|
| Putting these two together could make a pretty neat interface! I
| have another project (metareply.net) that I want to complete for
| a smaller community, Subreply[2], which might be a good candidate
| for this as well.
|
| Thanks for sharing this!
|
| [0]: https://augmented-ui.com/
|
| [1]: https://news.ycombinator.com/item?id=20923792
|
| [2]: https://subreply.com/
| solstice wrote:
| Right! Freespace 2 was great and is still being worked on by a
| dedicated community. Here's a reddit thread with a review and
| more info on it:
| https://www.reddit.com/r/Games/comments/9h30rn/why_you_shoul...
| tetris11 wrote:
| the battlestar galactica mod of Freespace2 was phenomenol,
| and the first immersive space game I ever played
| ticviking wrote:
| Cool! that's actually a reason to unpack my HOTAS. Freespace
| was kind of the last great space shooter of that era IMO.
| dvaun wrote:
| I actually used to lurk at hard-light for several years! It's
| a great community with very dedicated people :)
|
| My father and I were huge fans of the Descent series and,
| naturally, took up FreeSpace when it came out. Out of most of
| the games I've played, FreeSpace has always had a unique draw
| to it.
|
| If anyone happens to be reading this thread I definitely
| recommend picking it up on Good old Games[0] if you feel that
| you have the time to spare. It's best played with a joystick
| and is very immersive.
|
| [0]: https://www.gog.com/
| vijayr02 wrote:
| Absolutely seconded!
|
| Try out the knossos [0] front end to install the FreeSpace
| Open mods. 4k support, up-ressed textures and one of the best
| single player campaigns ever! And there's a bunch of user
| created campaigns that rival AAA games [1][2]
|
| [0] https://fsnebula.org/knossos/
|
| [1] https://www.kotaku.com.au/2019/09/get-freespace-2-for-
| free-t...
|
| [2] http://coin-drop.com/freespace-blue-planet-masterclass-
| video...
|
| [Edit: you do need the commercial Freespace release to get
| the most of the mods. Get it from Good Old Games]
| kthejoker2 wrote:
| Reminded me of the UI for the questionnaire on Spaceship Earth at
| Walt Disney World
|
| https://youtu.be/qFsd4xJKLEQ?t=702
|
| Very cool!
| petepete wrote:
| It's very similar to the UI from the game Frozen Synapse.
| shuringai wrote:
| too bad it's abandonware
| bufferoverflow wrote:
| It might look fun for a couple of minutes, but it's extremely
| annoying for the real world use.
| runawaybottle wrote:
| How so? On mobile swiping between pages felt very seamless and
| a well executed transition. That by itself is something most
| appy sites barely get right.
|
| Still checking it out, but at first glance it's obvious this
| person gets the details right.
| bufferoverflow wrote:
| It's slow. That alone is extremely annoying.
|
| The high-pitched noise every time you click on a link will
| get old very fast.
| VectorLock wrote:
| The zeep zoop sound with practically every element
| interaction, for starters.
| xwdv wrote:
| This is great if you're building a web page as marketing for some
| sci-fi game or movie.
|
| Don't use this for a real application. Real as in used for making
| _real_ money.
| asadlionpk wrote:
| why not?
| anonyfox wrote:
| I basically want this but in pure css. Highlight aesthetically
| pleasing!
| [deleted]
| ikealampe200 wrote:
| Looks quite a lot like StarCitizen
| (https://robertsspaceindustries.com/)
| ivanceras wrote:
| This is so cool. I made a simplified version[0] of the frame
| component using only plain html,css,js
|
| [0]: https://github.com/ivanceras/futureostech
| dusted wrote:
| Looks beautiful. This is probably the first time I've seen a UI
| framework for web that made me want to actually do something
| _ANYTHING_ with it (short of using it for my own site, for
| idealistic reasons).
|
| Some cyberpunk sci-fi online game... now I have to make one.
| mikepurvis wrote:
| Yeah, I'm getting serious Uplink vibes here:
| https://en.wikipedia.org/wiki/Uplink_(video_game)
| emteycz wrote:
| Ha! I completely forgot I played that. But yes, this is what
| the framework reminds me of.
| badrequest wrote:
| > This is probably the first time I've seen a UI framework for
| web that made me want to actually do something _ANYTHING_ with
| it
|
| I felt the same way! I wonder if there are other frameworks out
| there that elicit this response.
| jmnicolas wrote:
| For the love of God will someone think of the people that don't
| have fiber internet ?
|
| The carelessness of most web devs is infuriating. Don't you care
| that a not insignificant portion of potential users / customers
| will just close your website after waiting a few seconds as
| nothing happens.
|
| To the author that thinks he's making the world a better place
| with lines of code (written on his GitHub), then walk the walk
| and actually make it a better place for everybody.
|
| Thank you.
|
| The irony that tomorrow a technician is coming to install fiber
| internet to my home is not lost on me.
| minimuffins wrote:
| I'm sympathetic to this way of thinking but I'm not convinced
| this is a real instance of web bloat. I didn't measure files or
| anything, but I have a pretty terrible internet connection and
| didn't experience any discernible latency.
|
| Don't give up the good fight but maybe spare this poor guy and
| point your righteous indignation at the truly deserving.
| rpdillon wrote:
| I'm confused - the code for the landing page is about 690k,
| with a 760k background image, and the code for the "Play"
| section is another 333k. Are those the sizes you are thinking
| of when you mention fiber internet? I've never had fiber
| internet and the site loaded very well for me. Is there
| something I missed?
| prix wrote:
| You must be fun at parties - I would enjoy your icebreaker on
| how to not make the world a better place.
| njsubedi wrote:
| The author of the project seems to have built his personal
| website with this framework, and it looks perfect!
| https://romelperez.com/projects
|
| Like everyone else said, it's really one of the very few
| frameworks I wanted to build something on top of as soon as I saw
| it. Thanks for sharing!
| ahpearce wrote:
| Looks like you can even throw it on some reveal.js slides?
| Unless he did the slides himself.
|
| https://romelperez.com/talks/javascript-animations
|
| Pretty neat.
| rco8786 wrote:
| This reminds me of 2advanced studios way back when. They built
| crazy futuristic flash GUIs like this.
|
| Here's one from 2001: https://www.youtube.com/watch?v=UHbQmqmmIFk
| nirv wrote:
| Thank you for bringing up the name of the 2advanced studio! I
| tried a couple of years ago, but could not remember it. In
| 2003, their design[1] just blew my mind, they were way ahead of
| their time.
|
| [1] https://www.youtube.com/watch?v=N-2sKZjawq4
| xyzzy_plugh wrote:
| This takes me back. This was a big motivation to learn flash
| and web development as a whole, and spurred a lot of deep
| interest in programming for me.
| warpech wrote:
| 2advanced defined the whole generation of Flash productions
| done by interactive agencies. Every ambitious studio I knew
| admired 2advanced.
| Winterflow3r wrote:
| Wow! I really want to use this! Like some other commenters have
| said, I finally feel inspired to work on some of my website
| projects!
| UI_at_80x24 wrote:
| I really like the look of this. Kudos to the creator. It's
| legible, fast, and doesn't make my eyes bleed from the
| brightness. This is excellence in proper use of contrast.
|
| I'm tempted to use this on all my sites.
|
| Side note: I don't get any audio in Firefox. I had to load the
| page in Chromium to hear audio.
| Zardoz84 wrote:
| android Firefox (yeah, the new Firefox for Android) plays it
| flawless
| skykooler wrote:
| Works fine for me in Firefox on OSX.
| ebg13 wrote:
| > _and doesn 't make my eyes bleed from the brightness_
|
| Some of the frequencies used in the audio do make my ears bleed
| though. :\
| ocdtrekkie wrote:
| > Side note: I don't get any audio in Firefox. I had to load
| the page in Chromium to hear audio.
|
| This sounds like a feature rather than a bug. Website UI should
| not make sounds.
| inetknght wrote:
| > _This sounds like a feature rather than a bug. Website UI
| should not make sounds._
|
| While I usually agree, the sounds that it does make are not
| intrusive. They're only in response to user events (page
| loading/loaded, something was clicked), aren't stupid-loud
| (IMO), are very brief, and don't include any spoken words.
| Think of hearing button feedback in sci-fi videos.
|
| For what it's worth, I'm also using Firefox 79 and the sounds
| _do_ work after telling NoScript to enable Media from the
| site. They're loaded as MP3s.
| tandr wrote:
| worked flawlessly in firefox (80), with ublock and dns adblock
| enabled.
| mikepurvis wrote:
| I have audio in Firefox 79 / Win10.
| SubiculumCode wrote:
| Works for me in Firefox Android.
| williamtwild wrote:
| Reminds me of Ingress. Very well done.
| inetknght wrote:
| Great. Now make it work without javascript and you'll have me
| sold.
| anaganisk wrote:
| Sure, hire him and get it done
| neilpanchal wrote:
| Based on the positive responses here, I think I might be the only
| one who doesn't fancy decorations, whether it's sci-fi or in any
| form in user interface design - victorian ornamentation,
| steampunk brass, vaporware aesthetics, etc - they're all artistic
| endeavors - I think it's fun to explore these and even use them
| to achieve a particular objective, but I wonder how much of it
| influences serious designers whose responsibility is to produce
| functional, objective, straight forward UI that gets the job
| done. For example, SpaceX cockpit design and the amount of sci-fi
| influence with touchscreens vs. say F-15 Cockpit
| (https://news.ycombinator.com/item?id=23702560) which I
| personally consider as the epitome of interface design. Not
| directly comparing them, but comparing the underlying philosophy
| and approach towards UI.
|
| It's not to say that aesthetics itself is a problem, IMO when
| aesthetics emerge automatically from solving a problem (F-15
| philosophy) is far more beautiful, appealing and pleasing, than
| aesthetics that is forced by the designer's personal taste and
| then trying to solve the UI problems within that framework
| (biting on SpaceX again).
|
| Amazing work nevertheless in terms of its artistic appeal.
| resu_nimda wrote:
| It really depends on the context and the use cases. The F-15
| cockpit is an extreme example of a very complex interface that
| needs to be highly performant under intense life-or-death
| conditions. Most UIs that people design, including this
| library, are not meant for anything remotely similar to those
| situations. A lot of times it's mostly for consuming content.
|
| That video of the F-15 actually features a lot of overlay UI
| elements that are very similar to this project's sci-fi style.
| Did you lament that, or wonder if that functional uselessness
| was influencing the designers of the airplane? Or did it make
| for a better viewing experience than barebones labels with no
| animations?
|
| I can't speak to the SpaceX cockpit and how well it performs
| the job it was intended to, do you know of any testimony from
| people who have used it? I have to believe that they would put
| function over form for something like that, but that doesn't
| mean that form has no place either, they are definitely aiming
| for the lofty goal of achieving both.
| rkagerer wrote:
| As a user, I want all my UI's to be just as elegant, purpose-
| driven and performant as whatever best of breed example you
| can think of (perhaps to the point where, like the controls
| of a cockpit, they feel like a natural extension of my body).
| Imagine if all Palm or Apple had strived for was "good
| enough".
| jakear wrote:
| Tesla's have a touchscreen instead of analog controls,
| recently there was a case where a driver attempting to use
| the touchscreen wiper rate changer got in a collision and was
| deemed negligent.
|
| Based on them taking arguably the single most important
| toggle in a car [1] and hiding it behind a touchscreen so
| that when you already are in shitty conditions and you can't
| see, you have to take your entire focus off the road and
| navigate a touch screen interface, compared to every other
| car on the market where you can do it subconsciously while
| keeping your hands on the wheel... let's just say I don't
| think Elon's companies care particularly much about creating
| interfaces that are easy and safe to use if it means
| sacrificing "aesthetic".
|
| https://www.businessinsider.in/thelife/news/german-court-
| rul...
|
| [1] wipers and headlights are the 2 "I'm driving a massive
| hunk of steel at 80mph down the highway and I can't see shit
| I need to fix this immediately" controls, and wipers are more
| likely to be needed at the spur of a moment, so I'd say it is
| the single most important toggle in a car and replacing it
| with navigating a touchscreen seems like it ought to be
| grounds for not street-certifying a car.
| tenuousemphasis wrote:
| I have no experience with the S but I can say that every
| Model 3 made has had light and wiper controls on the stalk.
| ex3ndr wrote:
| Tesla has very convenient wiper hardware button.
| jakear wrote:
| My understanding is that the button toggles enablement of
| the sensor-driven wiper mode. If this is correct, it
| means every Tesla driver is betting their life and the
| lives of those around them that for every instance of
| something on the windshield blocking their view, either
| the sensor will accurately respond to it, or they will be
| able to navigate the touchscreen to activate the manual
| override before needing to react to developing conditions
| on the road. Given the reliability of automotive grade
| sensors (I'm not the only one who has paid mechanics a
| lot of money to tell me the sensor was bad right?) and
| the difficulty of interacting with touch screens, that's
| not a bet I'd be willing to take. Looking at the German
| case, I wish more people were unwilling to take that bet.
| tensor wrote:
| That button causes the wiper to wipe once, no matter
| what. No sensors involved. Yes you might have to keep
| hitting it but you aren't "betting anyone lives" on a
| sensor or UI.
| numpad0 wrote:
| Driver ended up crashing the car, that's the result isn't
| it.
| jjcm wrote:
| "Most UIs that people design, including this library, are not
| meant for anything remotely similar to those situations."
|
| You would think that, but that isn't necessarily the case. I
| worked for a Naval intelligence contractor back in 2007, and
| I was surprised at the amount of times there were requests at
| the top to "make it look cooler". War rooms at the time
| tended to look exactly like the Hollywood depictions. Not
| because Hollywood got it right, but because generals saw the
| movies and said, "I want one that looks like that". Even in
| the most functional of situations, flashy looks sell hearts.
| resu_nimda wrote:
| It wasn't my intent to say that people designing serious
| systems don't like flashy things. More just that a lot of
| UI designers and projects posted on HN are focused on
| lower-stakes applications that can accommodate more
| artistic license.
|
| But, my question is, did that actually make the war rooms
| less functional? In what ways did Hollywood get it wrong
| that they copied? Even a war room is a very different
| application than literally flying a fighter jet, which is
| arguably the most intense and demanding control experience
| in existence.
| ckozlowski wrote:
| Without getting into specifics, this is absolutely the
| case.
|
| There was one instance where, when the new ops center
| opened, getting the tour of it was _the_ thing everyone
| wanted. The brass thankfully obliged. Over a period of
| weeks, small groups got to go over and the new center, with
| it 's large blue display edge lighting, and electronically
| frosting glass. I'll never forget this bemused airman,
| pressing a button while a circle of us stood around in a
| half circle, giving a very Simpsons-esq "Oooooooooohh!" as
| the glass went transparent to opaque, and transparent
| again.
|
| Was it necessary? Absolutely not. Was it cool? Hell yeah it
| was. =D
| neilpanchal wrote:
| Not sure, but it is hard to deny that Elon's personal taste
| in building everything "sexy" has something to do with it.
|
| I think you're delving into the details and you're making
| valid points, I am mostly talking about the philosophy and
| approach in an abstract sense.
|
| It's fine to use this library. Otherwise, the world would be
| a totally unremarkable place. If you consider the central
| point I was trying to make, to re-emphasize is that I wonder
| how much of _influence_ do things like sci-fi aesthetics
| makes in designing serious products [1][2] (I suspect that it
| is widespread).
|
| [1] https://images-na.ssl-images-
| amazon.com/images/I/61cGhQ0begL...
|
| [2]
| https://miro.medium.com/max/800/1*eW4danopMOoMxEr5GBRZOA.png
| resu_nimda wrote:
| I think it's a somewhat orthogonal issue. I think you can
| approach the design of a serious interface with the F-15
| philosophy while also incorporating aesthetic
| sensibilities. Yes, some people may end up designing
| serious interfaces that suffer from too much unnecessary
| chrome (I've heard of a lot of frustration with
| touchscreens in cars).
|
| But I don't think there is anything inherently wrong with
| sci-fi aesthetics influencing interface design. What
| arguments can actually be made against the functional
| effectiveness of that oscilloscope or the SpaceX cockpit?
| numpad0 wrote:
| SpaceX touchscreen don't work under acceleration.
|
| F-15(or any other fighter) can be operated normally at
| -12G to +12G for important or critical functions.
|
| Pretty stark contrast, oh, and Dragon LCD look so blurry
| and washed out for aviation display btw.
| fermienrico wrote:
| But hey, we can't criticize SpaceX UI because we're not
| astronauts and don't have first hand experience. That's
| the pushback you're going to get for saying anything
| against SpaceX's rampant disregard for basic aviation and
| space UI concepts. Just because Doug and Bob doesn't have
| problem with the UI/UX, doesn't mean that it isn't
| terrible.
|
| Another example - the abort handle, instead of being
| painted with a hazard yellow/black stripes or some
| blaringly evident color scheme, it is painted matte black
| just like the rest of the dashboard.
|
| Can you spot it in the center? https://cdn.shopify.com/s/
| files/1/0173/8204/7844/articles/IM...
| neilpanchal wrote:
| The question is the other way around, the onus is on the
| designer that wants to add unnecessary decorations: What
| arguments can be made to support adding of unnecessary
| decorations?
|
| I really like HN design philosophy articulated by @dang
| here: https://news.ycombinator.com/item?id=23199062
|
| Quoting: > Move slowly and preserve things
|
| Everything should be questioned ruthlessly and UI is not
| like fashion that needs to keep up with trends. Although,
| if we are designing a website for a music band, all bets
| are off :)
| resu_nimda wrote:
| _What arguments can be made to support adding of
| unnecessary decorations?_
|
| Because without them, the world would be a totally
| unremarkable place. :) I think there is a lot of value to
| the images of SpaceX astronauts in their sleek suits, and
| the general flair with which they go about things. It
| inspires and excites people, it sparks joy.
|
| I get what you're saying though and I also appreciate the
| functional minimalist design of places like HN and
| Craigslist (I much preferred the original purely text
| GameFAQs forums vs. alternatives at the time that had a
| lot of crazy stuff going on). I'm not saying at all that
| form should step on function in serious UIs but I do
| think both are important and aesthetics should not be
| dismissed or lamented.
| neilpanchal wrote:
| It is also fun to question aesthetic choices for example
| - children's iPad apps - why do they need to use
| "friendly" and "fun" fonts, pastel colors, excessively
| rounded corners, etc? Nothing in human psyche dictates
| that children should be exposed to this particular type
| of aesthetic. I can understand if they're physical
| products and sharp corners for example need to be
| blunted, but there is a _lot_ of excessive decoration.
| Blue /pink color themes with boys and girls toys is a
| whole another can of worms. I don't think children have
| any sort of native affinity for soft and cuddly
| aesthetics - probably the opposite from the evolutionary
| standpoint and developing early survival instincts.
|
| Lol, I am not saying to develop iPad apps for children
| that look like F-15 controls, but the society is full of
| aesthetic subjectivity, noise, prejudices, norms, etc.
| whatever you wanna call it. Some University's psychology
| department should study this.
| cpill wrote:
| Really dude?! Your taking the "Futuristic Sci-Fi / Cyberpunk
| Graphical User Interface Framework" seriously?
| jayd16 wrote:
| "I find running a k8s cluster on a raspberry pi to be
| inconvenient. I prefer a desktop or server class CPU if
| possible."
| medium_burrito wrote:
| I strongly agree.
|
| My ideal for user interfaces would be something where the user
| can skin everything to look like they want it. For example,
| imagine the web browser version of winamp... a page has text,
| images, links, and that's it- the browser displays it according
| to your skin.
| pbronez wrote:
| Isn't this the entire point of CSS? And perhaps Semantic HTML
| as well?
| itronitron wrote:
| It's important to note that most popular 'sci-fi/futuristic'
| styles aren't based on any perceptual studies so may be quite
| bad choices from an artistic viewpoint of the UI itself. In
| particular, blue text on a dark background requires much more
| effort to read than white on dark.
|
| Most of the design choices for UIs in movies are made to ensure
| they fit the overall aesthetic of the movie, and not because
| they are good user interface design.
| neilpanchal wrote:
| Precisely. Those choices (made for entertainment purposes)
| infiltrate into the general masses through insane popularity
| of movies --> into the designer's personal taste through
| exposure since childhood ---> then those designers get
| employed at various medical, industrial, military, etc.
| fields and they try to put aesthetics/taste before everything
| else ---> decision makers in these companies also love it
| because it appeals to their childhood influence and taste too
| ---> sub-optimal UI goes into production which influences
| more designers to follow the trend. We love shiny things.
|
| This strawman is pretty tall and perhaps I am just getting
| old and grumpy :).
| ChrisMarshallNY wrote:
| This is great! Thanks for sharing it!
| Andrew_nenakhov wrote:
| The feel of this interface is incredible. What's most interesting
| is that it evokes lots of memories from the games I played more
| than 20 years ago, and yet it is very distinct and doesn't copy
| any of them. Feels almost like something very familiar, but you
| can't quite grasp where you saw it.
|
| This is incredible and I'll be following this project, and
| probably will do something with this framework, too.
| vanderZwan wrote:
| This actually shows something interesting: that there is a
| coherent visual language for interfaces within the sci-fi
| subgenre of graphic design that just kind of appeared by
| implicit consensus. Which I guess can be said for _many_ visual
| design trends - many of us can guess both when and for what
| purpose a product was designed based on its graphic design.
| caycep wrote:
| Of interest to me is that a lot of the graphics and sounds
| are based on '70's and '80's tech with the constraints of the
| circuits and display technology that were "state of the art"
| then, but then "futurized". Such that advanced tech now
| spends computer cycles simulating analog circuits, CRTs, etc,
| for the purpose of nostalgia...
| numpad0 wrote:
| Also that coherency is probably why many Star Trek reboots
| often look off
| dvtrn wrote:
| It definitely is for me. The LCARS interface is as much of
| a character of the story as the as the Enterprise herself
| (substitute with Voyager, Defiant, or Sao Paulo if you
| wish) and I'd go a step further of saying ship interfaces
| and systems inform us as much about the era of Star Trek
| one is watching as does the plot and narrative at any given
| moment to the discerning and attentive Trekkie :)
| TeMPOraL wrote:
| Strongly agreed. Which is why I was glad to see LCARS
| returning in _Lower Decks_ , and the series is
| experimenting with tweaking the design a little to
| include some lessons in UI design learned over the past
| decades. Despite being animated comedy, I like it better
| than post-Enterprise installments, because it brings back
| the design language of TNG/DS9/VOY/ENT era.
| pseudalopex wrote:
| That sounds really interesting! Could you share some
| examples?
| Andrew_nenakhov wrote:
| Btw, the Holo interface we saw in Android 4 was very
| influenced by this type of design. It was rather stylish,
| even if difficult to use consistently. But of course since
| then it was replaced by Material Design, starting with
| Android 5.0
| pmlnr wrote:
| God, I miss holo. It was so much nicer on the eyes. "Dark
| Mode" is... ugly. I'm glad it exists, but it's still
| uglier, than holo was.
| Andrew_nenakhov wrote:
| Problem with Holo it was hard to follow this concept and
| create visually distinct apps. They would all be cold
| white and blue. Material design gives for more
| variability.
| grishka wrote:
| Some apps did change the accent color, but it was very
| non-trivial. Material design comes with tintable controls
| out of the box.
| grishka wrote:
| There were two Holo themes: dark and light. You'd pick
| one and extend it with the style of your brand. My only
| gripe with it was that there's no built-in mechanism to
| add shadows to things -- you have to use pre-rendered
| shadows as bitmaps or generate them on the fly.
|
| Anyway, "dark mode" is totally doable with Holo.
| scrollaway wrote:
| The UI reminds me a bit of a mix between the EoC:IW2 UI
| (https://gamefabrique.com/games/independence-war-2-edge-of-
| ch...) and the ingress web UI. The fonts are doing a lot of the
| leg work for that.
|
| Maybe a bit of EVE Online too.
| angryold wrote:
| God I loved that game (IW2). Wasted so many hours just flying
| around with the physics in that game. I'm in total agreement,
| I get the same vibes.
| scrollaway wrote:
| Amen, my brother-in-space. It's the game that defined my
| childhood. The game that made me wish Star Citizen would be
| better managed.
|
| If I had infinite time I would fuck around Elite Dangerous
| all day these days, with flight sticks and everything.
| hosh wrote:
| I got instant and intense flashbacks of Deus Ex.
| hippospark wrote:
| StarCraft
| Andrew_nenakhov wrote:
| more like Homeworld / Outpost / Ascendancy / Invisible Inc /
| Mass effect 1 to me. But not direct ripoff any of them.
| soapboxrocket wrote:
| Invisible Inc, the sounds are even on point.
| joycian wrote:
| I think it's more Freelancer
| contingencies wrote:
| _Syndicate_ (1993). https://youtu.be/ACVZ5b8wW14?t=5954
|
| _System Shock_ (1994). https://youtu.be/qKchS2GeimE?t=9
| cevn wrote:
| The sounds are very Starcraftian
| haolez wrote:
| It's also cool that this is simply a web app. If I want the
| full desktop experience, I can write the missing components
| myself (lol) and make this app fullscreen. Nice!
| bityard wrote:
| Everything old is new again.
|
| If you take away some of the animations and sound, this looks
| like around half of all the websites I visited in 1998. (Which
| mainly revolved around hacking and Quake.)
| pmlnr wrote:
| Flash websites used to look incredible. Completely unusable,
| and without accessibility, but they did look gorgeous.
| [deleted]
| cocktailpeanuts wrote:
| Now this is what they mean when they say "Ideas are nothing, it's
| all about execution".
|
| I admire that you actually went and built a full fledged
| framework for this. Most people don't go that far.
| keiferski wrote:
| Just to clarify - I (link submitter) didn't make this. Just
| found it on the web (/r/cyberpunk, actually.)
| dropit_sphere wrote:
| No joke, if your boss is not technical, I bet you could get a
| raise if you started using this for internal tools.
| pmlnr wrote:
| Absolutely love the design!... but... it's not a progressive
| option, which make it a big, bad nope for me.
| ganonm wrote:
| Very reminiscent of Neocron, my favourite game of all time.
| Anyone in HN population a fan?
| wissio wrote:
| Buggy and unstable, but I loved it to death. I really miss the
| atmosphere.
| asah wrote:
| This makes me wish for a nextgen CSS Zen garden with modern
| layout, widgets, animation etc.
|
| http://csszengarden.com/
| m4tthumphrey wrote:
| Ahh, I always enjoyed the Starwars and movie theatre designs. I
| can't seem to find them on the site right now though..
|
| Edit: Here is the movie theatre! [0]
|
| [0] http://www.csszengarden.com/202/
| Animats wrote:
| Why does the future now have a pale blue glow? We're past the
| pale blue glow of the CRT era.
| flanbiscuit wrote:
| This is influenced by the cyberpunk imagery from the 90s so it
| makes sense. It says "future" but the cyberpunk aesthetic is
| more of a Retrofuture aesthetic now.
| Animats wrote:
| Ah, what TVTropes calls "Zeerust".
|
| In the mainstream, of course, we have the square corners /
| round corners cycle, and the grey/black/putty/chrome color
| cycle for appliances.
| sagebird wrote:
| perfect for creating DOD dashboards to impress upper brass.
|
| Add a sweeping crosshair reticle animation, tOp seCReT labels and
| a rotating bald eagle point cloud.
|
| (I wish this comment was satire...)
| [deleted]
| FanaHOVA wrote:
| I used to play this online hacking game back in high school, I
| think it's called "Mother"? Very similar interface. Brought good
| memories :)
| vich wrote:
| I love the nostalgic feel to it. Can't quite put my finger on it,
| but just reminds of me late 90's gaming. Looking forward to play
| around with it!
| m-p-3 wrote:
| It feels quite smooth, that is impressive.
| endlessvoid94 wrote:
| I love it
| kirillcool wrote:
| This seems to be abandoned in the middle of the alpha cycle of
| the very first release - https://github.com/arwes/arwes
| kkotak wrote:
| Yes, even the Copyright is for 2018.
| gleapsite2 wrote:
| > Since last year I have been delaying the development of the
| project due to personal reasons. I plan to resume it soon.
|
| Posted 24 days ago by the author:
|
| https://github.com/arwes/arwes/issues/46
| 52-6F-62 wrote:
| > _" I like to write the technical docs...so I'd be happy to
| help with that too"_
|
| That guy just met an angel.
| hd4 wrote:
| I love how this channels Syndicate Wars. That game probably
| solidified the cyberpunk aesthetic better than any game before or
| after it, possibly with the exception of Shadowrun (or the
| upcoming cp2077).
| wissio wrote:
| This specifically reminded me of Syndicate Wars user interface.
| Partly its the sounds that make it, I guess. I applaud the
| author for an excellent interpretation.
| longnguyen wrote:
| Glad to see this posted on Hacker News. I used this for our
| internal tool and the first time I showed it, almost the whole
| company were in awe. I made a kind of public version here if
| you're interested: https://scan-viewer.vercel.app/scans/1
|
| Edit: Guess I should explain a bit more about this tool. Our main
| product is a handheld scanner that can take an individual's body
| measurements while they are fully clothed. You take a 360deg body
| scan and get a few point clouds back. This tool is mostly for
| debugging 3D reconstruction issues.
|
| Edit 2: You should open this in a desktop browser. In mobile view
| some widgets are not showing.
| lifeisstillgood wrote:
| I have to ask, but how does the scanner work - if i am clothed
| how does it reconstruct my underneath self?
|
| Or is it actually penetrating the cloth?
|
| BTW - great idea. It has to be the future of clothes shopping
| longnguyen wrote:
| Yeah the scanner has a radar sensor which can penetrate
| clothes. We used multiple sensors and developed a "morphing"
| algorithm to reconstruct the whole body accurately.
| Qworg wrote:
| I'd love to learn more about the company and technology! Using
| radar is an interesting adaptation. Do you have a site?
| longnguyen wrote:
| Yes. Here is our website: https://bodidata.com
| pugworthy wrote:
| What widgets are you using for the gauge and line graph? They
| integrate in well.
| longnguyen wrote:
| I use svg-gauge[1] and recharts[2]. I think any libs can do
| the job, you just need some css with cyan on black background
|
| [1]: https://github.com/naikus/svg-gauge
|
| [2]: https://recharts.org
| Nannooskeeska wrote:
| I'm getting "An unexpected error has occurred." after a short
| loading screen. Let me know if you need more info!
| the_pwner224 wrote:
| I had to enable webgl for it to not error
| anigbrowl wrote:
| I want to use it all the time for everything, including
| desktop.
| rkagerer wrote:
| What's the elliptic, flat, angled disc near the kidney in the
| radar reconstruction?
| crooked-v wrote:
| This is nice-looking, but wow, those loading times are painful.
| There's also something weird going on in the transitions on the
| 'Play' page - seems like it's re-routing between selections.
| breakfastduck wrote:
| Absolutely fantastic. As a previous commented mentioned, it would
| be awesome to use this to build internal tools & dashboards.
|
| I actually think it would go down well with management as it
| would appear 'futuristic' to those that are not tech savvy.
|
| The fact it comes with sounds included is the cherry on the cake!
| [deleted]
| nirav72 wrote:
| Thanks for sharing. This might be a good option for building a UI
| for a diy home automation project I'm currently tinkering with
| using a raspberry pi and 7 inch lcd touch display (official
| raspberry pi lcd). So far I've looked at Kivy and also JavaFX for
| the UI. But would prefer it being a web frontend. So might have
| look into this.
| grogenaut wrote:
| Why does it history jack? That makes no sense for a style
| browser.
| motohagiography wrote:
| Love this stuff. I wonder what it's like for someone too young to
| remember the constraints that the design references.
|
| Like the cyberpunk fast scrolling effect is a reference to
| 300baud terminals being dog slow, and the idea that text could
| zip in that fast implied something fast and powerful. The image
| loading screens are complex and fast, like a kind of arpeggio of
| the individual steps sped up. As though to say, "It's doing the
| thing, fast, powerful, and specific." It's like old xterm boot
| processes where by the time they finished, each step was
| confidence that things were right in the world. What I love about
| the whole retro cyberpunk aesthetic is it is essentially heroic,
| with anti-hero origins, and the symbology bundles up so much of
| what I hope the older generations of hackers are able to pass on.
| breakfastduck wrote:
| That's an interesting point - I know I got a huge nostalgia
| blast looking at this. I also think it's awesome.
|
| Do you think someone who never played video games with menus
| like this would feel the same? Or would it look outdated and
| cliche...
| SubiculumCode wrote:
| Beautifully written. I just finished rewatching Halt and Catch
| Fire. If you haven't watched it, I recommend for the C64 hype
| and revisiting of the digital revolution.
| vinny2020 wrote:
| This is blade runner. I can finally have a blade runner interface
| of my SF dreams. Thank you
| OOPMan wrote:
| It's nice enough...but when you say GUI Framework I think of
| something like Qt.
| zadkey wrote:
| Kind of reminds me of the UI for the Star Citizen website.
| tambourine_man wrote:
| This looks great.
|
| The use of React components gives a post-apocalyptic feel to it.
| [deleted]
| rglover wrote:
| Now we're talking! Love the sound effects.
| miki123211 wrote:
| Just FYI, played with this for a while with a screen reader, and
| it even seems mostly accessible. If it has issues, they seem to
| be fixable issues. I feared painting the whole UI with WebGL on
| canvas, which would kill accessibility completely, but
| fortunately we have none of that.
|
| Of course, a screen reader doesn't notice the sci-fi style
| (except the sounds), but the framework seems usable.
| jtolmar wrote:
| This is super fun! I wouldn't want to see it on a serious
| website, but for games and such it's a really nice toolkit.
|
| Some minor suggestions:
|
| - The table isn't animated. Bringing in the grid lines the same
| way that HRs appear to be (like in the project example) would
| make sense. Possibly cascading the cells like the text renderer.
|
| - The sounds (which are excellent and super nostalgic btw) would
| be better with some variation. For example the author's portfolio
| site plays the same chirp every time you scroll a new project in,
| and sounds repetitive. Games will randomly pick from a set of
| similar sounds, which are often just the same sound at different
| pitches or different envelopes. That'd help here.
| cordite wrote:
| This really yanks at the human-to-computer latency. These
| transitions are incredibly long. Though the execution is
| delightful.
|
| It's better than Deus Ex 2.
| omarhaneef wrote:
| I like that this is also called "futuristic".
|
| This is the future if we projected it out in the 90s. (I think
| the popularity says something about the average age of HN users).
|
| However, if we had projected the future in the 80s or 70s or 00s,
| we would see different interfaces.
|
| Speaking of cyberpunk, I recommend the William Gibson short story
| Gernsback Continuum that explores this "projected future" concept
| in more detail.
| pvg wrote:
| A lot of the elements of 'the future' used are a lot older (and
| weirdly persistent!) - the notions that a 'computer' or some
| piece of gear outputs text slowly, makes noises while doing so
| and prints in a special font were themselves once real
| artifacts of what was then seen as futuristic technology.
| j4pe wrote:
| And in particular, the protagonist of that short story who is
| so happy he lives in his grim and grotty but real cyberpunk
| future, instead of the sterile, facile utopia imagined by the
| retro-futurism aesthetic.
|
| It's an interesting idea! You can learn a lot about a decade by
| studying what they thought their future would look like. And in
| the 90s we were definitely thinking it would involve neon
| translucency.
| anthk wrote:
| >This is the future if we projected it out in the 90s.
|
| I have to break some myths, but Mac OS9 in movies and MacOSX
| specially since Panther was THE dreamt interface from the 90's.
|
| It was so sucessful that even Fluxbox nerds wrote OSX like
| themes. Even for FVWM!!!
|
| Metallic themes were a thing in late 90's, among with the bloat
| and bling bling from E16. But OSX was a mix between art,
| skeumorphing and UNIX zealotism being built-in replacing the
| OS9 ahem... scrap.
| tiborsaas wrote:
| The React version of Her would be a bit too minimalistic :)
|
| Edit: I wanted to check if I was right and it's all voice, and
| found this playlist on Sci-fi UI:
|
| https://www.youtube.com/watch?v=m7WtNgesVbQ&list=PLAT7Dwp-tD...
| rkagerer wrote:
| This is neat, although I hate how contemporary UI libraries or
| pages often miss basic features I had in my old favorites, such
| as being able to adjust splitters.
| troughway wrote:
| 2advanced making a come back!
| ceedan wrote:
| Man this gives me some feels
| indigochill wrote:
| I may be bad at the internet, but how do people get *.dev domains
| to load in their browser? Those always break in Firefox/Chrome
| for me. I was under the impression Google had bought the TLD.
| I've mostly been able to ignore it, but now I'd like to see this
| but can't.
| sarosh wrote:
| You probably have an entry for *.dev; use scutil --dns Details
| at: https://superuser.com/questions/1413402/i-cant-visit-
| website...
| jagraff wrote:
| Works for me on chrome... try setting your DNS to 8.8.8.8?
| dgellow wrote:
| That's awesome. Of course not for standard web interface, I would
| hate my bank to have something like this, but that would be
| perfect to create a text adventure or other immersive
| experiences!
| atarian wrote:
| You just reminded me of Citibank's virtual number UI. It had
| sound effects and would play an animation that would show you a
| temporary credit card number using a slot-machine-like
| animation. It was hilarious but I would always dread using it
| whenever I needed it.
| dgellow wrote:
| Do you have a screenshot or video? That sounds nightmarish!
| elchin wrote:
| This is just so cool!
| whoisnnamdi wrote:
| Love this, thanks for sharing!!
| renewiltord wrote:
| Haha, very entertainingly done!
| anthk wrote:
| This reminds me of sucky CD-ROM interfaces for software/knowledge
| base given for free with magazines.
|
| Cool at first, but annoyingly slow and distracting in the next
| interactions.
| antihero wrote:
| I am legit trying to get permission to use this to build internal
| tools.
| cacois wrote:
| I want to sooooo much...
| abraxas wrote:
| I sense Sid Meier's Alpha Centauri vibes
| wiradikusuma wrote:
| Posts like this make me feel envy because it's not available in
| <<favorite-UI-framework-here>>. People smarter than me seriously
| need to separate design with framework and make combining them
| more like changing clothes.
| ncrmro wrote:
| I started just using bootstrap css in the index.html and class
| names in react. Much less headache (at least in POC stage)
___________________________________________________________________
(page generated 2020-08-26 23:00 UTC)