如何提升企業產品WEB APP的使用者體驗?

來源:互聯網
上載者:User

   Web App 設計要點

  1. 配色

  顏色作為設計師傳達情感的主要元素之一。一個明確的品牌顏色,對信任度,認知度都會有大大的提升。顏色除了能為介面提升美感,也能作為功能上的輔助。在普遍頁面資訊量大的企業產品中,往往一個有顏色的按鈕就很容易吸引使用者的視覺焦點。

  Lovely是Dribbble大神Kerem Suer設計的Web App。橙色主,藍色輔助,淡灰色為底色。這個配色既色彩鮮明,淡淡的感覺更讓人長時間使用也不覺累。整體感覺和諧舒服,簡潔耐看。

  Squarespace用的是黑白配,可說是黑白配色中的皎皎者。利用大面積的留白,高質素的圖片,配合極出色的互動,讓你每次開啟一個子頁面時都存在驚喜,是筆者最喜愛的網頁之一。

  連Icon也盡顯Squarespace的品牌風格。

  2. 空間

  經常會發現,很多設計師在設計Web App及Mobile App時,會被螢幕尺寸所限制住,只專註一屏內顯示所有資訊。要知道網頁設計及手機介面設計不同平面設計在於,前兩者在螢幕外是有無限可能,你可以透過動畫滑動一個全新介面到當前螢幕,也可以透過上下左右滾動來查看更多內容。 因此,設計Web App時可以更好的處理元素之間的空間。但要提醒的一點是,要注意在筆記本的尺寸底下,留白會不會過了。

  一個空間處理很棒的例子,來自Dribbble。

  這個思路在螢幕尺寸有限的Mobile App上更能體現。對比下面兩個設計稿,左邊的留白空間是不是更大氣一些。

  3. 減少線條

  在扁平化設計中,間隔的處理上,嘗試多用色塊之間的對比來取代線條。減少線條可以讓你的介面顯得更簡潔。回頭你可以嘗試一下,在設計稿中儘可能的去掉線條,或許會有耳目一新的感覺。

  4. 考慮不同尺寸

  由於大螢幕的慢慢普及,以往定在1000px闊度的網站已經開始不能滿足於在大螢幕下展示。因此在設計Web App中需要考慮在不同螢幕尺寸下,介面元素的展示方式。最基本的要求是要考慮好最大及最小的情境: 1920×1080, 1024×768

  這是2014年初的螢幕解析度統計(資料來源自CNZZ)

  Mailchimp在responsive的處理非常優秀。

  想更深入瞭解responsive,可以閱讀來自ISUX龍哥的響應式網頁設計一文。

  對企業產品設計的啟發

  簡單

  儘管你的產品背後邏輯很複雜,但要保証在呈現給使用者時要操作簡單而高效。

  Trello是一個多人任務協作類Web App。它的任務板只需用滑鼠一拖就能輕鬆移動任務從一個階段到另一個階段。

  Mailchimp是一個郵件製作及跟蹤的Web App。在製作郵件模板過程都提供了一個可視化的模板。基本上只需Drag&Drop及輸入數值便可完成設計及程式上的事情。

  Invision是一個專為設計師快速製作互動模形的Web App。它的管理頁面在分組上十分方便,可以在任何地點增加分割線,然後Drag&Drop來移動圖片所在的組別。其互動模形製作過程更是快速高效,而且可以一鍵產生連結髮送給其他非Invision的使用者查看。

  漸進式呈現

  許多Web App都有一個通病,就是功能很多,同時又想一次把所有功能告訴使用者,結果就導致使用者第一次進來時,面對一個擁有龐大資訊量的介面,然後還有一大輪新手提示的氣泡。很多時候,使用者就會因為手足無措或在體驗中遇到一些挫折而失去了繼續研究下去的衝動。為了強化產品對使用者的第一印象,可以嘗試使用漸進式呈現的理念來展示介面。

  拿Trello為例,第一次登入時介面上只會呈現一個項目方塊,使用者很自然地會注意並點擊這個唯一搶眼的元素,進入項目後會顯示一個任務版,點擊其中一個任務再顯示任務詳情。

  同樣是第一次使用,Trello對比Asana的表達方式是不是讓你輕鬆得多。

  這種層層漸進的設計手法能使介面保持簡潔,增強對使用者的第一印象,降低使用者的心理負擔。類似的思維,其實在網頁設計中經常會用到,例如Apple官網一開始只會顯示不同產品的入口,進入特定產品後可以根據自己的興趣點擊查看更多去作更深入的瞭解,如果一頁密密麻麻的把所有產品資訊寫滿,這又會是另一種感覺了。更多關於漸進式呈現的說明,可以閱讀由ISUX推薦的設計師要懂心理學。

  手機式的體驗

  適量的使用動畫,能在情感上為產品加分不少。時下html5及css發展迅速,在網頁上經常能看到一些在手機上似曾相識的體驗,這種設計除了讓人感覺特別酷之外,還可以直接廷伸到移動端,作為一種體驗上的統一。

  Squarespace的抽屜式導航。

  Teambition是國內的項目協作類Web App,它的收件匣有如iOS7的通知中樞。整體設計也很簡潔易用。

  結語

  企業產品的目的是要服務於企業,服務於人。

  一直相信,Apple及Google的極簡理念是給予設計師一個很好的反思點。要把複雜的企業產品設計得簡單有趣是很有挑戰性的。面對簡單,背後需要有強大的支援人員,以及設計師對改善人類生活中細節的關懷及執著,才能真正做到簡約而不簡單。

相關文章

Beyond APAC's No.1 Cloud

19.6% IaaS Market Share in Asia Pacific - Gartner IT Service report, 2018

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。