Retro UI fan thread / Command-line interface aesthetics

I don't know why, but I feel like the old-school user interface was looking way more cool than the current modern app UI design. The modern UI feels boring and soulless. The retro style UI had certain charm to it. Maybe it's caused by the "hacker" aesthetics that certain movies have popularized, or maybe the modern UI design really is as soulless as it feels. Anyway I think we can bring the old UI design back to life. Anybody agrees? Are you into the retro UI aesthetics as well? Do you think that the tech aesthetics of the 80's and early 90's was superior to any modern design? Would you want to go back? You can also share your creations of such retro design or tips on how to achieve such look. I'll start. Retro look HTML: CSS: body { font-family: monospace, monospace; color: DodgerBlue; background-color: black; font-weight: bold; } table { border: 2px solid DodgerBlue; } th, td { border: 2px solid DodgerBlue; padding: 20px; } .nob { border: none; padding: 20px; } .fbu { border: 1px solid; padding: 10px; box-shadow: 5px 8px DodgerBlue; display:inline; } .hig { font-weight: bold; text-decoration: underline; font-size: 20px; } HTML: Double line frame: <table><tr><td>Contect</td></tr></table> <br /><br /> Single line frame: <table><tr><td class="nob">Contect</td></tr></table> <br /><br /> Button: <div class="fbu"><span class="hig">C</span>ontent</div> Retro look in Batch (.bat) files: We need to use the "extended ASCII characters". In order to do this, we must first set the batch file to UTF-8 encoding by putting this line as the first line of the file: chcp 65001 Then we can use the extended ASCII characters which can be found on this page: https://theasciicode.com.ar/ Especially the characters 201, 205, 187, 186, 200, 188 for double line frames and characters 218, 196, 191, 179, 192, 217 for single line frames.

>>29465 Despite I fuarrrking hated the color of stock beige back in teh '90s - computer equipment in that color still invokes some kind of additional respect value in me. Maybe my brain is just nostalgic toward times when internals of computer was arcane magic to me. Or maybe it was just higher quality of plastic used in that are. Hard to say. As for what was displayed on screens: Generally speaking GUI of the era had limited color palletes too but it was coz of technical limitations. 1st PC i ever used had just monochrome monitor. Monochrome monitors still were a thing up to like around 1994-1996 in Poland where I'm from. Other aspect is low pixel count of many displays but here it was mostly limitation on the side of graphic cards or dumb terminal internals. Limited color palletes and low res were requiring development of clear readable visual language where you can understand what are you seeing on a first glance using simplest possible means. >Especially the characters 201, 205, 187, 186, 200, 188 for double line frames and characters 218, 196, 191, 179, 192, 217 for single line frames. Holee fook, I still remember typing these codes despite last time I did that was over 15 years ago. xD I had a truckload of fun doing copyright headers in Turbo Pascal programs using these characters.

It's not soulless due to modernity but rather soulless due to corporative aesthetic approaches. You see, business corporations like to go off of data over artistry and this becomes the standard norm that others begin to emulate even if they aren't businesses themselves they act as such to try and sell. What they are selling isn't always for money, it can be for clout of having the most popular FOSS for example. Other times it's not all data driving design but constraints of personal preferences of those who are hiring user interface designers. This leads to similar results where a certain look becomes the norm for masses and other businesses may try to emulate it and so may some FOSS programmers. It's sort of devolution of aesthetics from appealing to either the masses or the preferences of the select few running things who may have terrible tastes. I should shut up before I lose my train of thought more and start rambling so I will leave it at here.

Btw. if anybody is interested in Lainchan Cracker, here's the code for the JavaScript version: https://rentry.co/4dz73

Lainchan Cracker live demo at https://felvidek.neocities.org/

OP, you invented brutalist web design. It's quite recent fad really, circa 2015. Old computer interfaces never actually looked like this.

>>29537 >Old computer interfaces never actually looked like this. What do you define as an "old computer interface"? DEC VAX? Tektronix? OPs design is similar to DOS GUI interfaces commonly seen in the 1990s - and I would classify those as too recent to qualify as "old computer interfaces". >>29465 >I feel like the old-school user interface was looking way more cool than the current modern app UI design. There is a reason for this. Old systems were developed based on the knowledge gained from space programs. There was a disconnect in the development of software that arrived once personal computers became a common consumer product - and software sales became a significant market product. Profit & desirability lauded over function with Microsoft and Apple designs, hence many modern UIs (including web designs) copy these fashionable styles and are poor from the perspective of visual signage directing a user through a specific task. Modern UIs introduce the possibility of user error for the sake of 'looking cool' (ever chased a menu jumping around on a loading web page?). However "old school" interfaces were designed to minimize such possibilities of confusion. The really sad part is many today believe the current design ideologies (eg Apple hidden menus) are apex functionality to be emulated. It is like a microcosm of an advanced civilization being lost in a lifetime. Most disconcerting. Here endeth the blogpost of grandpa.

>>29465 >CSS class nob trick to negate table border line P.S. What you are doing with the CSS of the table would normally be done more simply by styling the FIELDSET, and LEGEND elements of a FORM element.

