起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識大神帶你了解iOS7設計的利與弊
幾塊錢評論：文章讓我收獲頗多的點：設計激發用戶行為。大家可以仔細閱讀下，從文章中理解設計是如何影響用戶判斷和采取行動的。相信你一定會有收獲哦。 原作者Luke Wroblewski和我們分享了他們在為iOS7進行重設計的過程中所學到的一些東西；真真正正在實戰中會遇到的一些問題，以及相應的思考方式及解決方案。 以下為譯文： 和其他很多公司一樣，我們最近花了不少時間來重新設計我們的iPhone應用Polar，使其能夠適配蘋果最新推出的操作系統。在漫長的重設計過程當中，我們真切地了解到了很多關于為iOS7進行設計的利與弊，甚至是一些說不清道不明的地方。 當我們開始著手將Polar已有的界面元素與iOS7的整體美學及設計語言進行適配的時候，有一件事情變得很清楚——我們不會僅僅滿足于讓應用適配 iOS7，我們想要確保重設計之后的方案確實比之前的版本要更好。從某些方面來講，iOS7讓我們可以更輕松改進現有的設計方案；而在另外一些方面上，事 情卻變得困難了很多，我們的多數時間也正是花在了這些地方。 相比于iOS6及以前的版本，iOS7的設計語言具有與生俱來的簡潔性。從表面上來看，這一特性可以幫助我們更簡單的設計應用，不過在現實中，你可能需要做更多的事情，才能打造出更簡潔的設計方案；這并非易事。 “真正的簡潔是指，你不斷地前行再前行，直到你發現：‘是啊，自然是這樣的！’” –?Jonathan Ive，2013 對于我們應用當中的很多設計元素，我們確實需要運用Ive所說的持續迭代的設計方式進行優化，不過蘋果的設計團隊帶來的新系統也使得我們可以利用更 多其他的元素來得到更好的效果。例如，在使用了iOS7風格的文本輸入框之后，我們的表單立刻變得簡單明了，而且與系統自身的美學外觀更加搭配。 界面頭部是需要做很多工作的地方，不過這也迫使我們從一些最基本的原則出發來改善現有的設計，同時我們也得到機會來挑戰iOS7當中總最具代表性的 毛玻璃效果。默認情況下， 新的導航欄是半透明的，并且與狀態欄使用了相同的配色；相比于之前的版本，這使得整個頭部成為視覺上的整體，同時也能映襯出底部內容。這些都是新方案當中 好的地方，但它們同時也帶來了一些新的挑戰。 使用系統控件的情況。在滾屏時，導航欄消失，狀態欄也失去了底色。 改造之后的情況。在滾屏時，導航欄消失，狀態欄仍然保持原樣。 最終，我們的解決方案是在系統狀態欄之下、內容視圖之上增加一層藍色的“襯底”，且位置固定。當產生滾屏時，導航欄消失，而狀態欄當中的內容則襯在藍色的背景上。 我們接下來要面對的是自定義的下拉刷新控件的表現問題。在之前的版本中，我們使用了下拉刷新的方式來更新界面當中的內容。而在iOS7當中，之前默認隱藏在導航欄后面的元素變得隱約可見了，使得導航欄當中的文字有些難以閱讀。 我們的解決方案是對任何位于導航欄底部的內容進行強化的模糊處理。這一方面保持了界面當中的深度和層次，一方面也能確保毛玻璃效果不會影響內容的可讀性，可以說是雙贏。 綜上所述，在我們的應用里，對于表單和頭部控件來說，iOS7的設計語言使我們能夠更輕松的進行正確的設計，而且我認為我們最終的一些解決方案比僅僅使用系統原生控件來的更好些。不過對于其他一些界面元素來說，事情就沒這么輕松了。 iOS7簡潔的設計語言同樣會讓你付出代價：設計師能夠用來構建信息層級關系及易讀性的視覺元素總量減少了。 設計師可以通過一系列的屬性來創建信息的呈現方式，使人們清楚他們所看到的信息的含義。例如配色、尺寸、紋理等元素，可以被用來在界面中打造內容之 間的相似性、差異性或是繼承關系。而當這些元素變得扁平了之后，設計師可用的界面設計元素辭典就變薄了。這就好像一個人失去了一部分詞匯量，他必須使用更 加有限的詞匯與他人進行交流。 你可以在很多iOS7應用中發現，扁平化的設計元素使得內容和功能的層級關系變得不再清晰。對比Twitter的發推界面在iOS6和7當中的表現，后者的界面中，元素之間缺乏必要的對比，使得重要的功能(Tweet)不再那么顯而易見。 在iOS7的某些地方，你很難判斷哪個元素是界面中最主要的call to action，因為各個元素之間只有細微的樣式差別。例如在每個iOS7用戶都能見到的條款與條件(Terms and Conditions)界面中，作為最主要的行為按鈕，“Agree”僅僅比該界面當中其他一些元素稍稍大了一點粗了一點。 當然，要通過對比度較低的視覺元素來創建有效的視覺層級關系也并非不可能，只是難度變大了。這讓我們又想起Jony Ive所說的話：一切都在于迭代。 進行過扁平化處理的視覺元素，彼此之間的差異性有所降低。在下面的例子中，你會發現，無論是添加、搜索還是創建，它們看上去都差不多，用戶需要依靠細小的視覺差異來進行判斷。 我們在自己應用里的投票列表界面中也面臨著類似的挑戰。在iOS6當中，我們可以依靠深度(陰影)和紋理質感來區分列表當中的不同項目；而到了 iOS7，只是簡單的把這些元素拍平的話，便會帶來視覺層次方面的問題。很多視覺元素看上去都混在了一起，使用戶很難立刻區分出列表當中各個不同的投票項 目。 在我們繼續移除了一些視覺元素之后，這個更扁平更簡潔的頁面才變得清晰了一些。我們去掉了一些背景，拿掉了一些圖標，另外為諸如評論和分享一類的文字按鈕使用了不同的配色。 失去了質感和深度的界面元素迫使視覺設計師必須更加努力的工作，才能在界面當中各種類型的元素之間創造出有意義的差異化。我認為這正是為iOS7進行設計的難點之一，它使你必須懂得怎樣簡化，怎樣使用更簡單的視覺形式來提供清晰明確的信息交流方式。 另外一個需要重點迭代的地方就是我們的標簽欄。多虧設計師Thanh漂亮的作品，我們的標簽欄不僅能夠提供關鍵功能的快速訪問入口，同時也可以很好的表達出我們產品的個性。不過當我們簡單的將iOS7線條化的圖標風格融入到自己的界面當中時，出現了兩個問題。 首先，新的風格使我們的圖標難以在最短時間內表達其自身的含義。Aubrey Johnson最近指出，空心圖標需要用戶花更多時間去理解，而我們發起的一輪投票看上去也證明了這一觀點。不過即使沒有這些理論和數據，我們也直到標簽欄當中的新圖標在溝通效率上確實存在問題。其次，我們失去了原有的很多個性。于是我們不斷迭代，直到我們找到一種方案，既能保持自己的個性，同時又讓人覺得符合iOS7的風格。 要在產品自己的個性與iOS7的個性之間尋求恰當的平衡，而不是簡單的將界面改造為iOS7風格。如果將iOS7的視覺風格比喻為語言，那么我們必須通過自己的聲音講出來。 此外，我們發現，在我們的一個關鍵界面——創建投票界面當中，扁平化的程度有些過了量。當我們第一次將這個界面改造為iOS7風格時，功能的優先級無法體現出來了；而在從前的版本中，這正是通過元素的質感與深度來確立的。 為了體現清晰的層次關系，以便讓用戶知道他們在創建投票時首先應該做些什么，我建議在默認情況下對那些次級元素進行模糊化處理，使用戶的注意力集中在最優先的功能上。 不過最終，鑒于可用性方面的考慮，以及時間成本方面的問題，我們放棄了這種方案。不過我們仍在保持迭代，很快，為iOS7專門打造的Polar就會 推出。如果你有興趣的話，屆時不妨安裝一個，看看我們的設計是怎樣進行過渡的。我們自己很享受這次重設計的旅程，相信你也會的。 來源：互聯網er的早讀課iOS7設計的益處
為了給內容提供更多的顯示空間，當用戶在內容列表里向下瀏覽時，我們會讓整個導航欄消失；而當用戶向上看回前面的內容時，導航欄又會出現，以便用戶可以使用的相關導航功能。但是iOS7默認的半透明狀態欄的行為卻打破了我們的規則，具體情況見這段視頻；我們必須另外考慮解決方案。
iOS7設計的弊端
??