從網頁設計轉換到智慧手機的設計思維
1、單一且專註
創新工場曾推出一款應用叫「布丁愛生活」,裡面包含電影、美食等內容,但是推出後一直反響平平。後來這些內容被拆分成不同的應用,反而取得了不俗的成績。這是為什麼呢?
我認為:
第一、行動端的螢幕小,場景不固定,太多的功能會造成層級複雜、操作困難,影響體驗。所以行動端本身不適合太多、太複雜的功能。
第二、從場景方面考慮,用戶在相應的場景下,才會想到相應的應用。比如說,用戶在想看電影的時候,可能就會搜素和電影相關的應用,而「愛生活」之類的產品,一般不會主動被搜到。即使用戶看到了,也不知道它是做什麼的。所以做行動應用,千萬不要「大而全」。
2、細分需求並做到極致
陌陌在微信這種強大的競爭對手面前,是怎麼生存並壯大起來的?況且微信也可以通過查看附近、搖一搖等方式聯繫陌生人。拋開產品定位、營銷等問題,我想對比一下設計方面的區別。
打開應用後,在微信界面上,看到的是最近和你聯繫過的人,以及它們的留言;而在陌陌上,首先看到的是附近陌生人的照片及個人簽名。
點擊微信標籤欄上的「找朋友」,再選中「附近的人」,才能到達如下圖的列表頁面。但很明顯,微信的頭像比陌陌的小很多,訊息也不如陌陌豐富。如果你只是單純的想結交陌生人,會選擇哪個應用?
因此我的結論是,面對強大的對手,找准一個細分的需求點,把它做到極致,也不是沒有機會(不考慮營銷等其它因素)。
3、功能優先級
行動應用的使用場景、設備都和網頁設計有巨大的區別。因此行動應用的功能,不僅取決於用戶需求,還要考慮使用場景、設備限制等因素。不要直接移植網頁設計的功能到應用程式上。
比如說優惠券產品,網頁設計端更重視打印功能;而手機端側重於到店展示。
微信剛出的時候,很多人覺得奇怪:騰訊已經有了手機QQ,為什麼要再做個微信?它們有什麼區別?
過了一段時間,我發現原先用手機QQ的人都改用微信了。為什麼大家覺得在手機上,微信比QQ好用呢?
後來有一天我終於有點明白了:
手機QQ是網頁設計端功能的移植;而微信的功能更多的考慮了行動應用的特點(語音輸入,通過手機通訊錄、QQ好友等方式添加好友,搖一搖……)
所以說,做應用程式時一定要充分考慮行動應用的場景、設備等特點來設計功能並決定功能優先級,而不是簡單移植網頁設計的功能。
4、簡單、易用
用戶在使用網頁設計網站時,一般是端坐在大螢幕前,既可以使用鼠標、也可以使用鍵盤;而用戶在使用行動應用時,可能是邊走邊用,也可能是在擁擠而晃動的公車內。因此行動應用的功能一定要簡單,字一定要夠大(字大了可放的內容就更少),操作一定要簡單(保證可觸面積)……總之四個字:簡單易用。
5、尊重平台特點及設計規範
行動應用不像網頁設計端,界面夠大,使用環境夠穩定,即便有不易理解的地方也可以在界面上加各種引導和提示。就算沒有任何提示,用戶還可以自己嘗試。
但行動應用的界面小,承載的內容十分有限(網頁設計端一個頁面的內容,行動應用可能要分很多個頁面來展現,頁面跳轉次數高),使用環境不穩定,操作更困難,如果開發者都按自己的「想象」去設計界面,那後果不堪設想。
索性我們有各平台的設計規範可以參考。設計規範可以更好的保持不同應用的一致性,讓用戶更易理解,減少學習成本,也讓界面看起來更友好。對產品設計者來說,認真研讀規範也是個學習的過程,幫助我們成長的更快。
之前有個PM堅決拒絕看各平台的設計規範,認為產品設計者不應該受此約束,而應該大膽發揮。他設計的東西果然非常「非主流」,用戶使用起來不易理解。我認為即使真的想去打破什麼約束,也應該先充分的了解它,然後再在此基礎去做更好的突破。
6、「又笨又大」的UI風格
很多之前做網頁設計產品的設計師,初次嘗試行動應用時都容易犯一個錯誤:界面看起來很美觀,但就是不像行動應用的界面,怎麼看都有網頁設計的影子在。為什麼呢?因為設計師往往傾向於更小一點的字體,這樣可以讓界面看起來更精緻,更美觀。
但這在行動應用上就行不通了,試想用戶如果在擁擠而晃動劇烈的公車上看密密麻麻的小字,將會多麼氣惱。所以這時就需要設計師轉換一下思維了。
行動應用的UI風格有什麼特點呢?簡單的來說:
1) 字一定要夠大,要一目了然
2) 布局非常的規整、簡潔、一致性更強,這樣閱覽起來更輕鬆
3) 內容少、顏色少……
這些可能都是網頁設計端設計師非常討厭和排斥的東西,但是為了做出專業和易用的產品,一定要及時調整思路。
7、獨特的風格&精美的界面
雖然行動應用界面看起來「又笨又蠢」,設計師還要受到平台規範的「束縛」,但這並不妨礙眾多令人驚嘆的行動應用界面的誕生。
行動應用界面應該比網頁設計界面看起來更精美,想象一下蘋果或安卓優美的機身,配上一個簡陋粗糙的界面,將是多麼煞風景的一件事情。
況且在小螢幕上,界面的缺陷更容易被人發覺。這些智能機的高端用戶,會毫不猶豫的帶着嫌棄的表情刪掉你的應用。
所以做行動應用的設計師,往往需要更加註意設計細節。當然,這建立在首先理解平台規範和設計特點的基礎上,在這個基礎上去尋求突破。行動應用其實給了設計師更大的發揮空間。
8、其它
行動應用還有許多不同於網頁設計端的特點,比如輸入方式、橫屏模式、啟動、加載、手勢、轉場、動畫等,這些就不一一敘述了,大家在設計規範上都可以找到相關內容。
總結
行動設備便攜、螢幕小、操作不便、但使用場景豐富多變,這些特點都決定了在行動應用上,不適於承載複雜的功能與龐雜的內容。很多時候,我們需要放棄網頁設計端的思維,充分考慮行動設備的特點,專註的思考問題,才能做出更成功的行動應用。
最後想說的是,行動應用既不是網頁設計端產品的附屬,也不是網頁設計端產品的複製品,它應該有自己獨特的生命力。不建議網頁設計端產品和客戶端產品由同樣的團隊來負責,這樣難以做出專業且高效的產品。
轉貼來源:雷鋒網
參考文獻:
1.林宥吟,2002,延伸性企業報告語言之產業應用-以資產管理產業為例,私立中原大學會計系碩士班未出版論文。
2.李果益,2001,JAVA 技術手冊,台北:美商歐萊禮股份有限公司台灣分公司。
3.易芙瑛,2002,影響企業導入可延伸性企業報告語言(XBRL)之因素探討,私立中原大學會計系碩士班未出版論文。
相關文章
每個網頁設計都是基因基礎架構掌握網頁設計要更多的主控權應用網頁設計核心路徑模型使用網頁設計核心路徑方法網頁設計應用支援螢幕大小時,要考慮的排版問題
最新文章
HVACKer:入侵隔離網絡的新型攻擊技術還有什麼不會被入侵?路由器 LED 燈已成為攻擊入口美 5 家獨角獸同天申請 IPO 掛牌,最狂的是一家估值 124 億美的數據分析新創!【台灣「智慧產業」開始佈局】緯創集團領投跨國 AI 新創 iKala,下一步拓展東南亞市場快可以用手機遠端遙控你的所有家電了