07.11 App Store10週年一起看看App Store應用程序的10年設計演變

在Apple的網站上發佈了一篇簡單的博客文章,宣佈了近期歷史上最重要的設計機會之一。“我只想說:我們想在iPhone上使用原生的第三方應用程序,我們計劃在二月份開發人員手中使用SDK,”史蒂夫喬布斯寫道。在不到一年之後的一個安靜的週四早上,App Store 向iPhone用戶開放了超過500個應用程序。

很少有當代創新改變了我們的生活方式,並且比iPhone應用程序更能與周圍的世界互動。在發佈會上推出的前500個創作者有獨特的機會塑造自那時以來創建的數百萬個應用程序的設計方向和交互方法。

為了慶祝App Store成立10週年,讓我們研究10個原創App Store應用程序的視覺演變。

App Store10週年一起看看App Store應用程序的10年設計演變

應用程序

對於這一塊的目的,我一直專注於顯著的視覺變化到應用程序都可以下載的一天,還在今天收到更新。雖然其中許多應用程序也可用於iPad,但此次審核突出了iPhone版本的變化。

App Store10週年一起看看App Store應用程序的10年設計演變

iTunes Remote

Apple通過在App Store上發佈一些自己的軟件,為其他開發人員樹立了榜樣。創建的第一個應用程序中有兩個是Texas Hold'em和Remote遊戲,這是一個簡單的實用程序,用於通過Wi-Fi控制Mac或Apple TV的iTunes庫的播放。雖然德州撲克在2011年從商店撤出,但今天仍然存在。

從一開始,Remote的設計就受到iPhone iPod應用程序(今天稱為音樂)的外觀和感覺的影響很大。事實上,正在播放的視圖在外觀上基本相同。2.0版帶來了由Louie Mantia設計的新圖標。這兩個應用程序開始在iOS 6上出現分歧,當時音樂應用程序完全重新設計並具有一個音量滑塊,可以動態響應iPhone的移動。遙控器保持了更多的庫存外觀。該圖標再次更新以匹配Mac上iTunes 11的樣式。

App Store10週年一起看看App Store應用程序的10年設計演變

Remote 7的第一次主要重新設計來自iOS 7.與音樂應用程序的鮮明白色主題形成鮮明對比的是,遙控器採用了深色的模糊背景,並以專輯封面的顏色著色。2016年,Apple發佈了針對第4代Apple TV 的Apple TV Remote應用程序,這是一個合乎邏輯的步驟,似乎取代了Remote。不久之後,Remote被重命名為iTunes Remote。雖然該應用程序繼續可供下載,但直到今年6月,它仍然保持不變,當時它收到了全新設計並支持iPhone X的更高顯示屏。

iTunes Remote的刷新迴歸到更具視覺保守性的外觀,讓人聯想到iOS 11音樂應用程序,但放棄了大型遊戲和卡片,轉而支持傳統導航。iTunes Remote使用藍色來匹配更新的圖標,而不是紅色調顏色。

App Store10週年一起看看App Store應用程序的10年設計演變

Facebook

與iTunes Remote的適度變化相比,Facebook應用程序在過去十年中不斷重新設計,頻率越來越高。應用程序的全面視覺歷史將填補一本小書,所以我選擇強調八個更重要的變化。

Facebook在iPhone上的冒險實際上是在App Store存在之前開始的。該服務最初於2007年10月作為iPhone的第一個網絡應用程序之一提供。除了標誌性的藍色導航欄之外,App Store中的1.0版現在幾乎無法識別為Facebook。即使是圖標也缺少簽名白色“f”。該應用程序的新聞Feed基本上是一個帶有五個圖標的標籤欄上方的裝飾表視圖:主頁,個人資料,朋友,聊天和收件箱。2.0版基於相同的概念,在主標題欄下添加了兩層導航。

Facebook 3.0於2009年7月首次預覽,並推出了3×3網格圖標,以幫助解決應用程序的氣球導航問題。早期的屏幕截圖顯示了一個完全藍色的平鋪網格,但這個設計從未在應用程序的公共版本中發佈。

App Store10週年一起看看App Store應用程序的10年設計演變

Things

Things開始作為Mac的任務管理工具開發,但最終在iOS上首先達到1.0狀態。該應用程序的開發人員Cultured Code在他們的發佈帖中指出,原始版本僅在一個月內構建 - 這個截止日期似乎不可能。

Things 1.0缺乏與Mac版同步的方法,並且禁用了標記,這兩個都是關鍵功能。儘管發佈壓力很大,但應用程序的基本層次結構仍然存在至今。一個優秀的Flickr相冊記錄了應用程序的早期設計階段。第一個主要的視覺刷新排在2012年8月,當事情2.0發佈了。一層清新的油漆脫落了iOS的外觀,而小巧的圖形裝飾賦予它獨特的個性。

App Store10週年一起看看App Store應用程序的10年設計演變

