設計和而不同的跨平臺App
如何設計一款符合安卓機交互的app一直是個令人頭疼的問題。去年底Google推出的Material Design似乎令這個問題有所改善
設計一個能適應不同平臺的移動應用是一項極具挑戰性的任務。在選擇設計風格的問題上,是選擇保留操作系統原生的控件?還是創造一個新的模式?抑或采取一個混合的方式?你會如何抉擇?StumbleUpon在iOS和Android版應用的重設計中,采取了一個混合的方式:采納操作系統原生的設計范例來創造一個獨一無二但卻不乏簡潔的界面。最終成果使我們產品的體驗大大提高了,從而讓用戶擁有更高的參與度。
就像所有產品設計過程中都需要做的那樣,這一切都是從用戶認知的層面上開始的。
理解你的用戶
想要了解用戶的想法、行為、動機和痛點,你需要從他們的角度出發去思考。這能讓你與用戶的需求和渴望達成一致,然后用這個認知去衡量你的每一個設計方案。了解現實中的的用戶不僅磨礪了你的設計直覺還會讓你與用戶產生共鳴。
每一項新功能的誕生,都得經歷“先收集靈感,再勾勒各種主要交互方案的草圖直至找到最優解”這樣的一個過程。盡管如此我們在設計過程中并不全部依賴于簡單的直覺和設計準則,我們通過用戶調研的結果和當前使用數據來給我們的設計方案增加豐富性和神韻。
整個應用生態圈擁有無窮無盡的娛樂資源,所以我們必須時刻挑戰自己,讓我們以保持高競爭力的目的去設計。StumbleUpon的魅力在于它能發現互聯網上最好的事物,給用戶帶來一些高質量且一眼鐘情的內容。所以我們試圖用我們的設計來試圖闡明這種能帶來“意外發現”的用戶體驗。
設定設計目標
我們為我們iOS和Android應用的重設計制定了一下幾個設計目標:
- 建立跨操作平臺應用的一致性;
- 滿足我們目前用戶的基本需求;
- 提高整體的用戶體驗來喚回我們的用戶。
在我們進行重設計的2014年,Google推出了他們Material design的設計風格。我們在進行iOS版StumbleUpon應用設計的同時,還時刻關注著這一新生的設計準則,盤算著將這一設計準則運用到我們兩個平臺的應用設計當中。在Android應用的設計中還加入了Material design的美學和交互原則來建立一個更加有特色和認知度的用戶體驗。
我們將Google的卡片式設計融入到了許多界面當中,但同時也保留了許多iOS風格的icons和界面樣式。在icon的設計上兩個操作平臺的應用都采用同一套icon,但是根據平臺的特性進行了一些微調,比如iOS系統中細描邊的中空icon到了Android平臺就被調整成了更粗的描邊。
當我們重新設計我們的Android應用時,我們進行了視覺審核,并對手機和平板設備對大圖片的感受體驗進行了記錄。對這些平臺生態系統的一覽,能幫助我們去分辨哪些地方需要改進;決定兩個平臺之間有哪些不同的地方需要強調出來;讓我們得以更加集中設計的精力。
然后著手去規范我們的UI模板來吻合Google的Material設計準則。我們應用的部分設計已經與Material相匹配,同時剩余的仍需要繼續推進。我們也從許多案例中辨別到動畫能傳遞一些細微的交互和轉場。
專注于這些問題提高了StumbleUpon的用戶體驗。為了支持material界面元素,我們舍棄了擬物化的裝飾(原文是skeuomorphic?embellishments)。在StumbleUpon的體驗預覽時,更厚實的文字風格和滿屏的圖片使我們的的文字信息和數據信息呈現更加豐富。我們還引進了懸浮按鈕來強調主要觸控點,解決了之前某些操作可能被用戶忽略的問題。融入懸浮卡片的設計到我們的應用當中不僅簡化了界面,還建立了一種Android用戶熟悉的操作環境。
另外,我們在iOS和Android都采取了統一的卡片風格,使用相同的色板和品牌元素以及核心的Stumbling功能,以此來建立這兩個平臺上應用的統一性。從靜態圖稿到原型到最終版本,我們一直堅持使用不同界面元素間的內部演示,替換和轉換來支持我們設計進程中至始至終的想法。
使我們的應用在兩個主流的移動平臺上的特點和核心框架達到平衡,能讓應用的視覺和功能結構更加和諧。通過迎合Material和apple design的設計規范,我們建立了高粘性的用戶體驗,使我們的產品注入了實用、愉悅、有意義的血液。
這兩個平臺上的重設計都包含了一些風險。一方面來講,采用單平臺特色的操控設計能創造一個流水式的用戶體驗。但是太過于依賴單個平臺的設計框架(比如在Android平板應用的設計中采用iOS的設計框架)會讓另外一個平臺的用戶體驗處于零碎狀態。我們還有最后一件事情想要完成,那就是通過全面的界面重設計來分離我們目前用戶在不同平臺上的用戶體驗,減低學習和探索成本。運用設計的思維來規避那些對我們發展進程存在潛在的危機問題。
測試我們的設計原理
在StumbleUpon,我們有一套敏捷開發流程——用快速迭代的設計和原型來測試我們的解決方案。我們采取A/B test(貌似是一種比對改變設計前和改變設計后的反饋的分析測試)來驗證哪一個場景下能產品更好的發揮其功能。所以我們會經常保持設計優化,哪怕初稿已經完成。
我們除了建立了可點擊的原型,還賦予了他們一些動畫效果來展現不同頁面之間的轉場效果,增加了交互的動勢和節奏。這可以讓我們慣例的轉場可視化,然后以此從開發者那里獲得重要的反饋,作為設計可行性的參考。因為動效的開發通常需要花比較長的時間來實現,往往會放慢將近兩周的設計進展。
早早地獲得來自工程師、設計師同事、產品經理和商務利益相關者的需求能幫助我們進行創作,提升創意的廣度以及推動產品流程順利進行。時刻提煉創意,能讓一個好產品成為一個偉大的產品。
作者:Hult
來源:UI中國
原文地址:http://www.ui.cn/detail/51351.html
- 目前還沒評論,等你發揮!