淺析智能手機(jī)圖標(biāo)擬物化與扁平化的發(fā)展趨勢(shì)

夏韜

摘要：移動(dòng)互聯(lián)網(wǎng)時(shí)代，手機(jī)已經(jīng)成為我們每天生活中的必需品。而因此帶來的是對(duì)于手機(jī)界面更加深層次的探究。手機(jī)APP圖標(biāo)設(shè)計(jì)，即手機(jī)應(yīng)用圖標(biāo)設(shè)計(jì)，伴隨用戶需求的發(fā)展，從最初的擬物化到扁平化，再到現(xiàn)在兩個(gè)陣營(yíng)的對(duì)立統(tǒng)一，使得手機(jī)圖標(biāo)設(shè)計(jì)有著更加需要研究的地方，本文通過對(duì)圖標(biāo)的擬物化與扁平化的分享和對(duì)比，分析智能手機(jī)國(guó)標(biāo)設(shè)計(jì)的新趨勢(shì)。

關(guān)鍵詞：扁平化設(shè)計(jì) 擬物化設(shè)計(jì) 智能手機(jī) 圖標(biāo)

中圖分類號(hào)：J0-03 文獻(xiàn)標(biāo)識(shí)碼：A

文章編號(hào)：1003-0069（2017）01-0122-02

一、智能手機(jī)圖標(biāo)設(shè)計(jì)的背景概述

隨著科技的不斷發(fā)展，智能設(shè)備的普及，手機(jī)已經(jīng)成為人們?nèi)粘Ｉ钪胁豢扇鄙俚囊徊糠?。隨之而來的是手機(jī)界面的設(shè)計(jì)需求量與日俱增，越來越多的設(shè)計(jì)師在找工作時(shí)開始選擇UI設(shè)計(jì)。而圖標(biāo)設(shè)計(jì)作為UI設(shè)計(jì)中不可缺少的一部分，自然備受關(guān)注。

縱觀手機(jī)圖標(biāo)發(fā)展史可以發(fā)現(xiàn)，隨著時(shí)間的推移技術(shù)的進(jìn)步，每一個(gè)時(shí)期的手機(jī)圖標(biāo)在設(shè)計(jì)上都有著很大的差異，無論是最初的抽象線條繪制的圖標(biāo)，還是再到風(fēng)格迥異的個(gè)性化定制圖標(biāo)時(shí)代，隨后又到了喬布斯時(shí)代的擬物化圖標(biāo)和現(xiàn)在的扁平化圖標(biāo)。每一時(shí)期的圖標(biāo)都有著當(dāng)時(shí)時(shí)代背景下的客觀影響。通過不斷地變化，我們也在探尋怎樣的圖標(biāo)設(shè)計(jì)才是最好的設(shè)計(jì)形式和在未來的設(shè)計(jì)中我們圖標(biāo)將會(huì)往哪個(gè)趨勢(shì)發(fā)展。因此從現(xiàn)有的設(shè)計(jì)風(fēng)格中探尋未來的手機(jī)圖標(biāo)發(fā)展趨勢(shì)也是一件十分有意義的事情。這樣會(huì)給人們的使用和設(shè)計(jì)者的制作都帶來了一定的幫助。

二、擬物化國(guó)標(biāo)設(shè)計(jì)

