我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

網(wǎng)絡(luò)上每年都會(huì)有大量設(shè)計(jì)趨勢(shì)分析,但是很多時(shí)候只是分析了一些表層,并沒有深入。趨勢(shì),幾乎每一年都在變,如何透過現(xiàn)象看本質(zhì)?我覺得方法之一是可以嘗試把時(shí)間線拉長(zhǎng),從一個(gè)更高的維度來看待趨勢(shì)演變,并通過對(duì)自身產(chǎn)品的品牌定位來分析是否需要跟隨趨勢(shì)去設(shè)計(jì)。

蘋果公司的設(shè)計(jì)一直是設(shè)計(jì)領(lǐng)域的風(fēng)向標(biāo),本文是通過回顧 App Store 里最經(jīng)典的10款應(yīng)用的設(shè)計(jì)演變,來橫向看待設(shè)計(jì)趨勢(shì)變化之路。

一篇簡(jiǎn)短的博客帖子在 Apple 官網(wǎng)上發(fā)布后,標(biāo)志著近段歷史上最重要的設(shè)計(jì)機(jī)會(huì)之一來臨了。史蒂夫喬布斯在這篇博文中寫道,「我想說的是:我們希望在 iPhone 上有原生的第三方應(yīng)用,并計(jì)劃在二月份讓開發(fā)人員拿到 SDK」。短短不到一年,在一個(gè)安靜的周四上午,App Store 向 iPhone 用戶開放了超過500個(gè)應(yīng)用。

幾乎沒有什么現(xiàn)代創(chuàng)新比 iPhone 應(yīng)用更能改變我們的生活和與周圍世界的互動(dòng)方式。在發(fā)布會(huì)上發(fā)布的首批500個(gè)應(yīng)用的開發(fā)者們有了一個(gè)特殊的機(jī)會(huì),可以塑造自那以后創(chuàng)建的數(shù)百萬個(gè)應(yīng)用的設(shè)計(jì)方向和交互策略。

為了慶祝 App Store 成立10周年,讓我們一起來研究下10個(gè)原創(chuàng) App Store 應(yīng)用的視覺演變。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

一、應(yīng)用

就本文而言,我所聚焦的點(diǎn)是在于應(yīng)用的顯著視覺變化上,這些應(yīng)用在第一天就可以下載,直到今天仍在保持更新。雖然其中許多應(yīng)用也有 iPad 版本,但本文主要講的是 iPhone 版本上的一些變化。

1. iTunes Remote

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

Apple 通過在 App Store 上發(fā)布一些自己的軟件,為其他開發(fā)人員樹立了標(biāo)桿。最初開發(fā)的兩個(gè)應(yīng)用是 Texas Hold'em 和 Remote,這是一個(gè)簡(jiǎn)單的應(yīng)用,用于通過 Wi-Fi 控制 Mac 或 Apple TV 的 iTunes庫的播放。2011年,Texas Hold'em 應(yīng)用下架了,但是 Remote 仍然在保持更新。

從一開始,Remote 的設(shè)計(jì)就很受 iPhone 版 iPod 應(yīng)用(現(xiàn)在叫做 Music)的外觀和感覺的影響。事實(shí)上,和現(xiàn)在的播放圖標(biāo)在外觀上本質(zhì)上是相同的。2.0版帶來了由 Louie Mantia 重新設(shè)計(jì)的圖標(biāo)。這兩個(gè)應(yīng)用開始在 iOS 6 上出現(xiàn)了分歧,當(dāng)時(shí)音樂應(yīng)用完全重新設(shè)計(jì)并設(shè)置了一個(gè)音量滑塊,可以動(dòng)態(tài)響應(yīng)你在 iPhone 上的移動(dòng)操作。Remote 保持了更保守的外觀,圖標(biāo)也再次更新以匹配 Mac 上 iTunes 11 的風(fēng)格。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

