10 ms·

The History of User Interfaces

205 points by mjshashank 4y ago

dingosity 4y ago
meh. dude forgot Engelbart's augment project (from the mother of all demos). the unix shell (which is the exemplar of a class of UIs) and Raskin's Canon Cat keyboard based interface. Or PLATO, which was doing remote graphical rendering before Y or X.
sligor 4y ago
Wow the Xerox Alto was so crazily ahead of its time
egfx 4y ago
Browsing 1992 through 1995 gave me tears. Btw, where is Vista, ME, or Windows 98, or 7 for that matter? Vista had an especially unique UI with Aero and Windows 7 was an adaptation of that I believe.
- linguae 4y ago
  I concur about Windows Vista. For all the criticism that OS received, it did bring Windows a compositing desktop similar to Mac OS X, which was a crucial milestone to the GUI experience, which brought compositing desktops to more than 90% of personal computer users. I believe Windows 98 and ME were omitted because this is largely a presentation of the evolution of GUIs. Windows 98 and ME did not substantially differ from Windows 95 in terms of their look-and-feel; the same can be said about Windows NT 4 and Windows 2000.
  - theandrewbailey 4y ago
    > Windows 98 and ME did not substantially differ from Windows 95 in terms of their look-and-feel; the same can be said about Windows NT 4 and Windows 2000. The only differences I remember are quick start icons in the taskbar, and gradients in window title bars.
- mngnt 4y ago
  Non-inclusion of Vista is really strange given how influential it was. I used to be among those Linux users that wanted to make the GUI look cool™. I spent a LOT of time browsing gnome-look.org and at the height of Vista popularity, the Aero knockoffs were everywhere.