2014年9月的Things2.5再次刷新了應用程序的用戶界面,外觀更平坦,配色更輕。重新設計最初計劃用於第3項,但開發時間比預期的要長。2017年5月發佈的第 3件事是應用程序外觀上最重大的變化。實際上,每個圖標和UI元素都被重新繪製,同時保留了底層佈局。在更新的發佈視頻中,Cultured Code特別強調了如何使用動畫為應用程序提供全新的感覺。重新設計在2017年獲得了Cultured Code的Apple設計獎。

OmniFocus

即使在它的初期,App Store也備有豐富的任務管理應用程序。來自The Omni Group的Things和OmniFocus從第一天開始提供。雖然這兩個應用程序提供類似的實用程序,但在過去的十年中,每個應用程

OmniFocus for iPhone最初使用簡單的桌面視圖和自定義導航圖像,在2008年贏得了Apple設計獎。Omni Group在2010年6月重新繪製了他們的所有藝術作品和應用程序圖標,以響應iPhone 4的Retina顯示屏。應用程序最大的變化之一發生在2011年6月,當時添加了預測模式。導航欄下方的光澤日期選擇器成為了一個定義的UI元素,即使在2013年針對iOS 7時代的重新設計降低了光澤度。新的平面外觀在很大程度上依賴於文本色調的顏色來提升空間感。

App Store10週年一起看看App Store應用程序的10年設計演變

2015年春季的更新為iPhone帶來了一個較暗的應用程序圖標,複選標記處邊緣較柔和。自2012年以來,每個圖標都包含一個復活節彩蛋,即使是長期用戶可能也不知道。放大,您會注意到碳纖維紋理實際上是由微小的重複Omni徽標組成。

OmniFocus最近的主要更新來自今年五月的OmniFocus 3.0。雖然許多變化都與工程相關,但大型遊戲和iPhone X優化更新了用戶界面。

App Store10週年一起看看App Store應用程序的10年設計演變

Evernote

Evernote的造型故事完美地突出了自2008年以來的許多主要軟件設計趨勢。筆記和組織工具在App Store之前作為桌面應用程序開始,並且最近在iPhone上發佈之前更名為其可識別的大象徽標。

像許多早期的iPhone應用程序一樣,Evernote 1.0嚴重依賴於UIKit庫存元素和大而有光澤的圖形。2011年的重新設計重新組織了標籤欄,並按時間順序排列了“所有筆記”視圖的優先順序。當Evernote在2012年增加對iPhone 5更大顯示器的支持時,該應用仍然使用默認的iOS UI元素。導航欄和按鈕自動拾取iOS 6的亞光飾面。

App Store10週年一起看看App Store應用程序的10年設計演變

2012年11月,Evernote 5推出。從頭開始重新設計,該應用程序是該時代典型的豐富紋理,高度主題設計的教科書範例。浮雕圖標,仿紙紋理和深度陰影為應用程序提供深度。該應用程序的圖標降低了老化的光澤外觀,但保留了拉絲金屬。

在一篇公告博客文章中,Evernote說:“我們通常不會進行全面的重新設計。事實上,它每隔幾年才會發生一次。“雖然他們當時並不知道,但是在2013年WWDC上宣佈推出iOS 7時,Evernote需要重新設計不到一年.Evernote 5 贏得Apple Design當天獎勵。

Evernote 採用張開雙臂包含 iOS 7的平整度。每個紋理,陰影和斜角都被替換掉了。一個明亮的從左到右的漸變條紋應用程序的導航欄,與新的無紋理圖標上使用的顏色相匹配。一個早期的2017刷新淡化的設計,更靜音圖標,白色的導航欄,注意卡有微妙的陰影和黑暗的標籤欄。隨後對排版和標籤欄圖標進行了進一步改進。

App Store10週年一起看看App Store應用程序的10年設計演變

易趣

eBay的設計可以說是這篇文章中10個應用程序中最引人注目的轉變。儘管蘋果公司在WWDC 2008的舞臺上突出了它,但與今天的精緻體驗相比,原始版本的eBay for iPhone是徹頭徹尾的原油。到2009年11月,整個應用程序已經重新考慮了更加一致的灰色用戶界面。

一年後,eBay 2.0為未來幾年應用程序的組織奠定了基礎。雖然eBay之前曾提供獨立銷售應用程序,但該功能現已融入主要體驗。該應用程序的主屏幕也刷新了,最後感覺像一個真正的原生iOS設計。

App Store10週年一起看看App Store應用程序的10年設計演變

2013年的幾次更新為eBay提供了新的塗料,同時保持了相同的基本用戶體驗。每一次變化都反映了這個時代迅速發展的軟件設計品味。這個連續的迭代意味著當應用程序重新設計為iOS 7時,eBay的外觀轉換得相當順利。使用熟悉的調色板和導航層次結構有助於保持用戶的肌肉記憶。

2015年9月,eBay 4.0 打破了模式。大多數應用程序的功能都放在漢堡包菜單下面,只留下三個標籤靠近頂部:“活動,商店,銷售。”憑藉鮮明的文字重量UI和新圖標匹配,設計不會持續很長時間。截至2016年5月,eBay幾乎完全恢復了應用程序的組織。今天的佈局與2010年推出的設計更加相似。

App Store10週年一起看看App Store應用程序的10年設計演變

