2014-3-18 藍藍設計的小編
轉載藍藍設計( m.820esy.cn )是一家專注而深入的界面設計公司,為期望卓越的國內(nèi)外企業(yè)提供有效的 BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務
來源:http://www.uisdc.com/100-things-you-should-know-about-design
如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里
藍藍設計將分析列表在各種情境的界面設計方法,以及需要注意的事項。
列表常見的使用情境
模式1. 雙面版選擇器
雙面板列表是一種將列表區(qū)分為兩個區(qū)域的一種設計模式,用戶可以自由在第一個面上選擇項目,第二個面版上會顯示面板一選擇的項目內(nèi)容。
優(yōu)點
缺點
設計要點
會使用一個基本的列表顯示內(nèi)容,當用戶點選某個項目時,會使用新的畫面顯示內(nèi)容,新的畫面會取代列表畫面。
優(yōu)點
缺點
設計要點
列表會在原地展開/收起,用來顯示該項目的詳細信息。
優(yōu)點
缺點
設計要點
將列表是用網(wǎng)格縮圖的方式呈現(xiàn),讓用戶可以使用視覺圖片的方式瀏覽內(nèi)容。
優(yōu)點
缺點
設計要點
將一組項目使用水平弧線或水平排列的呈現(xiàn)方式,允許使用者向左或向右檢視內(nèi)容,通常當前(中間)的項目會較大顯示。
優(yōu)點
缺點
設計要點
Safari 在 Mac OSX 10.9 之前時也使用這樣的方式展示 Top Sites,在 10.9 版后改用縮圖列表的方式
使用兩種不同的色彩作為列表項目的背景,使項目容易被區(qū)分出來。利用色塊的方式將列表轉換成合理的視覺對象(完形心理學 – 封閉性)
優(yōu)點
設計要點
列表使用字母的方式進行排列,在列表上使用英文字母的方式作為列表的滾動條,通常在電話簿、字典、音樂等列表上會看到這種模式。
使用情境
用戶不曉得項目的完整名稱,但了解項目的開頭字母,可以使用此模式進行快速定位。
設計要點
面對大量的列表數(shù)據(jù)時,將列表使用分頁的方式切成多個頁面閱讀,一次閱讀一頁。
優(yōu)點
缺點
設計要點
關于分頁顯示與無限滾軸兩個模式,會在之后的文章中進行詳細的分析與比較
使用多層的列表呈現(xiàn)內(nèi)容,用來表顯出內(nèi)容與內(nèi)容之間的階層關系。
優(yōu)點
缺點
設計要點
允許在列表結構中,展開出樹狀的階層結構關系,此模式與分層列表不同,樹狀清單能夠一次展示多個項目里頭的階層關系。
優(yōu)點
缺點
設計要點
一種快速且直覺的方式新增 / 修改列表內(nèi)容。
依照你的使用的情境,使用適當?shù)膶斜沓尸F(xiàn)方式
「從列表中選擇某個項目,該如何顯示該項目的細節(jié)信息?」
「該如何呈現(xiàn)一份具有視覺元素的列表」
「如何管理一份長清單」
「如何整理具有階層、分類的清單」