eesmith 4y ago
What's the theme here? That is, even in the context of desktop graphical UIs I expected Englebart's oN-Line System (NLS), Sutherland's Sketchpad, X Windows, NeWS, and/or NeXTStep. Broaden that and there's smartphone UIs. Or Raskin's The Humane Environment (THE). EDIT: OPEN LOOK tried to "fill the need for an easy to use desktop for Unix workstations, similar" long before KDE 1.0. There's also the Common Desktop Environment.
- kristopolous 4y ago
  random fact, CDE is open source these days and you can run it on Linux, for entertainment I guess (HPUX's SAM not included ;p ) https://sourceforge.net/projects/cdesktopenv/ https://sourceforge.net/projects/cdesktopenv/ There's also a 4DWM clone as well https://docs.maxxinteractive.com/ https://docs.maxxinteractive.com/
memetomancer 4y ago
minor nit - this is a very poorly named site. A better name might be "the history of workstation and personal computer graphical user interfaces", a very far cry from blanket coverage of all "user interfaces". Even foregoing simple UI such as the handle of a hammer, or even the mechanical interfaces of yesteryear such as the differences between a Curta calculator and the original Burroughs adding machine, or a Jacquard loom and so forth... Limiting ourselves to just binary digital computers we're still missing a lot at this site. IBM 1401 card punch machines... the IBM 360 operator console... the VAX DCL, the original UNIX sh, etc., etc.
- yreg 4y ago
  www.the-history-of-workstation-and-personal-computer-graphical-user-interfaces.io ?
  - bhandziuk 4y ago
    The URL isn't taken!
linguae 4y ago
This is a nice collection of graphical user interfaces. This reminds me of the well known Toasty Tech collection (http://toastytech.com/guis/ http://toastytech.com/guis/), but with a narrative tying together the evolution of these GUIs. Some feedback: 1. All interfaces presented were graphical user interfaces for desktop personal computers. However, there's a wide world of user interfaces for computers beyond conventional point-and-click GUIs. A command line interface, for example, is still a user interface, and in fact there has been much diversity of command line interfaces besides Unix and MS-DOS. For example, I remember reading in The Unix Haters Handbook critiques of the Unix shell, comparing it to the CLIs of other operating systems such as VMS. It would have been cool to have learned about the history of various CLIs and how they evolved. Regarding other user interfaces, there are touchscreens and voice, and even among GUIs there have been models that were not heavily influenced by the Apple Macintosh and Microsoft Windows, such as Symbolics Genera, Project Oberon, and Plan 9's 8 1/2 and rio GUIs. 2. Some highly influential GUIs are missing. For example, as influential Windows 95's UI was, its look and feel clearly shows influences from NeXTSTEP, the first GUI to introduce the gray, 3D, beveled look that Windows 95 embraced.
- jamessb 4y ago
  There is also the GUIdebook Graphical User Interface Gallery: https://guidebookgallery.org/screenshots https://guidebookgallery.org/screenshots (the panel on the right lets you select a "component" like "Notepad" and see how it looked in each system)
  - eesmith 4y ago
    That GUIdebook appears to be the source of many of these images. % curl -s https://guidebookgallery.org/pics/gui/desktop/full/lisaos10.png | sha256sum 7f4216c0c688c8d6942ddf6457300df7c8f86106729ec4e11c0f6a7d37fd89e5 - % curl -s https://history.user-interface.io/img/apple-lisa/desktop-with-applications.png | sha256sum 7f4216c0c688c8d6942ddf6457300df7c8f86106729ec4e11c0f6a7d37fd89e5 - Other images come from http://toastytech.com/guis/index.html http://toastytech.com/guis/index.html , eg, visually compare http://toastytech.com/guis/os211menu.png http://toastytech.com/guis/os211menu.png with https://history.user-interface.io/img/OS-2/cursor.png https://history.user-interface.io/img/OS-2/cursor.png . Both the GUIdebook Graphical User Interface Gallery and Nathan Lineback/Toasty Tech's GUI Gallery are significantly more comprehensive than the linked-to page.
asiachick 4y ago
The list is kind of arbitrary. I don't feel the Amiga UI had any influence on anything what so ever. I was a huge Amiga fan and owned an Amiga 1000 the year it launched and then an Amiga 500 later but other than Amiga's unique multi-resolution system, which really was only something that was a product of the limits of old hardware, there was nothing special about its UX. Similarly where's GEM? https://en.wikipedia.org/wiki/GEM_(desktop_environment) https://en.wikipedia.org/wiki/GEM_(desktop_environment) I'm sure there's a bunch of others missing for "The History of User Interfaces"
- Cockbrand 4y ago
  I agree - given the Amiga's excellent hardware capabilities for the time, the GUI lacked quite a bit, of course especially compared to the Mac, but even in comparison to GEM.
- Findecanor 4y ago
  There was one difference between Amiga and Mac/Windows that was noticeable on the slow machines of the day: It was more responsive. Not only did Amiga have preemptive multitasking. The window system ("Intuition") ran behaviour and redraw of apps' widgets in its own task, making them responsive even if the apps owning them were lagging. Compare that to Windows 3.11 of the day, where the entire GUI would hang while waiting for an app to redraw anything in one of its windows.
Oarch 4y ago
Does Ivan Sutherland's Sketchpad not deserve a mention? It was an early touchscreen / stylus interface from the 60s.
sedan_baklazhan 4y ago
If only this quite interesting work could be read on a normal, no-JS webpage! Scrolling to see more content fading in is such a bad UI practice. Completely negating all the natural reading experience.
- IYasha 4y ago
  At least you're lucky enough to see some content at all :))
  - sedan_baklazhan 4y ago
    I had to enable some JS to see it. Insane.
- sdfjkl 4y ago
  Agreed. Also the cropping of image previews to square format. You literally can't see the portrait orientation of the Xero Alto monitor. Argh.
- mngnt 4y ago
  For bonus points, try to visit from a smartphone. a few scrolls into the page, I got a modal begging me to subscribe and it was not closable - positioned too high so I didn't get to the x to close it, I guess. Ironic - a website about user interfaces has a UI so bad that I could but glimpse the content.
  - game-of-throws 4y ago
    For extra bonus points, read this blog post by the author of the site: https://user-interface.io/why-you-probably-shouldnt-put-forms-in-modals/ https://user-interface.io/why-you-probably-shouldnt-put-form... And all the screenshots are stolen, as mentioned in other comments. This guy is just a hustler.
- floren 4y ago
  Good news, a lot of the screenshots are just pulled from http://toastytech.com/guis/index.html http://toastytech.com/guis/index.html, which works perfectly well without JS.
IYasha 4y ago
<body> <div id="app"></div> </body> I love your interface. Such pure white.
masswerk 4y ago
Minor nitpick: The "Alto GUI" is really Smalltalk, there was no such thing as a general GUI for the Alto. Also, image 10/10 is a screenshot of the Xerox Star. (The merits of Xerox SDD in turning the experimental odds and ends of Alto developments into a consistent user interface are generally underappreciated.)
kypro 4y ago
I really miss Windows 95/98 era UIs. They were so much more practical and less noisy than current generation UIs. Opening the start bar on my Windows 11 I literally have no idea what's going on. All the "apps" at the top of my start bar are things I've never used and I don't think I've ever even installed. Stuff like Tiktok and XBox. Then below that I get recommendations, but I don't want recommendations, I just want to find the programs and settings I'm looking for. I'm not even sure if can get to setting from the start bar anymore, and if I'm looking for the programs I've installed it's behind another click. I guess it looks nice with all the tiles and transition effects though.
- hunterb123 4y ago
  But the start bar is completely customizable... You can turn off recommendations, remove the default apps, add any other app including settings, set the size, etc. Once you spend a couple minutes setting it up, it's less cluttered than any previous Windows OS.
  - kypro 4y ago
    Yeah, I spent some time on my other Windows computer doing just that. It does help, but it's still not as clean as the Windows 98 start bar imo. It's not just the start bar though. There are similar things all over the OS. For example, if you right click a document in Windows 11 one of the most common things you might want to do, "copy" isn't there. Well it is there, but now it's behind this little anonymous looking rectangle icon at the top* of the context menu and is no longer clearly listed as "copy" in the menu. Maybe I'm just getting old... But I find UIs are just generally getting more confusing and assume more of the user. For example, back buttons on browsers don't say back anymore, but are just an arrow, because everyone knows what that arrow does, right? And that's probably fair, but even still, I like the explicit text label so I know for sure what I'm clicking is what I'm looking for. The three dots for accessing a menu might be a better example as my parents actually do get confused by that * The icon can also randomly appear at the bottom of the menu because who cares about predictability when designing UIs anymore.
    - 4y ago
nathias 4y ago
it would be interesting to see an overview of the web UI, going from user-centric to ad-centric in 20 years
- ctas 4y ago
  Agreed. If anybody knows such a site, I'd like to see it. I just recently collected old screenshots of Facebook, Twitter, and other popular sites from 2010 and before. Looking back, all of them have a certain charm I would like to bring back in future personal projects.
- jethkl 4y ago
  A version of that exists: https://www.webdesignmuseum.org https://www.webdesignmuseum.org
  - nathias 4y ago
    thanks, this is great
jeffalyanak 4y ago
Am I wrong in thinking that the photo of the Alton keyboard is actually a corded input device and that a keyboard was also included?
masswerk 4y ago
Snow Leopard (OS X 10.6) really needs a representation of the brushed metal appearance in the image gallery. (There had been two presentation styles, the general one seen in the images, and a brushed metal one for utilities.) Edit: Interestingly, there's no representative image of this to be found in image searches, but here's a screenshot of a third party tool: https://www.google.com/imgres?imgurl=https%3A%2F%2Fimg.informer.com%2Fscreenshots_mac%2F102%2F102678_1.jpg&imgrefurl=https%3A%2F%2Fmacdownload.informer.com%2Fipatch%2F3.7%2F&tbnid=d330AieqVODxNM&vet=10CDMQMyh_ahcKEwiwnNbRnPj4AhUAAAAAHQAAAAAQAg..i&docid=GdNAyBnXofDgPM https://www.google.com/imgres?imgurl=https%3A%2F%2Fimg.infor...
preezer 4y ago
I'm just at 1/4 of the article. But I have to say that the design and the ux of the site is just perfect. Well done!
- doodpants 4y ago
  I strongly disagree. Content fades in moments after scrolling, and there's no content at all if JavaScript is disabled. The author clearly values style over usability.
Anthony-G 4y ago
Two things I noticed from looking at the screenshots: 1. The MS Windows 7 Task Manager look very similar to the KDE 1 version (from the late nineties): https://history.user-interface.io/img/kde-1/task-manager.jpeg https://history.user-interface.io/img/kde-1/task-manager.jpe... 2. In 1990, Microsoft referred to plain text files on the local system as “on-line documents”: https://history.user-interface.io/img/windows-3.0/notepad.png https://history.user-interface.io/img/windows-3.0/notepad.pn...
- Narishma 4y ago
  Regarding 2, back then online was often used to mean something in the computer, as opposed to outside of it. For example online help vs paper manuals.
- memetomancer 4y ago
  The KDE 1 task manager looks _very_ similar to the Windows NT 4 task manager (from the mid nineties): https://guidebookgallery.org/screenshots/winnt40 https://guidebookgallery.org/screenshots/winnt40 (scroll down to 'task manager' and click the faint tab control marked '3' in the upper left of the specific screen shot) Until Win10, the NT OSes had that same basic task manager with the cool looking green graphs. WinNT 3.51 had a much more crude looking task manager
  - Anthony-G 4y ago
    Thanks for the info and the tips on how to view the screenshot of the “Performance” tab. I would have been using Windows 95 or 98 back then but I don’t remember it displaying resource usage like that. I started using Red Hat Linux 6 in 1999/2000 so wouldn’t be very familiar with Windows 2000 or XP.
- floren 4y ago
  I always thought KDE of that vintage was extremely attractive and pretty damn usable... Shame it got too "shiny" after KDE 1.
TheRealNGenius 4y ago
one gripe is that it is like 15 years outdated
larsbrinkhoff 4y ago
PLATO forgotten again.
foobarbecue 4y ago
My user experience on this site: scroll to cool picture, click cool picture, click back button expecting to go back to text. Back button takes me back to hacker news, urgh. Click link to site again, scroll to where I was. Click next cool picture and forget that back is broken. Click back. Urgh! Actually I've tried to use the back button four times now and I guess it's best if I just don't finish reading the site. The back of the internet is broken... Very cool site though.
jerryjerryjerry 4y ago
Xerox PARC: the birthplace of many many many PC related technologies. It's so sad that the legend is gone.
memetomancer 4y ago
While looking up a reference image for another comment in this thread, I came across another cool GUI site: https://guidebookgallery.org/guis https://guidebookgallery.org/guis This seems much more comprehensive, has screenshots of specific UI elements and controls to view different tabs within those screenshots.
jccalhoun 4y ago
My first reaction is that it is disappointing that GUIs haven't changed all that much from Xerox. However, on second thought, how different is the user interface on a car from the 30s from a modern car? So maybe it isn't surprising that the GUI hasn't radically changed
- epolanski 4y ago
  > how different is the user interface on a car from the 30s from a modern car A lot I would say, even on a much smaller time scale. The features are completely different besides the very basic odometers which anyway look very different and present much different information. A modern car not only has much more features, but even the way of consuming the old ones is radically different, and not just because of the switch from analog to digital, e.g. steering wheels have seen a massive amount of analog buttons and levers. 2002 Mercedes Benz E class interior[1] 2022 Mercedes Benz E class interior[2] [1] https://autotech-miami.com/images/watermarked/3039zg.jpg https://autotech-miami.com/images/watermarked/3039zg.jpg [2] https://imgcdn.zigwheels.my/large/gallery/interior/17/481/mercedes-benz-e-class-coupe-dashboard-view-167873.jpg https://imgcdn.zigwheels.my/large/gallery/interior/17/481/me...
- dredmorbius 4y ago
  The MOAD got a lot of things right. There's only so much efficiency and clarity that can be squeezed out of a GUI. Familiarity and consistency are themselves powerful elements of UI/UX. Upshot: stop fucking with the interface. Apple, renowned for design, has essentially only ever offered two GUIs, "Classic Mac" (1984--1999) and "Aqua" (1999--2022) Note that the second has been in use longer than Classic, by over 60% (23/16 ~= 1.64). Good UIs don't change. Apple have tweaked at the edges, changed some of the styling and colours, and added features (e.g., workspaces / virtual desktops). But a user of the Classic Mac could sit down at a modern OSX system and figure it put pretty quickly. (I'm actually not a fan of the interface, though I generally use one based on a precursor / ancestor of it, WindowMaker, based on NeXTStep from the NeXT Machine.)
aimor 4y ago
The Windows 95 icons were so good. I'm comparing those to what I see in Windows 10 and it's kind of funny. Examples I think are much worse: Keyboard, Mouse, Accessibility Options/Ease Of Access, Network, Passwords/Credential Manager. What happened? Windows 95: https://history.user-interface.io/img/windows-95/settings.png https://history.user-interface.io/img/windows-95/settings.pn... Windows 10: https://i.ibb.co/SQkQNJw/Windows10.png https://i.ibb.co/SQkQNJw/Windows10.png
xrayarx 4y ago
To me it seems this is just to start a newsletter. At least one is promoted prominently. Maybe they are gauging interest…
AlbertCory 4y ago
I generally avoid slipping in overt promotion of my book [1], but this cries out for it. Find out how it really went down, what the debates were like, and what it was like to be there. This is a quickie, copy-and-paste job from publicly available sources. Mostly accurate, except for calling the Alto keyset "the Alto keyboard." As some of the comments point out, it's quite incomplete. [1] https://www.albertcory.io/inventing-the-future https://www.albertcory.io/inventing-the-future
- b06timmer 4y ago
  When payday rolls around again I'll get this, thanks for pointing it out.
  - AlbertCory 4y ago
    Thank you!
ss48 4y ago
Great job. I liked seeing the hardware in the first two pictures. It gave an idea of what it was like interacting with the computer. Do you think you could add this for some of the other interfaces, even multiple form factors if they existed for the operating system?
scelerat 4y ago
Cool site! The title promises more than is delivered: computer user interfaces existed before the GUI, and interfaces to physical machines in general have existed for centuries, and a lot of those antecedents have influenced present-day computer interfaces.
scelerat 4y ago
"It [Amiga] uses a workbench metaphor (in place of the more common desktop metaphor) for representing file system organisation." Is "workbench" truly a different metaphor from "desktop," or is it just a different word used to avoid legal hassles?
stereocodes 4y ago
Didn't see Last Call BBS on there.
joaomoreno 4y ago
Hi author! Cool site. It was odd getting a "hi hacker news would you like to subscribe to my UI mailing list", but OK. But it was really not great seeing this [0] when I clicked "no", given the whole thing is about UI. 0: https://gcdnb.pbrd.co/images/wH0ONKrFlqSI.png?o=1 https://gcdnb.pbrd.co/images/wH0ONKrFlqSI.png?o=1
beefman 4y ago
I'd love to see GEM, Canon Cat, NeXTSTEP, and BeOS here https://en.wikipedia.org/wiki/GEM_(desktop_environment) https://en.wikipedia.org/wiki/GEM_(desktop_environment) https://en.wikipedia.org/wiki/Canon_Cat https://en.wikipedia.org/wiki/Canon_Cat https://en.wikipedia.org/wiki/NeXTSTEP https://en.wikipedia.org/wiki/NeXTSTEP https://en.wikipedia.org/wiki/BeOS https://en.wikipedia.org/wiki/BeOS
- tablespoon 4y ago
  > I'd love to see GEM, Canon Cat, NeXTSTEP, and BeOS here That would be good. I'd also like to see something that's at a much lower level, basically an catalog of specific ways of accomplishing specific basic tasks in a particular UI, current or historical. I've switched between different OSes, and each time I sorely miss some very particular thing (e.g. Windows' very useful line-based Home/End key behavior vs. Mac OS's totally pointless document-based behavior). I'm sure even dead-end OS's had very good ideas like these that have been subsequently lost. My weird dream is that some day someone could use a catalog like that to combine all the best ideas into something that's as close to perfect as possible.
  - beefman 4y ago
    In the case of Home/End, are you missing ⌘ + ← and ⌘ + → ?
- sys_64738 4y ago
  Came here to say GEM too.
samstave 4y ago
Another interesting software to look at the UI/UX of is 3D design/animation software. From Softimage, ALIAS|Wavefront through Maya to Blender etc... This UI model is interesting. I personally started on Softimage on the SGI (Also, I didnt see IRIX in the list). But Softimage had one of the most novel UIs of its time.

205 points by mjshashank 4y ago

meh. dude forgot Engelbart's augment project (from the mother of all demos). the unix shell (which is the exemplar of a class of UIs) and Raskin's Canon Cat keyboard based interface. Or PLATO, which was doing remote graphical rendering before Y or X.

sligor 4y ago

Wow the Xerox Alto was so crazily ahead of its time

egfx 4y ago

Browsing 1992 through 1995 gave me tears. Btw, where is Vista, ME, or Windows 98, or 7 for that matter? Vista had an especially unique UI with Aero and Windows 7 was an adaptation of that I believe.

linguae 4y ago
I concur about Windows Vista. For all the criticism that OS received, it did bring Windows a compositing desktop similar to Mac OS X, which was a crucial milestone to the GUI experience, which brought compositing desktops to more than 90% of personal computer users. I believe Windows 98 and ME were omitted because this is largely a presentation of the evolution of GUIs. Windows 98 and ME did not substantially differ from Windows 95 in terms of their look-and-feel; the same can be said about Windows NT 4 and Windows 2000.
- theandrewbailey 4y ago
  > Windows 98 and ME did not substantially differ from Windows 95 in terms of their look-and-feel; the same can be said about Windows NT 4 and Windows 2000. The only differences I remember are quick start icons in the taskbar, and gradients in window title bars.
mngnt 4y ago
Non-inclusion of Vista is really strange given how influential it was. I used to be among those Linux users that wanted to make the GUI look cool™. I spent a LOT of time browsing gnome-look.org and at the height of Vista popularity, the Aero knockoffs were everywhere.

eesmith 4y ago

What's the theme here? That is, even in the context of desktop graphical UIs I expected Englebart's oN-Line System (NLS), Sutherland's Sketchpad, X Windows, NeWS, and/or NeXTStep. Broaden that and there's smartphone UIs. Or Raskin's The Humane Environment (THE). EDIT: OPEN LOOK tried to "fill the need for an easy to use desktop for Unix workstations, similar" long before KDE 1.0. There's also the Common Desktop Environment.

kristopolous 4y ago
random fact, CDE is open source these days and you can run it on Linux, for entertainment I guess (HPUX's SAM not included ;p ) https://sourceforge.net/projects/cdesktopenv/ https://sourceforge.net/projects/cdesktopenv/ There's also a 4DWM clone as well https://docs.maxxinteractive.com/ https://docs.maxxinteractive.com/

memetomancer 4y ago

minor nit - this is a very poorly named site. A better name might be "the history of workstation and personal computer graphical user interfaces", a very far cry from blanket coverage of all "user interfaces". Even foregoing simple UI such as the handle of a hammer, or even the mechanical interfaces of yesteryear such as the differences between a Curta calculator and the original Burroughs adding machine, or a Jacquard loom and so forth... Limiting ourselves to just binary digital computers we're still missing a lot at this site. IBM 1401 card punch machines... the IBM 360 operator console... the VAX DCL, the original UNIX sh, etc., etc.

yreg 4y ago
www.the-history-of-workstation-and-personal-computer-graphical-user-interfaces.io ?
- bhandziuk 4y ago
  The URL isn't taken!

linguae 4y ago

This is a nice collection of graphical user interfaces. This reminds me of the well known Toasty Tech collection (http://toastytech.com/guis/ http://toastytech.com/guis/), but with a narrative tying together the evolution of these GUIs. Some feedback: 1. All interfaces presented were graphical user interfaces for desktop personal computers. However, there's a wide world of user interfaces for computers beyond conventional point-and-click GUIs. A command line interface, for example, is still a user interface, and in fact there has been much diversity of command line interfaces besides Unix and MS-DOS. For example, I remember reading in The Unix Haters Handbook critiques of the Unix shell, comparing it to the CLIs of other operating systems such as VMS. It would have been cool to have learned about the history of various CLIs and how they evolved. Regarding other user interfaces, there are touchscreens and voice, and even among GUIs there have been models that were not heavily influenced by the Apple Macintosh and Microsoft Windows, such as Symbolics Genera, Project Oberon, and Plan 9's 8 1/2 and rio GUIs. 2. Some highly influential GUIs are missing. For example, as influential Windows 95's UI was, its look and feel clearly shows influences from NeXTSTEP, the first GUI to introduce the gray, 3D, beveled look that Windows 95 embraced.

jamessb 4y ago
There is also the GUIdebook Graphical User Interface Gallery: https://guidebookgallery.org/screenshots https://guidebookgallery.org/screenshots (the panel on the right lets you select a "component" like "Notepad" and see how it looked in each system)
- eesmith 4y ago
  That GUIdebook appears to be the source of many of these images. % curl -s https://guidebookgallery.org/pics/gui/desktop/full/lisaos10.png | sha256sum 7f4216c0c688c8d6942ddf6457300df7c8f86106729ec4e11c0f6a7d37fd89e5 - % curl -s https://history.user-interface.io/img/apple-lisa/desktop-with-applications.png | sha256sum 7f4216c0c688c8d6942ddf6457300df7c8f86106729ec4e11c0f6a7d37fd89e5 - Other images come from http://toastytech.com/guis/index.html http://toastytech.com/guis/index.html , eg, visually compare http://toastytech.com/guis/os211menu.png http://toastytech.com/guis/os211menu.png with https://history.user-interface.io/img/OS-2/cursor.png https://history.user-interface.io/img/OS-2/cursor.png . Both the GUIdebook Graphical User Interface Gallery and Nathan Lineback/Toasty Tech's GUI Gallery are significantly more comprehensive than the linked-to page.

asiachick 4y ago

The list is kind of arbitrary. I don't feel the Amiga UI had any influence on anything what so ever. I was a huge Amiga fan and owned an Amiga 1000 the year it launched and then an Amiga 500 later but other than Amiga's unique multi-resolution system, which really was only something that was a product of the limits of old hardware, there was nothing special about its UX. Similarly where's GEM? https://en.wikipedia.org/wiki/GEM_(desktop_environment) https://en.wikipedia.org/wiki/GEM_(desktop_environment) I'm sure there's a bunch of others missing for "The History of User Interfaces"

Cockbrand 4y ago
I agree - given the Amiga's excellent hardware capabilities for the time, the GUI lacked quite a bit, of course especially compared to the Mac, but even in comparison to GEM.
Findecanor 4y ago
There was one difference between Amiga and Mac/Windows that was noticeable on the slow machines of the day: It was more responsive. Not only did Amiga have preemptive multitasking. The window system ("Intuition") ran behaviour and redraw of apps' widgets in its own task, making them responsive even if the apps owning them were lagging. Compare that to Windows 3.11 of the day, where the entire GUI would hang while waiting for an app to redraw anything in one of its windows.

Oarch 4y ago

Does Ivan Sutherland's Sketchpad not deserve a mention? It was an early touchscreen / stylus interface from the 60s.

sedan_baklazhan 4y ago

If only this quite interesting work could be read on a normal, no-JS webpage! Scrolling to see more content fading in is such a bad UI practice. Completely negating all the natural reading experience.

IYasha 4y ago
At least you're lucky enough to see some content at all :))
- sedan_baklazhan 4y ago
  I had to enable some JS to see it. Insane.
sdfjkl 4y ago
Agreed. Also the cropping of image previews to square format. You literally can't see the portrait orientation of the Xero Alto monitor. Argh.
mngnt 4y ago
For bonus points, try to visit from a smartphone. a few scrolls into the page, I got a modal begging me to subscribe and it was not closable - positioned too high so I didn't get to the x to close it, I guess. Ironic - a website about user interfaces has a UI so bad that I could but glimpse the content.
- game-of-throws 4y ago
  For extra bonus points, read this blog post by the author of the site: https://user-interface.io/why-you-probably-shouldnt-put-forms-in-modals/ https://user-interface.io/why-you-probably-shouldnt-put-form... And all the screenshots are stolen, as mentioned in other comments. This guy is just a hustler.
floren 4y ago
Good news, a lot of the screenshots are just pulled from http://toastytech.com/guis/index.html http://toastytech.com/guis/index.html, which works perfectly well without JS.

IYasha 4y ago

<body> <div id="app"></div> </body> I love your interface. Such pure white.

masswerk 4y ago

Minor nitpick: The "Alto GUI" is really Smalltalk, there was no such thing as a general GUI for the Alto. Also, image 10/10 is a screenshot of the Xerox Star. (The merits of Xerox SDD in turning the experimental odds and ends of Alto developments into a consistent user interface are generally underappreciated.)

kypro 4y ago

I really miss Windows 95/98 era UIs. They were so much more practical and less noisy than current generation UIs. Opening the start bar on my Windows 11 I literally have no idea what's going on. All the "apps" at the top of my start bar are things I've never used and I don't think I've ever even installed. Stuff like Tiktok and XBox. Then below that I get recommendations, but I don't want recommendations, I just want to find the programs and settings I'm looking for. I'm not even sure if can get to setting from the start bar anymore, and if I'm looking for the programs I've installed it's behind another click. I guess it looks nice with all the tiles and transition effects though.

hunterb123 4y ago
But the start bar is completely customizable... You can turn off recommendations, remove the default apps, add any other app including settings, set the size, etc. Once you spend a couple minutes setting it up, it's less cluttered than any previous Windows OS.
- kypro 4y ago
  Yeah, I spent some time on my other Windows computer doing just that. It does help, but it's still not as clean as the Windows 98 start bar imo. It's not just the start bar though. There are similar things all over the OS. For example, if you right click a document in Windows 11 one of the most common things you might want to do, "copy" isn't there. Well it is there, but now it's behind this little anonymous looking rectangle icon at the top* of the context menu and is no longer clearly listed as "copy" in the menu. Maybe I'm just getting old... But I find UIs are just generally getting more confusing and assume more of the user. For example, back buttons on browsers don't say back anymore, but are just an arrow, because everyone knows what that arrow does, right? And that's probably fair, but even still, I like the explicit text label so I know for sure what I'm clicking is what I'm looking for. The three dots for accessing a menu might be a better example as my parents actually do get confused by that * The icon can also randomly appear at the bottom of the menu because who cares about predictability when designing UIs anymore.
  - 4y ago

nathias 4y ago

it would be interesting to see an overview of the web UI, going from user-centric to ad-centric in 20 years

ctas 4y ago
Agreed. If anybody knows such a site, I'd like to see it. I just recently collected old screenshots of Facebook, Twitter, and other popular sites from 2010 and before. Looking back, all of them have a certain charm I would like to bring back in future personal projects.
jethkl 4y ago
A version of that exists: https://www.webdesignmuseum.org https://www.webdesignmuseum.org
- nathias 4y ago
  thanks, this is great

jeffalyanak 4y ago

Am I wrong in thinking that the photo of the Alton keyboard is actually a corded input device and that a keyboard was also included?

masswerk 4y ago

Snow Leopard (OS X 10.6) really needs a representation of the brushed metal appearance in the image gallery. (There had been two presentation styles, the general one seen in the images, and a brushed metal one for utilities.) Edit: Interestingly, there's no representative image of this to be found in image searches, but here's a screenshot of a third party tool: https://www.google.com/imgres?imgurl=https%3A%2F%2Fimg.informer.com%2Fscreenshots_mac%2F102%2F102678_1.jpg&imgrefurl=https%3A%2F%2Fmacdownload.informer.com%2Fipatch%2F3.7%2F&tbnid=d330AieqVODxNM&vet=10CDMQMyh_ahcKEwiwnNbRnPj4AhUAAAAAHQAAAAAQAg..i&docid=GdNAyBnXofDgPM https://www.google.com/imgres?imgurl=https%3A%2F%2Fimg.infor...

preezer 4y ago

I'm just at 1/4 of the article. But I have to say that the design and the ux of the site is just perfect. Well done!

doodpants 4y ago
I strongly disagree. Content fades in moments after scrolling, and there's no content at all if JavaScript is disabled. The author clearly values style over usability.

Anthony-G 4y ago

Two things I noticed from looking at the screenshots: 1. The MS Windows 7 Task Manager look very similar to the KDE 1 version (from the late nineties): https://history.user-interface.io/img/kde-1/task-manager.jpeg https://history.user-interface.io/img/kde-1/task-manager.jpe... 2. In 1990, Microsoft referred to plain text files on the local system as “on-line documents”: https://history.user-interface.io/img/windows-3.0/notepad.png https://history.user-interface.io/img/windows-3.0/notepad.pn...

Narishma 4y ago
Regarding 2, back then online was often used to mean something in the computer, as opposed to outside of it. For example online help vs paper manuals.
memetomancer 4y ago
The KDE 1 task manager looks _very_ similar to the Windows NT 4 task manager (from the mid nineties): https://guidebookgallery.org/screenshots/winnt40 https://guidebookgallery.org/screenshots/winnt40 (scroll down to 'task manager' and click the faint tab control marked '3' in the upper left of the specific screen shot) Until Win10, the NT OSes had that same basic task manager with the cool looking green graphs. WinNT 3.51 had a much more crude looking task manager
- Anthony-G 4y ago
  Thanks for the info and the tips on how to view the screenshot of the “Performance” tab. I would have been using Windows 95 or 98 back then but I don’t remember it displaying resource usage like that. I started using Red Hat Linux 6 in 1999/2000 so wouldn’t be very familiar with Windows 2000 or XP.
floren 4y ago
I always thought KDE of that vintage was extremely attractive and pretty damn usable... Shame it got too "shiny" after KDE 1.

TheRealNGenius 4y ago

one gripe is that it is like 15 years outdated

larsbrinkhoff 4y ago

PLATO forgotten again.

foobarbecue 4y ago

My user experience on this site: scroll to cool picture, click cool picture, click back button expecting to go back to text. Back button takes me back to hacker news, urgh. Click link to site again, scroll to where I was. Click next cool picture and forget that back is broken. Click back. Urgh! Actually I've tried to use the back button four times now and I guess it's best if I just don't finish reading the site. The back of the internet is broken... Very cool site though.

jerryjerryjerry 4y ago

Xerox PARC: the birthplace of many many many PC related technologies. It's so sad that the legend is gone.

memetomancer 4y ago

While looking up a reference image for another comment in this thread, I came across another cool GUI site: https://guidebookgallery.org/guis https://guidebookgallery.org/guis This seems much more comprehensive, has screenshots of specific UI elements and controls to view different tabs within those screenshots.

jccalhoun 4y ago

My first reaction is that it is disappointing that GUIs haven't changed all that much from Xerox. However, on second thought, how different is the user interface on a car from the 30s from a modern car? So maybe it isn't surprising that the GUI hasn't radically changed

epolanski 4y ago
> how different is the user interface on a car from the 30s from a modern car A lot I would say, even on a much smaller time scale. The features are completely different besides the very basic odometers which anyway look very different and present much different information. A modern car not only has much more features, but even the way of consuming the old ones is radically different, and not just because of the switch from analog to digital, e.g. steering wheels have seen a massive amount of analog buttons and levers. 2002 Mercedes Benz E class interior[1] 2022 Mercedes Benz E class interior[2] [1] https://autotech-miami.com/images/watermarked/3039zg.jpg https://autotech-miami.com/images/watermarked/3039zg.jpg [2] https://imgcdn.zigwheels.my/large/gallery/interior/17/481/mercedes-benz-e-class-coupe-dashboard-view-167873.jpg https://imgcdn.zigwheels.my/large/gallery/interior/17/481/me...
dredmorbius 4y ago
The MOAD got a lot of things right. There's only so much efficiency and clarity that can be squeezed out of a GUI. Familiarity and consistency are themselves powerful elements of UI/UX. Upshot: stop fucking with the interface. Apple, renowned for design, has essentially only ever offered two GUIs, "Classic Mac" (1984--1999) and "Aqua" (1999--2022) Note that the second has been in use longer than Classic, by over 60% (23/16 ~= 1.64). Good UIs don't change. Apple have tweaked at the edges, changed some of the styling and colours, and added features (e.g., workspaces / virtual desktops). But a user of the Classic Mac could sit down at a modern OSX system and figure it put pretty quickly. (I'm actually not a fan of the interface, though I generally use one based on a precursor / ancestor of it, WindowMaker, based on NeXTStep from the NeXT Machine.)

aimor 4y ago

The Windows 95 icons were so good. I'm comparing those to what I see in Windows 10 and it's kind of funny. Examples I think are much worse: Keyboard, Mouse, Accessibility Options/Ease Of Access, Network, Passwords/Credential Manager. What happened? Windows 95: https://history.user-interface.io/img/windows-95/settings.png https://history.user-interface.io/img/windows-95/settings.pn... Windows 10: https://i.ibb.co/SQkQNJw/Windows10.png https://i.ibb.co/SQkQNJw/Windows10.png

xrayarx 4y ago

To me it seems this is just to start a newsletter. At least one is promoted prominently. Maybe they are gauging interest…

AlbertCory 4y ago

I generally avoid slipping in overt promotion of my book [1], but this cries out for it. Find out how it really went down, what the debates were like, and what it was like to be there. This is a quickie, copy-and-paste job from publicly available sources. Mostly accurate, except for calling the Alto keyset "the Alto keyboard." As some of the comments point out, it's quite incomplete. [1] https://www.albertcory.io/inventing-the-future https://www.albertcory.io/inventing-the-future

b06timmer 4y ago
When payday rolls around again I'll get this, thanks for pointing it out.
- AlbertCory 4y ago
  Thank you!

ss48 4y ago

Great job. I liked seeing the hardware in the first two pictures. It gave an idea of what it was like interacting with the computer. Do you think you could add this for some of the other interfaces, even multiple form factors if they existed for the operating system?

scelerat 4y ago

Cool site! The title promises more than is delivered: computer user interfaces existed before the GUI, and interfaces to physical machines in general have existed for centuries, and a lot of those antecedents have influenced present-day computer interfaces.

scelerat 4y ago

"It [Amiga] uses a workbench metaphor (in place of the more common desktop metaphor) for representing file system organisation." Is "workbench" truly a different metaphor from "desktop," or is it just a different word used to avoid legal hassles?

stereocodes 4y ago

Didn't see Last Call BBS on there.

joaomoreno 4y ago

Hi author! Cool site. It was odd getting a "hi hacker news would you like to subscribe to my UI mailing list", but OK. But it was really not great seeing this [0] when I clicked "no", given the whole thing is about UI. 0: https://gcdnb.pbrd.co/images/wH0ONKrFlqSI.png?o=1 https://gcdnb.pbrd.co/images/wH0ONKrFlqSI.png?o=1

beefman 4y ago

I'd love to see GEM, Canon Cat, NeXTSTEP, and BeOS here https://en.wikipedia.org/wiki/GEM_(desktop_environment) https://en.wikipedia.org/wiki/GEM_(desktop_environment) https://en.wikipedia.org/wiki/Canon_Cat https://en.wikipedia.org/wiki/Canon_Cat https://en.wikipedia.org/wiki/NeXTSTEP https://en.wikipedia.org/wiki/NeXTSTEP https://en.wikipedia.org/wiki/BeOS https://en.wikipedia.org/wiki/BeOS

tablespoon 4y ago
> I'd love to see GEM, Canon Cat, NeXTSTEP, and BeOS here That would be good. I'd also like to see something that's at a much lower level, basically an catalog of specific ways of accomplishing specific basic tasks in a particular UI, current or historical. I've switched between different OSes, and each time I sorely miss some very particular thing (e.g. Windows' very useful line-based Home/End key behavior vs. Mac OS's totally pointless document-based behavior). I'm sure even dead-end OS's had very good ideas like these that have been subsequently lost. My weird dream is that some day someone could use a catalog like that to combine all the best ideas into something that's as close to perfect as possible.
- beefman 4y ago
  In the case of Home/End, are you missing ⌘ + ← and ⌘ + → ?
sys_64738 4y ago
Came here to say GEM too.

samstave 4y ago

Another interesting software to look at the UI/UX of is 3D design/animation software. From Softimage, ALIAS|Wavefront through Maya to Blender etc... This UI model is interesting. I personally started on Softimage on the SGI (Also, I didnt see IRIX in the list). But Softimage had one of the most novel UIs of its time.