移動(dòng)App設(shè)計(jì)趨勢(shì):猜猜iOS7會(huì)是什么樣的?
一、圖標(biāo)
上圖是一些 ios 系統(tǒng)里最知名應(yīng)用的圖標(biāo),在它們上我們幾乎看不到任何高光、質(zhì)地或紋路(除了 Evernote、Path 和 Spotify)。即使是 Facebook、Google Drive、Dropbox 和 Flipboard,也是用一種隱晦方式來(lái)表現(xiàn)高光和縱向漸變,以此來(lái)表現(xiàn)透視或者 3D 效果,替代過去那種簡(jiǎn)單的去光澤化。
對(duì)我來(lái)說(shuō)這是再明顯不過的設(shè)計(jì)趨勢(shì)了,如果蘋果連這也看不出,那也實(shí)在無(wú)話可說(shuō)。這種趨勢(shì)顯然與 Metro 代表的扁平化大相逕庭。事實(shí)上隨著大眾審美觀的變遷,擬物化雖然不如 2007 年時(shí)那么受歡迎,但是,它并沒有消失,它的精華——立體感與模擬觸感以更成熟更隱晦方式存在于各個(gè)應(yīng)用之中。
作為一個(gè)設(shè)計(jì)師,你必須敏銳的感覺到是什么在影響著你對(duì)事物的認(rèn)知。
——Jony Ive
Google 和 Facebook ***了新一輪的 APP 設(shè)計(jì)潮流,可以肯定的是任何一方并沒有得到過來(lái)自蘋果的任何指導(dǎo),但二者之間又有著非常相似的設(shè)計(jì)風(fēng)格,這讓我覺得,或許,蘋果可以更好的推動(dòng)這一輪的設(shè)計(jì)運(yùn)動(dòng)。
二、卡片
下圖展示的卡片化信息設(shè)計(jì)就像其他 Pinterest 發(fā)明一樣, 在其他 APP 們手中發(fā)揚(yáng)光大。這個(gè)設(shè)計(jì)采用簡(jiǎn)單的背景(通常為淺色或灰色)來(lái)對(duì)抗蘋果原生的“切出”背景設(shè)計(jì)。
下圖展示的是被 Google Chrome 和 Evernote 熱捧的一項(xiàng)設(shè)計(jì),該設(shè)計(jì)采用縱向?qū)盈B的方式來(lái)整理“卡片”,雖然看起來(lái)比較有趣,但是使用的時(shí)候還是略為別扭,不過據(jù)我估計(jì)將來(lái)會(huì)有很多的 APP 采用這樣的設(shè)計(jì)。
三、按鈕
另一個(gè)比較重要的設(shè)計(jì)趨勢(shì)體現(xiàn)在按鈕設(shè)計(jì)上,僅留圖標(biāo)部分,不再保留任何邊框。雖然這有模仿 Android 的嫌疑,但公平的說(shuō),保留按鈕邊框早已過時(shí),無(wú)邊框已然是大勢(shì)所趨,許多應(yīng)用跟著 Facebook 一起采用了這個(gè)略為激進(jìn)的設(shè)計(jì)。這一獨(dú)特的設(shè)計(jì)最初出現(xiàn)在The Hamburger Icons(舉個(gè)例子,我們經(jīng)常用到的 Facebook 的菜單按鈕為三條橫線,看起來(lái)像抽象的漢堡包,這一概念即從這來(lái))上,很快便被所有設(shè)計(jì)師效仿。我不確定蘋果是否有必要把這一設(shè)計(jì)從其原生樣式中剔除,但是,可能至少不會(huì)過分強(qiáng)調(diào)。
三、返回按鈕
最近我注意到,很多重量級(jí)的應(yīng)用程序諸如 Facebook 和蘋果原生音樂播放器都經(jīng)過了重新設(shè)計(jì),它們用一個(gè)簡(jiǎn)單的箭頭代替之前的返回按鈕(包括文字按鈕與帶邊框的箭頭按鈕;蘋果音樂播放器是個(gè)例外,它用帶邊框 的箭頭按鈕替代了之前的文字按鈕,如下圖所示,雖然邊框極為暗淡,但依然存在)。我希望這一趨勢(shì)能一直持續(xù),簡(jiǎn)單的象形圖標(biāo)集足以表達(dá)常規(guī)操作。
四、蘋果原生圖標(biāo)
我非常迫切的想根據(jù)這種風(fēng)格來(lái)重新設(shè)計(jì)蘋果原生應(yīng)用的圖標(biāo)。
在這里我以 Messages 圖標(biāo)為例來(lái)說(shuō)明蘋果必須意識(shí)到的三個(gè)設(shè)計(jì)方面的問題:高光、條紋和過于明亮的顏色。我試圖用上文講述的那些原則來(lái)重新設(shè)計(jì)該圖標(biāo),并且大膽的把字體改為 Helvectica Neue Medium,把文字尺寸增大到 26 像素,以使其清晰可辨。我保留了蘋果原來(lái)的亮色調(diào),因?yàn)槲矣X得最近流行的柔和色調(diào)與蘋果并不相配,但是把整體亮度調(diào)低了一個(gè)檔次,如下圖所示。