>>29465 P.P.S OP, your implementation has "[P]ause" not "Pause" with the first letter underlined. This is an example of what I referred to about modern design styles introducing errors. You have introduced a possible error, though may not be aware of it. This error may be more readily seen by examining the second 'button' "[S]top". A non-native English speaker may erroneously interpret this as "S Top" and believe the S key would take them to the top of the page. However, in the original "Stop" with the "S" letter underlined the possibility of this error is removed since the user reads the word as a whole, and is told the first letter has a special significance (a keypress) added to it from the underlining. This is a subtle but significant difference. Picture related: - Notice how the readability of the "Server Info." section improves from the (broken) original you copied - by text alignment about the separator (as you would see in movie credits, etc). Note, also "Server Info." uses title case with abbreviations indicated.

>>29540 Does it matter? The result is what matters to me, not the way you got there. >>29543 > A non-native English speaker may erroneously interpret this as "S Top" and believe the S key would take them to the top of the page. Come on... Nobody is going to interpret it like that... > Notice how the readability of the "Server Info." section improves from the (broken) original you copied - by text alignment about the separator You are right. I admit that this looks better.

>>29553 > Nobody is going to interpret it like that. This is an assumption based on your personal experiences. Even a native English speaker confused through tiredness or operating in a stressful situation does odd things. Using a security analogy to this design method your reply becomes - "Nobody is going to enter data like that" so we don't have to sanitize for that kind of system input. The design using the underline removes the possibility of errors that come from precisely such assumptions being made. In short, it designs out possible errors. As mentioned prior, current interface designs are based on the principles of marketing and looking 'cool' not robust functionality. >Does it matter? The result is what matters to me, not the way you got there For robust functionality across browsers FORM sub-elements would be used (i.e. there is already a method baked into the HTML specification for what you are trying to do), but as you state robust functionality is not your overriding design principle. I was merely mentioning this functional design principle because it is what these interfaces were designed around, and the OP wished to replicate them.

>>29555 Square bracket gives better indication of a letter key due toskeuomorphic similarity with square shaped keys. An underline is underline, for example my brain doesn't necessarily read it as a reference to hotkey. Have you done group testing or have a reference from Nielsen-Norman Group to prove underline readability on large scale of users instead of anecdotal allusion to commercial UX practices? [S]top won't be read as "go to top" because page is short enough to fit into one standard screen under 600 px tall (despite page having a scroll bar for some mysterious reason), it's not in the corner where go-to-top buttons are located usually, it's grouped right next to [P]ause button under a box it clearly has some relation with. Perhaps, a styling feature that makes first letter look like it's squared and in slightly different font would suffice, but this obviously breaks your LARP definition of "oldschool" interfaces done solely in monospace ASCII,

Challenge: Code a working progress bar. This is my attempt: https://rentry.co/2mdr5 Still a little bit buggy though

>>29569 Lainchan destroyed the encoding, use the rentry one.

>>29569 Forget this, the math is completely bugged in this. Here's the correct one: https://rentry.co/hco4z

>>29565 >your LARP >user interfaces designed prior to Nielsen were a LARP I doubt you were around when Nielsen first came on the 'scene' and what his focus was in his rambling homepage rants. >UX practices What I mentioned pre-dates Nielsen's UX terminology that came about from World Wide Web page design decades later. >Nielsen-Norman Group You mention Nielsen to give your post credibility by an appeal to authority. Were you designing interfaces before Nielsen took up his new hobby ranting about poor web page design? Do you know he was compiling a list of common sense things that many saw and were mentioning at the time too? While others had different priorities, Nielsen's consistency of message for the decades that followed has created the "Nielsen-Norman Group" you are so keen to cite. It is laughable you fail to understand the difference between the modern term "UX practices" (e.g. user groups for commercial software products) and that of this thread as mentioned by the OP, which was born out of robust functional interface design arising predominantly from the aerospace industry (e.g. NASA). The OP mentioned wanting to bring back the old UI design. My contribution to this thread is on the principles of how such interfaces were designed. The reaction to offering this knowledge has been met by ego d*ck swinging in the replies. Sorry, no ball. I'm too old to care for such nonsense. This thread is a proven LARP, with no real interest in the topic it was created for. >It is like a microcosm of an advanced civilization being lost in a lifetime. Most disconcerting. I'm certain that if an ancient Egyptian surfaced to explain how the pyramids were built you'd be quoting modern archeologists about why they were wrong.

90's or 80's aesthetics are superior. The end.

I've been intending to write about how monochrome interfaces are more powerful. In brief, an interface which doesn't use some quality allows the user to use it for customization in a way guaranteed to work. Of course, modern garbage was never intended to be customized in any way, and this can be traced all the way back to the 1970s.

I love the Windows 95 aesthetic. Too bad I can't put it on my hidpi monitor without it looking like crap.

>>32114 >I can't I can >Linux Distro >Win95 theme >Profit? >Linux Distro >WINE >WIn95 >Profit? >Linux Distro >Virtual Box >WIn95 >Profit?

Site with a css scheme for mimicking apple's system 6. https://sakofchit.github.io/system.css/