為什麼設置圖標習慣用齒輪或扳手來表示?


我覺得這是一個很有意思的問題。

考據方面要找到第一次使用「齒輪」和「扳手」這兩個隱喻的電腦軟體似乎已經很難了,不過粗粗看了一下 GUIdebook [1] 發現貌似第一次出現在操作系統當中的扳手是 OS/2 Warp 4 里的設置:

而第一次出現的齒輪是 Win 95 里的設置:

-------------- 一條華麗麗的分割線,以下純猜想 ---------------

OS/2 的工具箱加上裡面若干工具很好地體現了「設置」所指代的意思,但是作為一個圖標實在太複雜了,雖然以當時(1996)的水平已經夠美觀了,但是細節太多識別性較弱,所以可能後來的設計師重新提取了一下裡面的元素。工具箱本身的造型相對 general,一個方盒子的指代性太弱所以選取了裡面的工具。這些工具無非就是扳手、螺絲刀和鎚子。鎚子給人的感覺略帶破壞性可能會產生歧義,所以就用了扳手和螺絲刀,很多 Linux 系統下就是這樣:

[2]

經常做系統圖標的設計師可能很討厭扳手、螺絲刀這兩個貨,因為他們都特媽是長條型的!不管是放一個還是放兩個、交叉放還是平行放,只要想完整顯示都很難在圖標的方形區域裡面放得夠飽滿!也許是因為這個原因,齒輪登場了。

齒輪比較討巧的地方在於從語義上人們很容易把他和扳手這類工具聯繫起來,生活中也算比較常見,而且在一般人的印象當中又往往是成對、成組出現的。所以從圖標的設計上來講設計師有很多選擇:可以放一個單獨的齒輪,一對互相咬合的齒輪或者一組前後重疊的齒輪,有很多方法能滿足不同的系統圖標一致性、飽滿度、美觀等方面的需求。

所以,我的回答是:決定圖標取哪些隱喻時,除了基本的識別性,美觀其實是個很重要的指標~

另外其實還有不少其他的常見事物來表達設置,比如開關

和一些模擬電腦中實際設置界面控制項的圖標:

[1] http://www.guidebookgallery.org/icons/components
[2] http://commons.wikimedia.org/wiki/Crystal_Clear


第一個採用齒輪或者扳手作爲setting icon的平臺是哪裏我也不知道,網上找了一圈也沒找到,但卻讓我找到一個滿好玩的網站 http://toastytech.com/guis/index.html 站主搜集了非常多的各個平臺OS的截圖。雖然我是答非所問,但我想做GUI設計或者對此有興趣的同學都會感興趣,也就斗膽貼到這個問題下來了。


如果你知道「設置」的英文是configure(動詞)和configuration(名詞)就不難理解了。
configure/configuration 既有form(組成、構造)又有arrange(為正常運轉而設定、調試)的含義,對於計算機這種精密設備來說,傳統機械是很好的比擬對象,因此傳統機械中的齒輪被採納當做」組成、構造「的象徵,而同樣來自傳統機械中的扳手形象被拿來當做」設定、調試「的象徵。

計算機辭彙比擬其他領域的例子還有menu(菜單)、virus(病毒)等等,因此在圖標形象設計上也會向這些領域靠攏,以便可以喚起人們的本能反應。


設定的目的是匹配工況或者風格化,手段是設定參數和開關,效果是程序的安全、流暢、高效運行以及舒適的體驗。
扳手和螺絲刀給我的印象可能不僅在於安裝、調整和修理,其改造的意味也很強,這就比較符合設定的目的論,也符合一部分玩家的方法論。
但我不敢苟同齒輪。受首先齒輪是傳統的機械部件,很容易令人聯想到震動、噪音、油污等等不快;其次齒輪是沒有可設定性的,它生產出來就是那樣了。我即不能對齒輪做什麼,也不能用齒輪對別的部件做什麼;如果要說緊密嚙合的齒輪象徵了理想的工況,那既然工況已經理想,設定行為的正當性又到哪裡去了?如果說齒輪象徵系統內部的運行規律,這符合設定的內在性,那「系統信息」才更有資格充當它的對象。因此我覺得齒輪不能恰如其分的體現計算機選項設定的基本內涵。
我覺得滑塊是最好的,要擬物設計則可參考5段音頻均衡器的實物造型。


明明是settings啊,為什麼是configuration呢……
事實上我看到的設置更傾向於使用 utility / settings / preferences / 這樣的辭彙……

The "gear" icon: is it a convention yet?
找到了這一篇文章,齒輪樣的圖標是約定俗成了么?
但是貌似沒有找到什麼答案,所以我就去了quora看看,還真找到了~
User Interface Design: Who came up with the gears icon for "Settings" (as most recently seen in gmail top nav bar)?

我把這個答案搬運一下~

As explained to me by a Professor of mine back in College: Way back when, the operation of a mechanical tool was determined by the physical constraint of the position/type/size of the gears used.
So if you wanted to change a tool setting, you would have to manually make an alteration to the gear(s).
Using a gear for settings is a metaphor that has made its way into our visual language lexicon. If you want to change how this operates you need to alter the inner-workings of the system, the gears.

