設(shè)計(jì)框架

Allan Cooper建議不要過(guò)早地把重點(diǎn)放在小細(xì)節(jié)、小部件和精細(xì)的交互上會(huì)妨礙產(chǎn)品的設(shè)計(jì)，應(yīng)先站在一個(gè)高層次上關(guān)注用戶(hù)界面和相關(guān)行為的整體結(jié)構(gòu)
Allan Cooper提出的交互框架不僅定義了高層次的屏幕布局，同時(shí)定義了產(chǎn)品的工作流、行為和組織。它包括了6個(gè)主要步驟：

定義外形因素和輸入方法

• 外形因素
  設(shè)計(jì)什么樣的產(chǎn)品？
• 產(chǎn)品輸入方法
  產(chǎn)品與用戶(hù)互動(dòng)的形式
  取決于產(chǎn)品的外形和人物角色的能力和喜好
  哪種方式或者組合更適合設(shè)定的人物角色

定義功能和數(shù)據(jù)元素

• 數(shù)據(jù)元素
  交互產(chǎn)品中的基本主體，如相片、電子郵件、訂單
• 功能元素
  對(duì)數(shù)據(jù)元素操作的工具以及輸入或者放置數(shù)據(jù)元素的位置
• 在智能電話(huà)人物角色Vivien，滿(mǎn)足其需求的功能元素包括：（使用場(chǎng)景劇本檢驗(yàn)）
  聲音激活控制（聲音數(shù)據(jù)和聯(lián)系人關(guān)聯(lián)起來(lái)）
  快速撥號(hào)鍵
  從地址簿中選擇聯(lián)系人
  從電子郵件、約會(huì)項(xiàng)以及備忘錄中選取聯(lián)系人
  在某些情境下自動(dòng)撥號(hào)鍵（比如即將到來(lái)的約會(huì)事項(xiàng)）

決定功能組合層次

對(duì)定義的高層次數(shù)據(jù)元素和功能元素進(jìn)行分組，并決定其層次。

• 元素分組
  更好地在任務(wù)中和任務(wù)間來(lái)幫助促進(jìn)任務(wù)角色的操作流程
• 需考慮的內(nèi)容
  哪些元素需要大片的視頻區(qū)域
  容器如何組織才能優(yōu)化工作流
  哪些元素是被一起使用的等
  產(chǎn)品平臺(tái)、屏幕大小、外形尺寸和輸入方法的影響
  1）容納對(duì)象的容器之間有比較關(guān)系或者要放在一起使用，則其應(yīng)該是相鄰的
  2）表達(dá)一個(gè)過(guò)程中多個(gè)步驟的對(duì)象通常也要放在一起，并且遵循一定的次序

勾畫(huà)大致的設(shè)計(jì)框架

最初階段，界面的視覺(jué)化工作應(yīng)該非常簡(jiǎn)單：

• 方塊圖階段
  用粗略的方塊圖來(lái)表達(dá)并區(qū)分每個(gè)視圖
  方塊圖對(duì)應(yīng)窗格、控制部件（如工具欄）
  為每個(gè)方塊圖添加上標(biāo)簽和注解
  
  不要被界面上某個(gè)特殊區(qū)域的細(xì)枝末節(jié)分散了精力

構(gòu)建關(guān)鍵情景場(chǎng)景劇本

• 描述了人物角色如何同產(chǎn)品交互
  這些場(chǎng)景劇本描述了人物角色最頻繁使用界面的主要路徑
  必須在細(xì)節(jié)上嚴(yán)謹(jǐn)?shù)孛枋?strong>每個(gè)主要交互的精確行為，并提供每個(gè)主要線(xiàn)路的走查
• 可使用低保真草圖序列的故事板
  

通過(guò)驗(yàn)證性的場(chǎng)景劇本來(lái)檢查設(shè)計(jì)

驗(yàn)證性的場(chǎng)景劇本不用具備很多細(xì)節(jié)，但包含一系列“如果怎樣，將怎樣”的問(wèn)題。
下面介紹三種驗(yàn)證性的場(chǎng)景劇本：
（1）關(guān)鍵線(xiàn)路的變種場(chǎng)景劇本
關(guān)鍵途徑的替代：如果Vivien決定不給Frank打電話(huà)，而是發(fā)電子郵件
（2）必須使用的場(chǎng)景劇本
必須要被執(zhí)行但又不是經(jīng)常發(fā)生的情況：智能電話(huà)中如果該手機(jī)被買(mǎi)賣(mài)，則需要?jiǎng)h除原用戶(hù)所有個(gè)人信息的功能
（3）邊緣情形使用場(chǎng)景劇本
非典型產(chǎn)品具備，但不太常用的功能：如Vivien想添加兩個(gè)同名聯(lián)系人