首先根據(jù)圖標(biāo)發(fā)展的過程來看，擬物化圖標(biāo)的出現(xiàn)早于扁平化圖標(biāo)，而且在研究順序上來看，通過研究擬物化圖標(biāo)像扁平化圖標(biāo)的轉(zhuǎn)變可以更好地研究設(shè)計(jì)者的思路和設(shè)計(jì)趨勢(shì)的發(fā)展方向，因此我們從擬物化圖標(biāo)著手。眾所周知，擬物化圖標(biāo)的興起到普及是在喬布斯于2007年發(fā)布的iPhone手機(jī)中所被開始使用的。之后隨著手機(jī)的普及，而逐漸改變了人們對(duì)于手機(jī)的固有印象，重新定義了手機(jī)。關(guān)于手機(jī)，喬布斯認(rèn)為，我們只是為我們的IOS操作系統(tǒng)做了一個(gè)漂亮的殼子去運(yùn)行它。而關(guān)于擬物化圖標(biāo)的設(shè)計(jì)考量則是喬布斯為了讓大家從帶有實(shí)體鍵盤的操作習(xí)慣中往虛擬鍵盤的操作習(xí)慣去轉(zhuǎn)變的一種降低學(xué)習(xí)成本的做法。更好地模擬現(xiàn)有生活中的物品，可以減少人們對(duì)智能手機(jī)的排斥以及不習(xí)慣。正如《iOS HumanInterface Guidellnes》里提到：“當(dāng)你應(yīng)用中的可視化對(duì)象和操作按照現(xiàn)實(shí)世界中的對(duì)象與操作仿造，用戶就能快速領(lǐng)會(huì)如何使用它?！崩缣O果最為經(jīng)典的擬物化按鈕圖標(biāo)，凸起的按鈕表示可以點(diǎn)擊，而凹陷的按鈕圖標(biāo)表示已被點(diǎn)擊。這樣無論是什么年齡層的人看到這樣的設(shè)計(jì)，都會(huì)明白如何去使用它。這可能就是擬物化圖標(biāo)最早被設(shè)計(jì)出來的意義吧。

而如今，雖然扁平化的設(shè)計(jì)占領(lǐng)了幾乎90%的市場(chǎng)，但是擬物化的圖標(biāo)設(shè)計(jì)還是存在的，大部分的擬物化圖標(biāo)出現(xiàn)在手機(jī)游戲應(yīng)用程序中?？赡苡捎谟螒虻奶厥鈱傩?，扁平化的圖標(biāo)無法更好地表現(xiàn)出游戲的特性和游戲風(fēng)格，因此在游戲圖標(biāo)設(shè)計(jì)中，用的最多的還是擬物化圖標(biāo)設(shè)計(jì)。而作為手機(jī)的操作系統(tǒng)使用擬物化圖標(biāo)設(shè)計(jì)的，目前只有錘子科技的Srnartisan OS操作系統(tǒng)在使用。如圖1所示，根據(jù)它們的CEO羅永浩給出的解釋是，扁平化和擬物化并沒有誰對(duì)誰錯(cuò)之分，而正確地認(rèn)識(shí)扁平化和擬物化圖標(biāo)的應(yīng)用則是我們應(yīng)該在正確的地方讓其出現(xiàn)，就像我們眾所周知的蘋果iOS系統(tǒng)一樣，即使在蘋果iOS 7扁平化之后的今天，蘋果最新iOS 10系統(tǒng)設(shè)置中滑塊的圖標(biāo)設(shè)計(jì)依舊保持?jǐn)M物化設(shè)計(jì)的形式。所以今天的擬物化設(shè)計(jì)可能是喬布斯時(shí)代擬物的一個(gè)升級(jí)改進(jìn)版。它拋棄了很多為了整體感而使用的擬物風(fēng)格，選擇更加正確的方式出現(xiàn)在我們的應(yīng)用中?？赡苤挥羞@樣的發(fā)展，才更能說服現(xiàn)在的用戶吧。

三、扁平化圖標(biāo)設(shè)計(jì)