Remote 的第一次重大改版是在 iOS 7 上完成的。與音樂應(yīng)用的純白色主題形成對(duì)比的是 Remote 的深色模糊背景,并以專輯作品的顏色來配色。2016年,Apple 發(fā)布了針對(duì)第4代 Apple TV 的 Apple TV Remote 應(yīng)用,這是一個(gè)合乎邏輯的迭代,似乎取代了 Remote。不久之后,Remote 被重命名為 iTunes Remote。雖然這款應(yīng)用仍然能下載,但此后很長(zhǎng)時(shí)間,它幾乎都沒有更新。直到今年6月,才做了一次全新設(shè)計(jì)并對(duì) iPhone X 做了適配。

iTunes Remote 的這次更新重新回歸到更具保守的視覺外觀,讓人聯(lián)想到 iOS 11 音樂應(yīng)用,但放棄了大標(biāo)題和卡片的設(shè)計(jì),轉(zhuǎn)而支持傳統(tǒng)導(dǎo)航。iTunes Remote 使用藍(lán)色來匹配更新的圖標(biāo),而不再是原來的深色色系。

2. Facebook

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

與 iTunes Remote 的溫和變化形成鮮明對(duì)比的是,F(xiàn)acebook 應(yīng)用在過去十年中不斷進(jìn)行重新設(shè)計(jì),而且頻率越來越高。如果想要完全展現(xiàn) Facebook 的視覺更新歷史可能會(huì)寫滿一整本書,所以我在這里僅選取了8個(gè)最重要的更新。

Facebook 在 iPhone 上的更新實(shí)際上在 App Store 存在之前就已經(jīng)開始了。這款應(yīng)用最初是作為 iPhone 2007年10月推出的首批網(wǎng)絡(luò)應(yīng)用之一。除了標(biāo)志性的藍(lán)色導(dǎo)航條外,App Store 中的1.0版本現(xiàn)在幾乎認(rèn)不出 Facebook 了。即使是圖標(biāo)也缺少白色標(biāo)志性簽名「f」。應(yīng)用的消息流本質(zhì)上是一個(gè)帶有五個(gè)標(biāo)簽欄并裝飾好的表格視圖:主頁,個(gè)人資料,朋友,聊天和收件箱。2.0版本也是基于同樣的理念,只是在主標(biāo)題欄下新增了兩層導(dǎo)航。

Facebook 在2009年7月的3.0版本中,第一次引入了一個(gè)3×3網(wǎng)格圖標(biāo)來幫助解決應(yīng)用不斷膨脹的導(dǎo)航。早期的截圖顯示了這種圖標(biāo),但是這個(gè)設(shè)計(jì)從來沒有在公開版本中發(fā)布過。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

2011年10月,F(xiàn)acebook 4.0率先采用了導(dǎo)航「漢堡菜單」。在接下來的幾年里,這款應(yīng)用的普及加速了各種應(yīng)用和網(wǎng)站在設(shè)計(jì)元素上的創(chuàng)新。在第4.0版之后,F(xiàn)acebook 的設(shè)計(jì)時(shí)間表變得更加具有挑戰(zhàn)性。Facebook 的外觀開始迭代得更快,并且經(jīng)常是逐步推出,而不是一次性在主版本中全面鋪開。

