<b>網站用戶體驗設計:高效的設計可視化</b>

作者: 來源:未知 2012-06-10 11:20:24 閱讀 我要評論 直達商品

  

 

  每一天,人們都淹沒在信息的海洋中。用戶在主動獲取和被動接受過程中,都始終避免不開一個“效率”的訴求。在這信息海洋,用戶目前面對了什么樣的困境呢?

  一些設計細節的 “隱藏式”、“折疊式”、“漸進式”設計消耗了用戶的快速認知訴求;

  偏于復雜和龐大的功能,給界面呈現帶來了負擔,加重了用戶操作映射的錯亂,讓用戶理解也模棱兩可;

  設計過多的操作點擊,用戶手部肌肉不停運動,切換不同頁面去查看;

  ⋯⋯

  作為信息傳達的設計師,如何讓信息更直觀清晰、剔除不確定性理解,是工作中的重中之重。而“可視化”就是多種高效傳遞信息方式中的一種,對于信息可視化、視覺化、圖形化,也成了設計圈熱捧的觀點和研究方向。

  

 

  對于產品的可視化設計,主要旨在借助于圖形化等直觀手段,清晰有效地傳達與溝通信息,形成高效的功能、使用映射,完成用戶任務目標。為用戶想完成的任務選擇正確的界面元素,通過一種能迅速理解和易于使用的表達方式,展現在頁面上,降低用戶的認知負擔和物理負擔。大概分為四個層次:功能可視化、結構可視化、操作可視化、控件可視化。

  

 

  功能可視化:即確定需求優先級的前提下,確保優先級高的功能展現給用戶,讓用戶易于識別和查找,使設計有正確的層次結構。用戶對信息層次的理解需要兩個過程,首先是快速捕捉,其次是對具體內容更詳細的理解。在快速捕捉階段,其過程中時間跨度短暫,通過顏色、對比、定位等運用,突出產品的主要功能點。例如圖1韓國著名門戶/搜索引擎網站Naver旗下的Naver Shopping,其產品定位即提供商品的搜索服務,通過搜索商品名稱,可以按照商品類別列出幾乎韓國所有的大型電子商務網站提供的該商品鏈接。所以在界面上,用強對比色調突出搜索功能和導航區。通過視覺化引導,讓用戶專注于核心內容,聚焦用戶視線的焦點,在白色為主色調的頁面,視線會先看到強色調的部分,所以也可以用強色調來突出核心內容,讓用戶的視覺聚焦在那里。

  

 

  結構可視化:即采用用戶易于理解的結構,讓用戶對于界面元素關系清晰。如百度統計3.0的搜索推廣效果查看,結構采用了漏斗的圖形方式,達到真正的圖表于意,表達轉化率的概念,形象直觀。

  

 

  流程可視化:即讓用戶在操作時不要迷失方向,幫助用戶定位,避免不明確操作的高成本。美國益智游戲網站Lumosity,在建立定制化大腦訓練計劃時的流程時,頂部采用步驟軸的圖形化方式,不僅用圖標“紅圈”表明了用戶所在的位置,也用圖標“對號”標明了用戶完成了哪些步驟,讓用戶對于整個流程熟悉。

  

 

  控件可視化:由于控件是產品的最小界面元素,是產品質量的基礎,所以本文重點與大家分享基礎控件的一些可視化案例。

  

 

  控件是創建界面的主要構造模塊,是用戶可與之交互以輸入或操作數據的最直接對象。控件需要用戶消耗大量的注意力和鼠標操作,從可視化角度,示例以下四個元素的設計區別:

  控件元素一:單選框

  單選框(Radio Button),又叫選項按鈕或單選按鈕,它容許用戶在一組選項中選擇并且只能其中一個時使用的控件形式,選項之間彼此互斥。

  圖4某產品界面,控件單選框使用錯誤,同時用戶必須在腦中想象空間位置,再轉化為對應文字,點擊兩次,輸入兩次,才能完成。

  圖5修改后采用圖形化表達,直觀,并且減少用戶的點擊次數(一次);當用戶輸入邊距時,在圖形中對應的邊距會出現動態三角,給予用戶引導,防止用戶輸錯。

  

 

  控件元素二:下拉列表控件

  下拉列表(Drop-down List)相對于單選框,同時用于從一組互斥值列表中進行選擇一個選項,不同的是下拉列表的按鈕數量通常較多。

  圖6為新藥品查詢系統的下拉列表篩選控件,通過藥品形狀、顏色、類型等進行篩選,對于用戶來說,認知成本較高,不夠形象化。

  

 

  圖7Naver的醫療藥品的查找篩選控件,將品牌、藥品形狀、顏色、藥品材質、藥面紋理等通過圖形化表達,使信息更直觀、形式更有趣,增強用戶的認知能力,提升操作效率,集合了趣味性與實用性。一圖勝千言,但同時要平衡空間占用和頁面加載成本等因素。

  

 


  推薦閱讀

  <b>旅游網站運營之住哪聯盟、同程聯盟酒店合作之對比</b>

各位旅游站長,大家好,我是一位普通的旅游站長,我的網站是旅途人旅游網,這個網站分別上線一年。中間跟好多站長一樣,都努力學習seo,做排名,我最好的成績做到百度第二,與旅行社合作是掙了一點小錢,可是總得看百>>>詳細閱讀


本文標題:<b>網站用戶體驗設計:高效的設計可視化</b>

地址:http://m.sdlzkt.com/a/22/20120610/66582.html

樂購科技部分新聞及文章轉載自互聯網,供讀者交流和學習,若有涉及作者版權等問題請及時與我們聯系,以便更正、刪除或按規定辦理。感謝所有提供資訊的網站,歡迎各類媒體與樂購科技進行文章共享合作。

網友點評
我的評論: 人參與評論
驗證碼: 匿名回答
網友評論(點擊查看更多條評論)
友情提示: 登錄后發表評論,可以直接從評論中的用戶名進入您的個人空間,讓更多網友認識您。
自媒體專欄

評論

熱度

主站蜘蛛池模板: 国产婷婷成人久久av免费高清| 国产成人久久精品一区二区三区 | 国产成人一区二区精品非洲| 国产成人无码AV一区二区| 四虎影院成人在线观看| 欧美成人第一页| 国产成人免费手机在线观看视频| 亚洲欧美日韩成人一区在线| 成人欧美视频在线观看| 国产成人久久精品一区二区三区 | 亚洲国产一成人久久精品| 成人看的午夜免费毛片| 亚洲成人高清在线| 成人777777| 成人禁在线观看| 欧美成人四级剧情在线播放| 亚洲精品天堂成人片AV在线播放| 成人动漫在线观看免费| 欧美成人看片黄a免费看| 亚洲国产精品成人午夜在线观看| 大臿蕉香蕉大视频成人| 成人黄色小说网站| 中文字幕欧美成人免费| 国产成人tv在线观看| 国产成人精品免费视频软件 | 四虎成人精品国产永久免费无码| 成人免费无遮挡无码黄漫视频| 香蕉久久成人网| 69国产成人精品视频软件| 99国产精品久久久久久久成人热| 噜噜噜亚洲色成人网站| 午夜电影成人福利| 亚洲国产成人久久一区www| 亚洲成人高清在线观看| 亚洲国产成人精品青青草原| 亚洲国产成人久久综合区| 亚洲国产成人精品无码区二本| 久久久久av综合网成人| 99久久成人国产精品免费| 欧美成人性视频播放| 成人中文乱幕日产无线码|