如果你想改變一個工具的設置,你就需要手動的轉動齒輪。

The oldest reference I can personally recall is from Windows 95, which introduced a gear as a part of its Settings Start Menu option:
http://en.wikipedia.org/wiki/Fil...( 就像@JJ Ying說的一樣,的確是在WIN95中出現的這個圖標 )
iOS used a detailed gear for the Settings app beginning back with the original iPhone OS; the same icon later became the System Preferences icon in Mac OS 10.5. It"s arguable that the popularity of iOS helped spur adoption of the gear icon as a metaphor for settings.
(I found it amusing that Quora uses a gear for Options, too!)

通過推動改變齒輪從而改變整體的改變
(我也發現知乎裡面的設置也是齒輪圖標)

---分割---線--
但如同這個似乎是一種習慣性的認識,所以我們也會看到一些非主流的類似三道杠的設置圖標,不過大多數還是齒輪了吧。
setting icon
另附,齒輪圖標製作方法http://vector.tutsplus.com/tutorials/icon-design/how-to-create-a-gearbox-settings-icon-using-simple-shapes/

另附,三道杠的確是設置圖標(容易在中華酷聯中出現),不是菜單那麼簡單。

魅族也使用的是齒輪圖標。
=====
安卓中的MENU菜單圖標主要是以安卓的小房子或者矩陣點進行排列的。
menu icon android
(其實我也是不認真不舒服斯基)


今天我也突然想到這個問題了並想過來問但是發現居然有人已經問過了可沒人回答。

那我就說一下我的看法吧……
齒輪,相當於是給物件(手錶、鬧鐘、機器之類)的外殼開了個口能讓人看到內部。設置的存在好像也有點這個感覺。點擊設置,離開桌面,進入手機的深層,就好像打開鬧鐘的後蓋看到其內部結構么。
扳手,則好理解的多。設置,校正,校準,放到機械上來,自然要用到扳手起子之類的工具。
但至於為什麼習慣用這兩種,我不知道。一來不知道是不是真的用這兩種的最多,二來如果真的最多,我不能解釋為什麼習慣於用這兩種而非其他(彈簧啊、老虎鉗之類)。

我其實不太懂,本來使想提問的,這裡說一些不成熟的看法,算是拋磚引玉吧。


我理解傳統的機械時代,通常依靠改變不同大小的齒輪組合來改變轉速,或者依靠扳手來調整鬆緊等。所以齒輪和扳手是很長很長一段時期對機械進行調整的象徵。


作為一名民工,我表示,扳手和螺絲可以更改組合大半個工地


自己動手去設置,當然首先想到的是能用手操作的工具,而最簡單的也就是扳手之類的,但為什麼不是螺絲刀呢?估計是出於扳手的美觀性和簡潔性吧。


因為兩種圖標,都有自己動手操作的感覺。


擬物化設計,調整一個非電子產品的參數一般會用什麼東西呢,大致也就是這三樣了


小時候玩四驅車,更換齒輪組可以有不同的速度和動力(相當於汽車換擋),所以理解無壓力。


印象中大家覺得扳手就是用來改變一件物品的外形甚至內在的工具,經常出現在工程師手上。而齒輪在大鐘到小表地轉動都給人一種正常運轉的感覺,更有那麼多導演老是在電影里破壞齒輪進而導致整個機器崩潰。這樣手機上的齒輪是不是讓人覺得可以讓手機崩潰,或者讓您的手機根據您的需要破壞哦不,設置出高大上的感覺呢。可能還能弄出變形金剛來。


因為這樣在你升級系統的時候齒輪轉起來有種眩暈迷惑感讓你忘記升級系統是需要花費大量時間的。。。


自我創造價值的發現,原來我可以讓這個手機更適合我。


1.顧名思義,「設置」,總讓人覺得是要動手去搞來搞去的,或者深入內部去搞來搞去的。而搞來搞去的,在機械設備上往往少不了螺母,在內部結論里往往少不了齒輪傳動。
2.那兩個圖標除了本身的意義外,它還美觀。這兩個圖標很簡單,要做漂亮就相對更加簡單了,配色也不用考慮太多。其中,齒輪的是由圓形和鋸齒構成的,圓形在裡面,鋸齒在外面,結合而成的圖讓人看了很舒服。
3.這兩個圖標放在設備上顯得很有科技感。特別是金屬特有的色澤,銀白色,非常有立體感和科技感。大眾當然樂於接受了。


推薦閱讀:

有什麼(在線)日記軟體比較好?
飛利浦的智能燈泡 Hue 使用起來體驗如何?好玩嗎?
為什麼很少有應用調用 iOS 6 系統內嵌的微博 API?
GitHub 上都有哪些值得關注學習的 iOS 開源項目?
為什麼 OS X 不像 iOS 只有 App Store 唯一軟體安裝渠道?

TAG:iOS | 用戶界面設計 | 用戶體驗設計 | 圖標 | Android |