設(shè)計(jì)策略

注：important
增加的功能越多，越難發(fā)現(xiàn)對(duì)用戶(hù)而言真正有價(jià)值的功能，同時(shí)還可能使遺留代碼變得越來(lái)越沉重，系統(tǒng)的維護(hù)成本越來(lái)越高。
交互設(shè)計(jì)策略的目的就是讓軟件產(chǎn)品變得簡(jiǎn)單，并借此提高大多數(shù)用戶(hù)的用戶(hù)體驗(yàn)。

刪除

• 最明顯的簡(jiǎn)化設(shè)計(jì)方法
  64%的軟件功能“從未使用或極少使用”
• 刪除雜亂的特性
  可以讓設(shè)計(jì)師專(zhuān)注于把有限的重要問(wèn)題解決好
  有助于用戶(hù)心無(wú)旁騖地完成自己的目標(biāo)

如何刪除？

• 關(guān)注核心
  關(guān)系到用戶(hù)日常使用體驗(yàn)的功能
  能夠消除用戶(hù)挫折感的功能
• 砍掉殘缺功能
  刪除實(shí)現(xiàn)的不夠理想的功能
  為什么要留著它？”而非“為什么應(yīng)該去掉它”
• 把注意力集中到客戶(hù)的目的上面，而非流程

消除錯(cuò)誤
消除錯(cuò)誤也能提供簡(jiǎn)單的用戶(hù)體驗(yàn)：如銀行對(duì)賬單查詢(xún)

刪除策略不僅適用于界面上的功能，還適用于界面上的文字：
刪除視覺(jué)混亂

• 減少用戶(hù)必須處理的信息，集中注意力在真正重要的內(nèi)容上
• 方法：
  使用空白或輕微背景來(lái)劃分頁(yè)面，不要使用線(xiàn)條
  盡可能少使用強(qiáng)調(diào)，僅加粗就可以了
  別使用粗黑線(xiàn)，勻稱(chēng)、淺色的線(xiàn)更好
  控制信息的層次，標(biāo)題、子標(biāo)題、正文
  減少元素大小的變化
  減少元素形狀的變化

刪除文字

• 幾乎任何句子都能夠精簡(jiǎn)，幾乎任何文字都可以刪除
• 精簡(jiǎn)句子的方法：
  不使用介詞（對(duì)于/根據(jù)/為了/基于/通過(guò)/關(guān)于）
  不使用is的動(dòng)詞形式，盡可能使用其他表達(dá)方式
  把被動(dòng)句式轉(zhuǎn)換為主動(dòng)句式，如：時(shí)間是被這個(gè)項(xiàng)目所需要的->這個(gè)項(xiàng)目需要時(shí)間
  刪除索然無(wú)味的開(kāi)頭，開(kāi)門(mén)見(jiàn)山
  刪除不必要的說(shuō)明和解釋

不要?jiǎng)h減過(guò)多
人們希望自己能夠掌控局面：

• 讓人們能夠控制結(jié)果
• 足夠多的控制可以讓他們消除因基本需求得不到滿(mǎn)足而引發(fā)的焦慮
• 要避免控制太多導(dǎo)致他們因選擇而浪費(fèi)時(shí)間

組織

• 最快捷的簡(jiǎn)化設(shè)計(jì)方式
• 分塊
  可對(duì)命令分塊，如菜單
  可以按字母表或時(shí)間順序排列的清單
  分塊越少，選擇越少，用戶(hù)的負(fù)擔(dān)就越輕
• 圍繞行為進(jìn)行組織
  人們希望按照某種特定的步驟做事
• 確定清晰的分類(lèi)標(biāo)準(zhǔn)
  建議多找一些用戶(hù)，詢(xún)問(wèn)他們的分類(lèi)標(biāo)準(zhǔn)
• 利用不可見(jiàn)的網(wǎng)格來(lái)對(duì)齊界面元素
  
• 大小和位置
  重要的元素要大一些，不太重要的界面元素應(yīng)該小一些
  把相似元素放在一起
• 感知分層的實(shí)現(xiàn)方式
  瞇起眼睛觀察屏幕，看是否能區(qū)分不同的層
• 期望路徑
  在描述用戶(hù)使用軟件的路徑時(shí)，千萬(wàn)不要被自己規(guī)劃圖中清晰的線(xiàn)條和整潔的布局所迷惑

