【正文】 附屬文本框。不過你可以基于不同選擇來動(dòng)態(tài)改變文本的內(nèi)容。 不要將單選框用于分組框標(biāo)簽。水平排列會(huì)使得難以閱讀和本地化。 設(shè)計(jì)規(guī)范 l 以邏輯順序排列選項(xiàng)，比如從被選到的可能性從高到低、操作從簡(jiǎn)單到復(fù)雜、或者風(fēng)險(xiǎn)從低到高等等。 如果頁(yè)面上還有其他下拉列表，那么也可以考慮使用下拉列表。 l 下拉列表會(huì)不會(huì)更合適？如果在大多數(shù)情況下，默認(rèn)選項(xiàng)對(duì)大多數(shù)用戶來說都是推薦的，那么單選框可能會(huì)過分占據(jù)用戶的注意力。否則，應(yīng)使用復(fù)選框或者下拉列表。但是，復(fù)選項(xiàng)只適合用于打開或關(guān)閉一個(gè)選項(xiàng)，而單選框則可用于完全不同的選項(xiàng)。要選擇多個(gè)選項(xiàng)，應(yīng)改用復(fù)選框、多選列表框或帶復(fù)選框的列表框。 文檔編寫單選框（Radio Button）用于在一組相關(guān)但互斥的選項(xiàng)中進(jìn)行選擇。 單選框目錄 提及復(fù)選框時(shí)，應(yīng)稱其為“復(fù)選框（check box）”，而非“選項(xiàng)（option）” 。 正確： 在這個(gè)示例中，用戶可能會(huì)認(rèn)為他們只能選擇一項(xiàng)。 如果你必須使用多行標(biāo)簽，應(yīng)當(dāng)將標(biāo)簽的頂部與復(fù)選框?qū)R。不要僅僅為了統(tǒng)一而重復(fù)標(biāo)簽的內(nèi)容。保持標(biāo)簽的簡(jiǎn)潔使得在提示信息和文檔中易于引用。不要將標(biāo)簽表述為選中復(fù)選框意味著不要執(zhí)行某操作。對(duì)于一組復(fù)選框來說，應(yīng)當(dāng)使用并列的措辭并盡量保持所有標(biāo)簽的長(zhǎng)度大致相同。 錯(cuò)誤： 推薦尺寸與間距高清： 用于復(fù)選框的推薦尺寸與間距 復(fù)選框標(biāo)簽為所有復(fù)選框添加標(biāo)簽。應(yīng)當(dāng)改用進(jìn)度條控件。要表示第三種狀態(tài)，應(yīng)當(dāng)改用單選框或下拉列表。 錯(cuò)誤： 在這個(gè)示例中，水平對(duì)齊會(huì)使得難以閱讀。字母順序排列并不推薦，因?yàn)檫@是語(yǔ)言相關(guān)的，無法本地化。 混合狀態(tài)的復(fù)選框 設(shè)計(jì)規(guī)范 將相關(guān)的復(fù)選框合并成組。 用于選擇獨(dú)立選項(xiàng)的一組復(fù)選框 關(guān)聯(lián)選項(xiàng)（一項(xiàng)或多項(xiàng)） 也可用于選擇一個(gè)或多個(gè)選項(xiàng)的一組復(fù)選框。 該選項(xiàng)展示的是程序選項(xiàng)，而非數(shù)據(jù)嗎？選項(xiàng)值不應(yīng)當(dāng)基于上下文或其它數(shù)據(jù)。否則，應(yīng)使用復(fù)選框或者下拉列表。 例如：錯(cuò)誤： 在這個(gè)示例中，紙張橫向（Landscape）選項(xiàng)的對(duì)立面并不明確，因此復(fù)選框在這里并不是好的選擇。 l 選項(xiàng)的數(shù)量是否在 10 個(gè)以內(nèi)？屏幕空間的使用會(huì)隨著選項(xiàng)的數(shù)量而成比例增長(zhǎng)，因此應(yīng)當(dāng)將復(fù)選框的數(shù)量控制在 10 個(gè)以下。 典型的復(fù)選框 它用在這里合適嗎？ 考慮下列問題以進(jìn)行判斷： l 該復(fù)選框是用于切換選項(xiàng)的開關(guān)狀態(tài)，或者是選擇/取消選擇一個(gè)項(xiàng)目嗎？如果不是，則改用其他控件。 標(biāo)簽 它用在這里合適嗎？ l 用“（單擊）”一詞描述用戶的交互行為。 推薦尺寸與間距用于命令按鈕的推薦尺寸與間距。否則，首先考慮文本，或者單獨(dú)使用圖形。錯(cuò)誤：在這個(gè)示例中，按鈕上標(biāo)簽四周的空間太多。 l 不要使用過窄、過短或過高的帶有文本標(biāo)簽的命令按鈕，因?yàn)槠淇雌饋盹@得不專業(yè)。 178。 l 當(dāng)其他控件和一個(gè)命令按鈕存在互操作時(shí)，如帶有“瀏覽”按鈕的文本框，應(yīng)當(dāng)將該命令按鈕以下列三種方式中的一種進(jìn)行擺放以表示它們之間的關(guān)系：178。 l 如果同樣的命令按鈕出現(xiàn)在多個(gè)窗口中，試著使用相同的標(biāo)簽文本、訪問鍵及窗口位置。 帶有瀏覽按鈕的文本框 對(duì)于包含多個(gè)瀏覽按鈕的窗口，可以使用它的簡(jiǎn)化版本： 簡(jiǎn)化的瀏覽按鈕 漸進(jìn)展開按鈕 可使用漸進(jìn)展開按鈕顯示或隱藏不常使用的選項(xiàng)。 瀏覽按鈕 可使用瀏覽按鈕來顯示對(duì)話框以幫助用戶選擇有效值。 輕量級(jí)命令按鈕 輕量級(jí)命令按鈕和標(biāo)準(zhǔn)命令按鈕很像，唯一的不同在于其邊框僅當(dāng)鼠標(biāo)懸停的時(shí)候才會(huì)顯示。 標(biāo)準(zhǔn)命令按鈕 默認(rèn)命令按鈕 窗口中的默認(rèn)命令按鈕表示當(dāng)用戶按下 Enter 鍵時(shí)會(huì)被激活。 178。 178。 178。也就是說，它與該窗口的主要目的沒有關(guān)系。178。它是由開發(fā)人員指定的，但對(duì)于任何一個(gè)按鈕，只要用戶將焦點(diǎn)切換到其上，它都會(huì)變成默認(rèn)按鈕。 推薦尺寸與間距 按鈕目錄 文檔編寫當(dāng)提及鏈接時(shí)： l 原樣引用鏈接文本，包括其大小寫，但無須包含省略號(hào)。 任務(wù)鏈接l 應(yīng)將任務(wù)鏈接用于那些沒有破壞性或能夠輕易恢復(fù)的命令。重復(fù)的鏈接沒有必要，而且會(huì)使文本難于閱讀。 l 僅當(dāng)鏈接的資料相關(guān)、有用、不是冗余重復(fù)的時(shí)候才使用鏈接。 導(dǎo)航鏈接l 確保導(dǎo)航鏈接不需要進(jìn)行提交。l 單擊圖標(biāo)與單擊文本的效果應(yīng)當(dāng)相同。 l 帶圖標(biāo)的文字鏈接 l 箭頭圖標(biāo)應(yīng)當(dāng)僅用于命令鏈接。在你想使用帶下劃線的文本地方使用斜體。這些線索包括下劃線、圖形或項(xiàng)目符號(hào)、以及標(biāo)準(zhǔn)的鏈接位置。 l 使用與鏈接顏色形成明顯對(duì)比的背景色。例如，沒有什么必要來標(biāo)明那些“已訪問過的”命令。 l 對(duì)于導(dǎo)航鏈接來說，為已訪問的和未訪問的鏈接使用不同的顏色。如果沒有反饋，用戶可能會(huì)認(rèn)為沒有單擊并會(huì)再次單擊。 公交信息 如：電視交友與芒果衛(wèi)視我們約會(huì)吧在12月15日于中興廣場(chǎng)舉行大型交友聯(lián)誼。 如：互動(dòng)娛樂推出中秋佳節(jié)特惠禮包答謝廣大用戶的厚愛。 因?yàn)椴藛嗡幍那闆r通常使用一組鏈接，其文本通常不加下劃線（除非懸停）而且可能沒有使用系統(tǒng)鏈接顏色。 幫助鏈接 用于顯示幫助主題的文字鏈接。與導(dǎo)航鏈接不同，任務(wù)鏈接啟動(dòng)一個(gè)新任務(wù)，而不是繼續(xù)進(jìn)行已有的任務(wù)。導(dǎo)航暗示著安全，因?yàn)橛脩艨偸强梢苑祷?。通過鏈接文本和可選的信息提示，用戶應(yīng)當(dāng)能夠準(zhǔn)確地預(yù)知鏈接會(huì)產(chǎn)生的結(jié)果。用戶不會(huì)對(duì)結(jié)果感到驚訝。去掉不必要的文字和細(xì)節(jié)。 使鏈接明確、相關(guān)且能夠被預(yù)知鏈接文本應(yīng)當(dāng)指出單擊鏈接會(huì)產(chǎn)生的結(jié)果。鏈接可能是文本或圖像，通常用已訪問或未訪問的系統(tǒng)鏈接顏色來顯示，以表明它是可以被單擊的。 使連接明確、相關(guān)且能夠被預(yù)知 l 當(dāng)描述用戶的交互行為時(shí)，對(duì)于數(shù)據(jù)應(yīng)使用“（選擇）”，而對(duì)于列標(biāo)題則應(yīng)使用“（單擊）”。 文檔編寫當(dāng)提及列表視圖時(shí)： l 原樣引用標(biāo)簽文本，包括其大小寫及“（列表）”字樣，但無須包含訪問鍵下劃線和冒號(hào)。可能包含大量條目的列表應(yīng)當(dāng)至少顯示3項(xiàng)，使其同時(shí)能夠顯示更多條目以使滑動(dòng)更加容易，也可以使得左右滑動(dòng)更易于定位。避免縱向截?cái)嗔斜眄?xiàng)。 此外，各列可以添加或刪除，也可以重新排序或改變列寬。相反，圖標(biāo)視圖模式則按行排列并使用上下翻頁(yè)。 大圖標(biāo) 各條目顯示為下方帶有標(biāo)簽的超大、大或中等尺寸的圖標(biāo)。 l 該控件需要作為全屏展開源或目標(biāo)嗎？如果需要，則應(yīng)使用列表視圖。也可用作拖放源或目標(biāo)。典型的列表視圖：列表視圖的靈活性與功能性都比列表框要強(qiáng)。 它用在這里合適嗎？B. 使用用戶易懂的文本。該產(chǎn)品或者設(shè)計(jì)具有非常特別的、創(chuàng)新性的、在其競(jìng)爭(zhēng)產(chǎn)品中沒有的功能。該產(chǎn)品或者設(shè)計(jì)能夠讓用戶完全、細(xì)致地控制他們的工作。該產(chǎn)品或者設(shè)計(jì)能夠使用戶在多變的環(huán)境下高效地完成較大范圍內(nèi)的任務(wù)。該產(chǎn)品或者設(shè)計(jì)能夠滿足目標(biāo)用戶的需要，讓他們能夠完成那些無法以其他方式完成的任務(wù)，有效地達(dá)成目標(biāo)。你很可能會(huì)（沮喪地）對(duì)結(jié)果表示驚訝。 有反饋比沒反應(yīng)好。當(dāng)選擇控件時(shí)，能夠約束有效輸入的控件通常是最好的選擇。把信息放在屏幕上，但是要簡(jiǎn)要。 減少精力、知識(shí)和思考要想減少使用你的程序所需的精力、知識(shí)和思考： l 顯式比隱式要好。 不要使人厭煩通常，任何用戶會(huì)直接忽略而不采取任何行動(dòng)的東西都應(yīng)當(dāng)被重新設(shè)計(jì)或者刪除。 為常見問題設(shè)計(jì)你的設(shè)計(jì)是不是很棒——除非用戶犯了錯(cuò)誤或網(wǎng)絡(luò)連接中斷？預(yù)測(cè)那些常見問題、用戶失誤及其他錯(cuò)誤并為基進(jìn)行設(shè)計(jì)。 使其保持簡(jiǎn)單力求在能夠很好地完整任務(wù)的前提下做出最簡(jiǎn)單的設(shè)計(jì)。 使其響應(yīng)及時(shí)你程序的響應(yīng)對(duì)于整體用戶體驗(yàn)來說至關(guān)重要——用戶會(huì)發(fā)現(xiàn)不必要的遲緩以及沒有響應(yīng)的程序不可用。 使其看起來很棒統(tǒng)一1套風(fēng)格，包括標(biāo)準(zhǔn)的窗口邊框、字體、系統(tǒng)顏色、通用控件和對(duì)話框及標(biāo)準(zhǔn)的布局。提供用戶能夠理解的（再次強(qiáng)調(diào)，基于用戶的目標(biāo)和任務(wù)來措辭，而不是技術(shù)）、相互區(qū)別清晰的選項(xiàng)。 讓它得以工作人們是想使用你的產(chǎn)品，而不是進(jìn)行一堆設(shè)置或?qū)W習(xí)一堆東西。這就是你的 UI 應(yīng)該的樣子——好像朋友之間的對(duì)話一樣——而不是什么用戶難以理解的高深莫測(cè)的東西。如果沒有，就干脆去掉！不要為了躲避這種艱難的選擇就把每樣?xùn)|西都做成可選的或可以配置的。牢牢抓住基本的東西！ 把某方面做出色想想“真實(shí)”用戶（而不是市場(chǎng)部或公關(guān)部的人）會(huì)如何描述你的程序。 提示文本應(yīng)當(dāng)不可編輯，且當(dāng)用戶跳轉(zhuǎn)到該文本框內(nèi)時(shí)應(yīng)立即消失。提示文字主要用于以緊湊的方式標(biāo)識(shí)文本框的目的。 提供有用的進(jìn)度細(xì)節(jié)。這樣的話，不要在初始階段顯示可能不準(zhǔn)確的估計(jì)值。不要僅僅因?yàn)椴粔蚓_，就選用不確定模式的進(jìn)度條。 顯示/隱藏 對(duì)象名稱。 顯示/隱藏命令。 更多/更少 對(duì)象名稱。 更多/更少命令。不要隱藏常用的內(nèi)容，因?yàn)橛脩艨赡苷也坏剿鼈儭?鏈接 不要為鏈接分配訪問鍵。使用明確的“取消”按鈕可以讓用戶非?？焖俚厝∠蝿?wù)。 提供明確的“取消”按鈕。例如，為那些是/否的問題提供“是”和“否”的選擇。 例外：如果“取消”有歧義的話，不要修改“取消”按鈕的名稱。禁用的控件可能很難使用，因?yàn)橛脩粜枰茢嗥浔唤玫脑颉Ｈ绻煽啃耘c安全性不是需要考慮的因素，那么就選擇最有可能的或最方便的值。而不是兩個(gè)。好的主標(biāo)題說明傳達(dá)的是用戶的目標(biāo)，而不只是關(guān)注于操作用戶界面。 不要為不是鏈接的文本使用藍(lán)色，因?yàn)橛脩魰?huì)把它當(dāng)成鏈接。用戶絕不應(yīng)感到被牽就、被責(zé)備或被脅迫。如果覺得布局左側(cè)偏重，應(yīng)當(dāng)考慮增加控件的寬度，并將一些控件移到右側(cè)。確保列表視圖具有合適的默認(rèn)、最小及最大列寬?？丶叽鐟?yīng)當(dāng)適合于其典型內(nèi)容，將控件變得更寬、更高、必要時(shí)使用多行編輯。 如果窗口是上下文相關(guān)的，應(yīng)當(dāng)總是將其顯示在靠近觸發(fā)它的對(duì)象旁邊。檢查布局問題、控件和窗口裁剪、以及圖標(biāo)和位圖拉伸情況。 避免將圓角按鈕用作標(biāo)簽頁(yè)。 界面元素的行為應(yīng)該和用戶期望的一致，不要試圖更改標(biāo)準(zhǔn)控件的行為。例如： 使用高質(zhì)量的圖標(biāo)。在長(zhǎng)時(shí)間使用的情況下，您的產(chǎn)品應(yīng)該仍然令人愉快。[5]《About Face 3交互設(shè)計(jì)精髓》二、 設(shè)計(jì)原則 用戶體驗(yàn)設(shè)計(jì)原則 反饋和交互反饋和交互意味著通過合適的反饋以及和程序之間的交互從而讓用戶時(shí)刻知道現(xiàn)在發(fā)生了什么，而不僅僅是當(dāng)事情出錯(cuò)時(shí)顯示一個(gè)警告。 參考資料[1]《Windows 用戶體驗(yàn)交互設(shè)計(jì)規(guī)范》。 適用范圍公司數(shù)字電視的界面設(shè)計(jì)。[4]《WindowsPhone7UI設(shè)計(jì)及人機(jī)交互指南》，pdf版。 整體美學(xué)整體美學(xué)意味著信息經(jīng)過良好的組織并且和視圖設(shè)計(jì)一致。窗口的布局和用戶接口元素的設(shè)計(jì)應(yīng)該反映用戶的心智模型。 在一個(gè)窗口內(nèi)的控件大小應(yīng)該一致─例如，不要將小號(hào)控件和標(biāo)準(zhǔn)控件混用。 避免使用按鈕來顯示彈出菜單或者將按鈕用作標(biāo)簽。 最容易犯的錯(cuò)誤 窗口確保在 640x526和1280 x720模式下分別測(cè)試標(biāo)清和高清的頁(yè)面。以后顯示的時(shí)候，如果更為方便，應(yīng)考慮將其顯示在最后一次出現(xiàn)的位置（相對(duì)于父窗口）。控件尺寸。列寬。窗口布局應(yīng)當(dāng)讓人感到大致平衡。有禮貌、給予支持與鼓勵(lì)。通常，完全保留說明文本和交互性控件中的文字，刪去其他地方的重復(fù)內(nèi)容。使用主標(biāo)題說明來簡(jiǎn)要地解釋一個(gè)頁(yè)面或?qū)υ捒蛴脕碜鍪裁础?在句子之間使用一個(gè)空格。 對(duì)于所有控件，應(yīng)當(dāng)將最可靠的（避免丟失數(shù)據(jù)或無法訪問系統(tǒng)）、最安全的值作為單選框。 重新考慮禁用控件。用戶更愿意閱讀命令按鈕標(biāo)簽，而不是靜態(tài)文本。 當(dāng)提問時(shí)，使用與問題相對(duì)應(yīng)的標(biāo)簽文字。從邏輯上來說，沒必要問只有一種答案的問題。使用命令鏈接來取消會(huì)使用戶必須仔細(xì)閱讀所有的命令鏈接并確定哪個(gè)表示取消。以它與第一個(gè)選擇有什么不同的角度來描述這個(gè)命令鏈接，而不僅僅是“取消”或類似的變體。 漸進(jìn)展開將“更多/更少”漸進(jìn)展開按鈕用于隱藏高級(jí)的或很少使用的選項(xiàng)、命令及用戶通常不需要的細(xì)節(jié)內(nèi)容。用于選項(xiàng)或是選項(xiàng)、命令與細(xì)節(jié)內(nèi)容的混合。僅用于信息。用于選項(xiàng)或是選項(xiàng)、命令與細(xì)節(jié)內(nèi)容的混合。僅用于信息。不確定模式的進(jìn)度條雖然表示正在進(jìn)行中，但無法提供任何其他信息。你可能需要在給出準(zhǔn)確估計(jì)值之前先進(jìn)行一些操作。相反，該操作中的各個(gè)步驟應(yīng)當(dāng)分別只占整個(gè)進(jìn)程的一部分，整個(gè)進(jìn)度條只完成一次。 提示當(dāng)屏幕空間緊張，使用標(biāo)簽或說明文字不合適時(shí)，可以使用提示文本。需要做的有： 以灰色斜體方式顯示提示文本，而以黑色正體方式顯示實(shí)際輸入的文本。 如何設(shè)計(jì)優(yōu)秀的用戶體驗(yàn) 抓住基本功能核心使用情境遠(yuǎn)遠(yuǎn)重要于那些邊邊角角的情境——人們也許會(huì)做也許不會(huì)做的事情。 做出艱難的決定這些功能、命令或選項(xiàng)確實(shí)有必要嗎？如果有，就將其做好。也想想那些你“不會(huì)”說的東西。不要假設(shè)用戶會(huì)把不好的初始體驗(yàn)配置成自己希望的方式，他們不會(huì)這么做。如果你必須在 UI 中提問，那么表達(dá)方式應(yīng)當(dāng)基于用戶的目標(biāo)和任務(wù)，而不是技術(shù)。注意細(xì)節(jié)。大多數(shù)用戶不會(huì)操心那些，而且具有一個(gè)很棒的外觀比有一堆一般化的外觀給人的印象更深。記住用戶對(duì)于速度的感知和實(shí)際速度一樣重要，而且速度的感知主要決定于程序多快能夠響應(yīng)。避免或減少那些沒用的東西！ 避免糟糕的體驗(yàn)說起來容易做起來難，但用戶對(duì)你的產(chǎn)品的總體印象更多是來自于那些不好的體驗(yàn)的質(zhì)量，而非好的體驗(yàn)。確保所有的錯(cuò)誤信息對(duì)問題進(jìn)行了清晰地解釋并給出可行的解決方案。與安全性和法律問題（例如授權(quán)或許可條款）相關(guān)的 UI 可以例外。 l 簡(jiǎn)要比羅嗦要好。 l 有約束比無約束要好。否則，應(yīng)當(dāng)移去不適用的控件或者保持其可用并提供有幫助的反饋信息。 測(cè)試你的用戶界面在你使用真實(shí)的目標(biāo)用戶進(jìn)行可用性研究之前，你不會(huì)知道你做的是否正確。 簡(jiǎn)約而又強(qiáng)大 強(qiáng)大強(qiáng)大意味著具體以下一些特性：A. 可用。 C. 通用。E. 靈活。 G. 高級(jí)。 簡(jiǎn)約簡(jiǎn)約設(shè)計(jì)的技巧：A. 使任務(wù)顯現(xiàn)并可視。三、 界面 高清72064012801200標(biāo)準(zhǔn)尺寸：1280*720安全尺寸：1280(80) 720 (80)=