什么是Pattern呢?
Pattern,我們可以把它看做是一組可重復使用、被大多數人知曉、蘊含設計經驗小結的界面交互模式。這些模式可能適用于桌面軟件、Web應用、手機應用等等。
這里我們通過分析兩個Pattern應用的實例,來更好的理解Pattern和運用Pattern。
雙面板Pattern
用來承載對象與對象內容的兩個面板,用戶選擇【對象面板】后,【對象內容面板】會自動顯示該對象的詳細信息。
Microsoft Outlook2007
適用范圍
郵件、歌曲庫、圖片庫、主從數據記錄、文件管理器等。
優點
1、對象與對象內容同時可視;
2、避免了頁面切換和更多的鼠標點擊操作,節省體力;
3、減輕用戶記憶負擔,用戶不需要去記憶【對象內容】的存在位置;
4、支持上、下方向鍵的快速瀏覽,有效減少瀏覽時間。
如何使用
根據用戶的視覺流動方向,可將【對象面板】與【對象內容面板】左右、上下排布。當用戶選中【對象面板】時,【對象內容】面板及時刷新。
案例
如上圖:在Web軟件應用中,可將基礎資料類(幣別、部門、職員)數據的錄入與查詢整合為”雙面板模式”,上面用做【數據輸入區】,下面列表用做【數據展示區】。鼠標單擊【數據展示區】即可在【數據輸入區】完成數據修改。
此方案充分利了用雙面板Pattern的優勢,并進行了擴展。用戶的反饋效果還是不錯的!
————————————————————————————————-
畫布+工具條Pattern
畫布+帶圖標的工具條,通過畫布旁的工具條來創建、修改畫布對象。
適用范圍
圖形編輯、文字編輯
優點
1、 一張畫紙和一支畫筆,現實生活到軟件界面的自然映射,符合用戶心智模型;
2、 通過使用工具條可以對復雜的操作進行分類,方便用戶使用。
如何使用
可根據用戶習慣將工具條放置在畫布上、左、右邊,工具條一定要提供表意明確的圖標(或增加文字描述)來幫助用戶識別。
案例
如上圖:在SnagIt9.0當中,將原有的工具條改為微軟的Ribbon,并在界面底部增加了”捕捉庫”操作區。在PhotoShop中進行多圖切換時需要使用Ctrl+Tab快捷鍵,而在SnagIt9.0″捕捉庫區域”既能看到多圖的縮略,又能很方便的通過鼠標點擊進行切換。這個在畫布+工具條Pattern的基礎上增加了 “捕捉區”的擴展,更加方便了用戶進行多圖的切換
通過上面兩個案例,我們可以了解到界面設計中的Pattern是什么?我們該如何利用已有的Pattern去更好的設計界面?好的Pattern有很多,這里沒法一一列舉。有興趣的話可以自己分析研究一下其他pattern。
原文:http://www.kdued.com/2008/11/%E7%95%8C%E9%9D%A2%E8%AE%BE%E8%AE%A1%E4%B8%AD%E7%9A%84pattern/