關(guān)于扁平化圖標(biāo)設(shè)計(jì)當(dāng)然要從2013年蘋果公司發(fā)布的iOS 7操作系統(tǒng)來說起，當(dāng)時(shí)iOS 7的發(fā)布，在業(yè)界產(chǎn)生了巨大的爭(zhēng)議，有人說是喬布斯時(shí)代的終結(jié)，喬納森時(shí)代的到來。很多人一時(shí)不能接受扁平化風(fēng)格的出現(xiàn)。但是隨著時(shí)間的推移，版本的迭代，人們逐漸開始接受這種風(fēng)格的產(chǎn)生。更加簡(jiǎn)潔的扁平化設(shè)計(jì)風(fēng)格，猶如雨后春筍一樣，發(fā)展迅速，仿佛一夜間所有的圖標(biāo)都被拍平了一樣。而國(guó)內(nèi)的大部分操作系統(tǒng)，也都爭(zhēng)先使用高度定制的扁平化風(fēng)格來當(dāng)作自家的應(yīng)用圖標(biāo)。如圖2，魅族flyme手機(jī)桌面圖標(biāo)設(shè)計(jì)。而關(guān)于扁平化風(fēng)格的設(shè)計(jì)理念，有點(diǎn)像美術(shù)風(fēng)格中的極簡(jiǎn)主義風(fēng)格，他們提倡少即是多的美學(xué)理念，去掉那些多余的設(shè)計(jì)元素，使用戶能夠?qū)Ｐ牡仃P(guān)注他們所需要的東西，而不是被各種復(fù)雜的設(shè)計(jì)語(yǔ)言所干擾。這樣整個(gè)界面將變得更加純粹而富有活力。雖然在圖標(biāo)的易用性探究中，有的人認(rèn)為扁平化的圖標(biāo)設(shè)計(jì)與之前擬物化的圖標(biāo)設(shè)計(jì)相比較，沒有擬物化的圖標(biāo)更能迅速地讓人們適應(yīng)。但是對(duì)于科技發(fā)展飛速的時(shí)代來講，扁平化風(fēng)格的圖標(biāo)設(shè)計(jì)采用極簡(jiǎn)的外形與相對(duì)單一的配色，比起之前的擬物風(fēng)格設(shè)計(jì)更加符合科技感與現(xiàn)代感，甚至還會(huì)有抽離了情感的簡(jiǎn)約感，但不得不說的是扁平化圖標(biāo)的設(shè)計(jì)帶來的高效、明確和更大的信息量。成為一種更為理性的交互體驗(yàn)，在移動(dòng)互聯(lián)網(wǎng)日益發(fā)達(dá)的今天，這種界面設(shè)計(jì)形式和交互方式更能反映出大眾的心理以及情緒變化。

其次，對(duì)于之前學(xué)習(xí)成本的論證來看，最新科技的發(fā)布往往不會(huì)照顧到所有用戶，其主要用戶大多數(shù)為年輕人。因?yàn)檫@些用戶有著很好的傳播性和他們?cè)谑褂檬謾C(jī)時(shí)的學(xué)習(xí)成本最低，適應(yīng)能力最強(qiáng)，并且他們逐漸會(huì)成為社會(huì)消費(fèi)的主要人群。恰好這些特點(diǎn)都與扁平化圖標(biāo)設(shè)計(jì)的風(fēng)格特點(diǎn)相符。例如上面所展示的魅族flyme操作系統(tǒng)就打出了青年良品的口號(hào)，在市場(chǎng)定位上針對(duì)年輕人的設(shè)計(jì)，因此他們手機(jī)的界面和icon都是扁平化風(fēng)格。

四、從最新的圖標(biāo)設(shè)計(jì)風(fēng)格分析未來發(fā)展趨勢(shì)

（一）分析最新的設(shè)計(jì)風(fēng)格

時(shí)至今日，我們可以從各個(gè)操作系統(tǒng)和主流應(yīng)用程序入手，來分析扁平化和擬物化圖標(biāo)設(shè)計(jì)的走向與趨勢(shì)。首先是lOS操作系統(tǒng)，最新的iOS 10操作系統(tǒng)，（如圖3所示）被看作是一次比較大的在設(shè)計(jì)上的改變。大而簡(jiǎn)，簡(jiǎn)而精的設(shè)計(jì)理念。加粗加大了字體的使用，增大了留白，減少了各級(jí)頁(yè)面的視覺層級(jí)，以及給功能性圖標(biāo)賦予更多顏色來優(yōu)化操作體驗(yàn)。但對(duì)于應(yīng)用圖標(biāo)的改變依舊保持著iOS 7之后的扁平設(shè)計(jì)風(fēng)格。扁平化的設(shè)計(jì)風(fēng)格可能在短時(shí)間內(nèi)在iOS操作系統(tǒng)上不會(huì)被取代，只會(huì)被優(yōu)化。相對(duì)于iOS操作系統(tǒng)Google為了與之抗衡，推出了自家的設(shè)計(jì)規(guī)范Material design。（如圖4所示）這是谷歌在2010年后的一次大動(dòng)作，對(duì)于Material design的設(shè)計(jì)風(fēng)格來看，它覺得之前扁平化設(shè)計(jì)所推崇的消除所有的擬物化比較激進(jìn)，即使是有用的。而借用Material Design層的概念，使用陰影，將圖像進(jìn)行編輯和分離；其中最為突出的就是在全新的交互設(shè)計(jì)中用動(dòng)效來輔助界面的視覺和操作的易用性。全新的設(shè)計(jì)風(fēng)格，雖然沒有重新使用擬物化設(shè)計(jì)，但不乏看出一些擬物化設(shè)計(jì)的小細(xì)節(jié)出現(xiàn)其中。例如陰影的使用，是之前扁平化設(shè)計(jì)風(fēng)格所拋棄的。對(duì)于其他我們能接觸到的手機(jī)系統(tǒng)或者應(yīng)用來看，除了錘子手機(jī)在設(shè)計(jì)中一直追求擬物化圖標(biāo)設(shè)計(jì)外，其余均保持扁平化的圖標(biāo)設(shè)計(jì)風(fēng)格。

