冷知識:你知道每個視窗都有的 [x] 是怎麼來的嗎?
我們在電腦的操作介面上都會看到 X 。X 是一個強大的符號,[x] 可以關閉視窗、彈出視窗、工具列、分頁以及其他任何可能佔據我們螢幕空間的東西。
Twitter X
按 [x] 鍵去關閉某種功能已經成為我們使用電腦的一種本能。也是一種網路或軟體的設計標準。雖然這樣子看起來 [x] 好像一直是圖形介面的一部份,但當我們簡單回顧圖形介面的歷史,可以發現事實好像並不是這樣子的。
那 [x] 是在什麼時候第一次出現在 UI 的字典裡的呢?
ChromeX
讓我們從現有的 Microsoft 版本 Windows 7x 開始,來回朔 [x] 的起源。
Windows 7 x
如果你也是 Windows 使用者,那你可以看到至少一個 [x] 的符號在你的螢幕上。
但 Windows 1.0 並沒有使用 [x] 這個符號來關閉東西。
Windows 1.0
2. 0 也沒有哦。
Windows 2.0
3.0 還是沒有
Windows 3.0
[x] 這個符號直到了 Windows 95 才出現,並且加入了右上角的放大與縮小的功能。
Widows 95
而且它不只是等到了 Window 95 才出現,他甚至是一個 Windows 95 後期才加上去的改動。我們可以從早期的 Demo(代號:芝加哥)可以看出端倪。在這裡我們可以看到縮小以及放大的符號已經被重新設計過了,關閉視窗的按鈕也跟之前一樣在左上角而非以 [x] 的方式在右上角出現。
Windows Chicago August 1993
所以,究竟是誰要對這個最後的更動負責呢? 最起碼我認為,他就是把 [x] 這個符號大量散播以及使用在使用者介面的「始作俑者」。
Windows 95 一直都是以讓電腦普及為目的而產生。也因此他們的目標則是讓所有新接觸電腦的人都可以學會怎麼樣使用 Windows 95。而對於 Windows 3.0 設計的更動主要來自使用者對於使用性所給回饋,與反應。
Windows 95 成功了。
他去除了其他系統的競爭者,而且被全世界的使用者所接受。
不過,我們今天的目標並非找出 [x] 這個符號究竟是在什麼時候開始有名,而是找出他究竟是什麼時候第一次成為了操作介面的一個重要的元素。
那麼,我們有辦法再找到 [x] 這個符號在圖形介面出現的更早的例子嗎?
Mac OS 也並沒有使用任何的 [x] 來作為關閉的功能。只有到了 OS X ,[x] 才第一次出現,而且只有在你將滑鼠滑鼠移到紅色的關閉鍵上方 x 這個符號才會出現。
Mac OS 2
而 Linux 的圖形介面則是在 Windows 95 上市之後才開始使用[x]這個符號。
X Window System
繼續下去似乎行不同,那麼我們回到最開始吧。回到 Windows 或者 Linux 或者是 Max OS 出現之前。回到最早將我們大家都非常熟悉的「桌面」這個比喻加以應用的圖形介面:The 8081 Information System from Xerox。
Xero 8108
Xerox 8081 又稱作:「The Xerox Star」、「View Point」,或者是「GlobalView」。Xerox 在 1997 年開始了 8101 這個系列的研發並且在 1981 年第一次以「Dandelion」這個名字售出。而這個圖形介面後來被蘋果宣稱用來作為他們的 Lisa/Mac OS 原型,而蘋果的靈感來自於在 1979 年 12 月在 Xerox 總部的參訪。
不過 [x] 仍然沒有出現
Xerox Star
還記得嗎? [x] 也並沒有在蘋果早期的作業系統出現過
Mac OS 1
在早期的 Visi On GUI(1983 年發表,第一個為 IBM 電腦整合圖形軟體環境的圖形介面),我們還是找不到 [x]
Visi On
在 Digital Research 1984 年研發的,為了給 DOS 系統電腦使用的 GEM 使用者介面裡,我們仍然見不到 [x] 的蹤跡。
GEM
但是! 難道是這個? 可能嗎?
這個螢幕擷取照片上的 Atari TOS 1.0。這個來自 Atari Corp 建立在 GEM 上後來於 1985 年被移植到 Atari ST 的系統。他已經是我最早能夠發現 [x] 出現的地方。
Atari TOS 1.0
但是為什麼在那裡?為什麼是這個時候?
Atari 是一家美國的公司,但是他們卻採用了日本的文化。而日本文化可能就是他們使用 [x] 這個符號的參考。首先 。首先,Atari 這個名字在日本的一個遊戲 Go 上的意義就是 「擊中目標」。
使用 [x] 作為關閉,而 [o] 作為開啟很有可能來自日本的符號 batsu 以及 maru。
Maru (O)Batsu (X)
batsu (X) 是象徵「不正確」的符號,同時也可以代表虛假、壞處、錯誤或攻擊,相對而言,maru (O) 則是「正確」、真實、美好、整體,或者珍貴的事物。我們也能以簡單的身體語言說出 O 與 X:雙手交叉於胸前成了 X,雙手舉高在頭頂交會就是 O。
另外一個我們很熟悉的 O/X 例子,是經典遊戲機 PlayStation 的遙控器設計,O/X 分別表示 yes 與 no。
第一個以行數為基礎的文字編輯器 Quick Editor(又稱 wed),是由 Ken Thompson 於 1965 年寫出來的,他後來曾協助開發 Unix。Qed 的「關閉程式」指令,是由 [q] 代表。
早期的文字編輯器,包括 Vi、vim、emacs、edlin、Ed、em、ex 等等,關閉程式指令很不一致,[q]、[e]、[c]、[ESC] 都有人用,唯 [x] 從來不是個受到青睞的選項。X 普遍被用來刪除字元,但不會被當作是關閉程式的符號。
直到圖形介面作業系統發展起來之後,[x] 才從一個單純字母轉變成一個真實的圖示,代表一個動作、並且成為唯一代表「關閉」的符號。[x] 首次出現在圖形使用者介面設計可能是 Atari TOS,也許是受到日本 batsu(o)與 maru(x)的啟發。當然,今天 x 會被理所當然當成「關閉」指令,關鍵在於 Windows 95 的採用並且一舉攻佔全世界作業系統。自此 [x] 變成標準的「關閉」符號,網頁、app 或軟體設計無一不沿用。
讓 [x] 傳遍世界的源頭現身說法
Lauren Archer 這篇有趣的 [x] 探源文章一出,傳遍網路,引來許多人蔘與討論。他雖然花了很多時間探究 [x] 的歷史,但依然無法肯定 Windows 的 [x] 究竟是不是真的來自 Atari TOS。但是網路傳播的威力,「釣出」Windows 95 的團隊成員 Daniel Oran 現身說法,他是「開始」按鈕與「工具列」的創造者,終於揭開 [x] 的謎底。
Daniel Oran 寫信娓娓道來 Windows 採用 [x] 的歷史:
1993 年,我們(Windows 95 團隊)在眾多不同的「關閉按鈕」設計中考慮,不過來源並非 Atari,而是 NeXT(如下影片),觀察視窗右上方有個灰階 3D 影象的 [x],Windows 借鑑了這個圖示。
本來我 Daniel Oran 想把 [x] 擺在左上方,不過這會跟當時雙按 Alt-空白鍵後「開啟新視窗」功能衝突,這個功能又是我們從跟 IBM 合作的 OS/2 中借來的。
附件檔桉是一張早期的芝加哥(Windows 95 早期版本代號)點陣圖,包含一個 [x] 按鈕。這張圖片截自 1993 年 9 月 22 日。(夾帶這個檔桉時,我才發現這個檔桉如此久遠,檔名只能有 8 個字元。在 Windows 95 出現之前,這已是極限。)
感謝你趣味十足的文章!
Danny
Windows Chicago (1993/9/22)
NeXT 1988
英文原文:x to close
相關文章
- 手機圈兒冷知識 品牌slogan你都知道嗎?
- 這些鮮為人知的前端冷知識,你都GET了嗎?前端
- 你知道Ctrl+Alt+Delete是怎麼來的嗎?delete
- 每個開發人員都應該知道的WebSockets知識Web
- 每個Web開發者都應該知道的關 URL編碼的知識Web
- 手機怎麼計數你走了多少步?一定有你不知道的冷知識
- 你知道微視背後的視訊特效技術是怎樣做出來的嗎?特效
- Dart | 你知道 sync*/async* 是怎麼用的嗎?Dart
- 每個程式設計師都應當知道的編譯器優化知識程式設計師編譯優化
- 聚合支付代理是怎麼賺錢的,你知道嗎?
- 昨天網站都變灰了,你知道是怎麼做的麼?網站
- 你所不知道的 Python 冷知識!(建議收藏)Python
- 年終小盤點:這十八個Android開發必備知識點,你都知道嗎?Android
- Python 五個有趣的彩蛋,你都知道嗎?Python
- 運維知識是怎麼構建起來的運維
- 每個程式設計師都需要知道一些遊戲網路知識程式設計師遊戲
- 你所不知道的 Python 冷知識!(二)(建議收藏)Python
- 有趣的8個IT冷知識
- Spring Boot 到底是怎麼執行的,你知道嗎?Spring Boot
- Spring Boot到底是怎麼執行的,你知道嗎?Spring Boot
- 面試官帶你學Android——面試中Handler 這些必備知識點你都知道嗎?面試Android
- 你知道YouTube的架構是什麼嗎架構
- 一個有趣的問題, 你知道SqlDataAdapter中的Fill是怎麼實現的嗎SQLLDAAPT
- 為什麼每個程式設計師都應該懂點前端知識?程式設計師前端
- 這三個關於Python包匯入的知識點你知道嗎Python
- 這三個關於Python包匯入的知識點你知道嗎?Python
- 錯錯錯!這些你絕對不知道的手機冷知識!
- 每個開發者都應該知道的33個JavaScript概念JavaScript
- 你知道什麼是路由器嗎?路由器
- iOS這些小技巧你都知道嗎iOS
- 深入理解MySQL---資料庫知識最全整理,這些你都知道了嗎?MySql資料庫
- 這幾個好用的Python開源框架,你都知道嗎?Python框架
- Go 泛型的這 3 個核心設計,你都知道嗎?Go泛型
- IT職場:每個黑帶都應該知道的事
- 每個Javascript開發者都應當知道的那些事JavaScript
- 3個膝上型電腦冷知識 看完你還敢說懂電腦嗎?
- 你真的知道Python的字串是什麼嗎?Python字串
- 「Vue原始碼學習」你真的知道插槽Slot是怎麼“插”的嗎Vue原始碼