乍看上去，“為iOS7重設計”無非就是新的應用圖標、無邊框按鈕、與導航欄配色相匹配的狀態(tài)欄等等。不過如果你再深入挖掘一些，便會發(fā)現(xiàn)很多耀眼的地方都體現(xiàn)著iOS7的三大設計主題，即“依從、清晰、縱深”。
對于某些應用來說，這些改變帶來了設計上的極大改善，而另外一些則甚至比從前還要糟糕，不僅可用性被破壞，而且品牌識別效應也大打折扣。本文會圍繞著iOS7 UI過渡指南當中提出的一些關(guān)鍵性的設計解決方案，介紹一些比較有代表性的應用案例。如果你正計劃著升級自己的產(chǎn)品，或是以iOS7風格為準繩從零開始設計應用，那么這些例子可能會幫你更好的起步。
1.全屏布局與半透明UI元素
iOS7允許應用界面充分利用“邊到邊”的全屏空間。舉個例子，如果你的應用當中會顯示系統(tǒng)狀態(tài)欄，那么在iOS7下，你也許需要讓用戶透過狀態(tài)欄看到它“后面”的模糊化的內(nèi)容。類似的，如果你的應用會用到其他一些標準控件，例如導航欄、標簽欄、工具欄、搜索欄、范圍欄(scope bar)，那么在iOS7當中，這些控件背后的內(nèi)容都可以模糊的呈現(xiàn)出來。如果你決定充分利用系統(tǒng)新特性來實現(xiàn)這些效果，那么就要確保內(nèi)容視圖的尺寸可以填滿整個屏幕，包括這些控件背后的區(qū)域。更多細節(jié)可以參考iOS7界面設計規(guī)范當中的Bars一節(jié)。
案例
大量的iOS7應用都使用了半透明狀態(tài)欄，能夠以模糊效果呈現(xiàn)底部的內(nèi)容。Twitter的做法則相對保守，他們通過自定義控件的方式制作了狀態(tài)欄和導航欄，使他們的顏色相配，并能呈現(xiàn)半透明效果。而其他一些應用，例如Instagram、Foodspotting和The New York Times等則打破了狀態(tài)欄的邊界，通過新的布局方式呈現(xiàn)全出血(full-bleed)效果的照片。
The New York Times在狀態(tài)欄和導航欄都使用了毛玻璃效果，并利用全屏空間來展示全出血效果的照片。
Twitter的狀態(tài)欄與導航欄顏色相配，并且都可以呈現(xiàn)半透明效果。
2.層與動效
iOS7 UI過渡指南推薦通過不同的層面來體現(xiàn)內(nèi)容的層次，以增強界面對象之間的關(guān)聯(lián)性。當用戶在不同的層面之間切換時，要為其提供強化的動畫效果來進一步增強內(nèi)容層次與深度的概念。
案例
在iOS7中，層面在很多時候被用來展示那些位于圖片之上的文字，例如Yahoo!新聞中的照片，以及musicXmatch當中專輯的呈現(xiàn)方式。此外，層面還可以用來為用戶提供某些快速訪問的功能，例如iOS7自身的通知中心和控制中心。
另外一個例子，Huffington Post應用通過一個單獨的層來呈現(xiàn)“全部分類(All Sections)”界面。雖然交互方式?jīng)]什么問題，但以模糊效果從該層面底部透出的照片卻沒有什么實際意義，反而會給用戶造成困惑。
關(guān)于動畫過渡效果，你可以在Luvocracy應用當中發(fā)現(xiàn)一些很有效的運用方式，例如其左側(cè)導航的模糊放大效果，以及展示產(chǎn)品頁照片時的彈跳效果等。另外，F(xiàn)lipboard在其封面上使用的視差動效也是個不錯的例子。
3.負空間(留白)與配色
iOS7界面設計規(guī)范中的“為iOS7設計”一節(jié)建議設計師們移除界面中不必要的裝飾性元素，并充分利用留白：
“留白可以使重要的內(nèi)容及功能更加突出。同時，留白還可以傳達出一種平靜和穩(wěn)定的感覺，使應用看上去更加專注和高效?！?/p>
此外，他們還建議通過配色來簡化UI：
“一種關(guān)鍵的顏色——例如備忘錄應用中的黃色——可以突出重要信息，并巧妙的暗示出元素的可交互性。同時，它也可以為應用帶來具有一致性的視覺主題?！?/p>
案例
然而，很多應用要么忽視了這條建議，要么執(zhí)行的有些過頭。無論出于怎樣的原因，大量應用當中充斥著過多的留白，而顏色卻過于稀疏微弱。這種風格對于蘋果來說也許是不錯的，因為它們具有明顯的iOS7風格，但對于應用本身來說也許會產(chǎn)生負面效應，因為這種平淡的設計風格可能會稀釋掉產(chǎn)品的品牌識別效應。在大量淺色風格的應用當中，例如Snapguide這樣配色豐富的應用也許能給用戶帶來更多驚喜，使其更受歡迎。
4.動態(tài)字體
動態(tài)字體可以針對任何字號的文字內(nèi)容自動調(diào)整其字間距和行間距。如果你準備采用動態(tài)字體技術(shù)，那么應用中的文字內(nèi)容格式會隨著用戶在系統(tǒng)“設置”當中對字號的調(diào)整而自動響應變化。那些以文字閱讀為主的應用將會極大的受益于這項技術(shù)，例如新聞、文章、郵件、微博等等。對這類應用來說，采用動態(tài)字體技術(shù)就意味著用戶無需進行很多設置便能得到更具一致性的閱讀體驗。
案例
當前，采用動態(tài)字體技術(shù)的應用還不是很多。這里有一個很簡單的原因：那些會受益于這項技術(shù)的應用當中，多數(shù)已經(jīng)包含了字號調(diào)整方面的功能。不過這類訂制化的解決方案并不理想，因為這意味著用戶需要針對每個不同的應用來單獨設置最合適的字號。
采用了動態(tài)字體技術(shù)的The New York Times應用在大字號下的表現(xiàn)。
5.自動布局
正如iOS7開發(fā)文檔中所介紹的，充分利用自動布局技術(shù)的應用可以更加輕松的從iOS6過渡到iOS7適配，因為這些技術(shù)可以幫助應用自動調(diào)整UI元素的尺寸。如果同時采用自動布局及動態(tài)字體技術(shù)，那么應用的界面元素也可以隨著字號的變化而響應式的調(diào)整，幫你實現(xiàn)諸如用戶在調(diào)小字號之后界面布局自動從一列變?yōu)閮闪械男枨蟆?/p>
案例
當人們采用動態(tài)布局技術(shù)來解決從iOS6向iOS7過渡的問題時，從表面看來似乎難以發(fā)現(xiàn)什么明顯的變化。而另一方面，如果同時使用動態(tài)字體技術(shù)，那么變化會更容易被發(fā)現(xiàn)。我的意思是，目前我還沒找到這方面的實際案例；如果你發(fā)現(xiàn)了一些，不妨分享給大家。
6.應用圖標和控件圖標
iOS7在應用圖標方面有很多變化，詳情可以參考iOS7界面設計規(guī)范當中的圖標與圖形尺寸一節(jié)。其中，我們可以注意到的變化包括略微增大的圖標尺寸、新的黃金分割率網(wǎng)格、新的配色方案、更加扁平的風格、曲線輪廓等等。此外，蘋果建議第三方應用的設計師們重新設計控件當中的自定義按鈕圖標，使它們看上去更輕量，更貼近iOS7原生風格。
案例
幾乎所有的iOS7應用都重新設計了它們的應用圖標，因為這一點在iOS7 UI過渡規(guī)范當中是有明確要求的。然而，只有一部分應用依照iOS7風格重新設計了它們的按鈕圖標。有些應用只是很勉強的做了些改變，特別是那些曾經(jīng)為了突出品牌效應而自定義設計過圖標的應用。這里也有一個時間的問題，也許所有的應用最終都會在它們看上去開始落伍的時候升級它們的圖標設計，否則就可能被用戶嘲笑“哦，那個應用看上去太iOS6了！”。
Shazam面向iOS7重新設計了他們的圖標。
Ted應用同樣重新設計了標簽欄上的按鈕圖標。
7.無邊框按鈕
蘋果建議僅在非常必要的時候為按鈕添加邊框或背景。這里的基本原理是，用戶通常都知道在各種控件欄和動作表單、警告框中的元素是可以交互的，因此邊框并不是必需的。而iOS7 UI過渡指南當中也提到一些例外情況，例如內(nèi)置的“時鐘”應用當中用來啟動計時的圓形按鈕，或是iTunes當中帶有邊框的“購買”按鈕。
案例
無邊框按鈕已經(jīng)在iOS7應用當中被廣泛使用了，因為這個改變的成本及其造成的影響都不大。當用在導航欄當中時，它們是很明顯的可交互元素；然而，當出現(xiàn)在主要文字內(nèi)容附近時，有些無邊框按鈕看上去只是樣式特殊的文字而已。造成這種情況的原因之一，就是對于無邊框按鈕來說，每個應用都有自己的“關(guān)鍵色”，例如Foodspotting的綠色，或是Opentable的紅色。
Foodspotting里的一些無邊框按鈕在用戶看來并不具備交互性。
Snapguide應用導航欄上的無邊框按鈕。
8.其它視圖和UI控件
iOS7當中包含大量的標準控件升級，例如日期選擇器、添加聯(lián)系人按鈕、詳情展開按鈕、信息按鈕、頁碼控制器、選擇器、進度條、刷新控制器、分段控制器、滑塊、計步器、切換、文本域等。例如動作表單、警告框、模態(tài)視圖一類的臨時性視圖也在視覺呈現(xiàn)方式上發(fā)生了變化。對這些控件進行升級不會對應用產(chǎn)生重大的影響，因為它們的基本構(gòu)成方式和交互方式并沒有發(fā)生根本性的變化。更多詳情可以參考iOS7界面設計規(guī)范當中的Controls一節(jié)。
案例
大量的應用都開始使用iOS7風格的新標準控件，因為這類升級是完全“免費”的，無需代碼方面的變動。這其中有一點值得提及，就是標準的切換控件在激活狀態(tài)時的顏色是可以自定義的。雖然看上去沒太大所謂，但這點細節(jié)可以使你的應用界面看上去更具一致性。另外一點受歡迎的變化就是新的列表結(jié)構(gòu)，它可以延伸到界面邊緣，給用戶帶來更多的可點擊空間。
Luvocracy的注冊界面使用了新的iOS7列表控件。
Luvocracy將切換控件的激活狀態(tài)定制為紅色。
Foodspotting當中的切換控件在激活狀態(tài)時為綠色。
9.手勢
在iOS7里，用戶可以從界面底部向上滑動，來展開控制中心。類似的，如果用戶希望訪問通知中心，他們可以從界面頂端向下滑動。那些使用了類似手勢命令的應用可能需要重新考慮相關(guān)功能的觸發(fā)方式，以避免和這些系統(tǒng)手勢產(chǎn)生沖突。
案例
不幸的是，即使在手勢操作上與iOS7沒有明顯的沖突，應用也有可能受到這些系統(tǒng)級手勢的影響。例如在The New York Times當中，用戶在向上滾屏瀏覽內(nèi)容時有可能不小心觸發(fā)控制中心的展開。而有些應用改變了它們從前的導航風格，以避免與系統(tǒng)手勢產(chǎn)生沖突。舉個例子，新版本的Facebook應用在主屏使用標簽欄作為導航，很可能是為了避免與系統(tǒng)級的右滑回退手勢產(chǎn)生沖突？雖然蘋果在手勢操作方面的改變是值得贊賞的，但實現(xiàn)方式上也有一定的弊端。
Facebook重回標簽欄導航的時代。
10.系統(tǒng)改進
除了以上所說的這些在應用內(nèi)部可能產(chǎn)生的改變以外，系統(tǒng)級的變化也可能影響第三方應用，這當中值得注意的一點就是包含了Airdrop功能的分享表單(Share Sheet)，以及多任務機制。如果你的應用已經(jīng)整合了系統(tǒng)原生的分享表單，那么在iOS7當中它們會自動更新到新的版本。同樣，曾經(jīng)僅限于內(nèi)置應用的多任務功能現(xiàn)在有了更廣泛的運用范圍，這也意味著內(nèi)容的下載和更新可以在后臺自動執(zhí)行了。
案例
我們已經(jīng)可以在很多應用當中看到包含了Airdrop功能的分享表單了，不過更多的應用仍在使用舊版的動作表單，或是自定義的解決方案。你不能指責他們，畢竟新的分享表單在實現(xiàn)方式上還是有一定復雜度的。
對于多任務來說，當前有很多新聞或照片媒體類的應用都已經(jīng)開始使用這方面的功能來實現(xiàn)后臺的上傳或下載。幸運的是，如果相關(guān)功能產(chǎn)生了性能方面的問題，用戶可以在系統(tǒng)的“設置”當中手動關(guān)閉多任務功能，不過我懷疑有多少人有能力準確的發(fā)現(xiàn)這方面的問題。
The New York Times使用了新的分享表單，包括Airdrop功能。