（二）探究手機(jī)圖標(biāo)未來發(fā)展趨勢(shì)

扁平與擬物從產(chǎn)生至今一直都是設(shè)計(jì)師永遠(yuǎn)的爭(zhēng)論的話題，因?yàn)椴还馐窃O(shè)計(jì)師，用戶也有著自己的喜好，而且人們都會(huì)有審美疲勞的時(shí)候，一味的扁平，終究有一天會(huì)看膩，就算不疲勞，有些產(chǎn)品也需要走出自己的風(fēng)格，需要嘗試更多的可能性，來更好地吸引用戶。

時(shí)至今日，扁平化的設(shè)計(jì)風(fēng)格仿佛已經(jīng)不可逆轉(zhuǎn)地存在于我們所有界面當(dāng)中。而擬物化的圖標(biāo)只能在那些少數(shù)的堅(jiān)持者手中出現(xiàn)。但是當(dāng)我們深入研究后發(fā)現(xiàn)，扁平化的設(shè)計(jì)風(fēng)格并不是當(dāng)年那么純粹的拋棄所有效果的那個(gè)扁平化設(shè)計(jì)風(fēng)格。它有著新的呈現(xiàn)方式，更加合理，更加層次分明。這可能就是各大設(shè)計(jì)者們對(duì)未來圖標(biāo)設(shè)計(jì)的一個(gè)方向吧。

擬物化不是扁平化的對(duì)立面，而是作為扁平化的一部分永遠(yuǎn)存在的。我們不難發(fā)現(xiàn)，為了避免純粹的扁平化設(shè)計(jì)，一些細(xì)微的效果逐漸被運(yùn)用其中。例如最新的淘寶天貓圖標(biāo)中加入了微投影的設(shè)計(jì)風(fēng)格，一下給人眼前一亮的感覺，在眾多的扁平化圖標(biāo)中脫穎而出。還有之前流行過得長(zhǎng)投影設(shè)計(jì)手段，外國(guó)設(shè)計(jì)師最近流行的彌撒陰影風(fēng)格，都是為了在扁平化的設(shè)計(jì)風(fēng)格中尋求一種突破。如今的魅族Flyme 6操作系統(tǒng)的設(shè)計(jì)為圖標(biāo)的扁平化增加了更多的細(xì)節(jié)。運(yùn)用豐富的顏色模擬出一種投影的概念，讓我們不禁看到一點(diǎn)擬物化的影子。所以我們不難推測(cè)，關(guān)于未來的圖標(biāo)設(shè)計(jì)趨勢(shì)是那種有著更加豐富細(xì)節(jié)的扁平化風(fēng)格，它不再是單純的扁平化風(fēng)格，更算不上擬物風(fēng)格。仿佛現(xiàn)在的扁平化設(shè)計(jì)都是在尋找一種它和擬物化之間的平衡點(diǎn)。

結(jié)語(yǔ)

智能手機(jī)圖標(biāo)從擬物化到扁平化的轉(zhuǎn)變存在著事物發(fā)展的必然規(guī)律和用戶的主觀選擇，我們?cè)趫D標(biāo)轉(zhuǎn)變的過程中并不能說哪種風(fēng)格好哪種不好，而是要從圖標(biāo)的美觀性與功能性來看誰更符合時(shí)下的趨勢(shì)。對(duì)于之后的圖標(biāo)發(fā)展趨勢(shì)就是在扁平化的圖標(biāo)風(fēng)格中找到與擬物化圖標(biāo)的平衡點(diǎn)，而盡量消除扁平化圖標(biāo)帶來的各種不好的操作體驗(yàn)，這可能是我們未來圖標(biāo)的一個(gè)設(shè)計(jì)方向。endprint