Twitterrific

在App Store宣佈之前,Craig Hockenberry和The Iconfactory為iPhone 構建了第一個 Twitter客戶端。由於 Apple愛好者社區開發的越獄軟件,開發人員在Apple提供官方認可的工具時有幾個月的編寫應用程序的經驗。

Twitterrific 1.0從越獄時代借用了一些設計元素,看起來令人驚訝地拋出了大門。它在2008年獲得了Apple設計獎。Twitterrific也是最早使用黑暗主題的應用程序之一 - 今天越來越流行的選擇。但Twitterrific的設計故事更多地講述了Twitter作為服務的歷史,而不是設計趨勢。每次更新都反映了Twitter平臺的特性和功能的變化。在早期,這些功能通常由第三方自己開創。

App Store10週年一起看看App Store應用程序的10年設計演變

2012年,Twitterrific 5.0將所有導航移動到顯示的頂部,並使用完全自定義的UI元素。類似的佈局一直持續到今天。就像應用程序的設計一樣迷人的是它的圖標。除了作為第一個使用鳥類圖像的 Twitter應用程序之外,Twitterrific還是為數不多的iOS應用程序之一,它仍然保持著現代化的視覺效果。應用程序的吉祥物Ollie在向iOS 7過渡期間幾乎沒有變化,今天看起來仍然像2012年一樣新鮮。

App Store10週年一起看看App Store應用程序的10年設計演變

Instapaper

一個專為閱讀而構建的應用程序優先考慮內容而不是chrome,因此Instapaper的設計從一開始就自然被制服了。事實上,由於iOS本身的變化,應用程序收到的一些最明顯的視覺變化。導航欄和按鈕樣式在iOS 6和7中都進行了更改,為應用程序提供了兩個“免費”的可視刷新。

然而,說應用程序沒有發展將是一種誤導。Instapaper在App Store上免費下載。不久之後,推出了名為Instapaper Pro的付費版本。2011年秋季,由Dribbble聯合創始人Dan Cedarholm設計的新圖標被添加,讀取體驗和更深層UI元素的重大更新。圖標後來特色關於偉大的肖像一個WWDC會議幻燈片。

App Store10週年一起看看App Store應用程序的10年設計演變

2013年4月,Betaworks從創始人Marco Arment 手中收購 Instapaper,以不同的方式發送應用程序。Betaworks指導下的第一次重大更新於2013年9月發佈,iOS 7更新。Pinterest於2016年8月收購了 Instapaper,當時該公司承諾該應用程序將繼續存在。在目前的所有權下,即使在支持iPhone X的Super Retina顯示器的更新後,Instapaper也保持了相當一致的視覺效果。

圖標

比較所有十個突出顯示的應用程序的圖標迭代並排顯示了每個選擇的現代性的獨特途徑。在過去十年中,一些圖標保持相當一致,只進行了細微的改進,其他圖標每隔幾年就重新設計一次。按時間順序排列,行業範圍的設計趨勢變得明顯。

在App Store推出時,有光澤的圖標統治著這片土地。默認情況下應用了圖標光澤,開發人員必須在Xcode中專門禁用該效果才能將其刪除。隨著iOS應用程序的成熟,大多數人最終失去了光澤並採用了非常詳細的自定義設計

iOS 7著名地重新設定了製作好圖標的指標。高度紋理化和3D渲染的資產通常在Apple的新圖標集旁邊看起來不合適,有些與更新的圓角半徑發生衝突。隨著設計師和開發人員逐漸建立了圖標設計的新指南和最佳實踐,細節和更多受限制的調色板已經悄悄回到許多圖標中。

個性

早期的iPhone應用程序一頭扎進一個未知的世界。除了蘋果公司自己的小型股票應用程序外,應用程序的外觀和工作方式沒有先入為主的觀念,設計師和開發人員可以完全自由地進行實驗。

儘管如此,許多早期的應用程序看起來和感覺非常相似,因為用戶和開發人員攜手學習最佳實踐。早期反饋和反覆試驗很快就會影響每個應用的發展方式。在幾年內,大多數應用程序找到了自己的方式,並開發出獨特的風格和個性。隨著硬件功能的改進,設計差異逐漸從靜態圖形轉變為動畫和動態界面。

在iOS 7引入的同質化界面指南將設計人員和開發人員送回繪圖板之後,許多應用程序開始通過感受到的體驗選擇來區分自己,而不是看到。經常使用周到的策展和預測信息設計來幫助表現出新的和有趣的內容,否則這些內容可能會被忽視。智能工作流程簡化了常見操作,幫助您減少完成任務的時間。超出像素級別的良好設計的重要性導致近年來用戶體驗(UX)設計的普及。

未來10年

在2008年,無法準確預測App Store的發展方式。創新源於創新,iPhone用戶的品味和習慣塑造了開發人員選擇的應用程序類型。未來也可以這麼說。即將推出的iPhone和iOS版本肯定會以不可預見的方式改變應用程序格局。一個新的設計趨勢明天將席捲全球。即使在10年後,未來也是令人興奮的。


分享到:


相關文章: