交互設計中的認知維度演示教學

1、交互設計交互設計(shj)(shj)中的認知維度中的認知維度及其細節(jié)及其細節(jié)The cognitive dimensions of interaction design and the details of them第一頁，共25頁。0101Part one什么是交互(jioh)設計Part two交互(jioh)的認知維度Part three細節(jié)(xji)分析討論Part four回顧與總結020203030404提 綱OUTLINE第二頁，共25頁。平面：平面： VI VI標志標志 圖形圖形/ /圖案圖案 字體字體/ /字形字形 DM/ DM/宣傳單宣傳單/ /平面廣告平面廣告 海報海報

2、包裝包裝 書裝書裝/ /畫冊畫冊 信息圖信息圖 PPT/ PPT/演示演示(ynsh)(ynsh)GUIGUI： 移動設備界面移動設備界面 電腦軟件界面電腦軟件界面 圖標圖標 游戲游戲UI UI 桌面背景桌面背景/ /壁壁紙紙 網頁：企業(yè)官網網頁：企業(yè)官網 門戶門戶/ /社交社交 電子商務電子商務/ /商城商城 專題專題/ /活動活動 游戲游戲/ /娛樂娛樂 個人網站個人網站/ /博客博客 Banner/ Banner/廣告圖廣告圖空間空間/ /建筑：建筑設計、室內設計建筑：建筑設計、室內設計 舞臺美術舞臺美術 展示展示/ /櫥窗櫥窗/ /店面設店面設計計 園林景觀園林景觀/ /規(guī)劃規(guī)劃 那什

3、么是交互設計？那什么是交互設計？設計分類設計分類(fn li)(fn li)眾多眾多01什么是交互(jioh)設計第三頁，共25頁?！?“ 你來我往你來我往(n li w wn) ” (n li w wn) ” 即為即為 交互交互01什么(shn me)是交互設計 交互可以交互可以(ky)(ky)存在于存在于 人與人、人人與人、人與物與物 物物 即為即為 產品產品 產品產品 可以是可以是 硬件硬件或者是或者是軟件軟件第四頁，共25頁。01交互(jioh)的認知維度以人的需求為導向，以人的需求為導向，理解用戶的期望理解用戶的期望(qwng)(qwng)、需求，、需求，理解商業(yè)、技術以及業(yè)內的機會

4、與制約，理解商業(yè)、技術以及業(yè)內的機會與制約，創(chuàng)造出形式、內容、行為，創(chuàng)造出形式、內容、行為，有用、易用、令用戶滿意且技術可行，有用、易用、令用戶滿意且技術可行，具有商業(yè)利益的產品。具有商業(yè)利益的產品。第五頁，共25頁。以軟件產品為例，是如何(rh)“你來我往”?02交互(jioh)的認知維度點擊、輸入 你來 來自用戶(yngh)反饋、輸出 我往 還給用戶(yngh)用戶是怎么使用產品的呢？第六頁，共25頁。這是用戶使用一項功能之前，意識(y sh)到自己需要此功能。 “需求” Aware : Aware : 意識意識(y sh)(y sh)到的到的02 02 交互交互(jioh)(jioh)的

5、認知維度的認知維度PerceivePerceive、Recognition&RecallRecognition&Recall：感知、識別感知、識別& &回憶回憶ActAct : : 行動操作行動操作FeedbackFeedback：反饋：反饋觀察界面、認出在哪里操作，該怎么操作 “產品界面” 點擊按鈕、輸入一個搜索條件 “操作” 誤操作了？網斷了？系統(tǒng)崩潰？ “給用戶提示當前的狀態(tài)” 第七頁，共25頁。03細節(jié)(xji)分析討論1、列表設計(shj)的三個基本思路2、按鈕的學問：確定在左？取消在右？第八頁，共25頁。列表算是一個非?；A(jch)的設計元素，無非

6、是一排一排的數(shù)據內容，加上一些基本的操作。一個信息結構合理，操作明確表格、列表設計，能夠幫助用戶減輕很多的閱讀負擔。03 03 細節(jié)分析討論細節(jié)分析討論(toln) (toln) 列表設計的三個基本思路列表設計的三個基本思路適合簡單直觀的操作，用戶不用查看詳細就能直接操作優(yōu)點：所有的操作一目了然；單擊完成操作缺點：1，如果信息很多，會導致信息過載(guzi)；2，列表長度有限，擴展性不強； 3，誤操作相對而言較高方案一：每一排都顯示具體的操作方案一：每一排都顯示具體的操作第九頁，共25頁。03 03 細節(jié)分析討論細節(jié)分析討論(toln) (toln) 列表設計的三個基本思路列表設計的三個基本思

7、路第十頁，共25頁。列表算是一個非?；A的設計元素，無非是一排一排的數(shù)據內容，加上一些基本的操作。一個信息(xnx)結構合理，操作明確表格、列表設計，能夠幫助用戶減輕很多的閱讀負擔。03 03 細節(jié)分析討論細節(jié)分析討論(toln) (toln) 列表設計的三個基本思路列表設計的三個基本思路適用于操作較多，無法在列表上完全顯示，或者操作不常發(fā)生的情況。優(yōu)點：信息密度低，重點突出；提高“高風險”操作的門檻缺點：增加(zngji)了點擊次數(shù)，不能一目了然方案二：折疊隱藏一部分操作方案二：折疊隱藏一部分操作第十一頁，共25頁。03 03 細節(jié)細節(jié)(xji)(xji)分析討論分析討論 列表設計的三個基本

8、思路列表設計的三個基本思路第十二頁，共25頁。列表算是一個非常基礎的設計元素，無非是一排一排的數(shù)據內容，加上一些基本的操作。一個信息結構合理，操作明確表格、列表設計，能夠幫助用戶(yngh)減輕很多的閱讀負擔。03 03 細節(jié)分析細節(jié)分析(fnx)(fnx)討論討論 列表設計的三個基本思路列表設計的三個基本思路適用于多個文件需要同時進行管理的情況，如網盤，郵件等。優(yōu)點：對于批量操作有幫助缺點：增加(zngji)了點擊次數(shù)方案三：支持用戶選中多個項目，并在列表上方統(tǒng)一操作方案三：支持用戶選中多個項目，并在列表上方統(tǒng)一操作第十三頁，共25頁。03 03 細節(jié)分析細節(jié)分析(fnx)(fnx)討論討論

9、 列表設計的三個基本思路列表設計的三個基本思路第十四頁，共25頁。確認框，顧名思義，就是對用戶的關鍵行為進行確認。確認框是一種打斷，有時候甚至(shnzh)是打擾。只有在用戶的操作具有很大的風險，一定需要他來確認，除此之外，盡量不要用確認框。03 03 細節(jié)細節(jié)(xji)(xji)分析討論分析討論 按鈕的學問：確定在左，取消在右按鈕的學問：確定在左，取消在右一、以視覺一、以視覺(shju)(shju)流的角度流的角度 （哪種更輕松？）（哪種更輕松？）第十五頁，共25頁。03 03 細節(jié)分析討論細節(jié)分析討論 按鈕的學問按鈕的學問(xu wen)(xu wen)：確定在左，取消在右：確定在左，取消

10、在右二、古騰堡法則二、古騰堡法則(fz)(fz)古騰堡圖是指人們在瀏覽頁面的時候，視覺(shju)趨向于從上到下，從左到右的眼動規(guī)律。第十六頁，共25頁。03 03 細節(jié)分析討論細節(jié)分析討論 按鈕的學問按鈕的學問(xu wen)(xu wen)：確定在左，取消在右？：確定在左，取消在右？三、三、“上一步上一步”“”“下一步下一步” 的操作的操作(cozu)(cozu)習慣習慣windows規(guī)范已經培養(yǎng)了強大的用戶習慣，確認按鈕在左邊(zu bian)，取消按鈕在右邊。這在用戶的心中已經形成一個默認的原則，改變用戶的習慣非常艱難。第十七頁，共25頁。03 03 細節(jié)分析細節(jié)分析(fnx)(fnx

11、)討論討論 按鈕的學問：確定在左，取消在右？按鈕的學問：確定在左，取消在右？影響人們使用習慣的因素很多：例如設備影響人們使用習慣的因素很多：例如設備(shbi)(shbi)（本實驗使用平板）、系統(tǒng)（本實驗使用（本實驗使用平板）、系統(tǒng)（本實驗使用IOSIOS）和載體（本實驗使用網頁）等。和載體（本實驗使用網頁）等。舉一個例子，中國人用筷子，西方人用刀叉，要證明筷子和刀叉哪個更加適合人類本能，怎么設計實驗？恐怕唯一的實驗對象只能是還沒學會用餐的小孩，因為在每個人已經被環(huán)境同化的情況下，本能的影響已經微乎其微了。而就算真的證明了筷子和刀叉哪個更符合人類本能又怎樣呢？也不可能因為那一點微小的學習成本就

12、讓全世界廢棄任何一種(y zhn)餐具。思考到這里，恐怕*順應大環(huán)境*才是最好的選擇。第十八頁，共25頁。尼爾森十大可用性原則(yunz)狀態(tài)(zhungti)可見原則04 04 總結總結(zngji) (zngji) 尼爾森十大可用性原則尼爾森十大可用性原則環(huán)境貼切原則一致性原則防錯原則易取原則撤銷重做原則靈活高效原則易掃原則容錯原則人性化幫助原則第十九頁，共25頁。狀態(tài)可見(kjin)原則04 04 總結總結(zngji) (zngji) 尼爾森十大可用性原則尼爾森十大可用性原則用戶在網頁上的任何操作，不論是單擊、滾動還是按下鍵盤(jinpn)，頁面應即時給出反饋?！凹磿r”是指，頁面響應時間小于用戶能忍受的等待時間。第二十頁，共25頁。環(huán)境(hunjng)貼切原則04 04 總結總結(zngji) (zngji) 尼爾森十大可用性原則尼爾森十大可用性原則網頁的一切表現(xiàn)和表述，應該盡可能貼近(tijn)用戶所在的環(huán)境（年齡、學歷、文化、時代背景），而不要使用第二世界的語言。使用用戶熟悉的表述和名詞。第二十一頁，共25頁。撤銷(chxio)重做原則 (?)04 04 總結總結(zngji) (zngji) 尼爾森十大可用性原則尼爾森十大可用性原則為了避免(bmin)用戶的誤用和誤擊，網頁應提供撤銷和重做功能。撤銷也要保存用戶曾經的信息第二