5 ms·

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

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.
SeanLuke 4y ago
I was dumbfounded to find NeXTSTEP missing: it was among the very most influential GUIs in history. Much of 95's UI (and OS/2's UI) were stolen directly from it, and badly, right down to icons. This page also seems to focus not on UIs, not on GUIs, but just on GUIs for personal computers. No discussion of the tablet->PDA->phone->small device UI evolution at all, even though that UI route has now had profound impact even on laptops. Where's the Newton?
- eesmith 4y ago
  Did you notice how nearly all the text was copy/pasted from Wikipedia? Though the KDE one was copy/pasted from the initial KDE email.
  - AlbertoGP 4y ago
    You seem to be right: I just picked one, “Xerox Star”, and it is copied from Wikipedia with a couple of changes: “was” → “is”, “mouse” → “mouse (two-button)” I think that putting attributions on each entry would be too distracting, I’d rather keep the clean style that focuses on the content, but there should be some attribution in the page footer. Edit: Wow, also the pictures are lifted without attribution as noted in this other post: https://news.ycombinator.com/item?id=32093743 https://news.ycombinator.com/item?id=32093743
- ArtWomb 4y ago
  MIT Project Athena was also hugely influential: X Windows wasn't the only thing to spin out, but MATLAB and other pre-cursors of today's Jupyter style notebooks. The VAX super-mini grid could be used at night as a renderfarm ;) https://en.wikipedia.org/wiki/Project_Athena https://en.wikipedia.org/wiki/Project_Athena
  - SeanLuke 4y ago
    To be honest, I think Athena and X have had very little influence. X's GUI design (and the Athena widget set) was entirely derivative of the Lisa/Mac interface. The notion of a client-server GUI system -- a historic extension of Unix terminals and servers -- has largely failed and is now disuse on modern Unix systems. The idea of a customizable window server has not spread beyond X to any other major system to my knowledge. Its font subsystem, graphics subsystem, and event management was and remains astonishingly primitive. It's hard to think of anything X innovated that now appears in a modern GUI. Despite what the random Wikipedia contributor implied, neither MATLAB nor Maple have any historical relationship with X Windows or Project Athena. It is a huge stretch to say that Athena invented the concept of per-course educational and research software given that Apple had been doing that nearly a decade before, and indeed had built its entire business model on the concept. And the precursor to Jupyter notebooks was Mathematica, full stop. Mathematica invented the very concept of the interactive notebook, and it did so on NeXTSTEP.
