他的龙根本太大了_动漫美女被吸乳视频漫画_欧美xxxx性疯狂bbbb_天天看天天爽天天摸天天添

如何提升企業(yè)產(chǎn)品(WEB APP)的用戶體驗(yàn)?

2014-3-14    藍(lán)藍(lán)設(shè)計(jì)的小編

轉(zhuǎn)載藍(lán)藍(lán)設(shè)計(jì)(   m.ssll180.com  )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供有效的   BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、  ipad界面設(shè)計(jì)   、  包裝設(shè)計(jì) 、  圖標(biāo)定制 、  用戶體驗(yàn) 、交互設(shè)計(jì)、   網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)

來(lái)源:http://www.uisdc.com/100-things-you-should-know-about-design

如果您想訂閱本博客內(nèi)容,每天自動(dòng)發(fā)到您的郵箱中,   請(qǐng)點(diǎn)這里

一般人對(duì)於企業(yè)產(chǎn)品的預(yù)期,可能僅停留在功能要強(qiáng)大,信息要安全,能夠幫助企業(yè)提高工作效率。但今時(shí)已不同往日,除此以外,人們開始更注重產(chǎn)品的用戶體驗(yàn)。那么,在面對(duì)企業(yè)產(chǎn)品的界面設(shè)計(jì)上,有什么方法可以提升用戶體驗(yàn)呢?

接下來(lái),藍(lán)藍(lán)設(shè)計(jì)為大家?guī)?lái)一些國(guó)內(nèi)外的優(yōu)秀案例以及一些設(shè)計(jì)Web App時(shí)的思考方向。

Web App 設(shè)計(jì)要點(diǎn)

1. 配色

顏色作為設(shè)計(jì)師傳達(dá)情感的主要元素之一。一個(gè)明確的品牌顏色,對(duì)信任度,認(rèn)知度都會(huì)有大大的提升。顏色除了能為界面提升美感,也能作為功能上的輔助。在普遍頁(yè)面信息量大的企業(yè)產(chǎn)品中,往往一個(gè)有顏色的按鈕就很容易吸引用戶的視覺(jué)焦點(diǎn)。

Lovely是Dribbble大神Kerem Suer設(shè)計(jì)的Web App。橙色主,藍(lán)色輔助,淡灰色為底色。這個(gè)配色既色彩鮮明,淡淡的感覺(jué)更讓人長(zhǎng)時(shí)間使用也不覺(jué)累。整體感覺(jué)和諧舒服,簡(jiǎn)潔耐看。

如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

Squarespace用的是黑白配,可說(shuō)是黑白配色中的皎皎者。利用大面積的留白,高質(zhì)素的圖片,配合極出色的交互,讓你每次打開一個(gè)子頁(yè)面時(shí)都存在驚喜,是筆者最喜愛(ài)的網(wǎng)頁(yè)之一。


如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

連Icon也盡顯Squarespace的品牌風(fēng)格。


如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

2. 空間

經(jīng)常會(huì)發(fā)現(xiàn),很多設(shè)計(jì)師在設(shè)計(jì)Web App及Mobile App時(shí),會(huì)被屏幕尺寸所限制住,只專注一屏內(nèi)顯示所有信息。要知道網(wǎng)頁(yè)設(shè)計(jì)及手機(jī)界面設(shè)計(jì)不同平面設(shè)計(jì)在于,前兩者在屏幕外是有無(wú)限可能,你可以透過(guò)動(dòng)畫滑動(dòng)一個(gè)全新界面到當(dāng)前屏幕,也可以透過(guò)上下左右滾動(dòng)來(lái)查看更多內(nèi)容。 因此,設(shè)計(jì)Web App時(shí)可以更好的處理元素之間的空間。但要提醒的一點(diǎn)是,要注意在筆記本的尺寸底下,留白會(huì)不會(huì)過(guò)了。

一個(gè)空間處理很棒的例子,來(lái)自Dribbble。

如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

這個(gè)思路在屏幕尺寸有限的Mobile App上更能體現(xiàn)。對(duì)比下面兩個(gè)設(shè)計(jì)稿,左邊的留白空間是不是更大氣一些。


如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

3. 減少線條

在扁平化設(shè)計(jì)中,間隔的處理上,嘗試多用色塊之間的對(duì)比來(lái)取代線條。減少線條可以讓你的界面顯得更簡(jiǎn)潔。回頭你可以嘗試一下,在設(shè)計(jì)稿中儘可能的去掉線條,或許會(huì)有耳目一新的感覺(jué)。

如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

4. 考慮不同尺寸

由于大屏幕的慢慢普及,以往定在1000px闊度的網(wǎng)站已經(jīng)開始不能滿足于在大屏幕下展示。因此在設(shè)計(jì)Web App中需要考慮在不同屏幕尺寸下,界面元素的展示方式。最基本的要求是要考慮好最大及最小的場(chǎng)景: 1920×1080, 1024×768

這是2014年初的屏幕分辨率統(tǒng)計(jì)(資料來(lái)源自CNZZ)

7a

Mailchimp在responsive的處理非常優(yōu)秀。