隱藏

• 隱藏是一種低成本的簡(jiǎn)化方案
  1）用戶(hù)不會(huì)因不常用的功能分散注意力
  2）可作為刪除不必要功能的開(kāi)始
  3）必須仔細(xì)權(quán)衡要隱藏哪些功能
• 隱藏什么
  1）主流用戶(hù)很少使用，但自身需要更新的功能
  2）事關(guān)細(xì)節(jié)（對(duì)服務(wù)器進(jìn)行配置或設(shè)計(jì)郵件簽名）
  3）選項(xiàng)和偏好（修改繪圖應(yīng)用的單位）
  4）特定于地區(qū)的信息（如時(shí)間和日期需頻繁自動(dòng)更新的信息）
• 自定義
  1）是否應(yīng)該給用戶(hù)自己選擇的權(quán)利？
  自定義可能是一件非常耗費(fèi)時(shí)間的事，且要求對(duì)軟件中各種各樣的功能了如指掌
  2）主流用戶(hù)感興趣的是展示自己的個(gè)性
  3）如果自定義的工具很簡(jiǎn)單，還是有價(jià)值的
• 漸進(jìn)展示
  1）隱藏精確的控制部件
  2）對(duì)于用戶(hù)期望的功能，要在正確的環(huán)境下給出明確的提示
• 適時(shí)出現(xiàn)
  1）過(guò)分強(qiáng)調(diào)隱藏功能會(huì)導(dǎo)致混亂
  2）成功的隱藏
  盡可能徹底地隱藏所有需要隱藏的功能
  在合適的時(shí)機(jī)、合適的位置上顯示相應(yīng)功能
• 讓功能易于發(fā)現(xiàn)
  1）怎樣介紹被隱藏在幕后的附件項(xiàng)？
  為隱藏功能打上標(biāo)簽：更多，高級(jí)
  把標(biāo)簽放在哪里比把標(biāo)簽做多大重要得多
  2）用戶(hù)關(guān)注點(diǎn)
  用戶(hù)在遇到問(wèn)題的時(shí)候，過(guò)于關(guān)注屏幕上問(wèn)題區(qū)域就算標(biāo)簽再大，放在用戶(hù)關(guān)注點(diǎn)之外，用戶(hù)也看不到

轉(zhuǎn)移

• 設(shè)備間的轉(zhuǎn)移
• 用戶(hù)間的轉(zhuǎn)移

簡(jiǎn)化設(shè)計(jì)策略的組合

• 刪除不必要的
• 組織要提供的
• 隱藏非核心的

設(shè)計(jì)中的折中

個(gè)性化和配置

問(wèn)題：是否應(yīng)該讓產(chǎn)品具有用戶(hù)定制功能？

• 個(gè)性化
  人們喜歡改變周?chē)氖挛?，使之適合自己
  必須簡(jiǎn)單易用
  在用戶(hù)確定選擇之前給他們一個(gè)預(yù)覽的機(jī)會(huì)
  必須容易撤銷(xiāo)
• 配置
  移動(dòng)、添加或者刪除持久對(duì)象
  富有經(jīng)驗(yàn)的用戶(hù)所期望的
  包含多種配置形式

本地化和國(guó)際化

• 調(diào)整軟件，使之能適用于不同語(yǔ)言及地區(qū)的過(guò)程
• 國(guó)際化
  指在設(shè)計(jì)軟件時(shí)，將軟件與特定語(yǔ)言及地區(qū)脫鉤的過(guò)程
  當(dāng)移植到不同的語(yǔ)言及地區(qū)時(shí)，軟件本身不用做內(nèi)部工程上的改變或修正
  意味著產(chǎn)品有適用于任何地方的“潛力”
  只需做一次
• 本地化
  當(dāng)移植軟件時(shí)，加上與特定區(qū)域設(shè)置有關(guān)的信息和翻譯文件的過(guò)程
  為了更適合于“特定”地方的使用，而另外增添的特色
  針對(duì)不同的區(qū)域各做一次

審美學(xué)與實(shí)用性

• 一個(gè)漂亮的界面不一定就是一個(gè)好的界面！
• 審美與實(shí)用的沖突
  為確保文本的可讀性，文本的背景采用較低的對(duì)比度
  復(fù)雜而強(qiáng)烈的對(duì)比可能獲獎(jiǎng)，但不實(shí)用