kristopolous 4y ago
I was honestly expecting it to start with things like arithmometers (https://www.youtube.com/watch?v=ppXnnWAssoI https://www.youtube.com/watch?v=ppXnnWAssoI), Cooke and Wheatstone 5-needle telegraphs (https://m.youtube.com/shorts/YKSCqtKZOwg https://m.youtube.com/shorts/YKSCqtKZOwg), or perhaps a dictaphone (https://en.wikipedia.org/wiki/Dictaphone https://en.wikipedia.org/wiki/Dictaphone) and what about the rich history of fax machines such as the Pantelegraph (https://en.m.wikipedia.org/wiki/Pantelegraph https://en.m.wikipedia.org/wiki/Pantelegraph). Here's a newspaper being printed by radiofax in the 1930s for instance (https://commons.m.wikimedia.org/wiki/File:Krant_per_fax_-_Faxed_newspaper_(4193509648).jpg#mw-jump-to-license https://commons.m.wikimedia.org/wiki/File:Krant_per_fax_-_Fa...) Speaking of communications, there's things like Strowger switches (https://m.youtube.com/watch?v=xZePwin92cI&t=111 https://m.youtube.com/watch?v=xZePwin92cI&t=111) which I think count because that's what people were interfacing whilst using the phone (this became crossbars and relays in the 1910s and 20s respectively) Relays and telephone tech btw is how Electro the smoking robot from the 1939 world's fair worked (https://m.youtube.com/watch?v=AuyTRbj8QSA https://m.youtube.com/watch?v=AuyTRbj8QSA) Even if we want to limit to computers, we have batch versus time-sharing flow, teletype versus graphical terminals and along those lines you have the work of groups like Evans & Sutherland in the 1970s (such as the line drawing system 1 https://en.wikipedia.org/wiki/LDS-1_(Line_Drawing_System-1) https://en.wikipedia.org/wiki/LDS-1_(Line_Drawing_System-1) ) or Scientific Data Systems which was later acquired by Xerox. You also have the world of analog computers, the most famous of which is the slide rule. Even then you can go back to the 19th century Jacquard Loom, which even has a solution to "Hello World" on Rosetta Code (https://rosettacode.org/wiki/Category:Jacquard_Loom https://rosettacode.org/wiki/Category:Jacquard_Loom) Then you have specialty machines such as the Fairlight CMI synthesizer with the lightpen interface (https://m.youtube.com/watch?v=iOlPCpSmhRM&t=40 https://m.youtube.com/watch?v=iOlPCpSmhRM&t=40) which really laid the groundwork of most DAWs to this day. For music there's lots of things. The theremin which you all know about but also things like Nikolai Voinov's "Paper Sound" https://m.youtube.com/watch?v=Mmejo9WL2gY https://m.youtube.com/watch?v=Mmejo9WL2gY You also have 1970s CAD computers, many of which were built by large companies like Mercedes, Nissan, Ford and General Motors (https://www.cadazz.com/cad-software-history-1970s.htm https://www.cadazz.com/cad-software-history-1970s.htm) Then there's video compositing systems as well such as the lightpen based CMX-600 from 1971: https://www.youtube.com/watch?v=PTUdHncIbq8 https://www.youtube.com/watch?v=PTUdHncIbq8 The history is way richer then this. Nobody has really given it a good general effort IMHO. Maybe I'm the guy? I hope not. That's a lot of work.
teddyh 4y ago
Someone else already mentioned guidebookgallery.org, so I’ll just also mention the Museum of UI: https://ui.codexpanse.com/ https://ui.codexpanse.com/
rwmj 4y ago
It also misses all the "text GUI" interfaces found on eg. MS-DOS and mainframes. These are super-efficient to navigate and use using just a keyboard, and extremely fast for data entry in comparison to modern systems.
- sixothree 4y ago
  https://en.wikipedia.org/wiki/Turbo_Vision https://en.wikipedia.org/wiki/Turbo_Vision
- epolanski 4y ago
  Isn't a "text gui" simply a text user interface? https://en.wikipedia.org/wiki/Text-based_user_interface https://en.wikipedia.org/wiki/Text-based_user_interface
Anthony-G 4y ago
Thanks for the Toasty Tech link. It looks like some of the screenshots in the featured article are actually from Toasty Tech, e.g., this Visi On Word screenshot: https://history.user-interface.io/img/visi-on/word.gif https://history.user-interface.io/img/visi-on/word.gif http://toastytech.com/guis/visionword.gif http://toastytech.com/guis/visionword.gif
Narishma 4y ago
I think they just took random screenshots from toasty tech and presented them differently, often mislabeling them in the process.
jecel 4y ago
Actually, the NeXTStep style was adopted by Windows 3.1 and that made it look subtly different from 3.0. Given the timing, I think the actual direct influence on Windows 3.1 was Motif, which in turn was inspired by NeXTStep. When the NeXT was announced I thought it had been influenced by Randy Smith's (Xerox Parc) ARK (Alternate Reality Kit): http://worrydream.com/refs/Smith%20-%20Experiences%20With%20The%20Alternate%20Reality%20Kit.pdf http://worrydream.com/refs/Smith%20-%20Experiences%20With%20... But it might just have been a coincidence.
- flomo 4y ago
  IIRC, Microsoft actually had an hand in Motif, which followed the IBM Common User Access spec. Some of this I suspect was for legal reasons with Apple suing everyone.
unsafecast 4y ago
Would've also loved to see Oberon and Plan 9 on there. The list just seems to be some random choices of mainstream GUIs.
jimmySixDOF 4y ago
Yes, CLI is missing from the study but so are alternatives like Natural and Tangible and Zoomable. NUI/TUI/ZUI/3DUIs are all very relevant for Spatial Computing and have historical antecedents worthy of note here too.
chem83 4y ago
Nice collection, indeed. Usually (and it seems to be the case here), UI studies/collections tend to emphasize operating systems and shells, but there's some very interesting UI paradigms brought on by applications. For example: music software like Fruit Loops and Native Instruments, skeuomorphism from audio plugins; or graphical software like the flow-based shader modeler in Blender, the quad menu in 3DSMax, the dark mode on Autodesk Flame/Flint/Inferno/Smoke; or the MS ribbon; or things like IntelliSense etc.
egberts1 4y ago
also OpenWin by Sun Microsystems

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.

SeanLuke 4y ago

I was dumbfounded to find NeXTSTEP missing: it was among the very most influential GUIs in history. Much of 95's UI (and OS/2's UI) were stolen directly from it, and badly, right down to icons. This page also seems to focus not on UIs, not on GUIs, but just on GUIs for personal computers. No discussion of the tablet->PDA->phone->small device UI evolution at all, even though that UI route has now had profound impact even on laptops. Where's the Newton?