如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

想更深入了解responsive,可以閱讀來(lái)自ISUX龍哥的響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)一文。

 

對(duì)企業(yè)產(chǎn)品設(shè)計(jì)的啟發(fā)

簡(jiǎn)單

儘管你的產(chǎn)品背后邏輯很複雜,但要保証在呈現(xiàn)給用戶時(shí)要操作簡(jiǎn)單而。

Trello是一個(gè)多人任務(wù)協(xié)作類Web App。它的任務(wù)板只需用鼠標(biāo)一拖就能輕鬆移動(dòng)任務(wù)從一個(gè)階段到另一個(gè)階段。

如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

Mailchimp是一個(gè)郵件制作及跟蹤的Web App。在制作郵件模板過(guò)程都提供了一個(gè)可視化的模板。基本上只需Drag&Drop及輸入數(shù)值便可完成設(shè)計(jì)及程序上的事情。


如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

Invision是一個(gè)專為設(shè)計(jì)師快速制作交互模形的Web App。它的管理頁(yè)面在分組上十分方便,可以在任何地點(diǎn)增加分割線,然后Drag&Drop來(lái)移動(dòng)圖片所在的組別。其交互模形制作過(guò)程更是快速,而且可以一鍵生成連結(jié)發(fā)送給其他非Invision的用戶查看。


如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

漸進(jìn)式呈現(xiàn)

許多Web App都有一個(gè)通病,就是功能很多,同時(shí)又想一次把所有功能告訴用戶,結(jié)果就導(dǎo)致用戶第一次進(jìn)來(lái)時(shí),面對(duì)一個(gè)擁有龐大信息量的界面,然后還有一大輪新手提示的氣泡。很多時(shí)候,用戶就會(huì)因?yàn)槭肿銦o(wú)措或在體驗(yàn)中遇到一些挫折而失去了繼續(xù)研究下去的衝動(dòng)。為了增強(qiáng)產(chǎn)品對(duì)用戶的第一印象,可以嘗試使用漸進(jìn)式呈現(xiàn)的理念來(lái)展示界面。

拿Trello為例,第一次登錄時(shí)界面上只會(huì)呈現(xiàn)一個(gè)項(xiàng)目方塊,用戶很自然地會(huì)注意并點(diǎn)擊這個(gè)唯一搶眼的元素,進(jìn)入項(xiàng)目后會(huì)顯示一個(gè)任務(wù)版,點(diǎn)擊其中一個(gè)任務(wù)再顯示任務(wù)詳情。

如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

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


如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

這種層層漸進(jìn)的設(shè)計(jì)手法能使界面保持簡(jiǎn)潔,增強(qiáng)對(duì)用戶的第一印象,降低用戶的心理負(fù)擔(dān)。類似的思維,其實(shí)在網(wǎng)頁(yè)設(shè)計(jì)中經(jīng)常會(huì)用到,例如Apple官網(wǎng)一開始只會(huì)顯示不同產(chǎn)品的入口,進(jìn)入特定產(chǎn)品后可以根據(jù)自己的興趣點(diǎn)擊查看更多去作更深入的了解,如果一頁(yè)密密麻麻的把所有產(chǎn)品信息寫滿,這又會(huì)是另一種感覺(jué)了。更多關(guān)于漸進(jìn)式呈現(xiàn)的說(shuō)明,可以閱讀由ISUX推薦的設(shè)計(jì)師要懂心理學(xué)。

手機(jī)式的體驗(yàn)

適量的使用動(dòng)畫,能在情感上為產(chǎn)品加分不少。時(shí)下html5及css發(fā)展迅速,在網(wǎng)頁(yè)設(shè)計(jì)上經(jīng)常能看到一些在手機(jī)上似曾相識(shí)的體驗(yàn),這種UI設(shè)計(jì)除了讓人感覺(jué)特別酷之外,還可以直接廷伸到移動(dòng)端,作為一種體驗(yàn)上的統(tǒng)一。

Squarespace的抽屜式導(dǎo)航。

如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

Teambition是國(guó)內(nèi)的項(xiàng)目協(xié)作類Web App,它的收件箱有如iOS7的通知中心。整體設(shè)計(jì)也很簡(jiǎn)潔易用。


如何提升企業(yè)產(chǎn)品(Web app)的用戶體驗(yàn)

 

結(jié)語(yǔ)

企業(yè)產(chǎn)品的目的是要服務(wù)于企業(yè),服務(wù)于人。

一直相信,Apple及Google的極簡(jiǎn)理念是給予UI設(shè)計(jì)師一個(gè)很好的反思點(diǎn)。要把複雜的企業(yè)產(chǎn)品界面設(shè)計(jì)得簡(jiǎn)單有趣是很有挑戰(zhàn)性的。面對(duì)簡(jiǎn)單,背后需要有強(qiáng)大的技術(shù)支持,以及設(shè)計(jì)師對(duì)改善人類生活中細(xì)節(jié)的關(guān)懷及執(zhí)著,才能真正做到簡(jiǎn)約而不簡(jiǎn)單。

日歷

鏈接

個(gè)人資料

存檔