2013年4月,F(xiàn)acebook 在 iOS 應(yīng)用中嘗試了「Chat Heads(譯者注:浮動(dòng)聊天頭像)」,頭像可以單獨(dú)彈出并能移動(dòng),在點(diǎn)擊時(shí)能直接打開聊天窗口(譯者注:youtube上有一段視頻是介紹這個(gè)功能的,感興趣的可以看看https://9to5mac.com/2013/04/16/facebook-for-ios-to-gain-chatheads-ipad-app-redesign-today-brichter-working-on-home/)。iOS 7 的新風(fēng)格要求重新設(shè)計(jì)導(dǎo)航欄。標(biāo)簽欄圖標(biāo)在更新之間仍有規(guī)律地重新定位和設(shè)計(jì)。

Facebook 的一些設(shè)計(jì)挑戰(zhàn)來自其運(yùn)營規(guī)模。 與許多小應(yīng)用不同,F(xiàn)acebook 必須在大量平臺(tái)上為其客戶提供一致的體驗(yàn),而不僅僅是在 iOS 上。 2017年8月的更新,是在嘗試統(tǒng)一 iOS,Android 和 Web 上的信息流設(shè)計(jì),其評(píng)論風(fēng)格看起來也更像是 Messenger 對(duì)話。

3. Things

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

Things 一開始是作為一個(gè) mac端的任務(wù)管理工具開發(fā)的,但是最后的1.0版本卻是在 iOS 上發(fā)布的。開發(fā)這款應(yīng)用的作者 Culture Code 在發(fā)布會(huì)上指出,最初的版本在一個(gè)月時(shí)間內(nèi)完成——是在一個(gè)聽起來似乎不可能完成的時(shí)間內(nèi)完成的。

1.0版本與 Mac 版本兩個(gè)關(guān)鍵問題是沒有辦法同步并且不能使用標(biāo)簽。盡管開始有壓力,但這款應(yīng)用的基本架構(gòu)一直延續(xù)到今天。一款優(yōu)秀的 Flickr 相冊(cè)記錄了應(yīng)用的早期設(shè)計(jì)階段。第一次主要的更新是在2012年8月2.0版本的發(fā)布,有了一個(gè)全新的外觀和一些個(gè)性的圖標(biāo)設(shè)計(jì)。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

2014年9月,Things 2.5 版本再次更新了 UI,使其外觀更加扁平,配色更淺。最初計(jì)劃對(duì) Things 3 版本進(jìn)行重新設(shè)計(jì),但開發(fā)花費(fèi)的時(shí)間比預(yù)期的要長(zhǎng)。2017年5月發(fā)布的 Things 3 是這款應(yīng)用迄今為止最重大的一次改版。幾乎每個(gè)圖標(biāo)和 UI 元素都被重新設(shè)計(jì),僅保留了底層布局。在更新的發(fā)布視頻中,Cultured Code 特別強(qiáng)調(diào)了如何使用動(dòng)畫為應(yīng)用提供全新的感覺。在2017年,重新設(shè)計(jì)的 Things 獲得了蘋果設(shè)計(jì)大獎(jiǎng)。

4. OmniFocus

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

即使在它的初期,App Store 也已經(jīng)有非常多的任務(wù)管理應(yīng)用。 來自 The Omni Group 公司的 Things 和 OmniFocus 兩款應(yīng)用從 App Store 上線第一天就有了。 雖然這兩款應(yīng)用提供類似的功能,但在過去的十年中,它們都有各自獨(dú)特的設(shè)計(jì)方向。

OmniFocus 的 iPhone 版最初采用簡(jiǎn)單的表格視圖和自定義圖標(biāo)導(dǎo)航,獲得了2008年的蘋果設(shè)計(jì)大獎(jiǎng)。2010年6月,為了支持 iPhone4 的視網(wǎng)膜屏幕,Omni 集團(tuán)重新設(shè)計(jì)了界面和應(yīng)用圖標(biāo)。這款應(yīng)用最大的變化之一是在2011年6月增加了預(yù)測(cè)模式。導(dǎo)航條下方光滑的日期選擇器成為了一個(gè)定義用戶界面的元素,直到2013年為了 iOS7 而重新設(shè)計(jì)并放棄了光澤質(zhì)感。新的扁平界面很大程度上依賴于文本顏色來感知層級(jí)關(guān)系。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

2015年春季的更新給 Thines 的 iPhone 版本換上了一個(gè)深色的應(yīng)用圖標(biāo),圖標(biāo)中的圖形拐角也變得更加柔和。自2012年以來,每個(gè)圖標(biāo)都包含一個(gè)彩蛋,即使是老用戶也可能不知道。把圖標(biāo)放大,才會(huì)注意到原來圖標(biāo)中的紋理實(shí)際上是由微小重復(fù)的 Omni 標(biāo)志組成的。

最近一次重大更新是在5月份發(fā)布的 OmniFocus 3.0。雖然許多更改都與功能邏輯相關(guān),但大標(biāo)題和對(duì) iPhone X 的優(yōu)化仍然使得 UI 煥然一新。

5. Evernote

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

Evernote 的風(fēng)格迭代完美地展現(xiàn)了2008年以來的許多主要軟件的設(shè)計(jì)趨勢(shì)。在 App Store 推出之前,這款筆記記錄和組織工具最初是作為桌面應(yīng)用開發(fā)的,在 iPhone 上發(fā)布之前,它已經(jīng)用上了其標(biāo)志性的大象 logo。

與許多早期的 iPhone 應(yīng)用一樣,Evernote 1.0 非常依賴于 iPhone 的 UIKit 和寫實(shí)的圖標(biāo)。2011年的版本重新設(shè)計(jì)了標(biāo)簽欄,并將按時(shí)間順序?qū)Α杆泄P記」視圖進(jìn)行了優(yōu)化。當(dāng) Evernote 在2012年增加對(duì) iPhone 5 更大屏幕的支持時(shí),應(yīng)用仍然使用默認(rèn)的 iOS UI 元素。導(dǎo)航條和按鈕自動(dòng)讀取 iOS 6的 UI 組件。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