• 交互設(shè)計(jì)角度
  根據(jù)語(yǔ)義和任務(wù)因素來(lái)進(jìn)行視覺(jué)組織是最重要的
  視覺(jué)美學(xué)的重要性稍低
  換句話(huà)說(shuō)，先實(shí)現(xiàn)一個(gè)良好的基本布局，然后再在這個(gè)基礎(chǔ)上進(jìn)行改進(jìn)來(lái)實(shí)現(xiàn)好的美學(xué)效果
  組件之間的空白非常重要
  
  組件的對(duì)齊會(huì)影響界面的可理解性和易用性
  

軟件設(shè)計(jì)的細(xì)節(jié)

加快系統(tǒng)的響應(yīng)時(shí)間

• 軟件的空閑時(shí)間被浪費(fèi)了
  CPU除了等待，沒(méi)有做任何事
• 如何利用程序的空閑時(shí)間
• 需要以全新并更主動(dòng)的方式來(lái)思考軟件能夠怎樣幫助人們實(shí)現(xiàn)其目標(biāo)和任務(wù)

減輕用戶(hù)的記憶負(fù)擔(dān)

• 為了使用軟件來(lái)完成某些任務(wù)，必須記住兩類(lèi)信息或知識(shí)
  和軟件如何操作相關(guān)：應(yīng)當(dāng)選擇哪個(gè)命令或操作、文件存在哪個(gè)目錄中等
  和該任務(wù)所需的領(lǐng)域知識(shí)相關(guān)：哪些系統(tǒng)函數(shù)可以使用，這些函數(shù)的參數(shù)及返回值是什么
• 好的軟件通過(guò)回憶用戶(hù)上次的行為預(yù)測(cè)用戶(hù)可能的操作
  程序可以使用用戶(hù)以前的設(shè)置作為默認(rèn)值，如文檔存放目錄、窗口位置等

減少用戶(hù)的等待感

• 以某種形式的反饋?zhàn)層脩?hù)了解操作進(jìn)行的進(jìn)度和狀態(tài)
  如進(jìn)度對(duì)話(huà)框
• 以漸進(jìn)方式向用戶(hù)呈現(xiàn)處理結(jié)果
  分成多個(gè)連續(xù)的部分來(lái)順序地把結(jié)果提供給用戶(hù)
  先傳輸全局概括，再傳輸細(xì)節(jié)
• 給用戶(hù)分配任務(wù)，分散用戶(hù)的注意力
• 減低用戶(hù)的期望值

設(shè)計(jì)好的出錯(cuò)信息

四個(gè)簡(jiǎn)單原則 ：

• 使用清晰的語(yǔ)言來(lái)表達(dá)，而不要使用難懂的代碼
• 使用的語(yǔ)言應(yīng)當(dāng)精煉準(zhǔn)確，而不是空泛而模糊的
• 對(duì)用戶(hù)解決問(wèn)題提供建設(shè)性的幫助
• 出錯(cuò)信息應(yīng)當(dāng)友好，不要威脅或責(zé)備用戶(hù)

交互設(shè)計(jì)模式

模式

模式就是某個(gè)情形下某個(gè)問(wèn)題的解決方案，描述了問(wèn)題和解決方案，并說(shuō)明了它成功應(yīng)用于何處。
模式捕捉的只是良好設(shè)計(jì)中不變的特性，具體實(shí)現(xiàn)，將取決于環(huán)境和設(shè)計(jì)者的創(chuàng)造性。

舉例：
問(wèn)題
當(dāng)人們有一種選擇的時(shí)候，總是傾向于進(jìn)入兩邊透亮的房子中，離開(kāi)一邊透亮的房子，使其處于閑置狀態(tài)
解決方案
定位每個(gè)房間，使得至少在其兩邊的外部有戶(hù)外空間。然后，在兩邊的墻上設(shè)置窗戶(hù)，結(jié)果自然光能從多于一個(gè)方向照射進(jìn)來(lái)

交互設(shè)計(jì)模式

Allan Cooper將交互設(shè)計(jì)模式分為三種類(lèi)型：
1）定位模式：應(yīng)用于概念層面，幫助界定產(chǎn)品對(duì)用戶(hù)的整體定位。
2）結(jié)構(gòu)模式：解答如何在屏幕上安排信息和功能元素之類(lèi)的問(wèn)題。
3）行為模式：旨在解決功能或數(shù)據(jù)元素的具體交互問(wèn)題。
模式不是拿來(lái)即用的商品，每一次模式的運(yùn)用都有所不同。
向?qū)Ｊ?/strong>：在界面上一步步引導(dǎo)用戶(hù)按預(yù)定的順序完成任務(wù)文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-490588.html