Немалую роль в дружественном взаимодействии пользователя и сайта играют привычные элементы управления. Например, крестик для закрытия окна. Последние несколько дней в интернете широко обсуждалась одна статья об истоках возникновения этого элемента пользовательского интерфейса и она даже привлекла внимание одного из первых разработчиков Windows 95, но об этом ниже.
В пользовательских интерфейсах мы видим X повсеместно. Этот могущественный символ способен закрывать рабочие и всплывающие окна, панели инструментов и вкладки, а также убрать вообще все, что только может создать вам помехи на экране.
Использование нажатия на [x] для того, чтобы закрыть тот или иной элемент превратилось в один из основных инстинктов, связанных с использованием компьютера и стало стандартом в дизайне веб-сайтов и компьютерных приложений. Может показаться, что вездесущий [x] всегда был частью интерфейсов, однако этот короткий и увлекательный экскурс в историю пользовательских графических интерфейсов показывает, что на самом деле дела обстоят иначе.
Итак, где и когда [х] впервые попал в лексикон интерфейсов?
![image](https://habrastorage.org/r/w1560/getpro/habr/post_images/5ce/f8c/a31/5cef8ca31e1406ba06c126c2324801bf.png)
Для того, чтобы вернуться назад к моменту появления [x], давайте начнем с текущего положения дел: Microsoft.
Если вы используете Windows, значит, вы прямо сейчас можете найти у себя на экране хотя бы один [х].
![](https://habrastorage.org/r/w1560/files/d25/314/a25/d25314a251d94f4f9d092be8e76ee65b.png)
Однако Windows 1.0 вообще не использовала [x] для закрытия.
![image](https://habrastorage.org/getpro/habr/post_images/424/be8/af7/424be8af78742ed3e0d8dde0c2a750e1.gif)
Windows 1.0
Тоже самое касается и 2.0.
![](https://habrastorage.org/getpro/habr/post_images/8b8/df0/325/8b8df03256d6e4df246b900d7c324b6f.gif)
Windows 2.0
Ну а как насчет 3.0?
![image](https://habrastorage.org/getpro/habr/post_images/e47/334/94a/e4733494aff68cf50af31798cdd500fb.gif)
Windows 3.0
[x] не появлялась вплоть до выхода Windows 95, когда кнопка закрытия была перемещена на правую сторону, присоединившись к кнопкам «Свернуть» и «Развернуть».
![image](https://habrastorage.org/r/w1560/getpro/habr/post_images/ca8/6ee/a03/ca86eea0336a4086fc8a4b575c229951.png)
Windows 95
Существует даже доказательство того, что это было позднее изменение в Windows 95. В ранней демонстрационной версии (под кодовым именем Chicago), кнопки «Свернуть» и «Развернуть» получили редизайн, однако кнопка «Закрыть» осталась такой же, располагаясь, как и раньше, слева.
![image](https://habrastorage.org/getpro/habr/post_images/e76/a7b/f30/e76a7bf30ffb158d6dbf5db8cd7a6e20.gif)
Windows Chicago, August 1993
Так кто же отвечал за изменение решения в последний момент? Насколько я могу судить, этот человек ответственен за быстрое и широкое распространение использования [x] в дизайне пользовательских интерфейсов сегодня.
За разработкой Windows 95 с самого начала стояло намерение сделать так, чтобы компьютер появился на каждом рабочем столе, в каждом доме. Изменения дизайна в Windows 95 основывались прежде всего на обратной связи по юзабилити Windows 3.0. Необходимо было убедиться, что любой незнакомый с миром компьютеров человек смог бы изучить Windows 95.
И это сработало.
Windows 95 устранила все конкурирующие операционные системы. Ее стали использовать домашние пользователи и компании по всему миру.
Однако сегодня мы не ставим целью поймать тот момент, когда [x] стал популярен. Нам скорее нужно узнать, когда он впервые появился в мире UI-дизайна.
Можем ли мы найти более ранние примеры использования [x] в дизайне графических интерфейсов?
Mac OS не использовала [x] для закрытия. Впервые, он появился уже в OS X и то, отображался он только при наведении на красную кнопку закрытия.
![](https://habrastorage.org/getpro/habr/post_images/074/441/694/074441694c5ad7e5bc4d57d63fc9520c.gif)
Mac OS 2: Красивые цвета!
Пользовательские интерфейсы Linux также начали использовать этот символ только после выпуска Windows 95.
![image](https://habrastorage.org/r/w1560/getpro/habr/post_images/3e5/8c3/117/3e58c311745ea526c2f93cf243fbed67.png)
Оконная система X Window System
Нет, так мы далеко не уйдем. Давайте вернемся обратно к самому началу, когда еще не было ни Windows, ни Linux, ни Mac OS, к самому первому графическому пользовательскому интерфейсу, который полностью использовал хорошо знакомую всем нам образную аналогию "рабочего стола": информационную систему 8010 от Xerox.
![](https://habrastorage.org/r/w780q1/getpro/habr/post_images/2d1/b28/2d3/2d1b282d34c5ca54ee3ea23cfbb89ce1.jpg)
Xerox 8108
Xerox начала разработку системы 8101, также известной, как “The Xerox Star”, “ViewPoint”, или “GlobalView”, в 1977 году, впервые продав ее в 1981 года под названием «Dandelion» (одуванчик — прим. переводчика). Это и есть тот самый графический пользовательский интерфейс, который Apple, вдохновленная поездкой в штаб-квартиру Xerox в 1979, предположительно использовала для создания своих Lisa/Mac OS.
Однако, [х] здесь отсутствует:
![](https://habrastorage.org/getpro/habr/post_images/547/299/c17/547299c17570402f248245855f62b6c9.gif)
Xerox Star
Давайте вспомним, что [х] также нет и в ранних операционных системах Apple:
![](https://habrastorage.org/getpro/habr/post_images/43d/b25/d98/43db25d985497d6c1f015c2fea1d22c7.gif)
Mac OS 1
Никакого [х] не было и в графическом интерфейсе Visi On, первой интегрированной графической программной среде для IBM PC, выпущенного в 1983 году:
![](https://habrastorage.org/getpro/habr/post_images/e68/d99/122/e68d9912219de101f4b0bbb9cb251ced.gif)
Visi On
Пользовательский интерфейс GEM, разработанный компанией Digital Research для компьютеров на базе DOS в 1984 (и снова, его нет):
![](https://habrastorage.org/getpro/habr/post_images/45a/20d/2e1/45a20d2e17439bb4932b42aa8baf3d2b.gif)
GEM
Стойте, что это?! Неужели это оно?
![](https://habrastorage.org/r/w1560/getpro/habr/post_images/4a3/39a/d80/4a339ad80838e9ee4c91079157c97d32.png)
Atari TOS 1.0
Это скриншот Atari TOS 1.0, созданной компьютерным подразделением Atari Corp на основе системы GEM для последующего портирования на Atari ST в 1985 году. Это самый ранний пример использования кнопки [x], который я только смог найти.
Так почему же там? И почему именно тогда?
Это очередной пример того, как Atari, американская компания, позаимствовала идею из японской культуры. Первым таким примером, конечно же является само название Atari, японский термин из игры Го, который можно перевести как «попасть точно в цель».
Использование [x] для закрытия и [o] для открытия могло пойти от японских символов батсу и мару.
![](https://habrastorage.org/r/w1560/getpro/habr/post_images/c4b/0f9/88c/c4b0f988c84dbc0ec7bdc2d3199401e9.png)
Maru (o) and Batsu (x)
Символ Батсу используется для обозначения чего-то неправильного и может переводится, как «ошибочный», «плохой», «неправильный» или словом «атака», тогда как мару (o) означает «правильный», «истинный», «хороший», «целый» или «очень ценный». Батсу и мару также часто употребляются как жесты. Скрестите руки на груди и получиться батсу, поднимите руки над головой и соедините их в форме круга — вы изобразили мару.
Другой пример использования мару и батсу можно найти в дизайне контроллера Playstation, где они используются в качестве «да» и «нет» соответственно:
![](https://habrastorage.org/r/w780q1/getpro/habr/post_images/deb/0c1/229/deb0c12298ffb000f00f8655efc5aaec.jpg)
Playstation Controller
Однако это, конечно же, всего лишь теория. Я не могу с уверенностью сказать — меня ведь там не было.
Для большей основательности подхода, давайте посмотрим, удастся ли нам еще больше углубиться в прошлое.
Самым первым строчным текстовым редактором был Quick Editor, или qed, написанный в 1965 году Кеном Томсоном, который позже помогал разрабатывать Unix. Qed использует [q] в качестве команды для выхода.
Первые текстовые редакторы использовали кучу самых разных команд для выхода: [q], [e], [c], и [ESC], однако [x] не был сколько-нибудь популярным вариантом. Ed, em и ex — ранние текстовые редакторы, отпочковавшиеся от qed где-то в 1971, не использовали [x].
Может быть Vi, vim, emacs или edlin?
Нет, в эти редакторах также не было никаких [x]. X обычно использовался для удаления символов в строке, но не для закрытия программы.
Символ [x] — самая настоящая икона. Он не является каким-то посланием. Он представляет из себя действие «закрыть», которое с самого начала и по сей день воспринималось именно так, независимо от уровня развития графических операционных систем. Первое появление символа [x] в дизайне пользовательских графических интерфейсов скорее всего произошло в Atari TOS, вероятно, под влиянием японских условных обозначений батсу и мару. А благодаря неожиданному изменению в дизайне Windows 95 и началу массового ее использования по всему миру, [x] превратился в стандартный символ для такого действия, как «закрыть» — символ, который сегодня господствует в дизайне веб-сайтов, приложений и программного обеспечения.
Источники скриншотов toastytech.com/guis и whiteandnoisy.org
От переводчика: за время работы над переводом вышел апдейт к этой статье, с автором связался один из разработчиков Windows 95 и поделился некоторыми новыми подробностями.
UPDATE:
Надо же, эта маленькая статья стала такой популярной! Я получил много хороших указаний, комментариев и ценной информации о том, откуда пошло использование [х], однако ни одно из этих сообщений не сравнится с письмом, которое мне прислал член команды разработчиков Windows 95 Дэниел Оран:
«Привет Лорен!
Мой друг переслал мне твою статью «Нажмите X, чтобы закрыть». Он вспомнил, что я работал над Windows 95 в Microsoft, а именно над кнопкой «Пуск» и панелью задач. Ему показалось, что мне это будет интересно. Так оно и есть! :)
Всегда интересно наблюдать за тем, как пишется история о тех давних событиях, которые ты пережил лично. Я начал работать в Microsoft в 1992 году, программным менеджером пользовательского интерфейса «Chicago», которая в конечном счете превратилась в Windows 95.
На самом деле оно не было сделано в последний момент. В течении всего 1993 года, мы рассмотрели множество вариантов дизайна кнопки «Закрыть». А идея была взята не у Atari, а у NeXT, которые разместили кнопку [х] в правом верхнем углу. Вместе с ней мы позаимствовали для Windows 95 и псевдо-трехмерное цветовое решение в серых тонах.
Я хотел расположить кнопку «Закрыть» слева сверху, однако этот вариант конфликтовал с существующих тогда в системе меню, которое появлялось при нажатии alt-пробел, а также новой иконкой программы, которая была позаимствована из OS/2, над которой Microsoft ранее работала вместе с IBM.
Я прилагаю к письму самое раннее изображение Chicago с кнопкой X для закрытия, которое только смог найти. Оно датирована 22 сентябрем 1993 года. (Прикрепляя файл к этому письму, я только сейчас понял, что оно настолько старое, что его имя может содержать не более восьми символов — ограничение, которое существовало до выхода Windows 95).
Спасибо вам за это увлекательное эссе!
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/a2a/36c/abb/a2a36cabb5aefdb139f94cf311c9285c.jpg)
Windows Chicago 9/22/1993
В пользовательских интерфейсах мы видим X повсеместно. Этот могущественный символ способен закрывать рабочие и всплывающие окна, панели инструментов и вкладки, а также убрать вообще все, что только может создать вам помехи на экране.
Использование нажатия на [x] для того, чтобы закрыть тот или иной элемент превратилось в один из основных инстинктов, связанных с использованием компьютера и стало стандартом в дизайне веб-сайтов и компьютерных приложений. Может показаться, что вездесущий [x] всегда был частью интерфейсов, однако этот короткий и увлекательный экскурс в историю пользовательских графических интерфейсов показывает, что на самом деле дела обстоят иначе.
Итак, где и когда [х] впервые попал в лексикон интерфейсов?
![image](https://habrastorage.org/getpro/habr/post_images/5ce/f8c/a31/5cef8ca31e1406ba06c126c2324801bf.png)
Для того, чтобы вернуться назад к моменту появления [x], давайте начнем с текущего положения дел: Microsoft.
Если вы используете Windows, значит, вы прямо сейчас можете найти у себя на экране хотя бы один [х].
![](https://habrastorage.org/files/d25/314/a25/d25314a251d94f4f9d092be8e76ee65b.png)
Однако Windows 1.0 вообще не использовала [x] для закрытия.
![image](https://habrastorage.org/getpro/habr/post_images/424/be8/af7/424be8af78742ed3e0d8dde0c2a750e1.gif)
Windows 1.0
Тоже самое касается и 2.0.
![](https://habrastorage.org/getpro/habr/post_images/8b8/df0/325/8b8df03256d6e4df246b900d7c324b6f.gif)
Windows 2.0
Ну а как насчет 3.0?
![image](https://habrastorage.org/getpro/habr/post_images/e47/334/94a/e4733494aff68cf50af31798cdd500fb.gif)
Windows 3.0
[x] не появлялась вплоть до выхода Windows 95, когда кнопка закрытия была перемещена на правую сторону, присоединившись к кнопкам «Свернуть» и «Развернуть».
![image](https://habrastorage.org/getpro/habr/post_images/ca8/6ee/a03/ca86eea0336a4086fc8a4b575c229951.png)
Windows 95
Существует даже доказательство того, что это было позднее изменение в Windows 95. В ранней демонстрационной версии (под кодовым именем Chicago), кнопки «Свернуть» и «Развернуть» получили редизайн, однако кнопка «Закрыть» осталась такой же, располагаясь, как и раньше, слева.
![image](https://habrastorage.org/getpro/habr/post_images/e76/a7b/f30/e76a7bf30ffb158d6dbf5db8cd7a6e20.gif)
Windows Chicago, August 1993
Так кто же отвечал за изменение решения в последний момент? Насколько я могу судить, этот человек ответственен за быстрое и широкое распространение использования [x] в дизайне пользовательских интерфейсов сегодня.
За разработкой Windows 95 с самого начала стояло намерение сделать так, чтобы компьютер появился на каждом рабочем столе, в каждом доме. Изменения дизайна в Windows 95 основывались прежде всего на обратной связи по юзабилити Windows 3.0. Необходимо было убедиться, что любой незнакомый с миром компьютеров человек смог бы изучить Windows 95.
И это сработало.
Windows 95 устранила все конкурирующие операционные системы. Ее стали использовать домашние пользователи и компании по всему миру.
Однако сегодня мы не ставим целью поймать тот момент, когда [x] стал популярен. Нам скорее нужно узнать, когда он впервые появился в мире UI-дизайна.
Можем ли мы найти более ранние примеры использования [x] в дизайне графических интерфейсов?
Mac OS не использовала [x] для закрытия. Впервые, он появился уже в OS X и то, отображался он только при наведении на красную кнопку закрытия.
![](https://habrastorage.org/getpro/habr/post_images/074/441/694/074441694c5ad7e5bc4d57d63fc9520c.gif)
Mac OS 2: Красивые цвета!
Пользовательские интерфейсы Linux также начали использовать этот символ только после выпуска Windows 95.
![image](https://habrastorage.org/getpro/habr/post_images/3e5/8c3/117/3e58c311745ea526c2f93cf243fbed67.png)
Оконная система X Window System
Нет, так мы далеко не уйдем. Давайте вернемся обратно к самому началу, когда еще не было ни Windows, ни Linux, ни Mac OS, к самому первому графическому пользовательскому интерфейсу, который полностью использовал хорошо знакомую всем нам образную аналогию "рабочего стола": информационную систему 8010 от Xerox.
![](https://habrastorage.org/getpro/habr/post_images/2d1/b28/2d3/2d1b282d34c5ca54ee3ea23cfbb89ce1.jpg)
Xerox 8108
Xerox начала разработку системы 8101, также известной, как “The Xerox Star”, “ViewPoint”, или “GlobalView”, в 1977 году, впервые продав ее в 1981 года под названием «Dandelion» (одуванчик — прим. переводчика). Это и есть тот самый графический пользовательский интерфейс, который Apple, вдохновленная поездкой в штаб-квартиру Xerox в 1979, предположительно использовала для создания своих Lisa/Mac OS.
Однако, [х] здесь отсутствует:
![](https://habrastorage.org/getpro/habr/post_images/547/299/c17/547299c17570402f248245855f62b6c9.gif)
Xerox Star
Давайте вспомним, что [х] также нет и в ранних операционных системах Apple:
![](https://habrastorage.org/getpro/habr/post_images/43d/b25/d98/43db25d985497d6c1f015c2fea1d22c7.gif)
Mac OS 1
Никакого [х] не было и в графическом интерфейсе Visi On, первой интегрированной графической программной среде для IBM PC, выпущенного в 1983 году:
![](https://habrastorage.org/getpro/habr/post_images/e68/d99/122/e68d9912219de101f4b0bbb9cb251ced.gif)
Visi On
Пользовательский интерфейс GEM, разработанный компанией Digital Research для компьютеров на базе DOS в 1984 (и снова, его нет):
![](https://habrastorage.org/getpro/habr/post_images/45a/20d/2e1/45a20d2e17439bb4932b42aa8baf3d2b.gif)
GEM
Стойте, что это?! Неужели это оно?
![](https://habrastorage.org/getpro/habr/post_images/4a3/39a/d80/4a339ad80838e9ee4c91079157c97d32.png)
Atari TOS 1.0
Это скриншот Atari TOS 1.0, созданной компьютерным подразделением Atari Corp на основе системы GEM для последующего портирования на Atari ST в 1985 году. Это самый ранний пример использования кнопки [x], который я только смог найти.
Так почему же там? И почему именно тогда?
Это очередной пример того, как Atari, американская компания, позаимствовала идею из японской культуры. Первым таким примером, конечно же является само название Atari, японский термин из игры Го, который можно перевести как «попасть точно в цель».
Использование [x] для закрытия и [o] для открытия могло пойти от японских символов батсу и мару.
![](https://habrastorage.org/getpro/habr/post_images/c4b/0f9/88c/c4b0f988c84dbc0ec7bdc2d3199401e9.png)
Maru (o) and Batsu (x)
Символ Батсу используется для обозначения чего-то неправильного и может переводится, как «ошибочный», «плохой», «неправильный» или словом «атака», тогда как мару (o) означает «правильный», «истинный», «хороший», «целый» или «очень ценный». Батсу и мару также часто употребляются как жесты. Скрестите руки на груди и получиться батсу, поднимите руки над головой и соедините их в форме круга — вы изобразили мару.
Другой пример использования мару и батсу можно найти в дизайне контроллера Playstation, где они используются в качестве «да» и «нет» соответственно:
![](https://habrastorage.org/getpro/habr/post_images/deb/0c1/229/deb0c12298ffb000f00f8655efc5aaec.jpg)
Playstation Controller
Однако это, конечно же, всего лишь теория. Я не могу с уверенностью сказать — меня ведь там не было.
Для большей основательности подхода, давайте посмотрим, удастся ли нам еще больше углубиться в прошлое.
Самым первым строчным текстовым редактором был Quick Editor, или qed, написанный в 1965 году Кеном Томсоном, который позже помогал разрабатывать Unix. Qed использует [q] в качестве команды для выхода.
Первые текстовые редакторы использовали кучу самых разных команд для выхода: [q], [e], [c], и [ESC], однако [x] не был сколько-нибудь популярным вариантом. Ed, em и ex — ранние текстовые редакторы, отпочковавшиеся от qed где-то в 1971, не использовали [x].
Может быть Vi, vim, emacs или edlin?
Нет, в эти редакторах также не было никаких [x]. X обычно использовался для удаления символов в строке, но не для закрытия программы.
Символ [x] — самая настоящая икона. Он не является каким-то посланием. Он представляет из себя действие «закрыть», которое с самого начала и по сей день воспринималось именно так, независимо от уровня развития графических операционных систем. Первое появление символа [x] в дизайне пользовательских графических интерфейсов скорее всего произошло в Atari TOS, вероятно, под влиянием японских условных обозначений батсу и мару. А благодаря неожиданному изменению в дизайне Windows 95 и началу массового ее использования по всему миру, [x] превратился в стандартный символ для такого действия, как «закрыть» — символ, который сегодня господствует в дизайне веб-сайтов, приложений и программного обеспечения.
Источники скриншотов toastytech.com/guis и whiteandnoisy.org
От переводчика: за время работы над переводом вышел апдейт к этой статье, с автором связался один из разработчиков Windows 95 и поделился некоторыми новыми подробностями.
UPDATE:
Надо же, эта маленькая статья стала такой популярной! Я получил много хороших указаний, комментариев и ценной информации о том, откуда пошло использование [х], однако ни одно из этих сообщений не сравнится с письмом, которое мне прислал член команды разработчиков Windows 95 Дэниел Оран:
«Привет Лорен!
Мой друг переслал мне твою статью «Нажмите X, чтобы закрыть». Он вспомнил, что я работал над Windows 95 в Microsoft, а именно над кнопкой «Пуск» и панелью задач. Ему показалось, что мне это будет интересно. Так оно и есть! :)
Всегда интересно наблюдать за тем, как пишется история о тех давних событиях, которые ты пережил лично. Я начал работать в Microsoft в 1992 году, программным менеджером пользовательского интерфейса «Chicago», которая в конечном счете превратилась в Windows 95.
Так кто же отвечал за изменение решения в последний момент? На сколько я могу судить, этот человек ответственен за быстрое и широкое распространение использования [x] в дизайне пользовательских интерфейсов сегодня.
На самом деле оно не было сделано в последний момент. В течении всего 1993 года, мы рассмотрели множество вариантов дизайна кнопки «Закрыть». А идея была взята не у Atari, а у NeXT, которые разместили кнопку [х] в правом верхнем углу. Вместе с ней мы позаимствовали для Windows 95 и псевдо-трехмерное цветовое решение в серых тонах.
Я хотел расположить кнопку «Закрыть» слева сверху, однако этот вариант конфликтовал с существующих тогда в системе меню, которое появлялось при нажатии alt-пробел, а также новой иконкой программы, которая была позаимствована из OS/2, над которой Microsoft ранее работала вместе с IBM.
Я прилагаю к письму самое раннее изображение Chicago с кнопкой X для закрытия, которое только смог найти. Оно датирована 22 сентябрем 1993 года. (Прикрепляя файл к этому письму, я только сейчас понял, что оно настолько старое, что его имя может содержать не более восьми символов — ограничение, которое существовало до выхода Windows 95).
Спасибо вам за это увлекательное эссе!
![image](https://habrastorage.org/getpro/habr/post_images/a2a/36c/abb/a2a36cabb5aefdb139f94cf311c9285c.jpg)
Windows Chicago 9/22/1993