2012年11月,Evernote 5發(fā)布。這款應(yīng)用從頭開始重新設(shè)計(jì),是那個(gè)時(shí)代典型的紋理豐富、主題鮮明的設(shè)計(jì)范例。浮雕圖標(biāo),紙張紋理和陰影賦予了應(yīng)用的空間感。應(yīng)用的圖標(biāo)去掉了過時(shí)的光澤質(zhì)感,但保留了金屬光澤。

在一篇博文中,Evernote 說:「我們通常不會(huì)進(jìn)行全盤的重新設(shè)計(jì)。事實(shí)上,至少每隔幾年才會(huì)發(fā)生一次?!闺m然他們當(dāng)時(shí)并不知道,僅在一年后的2013年 WWDC 上發(fā)布了 iOS7 時(shí),Evernote 就在重新設(shè)計(jì)了。之后的 Evernote 5 也獲得了蘋果設(shè)計(jì)大獎(jiǎng)。

Evernote 完全擁抱 iOS 7 的設(shè)計(jì)趨勢(shì)。每個(gè)紋理、陰影和斜角都被替換。一個(gè)亮色的從左到右的漸變條在應(yīng)用在導(dǎo)航條上,與新的文本圖標(biāo)上使用的顏色相匹配。2017年早些時(shí)候的一次更新使設(shè)計(jì)更加柔和,有了一個(gè)更柔和的圖標(biāo)、淺色導(dǎo)航條、帶有微妙陰影的便簽卡和一個(gè)黑色的標(biāo)簽條。字體和標(biāo)簽欄圖標(biāo)也同步進(jìn)行了更新。

6. eBay

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

eBay 的設(shè)計(jì)可以說是這篇文章10個(gè)應(yīng)用中最引人注目的一個(gè)。 盡管蘋果公司在 WWDC 2008大會(huì)上強(qiáng)調(diào)了它,但與今天的精致體驗(yàn)相比,原始版本的 eBay for iPhone 是做的非常粗糙的。 到2009年11月,整個(gè)應(yīng)用已經(jīng)重新考慮了更加一致的灰色用戶界面。

一年后的 eBay 2.0 為未來幾年如何設(shè)計(jì)這款應(yīng)用奠定了基礎(chǔ)。盡管 eBay 此前曾推出過一款獨(dú)立的銷售應(yīng)用,但現(xiàn)在這一功能已經(jīng)融入了主流體驗(yàn)。這款應(yīng)用的主界面也得到了更新,最終讓人覺得它是一個(gè)真正的 iOS 設(shè)計(jì)。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

在2013年的幾次更新中,eBay 在保持基本用戶體驗(yàn)的同時(shí),也創(chuàng)造了新的用戶體驗(yàn)。每一個(gè)變化都反映了這個(gè)時(shí)代快速發(fā)展的軟件設(shè)計(jì)品味。這一持續(xù)不斷的迭代意味著,在為 iOS 7 重新設(shè)計(jì)該應(yīng)用時(shí),eBay 的面貌發(fā)生了相當(dāng)平穩(wěn)的轉(zhuǎn)變。使用熟悉的配色和導(dǎo)航層次結(jié)構(gòu)有助于保存用戶的記憶。

