How did you start using [x] in the design of graphical interfaces
A significant role in the friendly interaction of the user and the site are familiar controls. For example, a cross to close the window. The last few days on the Internet has been widely discussed one article about the origins of this element of the user interface and it even attracted the attention of one of the first developers of Windows 95, but more on that below.
In user interfaces, we see X everywhere. This powerful symbol can close work and pop-up windows, toolbars and tabs, and also remove everything that can interfere with you on the screen.
The use of clicking on [x] to close one or another element has become one of the basic instincts associated with computer use and has become a standard in the design of websites and computer applications. It may seem that the ubiquitous [x] has always been part of the interfaces, but this brief and fascinating insight into the history of user-defined graphical interfaces shows that in reality things are different.
')
So, where and when did [x] first hit the interface lexicon?
In order to go back to the moment when [x] appears, let's start with the current state of affairs: Microsoft.
If you use Windows, it means that right now you can find at least one [x] on your screen.
However, Windows 1.0 did not use [x] at all to close.
Windows 1.0
The same goes for 2.0 .
Windows 2.0
Well, what about 3.0 ?
Windows 3.0
[x] did not appear until the release of Windows 95, when the close button was moved to the right side, joining the “Minimize” and “Maximize” buttons.
Windows 95
There is even evidence that this was a later change in Windows 95. In the early demo version (codenamed Chicago), the Minimize and Maximize buttons received a redesign, but the Close button remained the same, as before on the left.
Windows Chicago, August 1993
So who was responsible for changing the solution at the last moment? As far as I can tell, this person is responsible for the rapid and widespread use of [x] in the design of user interfaces today.
From the very beginning, the development of Windows 95 was intended to make the computer appear on every desktop, in every home. The design changes in Windows 95 were based primarily on the Windows 3.0 usability feedback. It was necessary to make sure that any person unfamiliar with the world of computers could study Windows 95.
And it worked.
Windows 95 has eliminated all competing operating systems. She began to use home users and companies around the world.
However, today we are not aiming to catch that moment when [x] became popular. We rather need to know when he first appeared in the world of UI-design.
Can we find earlier examples of using [x] in GUI design?
Mac OS did not use [x] to close. For the first time, it appeared already in OS X and then, it was displayed only when you hover the red close button.
Mac OS 2: Beautiful colors!
Linux user interfaces also began to use this symbol only after the release of Windows 95.
Window System X Window System
No, this is not going away. Let's go back to the very beginning, when there was neither Windows, nor Linux, nor Mac OS, to the very first graphical user interface that fully used the well-known figurative analogy of the " desktop ": the Xerox 8010 information system.
Xerox 8108
Xerox began developing the 8101 system, also known as “The Xerox Star”, “ViewPoint”, or “GlobalView”, in 1977, first selling it in 1981 under the name “Dandelion” (dandelion - comment of the translator ). This is the very graphical user interface that Apple, inspired by a trip to the Xerox headquarters in 1979, allegedly used to create its Lisa / Mac OS.
However, [x] is missing here:
Xerox star
Let's remember that [x] is also not in the early Apple operating systems:
Mac OS 1
There was no [x] in the Visi On graphical interface, the first integrated graphical software environment for the IBM PC released in 1983:
Visi on
GEM user interface developed by Digital Research for DOS-based computers in 1984 (and again, it does not exist):
Gem
Wait, what is it ?! Is this really it?
Atari TOS 1.0
This is a screenshot of the Atari TOS 1.0 created by the Atari Corp computer division based on the GEM system for porting to the Atari ST in 1985. This is the earliest example of using the [x] button that I could find.
So why there? And why exactly?
This is another example of how Atari, an American company, borrowed an idea from Japanese culture. The first such example, of course, is the very name Atari, the Japanese term from the game of Go, which can be translated as "hit the mark."
Using [x] to close and [o] to open could go from Japanese characters to batsu and maru.
Maru (o) and Batsu (x)
The Batsu symbol is used to denote something wrong and can be translated as “wrong”, “bad”, “wrong” or the word “attack”, whereas maru (o) means “correct”, “true”, “good”, "Whole" or "very valuable." Batsu and maru are also often used as gestures. Cross your arms over your chest and turn out to be a bats, raise your arms above your head and join them in the shape of a circle - you depicted a mara.
Another example of using maru and bats can be found in the design of the Playstation controller, where they are used as “yes” and “no” respectively:
Playstation controller
However, this, of course, is only a theory. I can not say with certainty - because I was not there.
For a more thorough approach, let's see if we can go even further into the past.
The very first line text editor was Quick Editor, or qed , written in 1965 by Ken Thomson, who later helped develop Unix. Qed uses [q] as the exit command.
The first text editors used a bunch of very different commands to exit: [q], [e], [c], and [ESC], but [x] was not any popular option. Ed , em, and ex — early text editors that budded off qed sometime in 1971 did not use [x].
Could it be Vi , vim , emacs or edlin ?
No, there were no [x] in these editors either. X is usually used to remove characters in a string, but not to close a program.
Symbol [x] is a real icon. He is not some kind of message. It represents the action “close”, which from the very beginning and to this day was perceived in this way, regardless of the level of development of graphic operating systems. The first appearance of the symbol [x] in the design of user graphic interfaces most likely occurred in the Atari TOS, probably under the influence of the Japanese legend of bats and maru. And thanks to an unexpected change in the design of Windows 95 and the beginning of its mass use around the world, [x] has become a standard symbol for such an action as “close” - a symbol that today dominates the design of websites, applications and software.
Screenshot sources of toastytech.com/guis and whiteandnoisy.org
From the translator: while working on the translation, an update was made to this article, one of the developers of Windows 95 contacted the author and shared some new details.
UPDATE:
Wow, this little article has become so popular! I received many good instructions, comments and valuable information about where the use of [x] came from, but none of these messages compare with the letter that was sent to me by the Windows 95 development team member Daniel Oran:
“Hello Lauren!
My friend sent me your article "Click X to close." He recalled that I was working on Windows 95 at Microsoft, namely, on the Start button and the taskbar. It seemed to him that it would be interesting to me. The way it is! :)
It is always interesting to watch how the story is written about those old events that you personally experienced. I started working for Microsoft in 1992 as the Chicago user interface program manager, which eventually evolved into Windows 95.
In fact, it was not done at the last moment. During the whole of 1993, we considered a variety of design options for the Close button. And the idea was taken not from Atari, but from NeXT , which placed the [x] button in the upper right corner. Together with her, we borrowed Windows 95 and a pseudo-three-dimensional color scheme in shades of gray.
I wanted to place the “Close” button on the upper left, but this option was in conflict with the existing menu system, which appeared when you press the alt-space, as well as the new program icon, which was borrowed from OS / 2, on which Microsoft previously worked with Ibm.
I enclose the earliest Chicago image with the close button X that I could find. It is dated September 22, 1993. (Attaching a file to this letter, I only now realized that it is so old that its name can contain no more than eight characters - a restriction that existed before the release of Windows 95).
Thank you for this fascinating essay!
Windows Chicago 9/22/1993
In user interfaces, we see X everywhere. This powerful symbol can close work and pop-up windows, toolbars and tabs, and also remove everything that can interfere with you on the screen.
The use of clicking on [x] to close one or another element has become one of the basic instincts associated with computer use and has become a standard in the design of websites and computer applications. It may seem that the ubiquitous [x] has always been part of the interfaces, but this brief and fascinating insight into the history of user-defined graphical interfaces shows that in reality things are different.
')
So, where and when did [x] first hit the interface lexicon?
In order to go back to the moment when [x] appears, let's start with the current state of affairs: Microsoft.
If you use Windows, it means that right now you can find at least one [x] on your screen.
However, Windows 1.0 did not use [x] at all to close.
Windows 1.0
The same goes for 2.0 .
Windows 2.0
Well, what about 3.0 ?
Windows 3.0
[x] did not appear until the release of Windows 95, when the close button was moved to the right side, joining the “Minimize” and “Maximize” buttons.
Windows 95
There is even evidence that this was a later change in Windows 95. In the early demo version (codenamed Chicago), the Minimize and Maximize buttons received a redesign, but the Close button remained the same, as before on the left.
Windows Chicago, August 1993
So who was responsible for changing the solution at the last moment? As far as I can tell, this person is responsible for the rapid and widespread use of [x] in the design of user interfaces today.
From the very beginning, the development of Windows 95 was intended to make the computer appear on every desktop, in every home. The design changes in Windows 95 were based primarily on the Windows 3.0 usability feedback. It was necessary to make sure that any person unfamiliar with the world of computers could study Windows 95.
And it worked.
Windows 95 has eliminated all competing operating systems. She began to use home users and companies around the world.
However, today we are not aiming to catch that moment when [x] became popular. We rather need to know when he first appeared in the world of UI-design.
Can we find earlier examples of using [x] in GUI design?
Mac OS did not use [x] to close. For the first time, it appeared already in OS X and then, it was displayed only when you hover the red close button.
Mac OS 2: Beautiful colors!
Linux user interfaces also began to use this symbol only after the release of Windows 95.
Window System X Window System
No, this is not going away. Let's go back to the very beginning, when there was neither Windows, nor Linux, nor Mac OS, to the very first graphical user interface that fully used the well-known figurative analogy of the " desktop ": the Xerox 8010 information system.
Xerox 8108
Xerox began developing the 8101 system, also known as “The Xerox Star”, “ViewPoint”, or “GlobalView”, in 1977, first selling it in 1981 under the name “Dandelion” (dandelion - comment of the translator ). This is the very graphical user interface that Apple, inspired by a trip to the Xerox headquarters in 1979, allegedly used to create its Lisa / Mac OS.
However, [x] is missing here:
Xerox star
Let's remember that [x] is also not in the early Apple operating systems:
Mac OS 1
There was no [x] in the Visi On graphical interface, the first integrated graphical software environment for the IBM PC released in 1983:
Visi on
GEM user interface developed by Digital Research for DOS-based computers in 1984 (and again, it does not exist):
Gem
Wait, what is it ?! Is this really it?
Atari TOS 1.0
This is a screenshot of the Atari TOS 1.0 created by the Atari Corp computer division based on the GEM system for porting to the Atari ST in 1985. This is the earliest example of using the [x] button that I could find.
So why there? And why exactly?
This is another example of how Atari, an American company, borrowed an idea from Japanese culture. The first such example, of course, is the very name Atari, the Japanese term from the game of Go, which can be translated as "hit the mark."
Using [x] to close and [o] to open could go from Japanese characters to batsu and maru.
Maru (o) and Batsu (x)
The Batsu symbol is used to denote something wrong and can be translated as “wrong”, “bad”, “wrong” or the word “attack”, whereas maru (o) means “correct”, “true”, “good”, "Whole" or "very valuable." Batsu and maru are also often used as gestures. Cross your arms over your chest and turn out to be a bats, raise your arms above your head and join them in the shape of a circle - you depicted a mara.
Another example of using maru and bats can be found in the design of the Playstation controller, where they are used as “yes” and “no” respectively:
Playstation controller
However, this, of course, is only a theory. I can not say with certainty - because I was not there.
For a more thorough approach, let's see if we can go even further into the past.
The very first line text editor was Quick Editor, or qed , written in 1965 by Ken Thomson, who later helped develop Unix. Qed uses [q] as the exit command.
The first text editors used a bunch of very different commands to exit: [q], [e], [c], and [ESC], but [x] was not any popular option. Ed , em, and ex — early text editors that budded off qed sometime in 1971 did not use [x].
Could it be Vi , vim , emacs or edlin ?
No, there were no [x] in these editors either. X is usually used to remove characters in a string, but not to close a program.
Symbol [x] is a real icon. He is not some kind of message. It represents the action “close”, which from the very beginning and to this day was perceived in this way, regardless of the level of development of graphic operating systems. The first appearance of the symbol [x] in the design of user graphic interfaces most likely occurred in the Atari TOS, probably under the influence of the Japanese legend of bats and maru. And thanks to an unexpected change in the design of Windows 95 and the beginning of its mass use around the world, [x] has become a standard symbol for such an action as “close” - a symbol that today dominates the design of websites, applications and software.
Screenshot sources of toastytech.com/guis and whiteandnoisy.org
From the translator: while working on the translation, an update was made to this article, one of the developers of Windows 95 contacted the author and shared some new details.
UPDATE:
Wow, this little article has become so popular! I received many good instructions, comments and valuable information about where the use of [x] came from, but none of these messages compare with the letter that was sent to me by the Windows 95 development team member Daniel Oran:
“Hello Lauren!
My friend sent me your article "Click X to close." He recalled that I was working on Windows 95 at Microsoft, namely, on the Start button and the taskbar. It seemed to him that it would be interesting to me. The way it is! :)
It is always interesting to watch how the story is written about those old events that you personally experienced. I started working for Microsoft in 1992 as the Chicago user interface program manager, which eventually evolved into Windows 95.
So who was responsible for changing the solution at the last moment? As far as I can tell, this person is responsible for the rapid and widespread use of [x] in the design of user interfaces today.
In fact, it was not done at the last moment. During the whole of 1993, we considered a variety of design options for the Close button. And the idea was taken not from Atari, but from NeXT , which placed the [x] button in the upper right corner. Together with her, we borrowed Windows 95 and a pseudo-three-dimensional color scheme in shades of gray.
I wanted to place the “Close” button on the upper left, but this option was in conflict with the existing menu system, which appeared when you press the alt-space, as well as the new program icon, which was borrowed from OS / 2, on which Microsoft previously worked with Ibm.
I enclose the earliest Chicago image with the close button X that I could find. It is dated September 22, 1993. (Attaching a file to this letter, I only now realized that it is so old that its name can contain no more than eight characters - a restriction that existed before the release of Windows 95).
Thank you for this fascinating essay!
Windows Chicago 9/22/1993
Source: https://habr.com/ru/post/233461/
All Articles