eesmith 4y ago
Did you notice how nearly all the text was copy/pasted from Wikipedia? Though the KDE one was copy/pasted from the initial KDE email.
- AlbertoGP 4y ago
  You seem to be right: I just picked one, “Xerox Star”, and it is copied from Wikipedia with a couple of changes: “was” → “is”, “mouse” → “mouse (two-button)” I think that putting attributions on each entry would be too distracting, I’d rather keep the clean style that focuses on the content, but there should be some attribution in the page footer. Edit: Wow, also the pictures are lifted without attribution as noted in this other post: https://news.ycombinator.com/item?id=32093743 https://news.ycombinator.com/item?id=32093743
ArtWomb 4y ago
MIT Project Athena was also hugely influential: X Windows wasn't the only thing to spin out, but MATLAB and other pre-cursors of today's Jupyter style notebooks. The VAX super-mini grid could be used at night as a renderfarm ;) https://en.wikipedia.org/wiki/Project_Athena https://en.wikipedia.org/wiki/Project_Athena
- SeanLuke 4y ago
  To be honest, I think Athena and X have had very little influence. X's GUI design (and the Athena widget set) was entirely derivative of the Lisa/Mac interface. The notion of a client-server GUI system -- a historic extension of Unix terminals and servers -- has largely failed and is now disuse on modern Unix systems. The idea of a customizable window server has not spread beyond X to any other major system to my knowledge. Its font subsystem, graphics subsystem, and event management was and remains astonishingly primitive. It's hard to think of anything X innovated that now appears in a modern GUI. Despite what the random Wikipedia contributor implied, neither MATLAB nor Maple have any historical relationship with X Windows or Project Athena. It is a huge stretch to say that Athena invented the concept of per-course educational and research software given that Apple had been doing that nearly a decade before, and indeed had built its entire business model on the concept. And the precursor to Jupyter notebooks was Mathematica, full stop. Mathematica invented the very concept of the interactive notebook, and it did so on NeXTSTEP.

kristopolous 4y ago