2015年9月,eBay 4.0 打破了固有設(shè)計(jì)模式。應(yīng)用的大部分功能都放在漢堡菜單里,在最上面只剩下三個(gè)標(biāo)簽:「活動(dòng)、購物、銷售」,但這個(gè)設(shè)計(jì)沒有持續(xù)太長(zhǎng)時(shí)間。到2016年5月,eBay 幾乎完全恢復(fù)了應(yīng)用的組織結(jié)構(gòu),如今的布局與2010年推出的設(shè)計(jì)更接近了。

7. Twitterrific

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

在 App Store 發(fā)布之前,Craig Hockenberry 和 The Iconfactory 就已經(jīng)為 iPhone 構(gòu)建了第一個(gè) Twitter 客戶端。 得益于蘋果發(fā)燒友社區(qū)開發(fā)的越獄軟件,開發(fā)者們?cè)谔O果提供官方工具的時(shí)候就已經(jīng)有了幾個(gè)月的應(yīng)用編寫經(jīng)驗(yàn)。

Twitterrific 1.0 從越獄版本借鑒了不少設(shè)計(jì)元素,從普通用戶看來,它非常光彩照人。它在2008年獲得了蘋果設(shè)計(jì)獎(jiǎng),Twitterrific 也是首批使用深色主題的應(yīng)用之一,這種風(fēng)格在今天看來也很受歡迎。但 Twitterrific 的設(shè)計(jì)迭代更多地反映了 Twitter 作為一種服務(wù)的歷史,而并非設(shè)計(jì)趨勢(shì),每次更新都反映了 Twitter 平臺(tái)的特性和功能的變化。在早期,這些特征通常是需要第三方自己去創(chuàng)新的。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

2012年,Twitterrific 5.0 將所有導(dǎo)航都移動(dòng)到界面頂部,并使用完全定制的 UI元素,類似的布局一直延續(xù)到今天。就像這款應(yīng)用的設(shè)計(jì)一樣吸引人的是它的圖標(biāo)。除了是第一個(gè)使用鳥類圖標(biāo)的 Twitter 應(yīng)用之外,Twitterrific 也是為數(shù)不多的幾個(gè) iOS 應(yīng)用之一,這些應(yīng)用在保留了豐富細(xì)節(jié)圖標(biāo)的同時(shí)看起來也更現(xiàn)代。這款應(yīng)用的吉祥物奧利(Ollie)在升級(jí)到 iOS 7 的過程中幾乎沒怎么變過,現(xiàn)在看起來還是和2012年一樣新鮮。

8. Instapaper

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

一款專為閱讀而設(shè)計(jì)的應(yīng)用將內(nèi)容置于 chrome 之上,因此 Instapaper 的設(shè)計(jì)從一開始就很自然地受到限制。事實(shí)上,一些最明顯的視覺變化來自 iOS 本身的改變。iOS 6 和7都改變了導(dǎo)航條和按鈕樣式,給了應(yīng)用兩個(gè)「免費(fèi)」的視覺更新。

當(dāng)然,要說這款應(yīng)用沒有進(jìn)化,也是不大準(zhǔn)確的。Instapaper 最初是在應(yīng)用商店作為免費(fèi)下載開始的。不久之后,一個(gè)名為 Instapaper Pro 的付費(fèi)版本發(fā)布了。2011年秋季推出了由 Dribbble 聯(lián)合創(chuàng)始人 Dan Cedarholm 設(shè)計(jì)的一個(gè)新圖標(biāo),大大改善了閱讀體驗(yàn)和更深層次的 UI元素。這個(gè)圖標(biāo)后來出現(xiàn)在 WWDC 的一個(gè)關(guān)于偉大圖片的 PPT 上。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

2013年4月,Betaworks 從創(chuàng)始人 Marco Arment 手中收購 Instapaper,讓這款應(yīng)用走上了一條不同的道路。 Betaworks 指導(dǎo)下的第一次重大更新于2013年9月發(fā)布,恰逢 iOS 7 更新。 Pinterest 于2016年8月收購了 Instapaper,當(dāng)時(shí)該公司承諾這款應(yīng)用將繼續(xù)更新。 在目前的所有權(quán)下,即使在支持 iPhone X 的超級(jí)視網(wǎng)膜屏的更新后,Instapaper 也保持了相當(dāng)一致的視覺效果。

9. PCalc

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

PCalc 的故事開始于應(yīng)用商店推出前的十多年。開發(fā)者 James Thomson 在1992年發(fā)布了 Mac 的初始版本,它的發(fā)展一直延續(xù)到今天。PCalc 從一開始就在 iOS 上推出了一個(gè)完全定制的界面,提供了越來越多的主題選擇和定制選項(xiàng)。這里有太多能強(qiáng)調(diào)的地方,所以我打算只選擇幾個(gè)里程碑來說明。

iPhone 的第一個(gè) PCalc 版本是從 Mac dashboard 的一個(gè)小部件移植過來的,但是與經(jīng)典的 iPhone UI 能很好地結(jié)合在了一起。帶高光的按鈕和深藍(lán)色的 LCD 面板與應(yīng)用的圖標(biāo)相匹配。2008年12月,一個(gè)名為 Twilight 的熱門主題被添加進(jìn)了 PCalc 中,有點(diǎn)類似于 iOS 默認(rèn)的計(jì)算器應(yīng)用。直到現(xiàn)在,它仍然是應(yīng)用程序中的一個(gè)選項(xiàng)。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

PCalc 采用了名為「Samurai」的新默認(rèn)主題和匹配圖標(biāo),適應(yīng)了 iOS 7 的扁平風(fēng)格。 應(yīng)用程序設(shè)置中仍然提供一些比較經(jīng)典的主題。 PCalc 的圖標(biāo)在2016年3月再次更新。自 iOS 10.3 發(fā)布以來,Apple 已允許第三方應(yīng)用程序動(dòng)態(tài)更改其應(yīng)用程序圖標(biāo),而無需向商店提交新版本。 PCalc 于2017年5月開始充分利用該功能,推出了各種各樣的備用圖標(biāo)供您選擇, 在后續(xù)更新中也添加了更多內(nèi)容。

經(jīng)過10年的發(fā)展,PCalc 已經(jīng)突破了 iPhone 計(jì)算器應(yīng)用的實(shí)際限制,最近的更新已經(jīng)享受到了一些具有創(chuàng)新性的自由,比如 AR 計(jì)算器模式。支持 iPhone X 的展示給 Samurai 主題增添了圓角。

10. Yelp

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

和 Facebook 一樣,Yelp 的 iPhone 版本界面多年來也發(fā)生了很大的變化,但由于使用了一致的導(dǎo)航欄顏色,它的品牌標(biāo)識(shí)仍然可以辨認(rèn)。由于與蘋果地圖的深度融合,這款應(yīng)用越來越受歡迎。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

2009年8月,Yelp 將一個(gè)基本的增強(qiáng)現(xiàn)實(shí)界面應(yīng)用在 iPhone 版本中,用于定位周圍的企業(yè)。 雖然它當(dāng)時(shí)只是一個(gè)新奇的東西,但鑒于 ARKit 應(yīng)用程序的興起,這一功能在今天看來是具有先見之明的。

2010年1月,在新的 Yelp 主頁上推出了9宮格形式的快捷圖標(biāo)。同樣的基本界面在風(fēng)格上得到了完善,直到整個(gè)應(yīng)用在2013年10月進(jìn)行了重新設(shè)計(jì),使得外觀更扁平,也更突出「附近」標(biāo)簽。

Yelp 的最新更新通過顯示與你相關(guān)的內(nèi)容,豐富了簡(jiǎn)單基于位置的結(jié)果。 這種通過綜合處理信息發(fā)現(xiàn)的方法是用戶體驗(yàn)設(shè)計(jì)的趨勢(shì),在 iOS 11 重新設(shè)計(jì)的 App Store 中取得了巨大成功。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

二、圖標(biāo)

對(duì)比所有10個(gè)重點(diǎn)提到的應(yīng)用圖標(biāo)迭代,揭示了各自選擇的獨(dú)特的現(xiàn)代化路徑。在過去的十年里,一些圖標(biāo)保持了相當(dāng)?shù)囊恢滦?,只有微小的改變,而另一些則每隔幾年重新設(shè)計(jì)一次。從時(shí)間線上來看,全行業(yè)都在緊跟設(shè)計(jì)趨勢(shì)變得愈發(fā)明顯。