I was honestly expecting it to start with things like arithmometers (https://www.youtube.com/watch?v=ppXnnWAssoI https://www.youtube.com/watch?v=ppXnnWAssoI), Cooke and Wheatstone 5-needle telegraphs (https://m.youtube.com/shorts/YKSCqtKZOwg https://m.youtube.com/shorts/YKSCqtKZOwg), or perhaps a dictaphone (https://en.wikipedia.org/wiki/Dictaphone https://en.wikipedia.org/wiki/Dictaphone) and what about the rich history of fax machines such as the Pantelegraph (https://en.m.wikipedia.org/wiki/Pantelegraph https://en.m.wikipedia.org/wiki/Pantelegraph). Here's a newspaper being printed by radiofax in the 1930s for instance (https://commons.m.wikimedia.org/wiki/File:Krant_per_fax_-_Faxed_newspaper_(4193509648).jpg#mw-jump-to-license https://commons.m.wikimedia.org/wiki/File:Krant_per_fax_-_Fa...) Speaking of communications, there's things like Strowger switches (https://m.youtube.com/watch?v=xZePwin92cI&t=111 https://m.youtube.com/watch?v=xZePwin92cI&t=111) which I think count because that's what people were interfacing whilst using the phone (this became crossbars and relays in the 1910s and 20s respectively) Relays and telephone tech btw is how Electro the smoking robot from the 1939 world's fair worked (https://m.youtube.com/watch?v=AuyTRbj8QSA https://m.youtube.com/watch?v=AuyTRbj8QSA) Even if we want to limit to computers, we have batch versus time-sharing flow, teletype versus graphical terminals and along those lines you have the work of groups like Evans & Sutherland in the 1970s (such as the line drawing system 1 https://en.wikipedia.org/wiki/LDS-1_(Line_Drawing_System-1) https://en.wikipedia.org/wiki/LDS-1_(Line_Drawing_System-1) ) or Scientific Data Systems which was later acquired by Xerox. You also have the world of analog computers, the most famous of which is the slide rule. Even then you can go back to the 19th century Jacquard Loom, which even has a solution to "Hello World" on Rosetta Code (https://rosettacode.org/wiki/Category:Jacquard_Loom https://rosettacode.org/wiki/Category:Jacquard_Loom) Then you have specialty machines such as the Fairlight CMI synthesizer with the lightpen interface (https://m.youtube.com/watch?v=iOlPCpSmhRM&t=40 https://m.youtube.com/watch?v=iOlPCpSmhRM&t=40) which really laid the groundwork of most DAWs to this day. For music there's lots of things. The theremin which you all know about but also things like Nikolai Voinov's "Paper Sound" https://m.youtube.com/watch?v=Mmejo9WL2gY https://m.youtube.com/watch?v=Mmejo9WL2gY You also have 1970s CAD computers, many of which were built by large companies like Mercedes, Nissan, Ford and General Motors (https://www.cadazz.com/cad-software-history-1970s.htm https://www.cadazz.com/cad-software-history-1970s.htm) Then there's video compositing systems as well such as the lightpen based CMX-600 from 1971: https://www.youtube.com/watch?v=PTUdHncIbq8 https://www.youtube.com/watch?v=PTUdHncIbq8 The history is way richer then this. Nobody has really given it a good general effort IMHO. Maybe I'm the guy? I hope not. That's a lot of work.

teddyh 4y ago

Someone else already mentioned guidebookgallery.org, so I’ll just also mention the Museum of UI: https://ui.codexpanse.com/ https://ui.codexpanse.com/

rwmj 4y ago

It also misses all the "text GUI" interfaces found on eg. MS-DOS and mainframes. These are super-efficient to navigate and use using just a keyboard, and extremely fast for data entry in comparison to modern systems.

sixothree 4y ago
https://en.wikipedia.org/wiki/Turbo_Vision https://en.wikipedia.org/wiki/Turbo_Vision
epolanski 4y ago
Isn't a "text gui" simply a text user interface? https://en.wikipedia.org/wiki/Text-based_user_interface https://en.wikipedia.org/wiki/Text-based_user_interface

Anthony-G 4y ago

Thanks for the Toasty Tech link. It looks like some of the screenshots in the featured article are actually from Toasty Tech, e.g., this Visi On Word screenshot: https://history.user-interface.io/img/visi-on/word.gif https://history.user-interface.io/img/visi-on/word.gif http://toastytech.com/guis/visionword.gif http://toastytech.com/guis/visionword.gif

Narishma 4y ago

I think they just took random screenshots from toasty tech and presented them differently, often mislabeling them in the process.

jecel 4y ago

Actually, the NeXTStep style was adopted by Windows 3.1 and that made it look subtly different from 3.0. Given the timing, I think the actual direct influence on Windows 3.1 was Motif, which in turn was inspired by NeXTStep. When the NeXT was announced I thought it had been influenced by Randy Smith's (Xerox Parc) ARK (Alternate Reality Kit): http://worrydream.com/refs/Smith%20-%20Experiences%20With%20The%20Alternate%20Reality%20Kit.pdf http://worrydream.com/refs/Smith%20-%20Experiences%20With%20... But it might just have been a coincidence.

flomo 4y ago
IIRC, Microsoft actually had an hand in Motif, which followed the IBM Common User Access spec. Some of this I suspect was for legal reasons with Apple suing everyone.

unsafecast 4y ago

Would've also loved to see Oberon and Plan 9 on there. The list just seems to be some random choices of mainstream GUIs.

jimmySixDOF 4y ago

Yes, CLI is missing from the study but so are alternatives like Natural and Tangible and Zoomable. NUI/TUI/ZUI/3DUIs are all very relevant for Spatial Computing and have historical antecedents worthy of note here too.

chem83 4y ago

Nice collection, indeed. Usually (and it seems to be the case here), UI studies/collections tend to emphasize operating systems and shells, but there's some very interesting UI paradigms brought on by applications. For example: music software like Fruit Loops and Native Instruments, skeuomorphism from audio plugins; or graphical software like the flow-based shader modeler in Blender, the quad menu in 3DSMax, the dark mode on Autodesk Flame/Flint/Inferno/Smoke; or the MS ribbon; or things like IntelliSense etc.

egberts1 4y ago

also OpenWin by Sun Microsystems