在 App Store 剛推出時(shí),有光澤質(zhì)感的圖標(biāo)統(tǒng)治著這片土地。圖標(biāo)在默認(rèn)情況下就應(yīng)用了光澤,開發(fā)人員必須在 Xcode 中專門禁用該效果才能將其刪除。 隨著 iOS 應(yīng)用的成熟,大多數(shù)應(yīng)用最終去掉了光澤并采用了非常明確的個(gè)性化設(shè)計(jì)。

眾所周知,iOS 7 重新定義了一個(gè)好圖標(biāo)的標(biāo)準(zhǔn)。與蘋果的新圖標(biāo)集一起,高質(zhì)感和 3D渲染的作品通常看起來不太合適,有些與更新后的圓角半徑發(fā)生了沖突。隨著設(shè)計(jì)師和開發(fā)人員逐漸為圖標(biāo)設(shè)計(jì)制定新的規(guī)范,細(xì)節(jié)和更加克制的顏色慢慢地回到了許多圖標(biāo)中。

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

三、個(gè)性

早期的 iPhone 應(yīng)用一頭扎進(jìn)一個(gè)未知的世界。 除了蘋果公司自己的內(nèi)置應(yīng)用外,應(yīng)用的外觀和工作方式?jīng)]有既定的規(guī)范,設(shè)計(jì)師和開發(fā)人員可以完全自由地進(jìn)行實(shí)驗(yàn)。

盡管如此,當(dāng)用戶和開發(fā)人員手把手地學(xué)習(xí)最佳實(shí)踐時(shí),許多早期的應(yīng)用看上去和感覺上都非常相似。早期的反饋、嘗試和錯(cuò)誤迅速塑造了每個(gè)應(yīng)用的發(fā)展過程。幾年之內(nèi),大多數(shù)應(yīng)用程序都找到了自己的定位,并發(fā)展出了獨(dú)特的風(fēng)格和個(gè)性。隨著硬件性能的提高,設(shè)計(jì)差異化逐漸從靜態(tài)圖形轉(zhuǎn)向動(dòng)態(tài)圖形和動(dòng)態(tài)界面。

在 iOS 7 引入的同質(zhì)化界面指導(dǎo)原則讓設(shè)計(jì)師和開發(fā)人員從頭開始設(shè)計(jì),許多應(yīng)用開始重視用戶體驗(yàn),而不僅是視覺。周到的信息綜合處理和預(yù)測(cè)性信息設(shè)計(jì)通常被用來幫助展示新的和有趣的內(nèi)容,否則這些內(nèi)容可能會(huì)被忽視。智能工作流簡(jiǎn)化了常見的操作,幫助減少完成任務(wù)的時(shí)間。優(yōu)秀設(shè)計(jì)的重要性超越了視覺層面,這導(dǎo)致了近年來用戶體驗(yàn)設(shè)計(jì)的盛行。

四、下一個(gè)10年

在2008年,那時(shí)還無法準(zhǔn)確預(yù)測(cè) App Store 的發(fā)展方式。改革源于創(chuàng)新,iPhone 用戶的品味和習(xí)慣塑造了開發(fā)者選擇開發(fā)的應(yīng)用類型。同樣的道理也適用于未來,即將發(fā)布的 iphone 和 iOS 新版本肯定會(huì)以不可預(yù)見的方式改變應(yīng)用的格局。一種新的設(shè)計(jì)趨勢(shì)明天可能席卷全球。即使是在10年后,未來仍然是令人興奮的。

原文鏈接:《10 years of the App Store: The design evolution of the earliest apps》??Michael Steeber

歡迎關(guān)注譯者的微信公眾號(hào):「?彩云譯設(shè)計(jì)」

我回顧了App Store 十年來的視覺變化,告訴你設(shè)計(jì)趨勢(shì)是如何演變的!

圖片素材作者:Al Shostko

「2018年的設(shè)計(jì)趨勢(shì)」

收藏 12
點(diǎn)贊 26

復(fù)制本文鏈接 文章為作者獨(dú)立觀點(diǎn)不代表優(yōu)設(shè)網(wǎng)立場(chǎng),未經(jīng)允許不得轉(zhuǎn)載。