1、界面組件級交互設(shè)計檢查表請根據(jù)界而交互設(shè)計檢査附表進行設(shè)計檢測，以下表請各項目的檢測人填寫。項目名稱： 項目負責(zé)人：自查人： 規(guī)范檢查人：自査人員意見申辯表:不符合項規(guī)范檢査人 反饋意見項目負責(zé)人 最終反饋意見備注編號申辯理由規(guī)范檢査人抽査意見反饋表:不符合項項目負責(zé)人 最終反饋結(jié)果備注編號抽査結(jié)果界面組件級交互設(shè)計檢查附表使用說明本檢測表主要根據(jù)界面組件級交互設(shè)計規(guī)范編寫，此檢測表將幫助您檢測網(wǎng)站或者軟件系 統(tǒng)中的問題，使用其進行檢測時按照以卜三個步驟進行：1. 諳檢測每一個問題是否適用于您冃前的網(wǎng)站或者軟件系統(tǒng)。如果不適用，詰記錄于附表的不 適合項中，并r跳到下一條。2. 對于所評估的系統(tǒng)

2、，如果符合要求，請繼續(xù)下一條；如果不符合要求，請在附表的不符合要 求項記錄該項編號，并繼續(xù)下i條。3. 將改正后的網(wǎng)站或者軟件系統(tǒng)，繼續(xù)按照上而的步驟進行，總到改完為止。備注：1. 此文檔適用于產(chǎn)品前期的設(shè)計人員；2. 意見反饋：ue 研究家 李穎穎(58022727-674) lyying。界面組件級規(guī)范項目檢查表目錄1. 數(shù)據(jù)表格的展示42. 單元格數(shù)據(jù)43. 信息列表44. 編號和序號55. 注冊表單56. 聯(lián)系方式67. 圖片裁切68. 翻頁69. 口期輸入710. 分隔711. 高級加密812. 進度條813. 圖形化面包屑814. 評鑒與評論915. 保留圖標916. 彈出層917

3、. 搜索1018. 數(shù)據(jù)添加錯誤！未定義書簽。19. 排序101.數(shù)據(jù)表格的展示編號項目內(nèi)容1. 1表格標題要與其它文字有所區(qū)別1. 2表格標題文字內(nèi)容描述方式必須一致13表格行間隔線的粗細要適中1. 4表格的表頭與表格主體在外觀上要有區(qū)分1. 5表格排序狀態(tài)要明確體現(xiàn)1. 6表格行選中操作必須清晰明了1. 7合理的為表格增加數(shù)據(jù)篩選、命令按鈕、操作按鈕、翻頁等區(qū)域并符合相關(guān) 規(guī)定1. 8數(shù)據(jù)篩選區(qū)中，頁簽內(nèi)的文字，需要簡單明了，相同內(nèi)容的文字省略1. 9數(shù)據(jù)篩選區(qū)屮，頁簽總寬度在表格寬度的75%之內(nèi)為住，超出此范圍時，應(yīng) 用其他設(shè)計形式體現(xiàn)；1. 10當(dāng)表格行中嵌套表格時，選中的某組數(shù)據(jù)信息

4、行必須成組高亮顯示給用戶。2.單元格數(shù)據(jù)編號項目內(nèi)容2. 1經(jīng)過或選屮單元格時鼠標反饋必須統(tǒng)一明確2. 2必須支持快捷鍵間斷、連續(xù)選定2. 3整行整列選定時必須有圖標反饋2. 4沒有內(nèi)容顯示時，必須顯示表格的一個空行2. 5整行單元格數(shù)據(jù)被填滿時表格必須自動增加一個空行2. 6增加至3行時必須出現(xiàn)滾動條2. 7必須支持手動輸入和快捷添加操作2. 8輸入地址時自動匹配通訊錄中對應(yīng)的人名2. 9遇到兩個人同名時必須采用“姓名（號碼）”的方式顯示3信息列表編號項目內(nèi)容3. 1項目符號是圖標時，圖標含義要與應(yīng)川場景相符32列表行內(nèi)容如果折行，行距必須小于兩個記錄行z間的段距3. 3信息列表的行間距要適

5、中3. 4根據(jù)情況增加列表標題、單選按鈕、多選按鈕、分隔線、翻頁等，并遵循相應(yīng)規(guī) 范4. 編號和序號編號項目內(nèi)容4. 1編號必需代表一個對彖，具有真實、合理、有效的意義4. 2用戶關(guān)注度高的此類編號需要明確顯示4. 3用戶關(guān)注度低的此類編號默認不顯示，但當(dāng)用戶需要時必須能夠查看到序號4. 4序號必需代表一個對彖在集體中的序列，不提供無意義的序號4. 5當(dāng)用戶非常關(guān)注對象的排列次序時則必須提供序號5. 注冊表單編號項目內(nèi)容5. 1表單的設(shè)計應(yīng)該遵循簡潔的設(shè)計原則52信息輸入的對錯判斷反饋耍明確有效5. 3注釋文木要包含用戶填寫正確格式的提示和要求外,還要包含填寫的必要性等內(nèi) 容5. 4驗證碼中的

6、圖示耍盡可能避免顯示一些不易區(qū)分的字母、數(shù)字5. 5驗證碼的位數(shù)控制在4位5. 6捉供鏈接文字更換驗證碼5. 7輸入驗證碼后，耍及時給出輸入對錯的反饋提示5. 8存在驗證或提交按鈕時，只有所驗證或提交的部分輸入完畢并且止確后，按鈕/ 能山置灰狀態(tài)變?yōu)榭捎脿顟B(tài)5. 9表單填寫完成后，要給出相應(yīng)提示；5. 1()輸入的內(nèi)容錯誤或不完全正確時，提示的反饋信息必須明確，并同時給出正確的 解決方法5. 11根據(jù)產(chǎn)品的特性，要求用戶填寫的注冊表單較長、步數(shù)較多時，需要給出注冊的 進度條提示，明確的告知當(dāng)前注冊的進度512注冊內(nèi)容較長時，耍用分組線，并遵循相應(yīng)規(guī)范5. 13當(dāng)用戶賬號的保密性相對較高時，可以

7、應(yīng)用密碼的強弱提示來保證密碼的復(fù)雜 度；6. 聯(lián)系方式編號項目內(nèi)容6. 1“國家地區(qū)”、“省份”和“城市”要有連動關(guān)系；6. 2“省份”屮己選擇直轄市，則“城市”白動置灰不需要再進行選擇；6. 3城市下拉列表選項的最后一項為“其他地區(qū)”6. 4“聯(lián)系電話”、“傳真號碼”和“手機號碼”必須拆分成幾個字段6. 5“聯(lián)系電話”：四個輸入框字段，分別為：國家代碼一區(qū)號一電話號碼一分機號6. 6“傳真號碼”：三個輸入框字段，分別為：國家代碼一區(qū)號一傳真電話；6. 7“手機號碼”：兩個輸入框字段，分別為：國家代碼一手機號；6. 8相應(yīng)字段填寫后，國家代碼和區(qū)號必須自動顯示69手動輸入郵政編碼時，系統(tǒng)根據(jù)“

8、省份”、“城市”給出一些不同地區(qū)郵政編碼的 關(guān)聯(lián)提示，供用戶參考6. 10提供相應(yīng)的“查詢郵政編碼”鏈接7. 圖片裁切編號項目內(nèi)容固定尺寸71數(shù)據(jù)約束要明確有效7. 2圖片裁切區(qū)的尺寸必須與上傳后的尺寸完全一致7. 3圖片必須填充整個裁切區(qū)，不能全部或部分為空7. 4針對不同的區(qū)域鼠標指針要有明確的形狀切換反饋7. 5上傳的圖片格式或大小不符合要求時，系統(tǒng)必須給出明確有效的提示自定義尺寸7. 6數(shù)據(jù)約束要明確有效7. 7裁切框最大化顯示在預(yù)覽區(qū)內(nèi)；鼠標經(jīng)過裁切框冇明確的指針反饋7. 8裁切框的上下左右均可以隨意拖拽裁切7. 9上傳的圖片格式或大小不符合要求時，系統(tǒng)必須給出明確有效的提示&

9、;翻頁編號項目內(nèi)容8. 1頁碼少于或等于10頁時，只顯示應(yīng)該出現(xiàn)的頁碼數(shù)8. 2當(dāng)前頁的頁碼在外觀上要明顯的區(qū)分于其它頁碼，且不再提供頁面鏈接8. 3已訪問過的頁碼、耒訪問過的頁碼耍有所區(qū)分8. 4顯示當(dāng)前頁碼的前4頁和后4頁；前9頁和最后9頁除外，默認全部顯示8. 5頁碼的可點區(qū)域耍相對較大8. 6根據(jù)情況提供上下頁、首末頁、跳轉(zhuǎn)、數(shù)據(jù)統(tǒng)計等內(nèi)容并遵循相應(yīng)規(guī)范9.日期輸入編號項目內(nèi)容通過日歷選擇日期9. 1日歷屮必須明確標示出當(dāng)前系統(tǒng)日期9. 2日期輸入支持手動輸入和日歷選擇兩種方式9. 3默認顯示“yyyy-mm-dd”的格式94年份月份的選擇耍快捷方便9. 5錯誤捉示要明確有效9. 6需

10、要一個時間段時要冇文本提示“從至”9. 7選定一個吋間段時，起始吋間選擇完成后，截至?xí)r間日歷框要自動打開年份跨度較大的日期輸入9. 8日期輸入支持手動輸入和選擇輸入兩種方式9. 9年、月、fi各口選擇或輸入9. 10當(dāng)而年份、月份、fi期均髙亮顯示9. 11相應(yīng)輸入年份、刀份、口期時輸入框均高亮反饋10 分隔編號項目內(nèi)容10. 1視覺上不能過于解目，不能干擾用戶的視覺重心10. 2每2()條記錄出現(xiàn)一條分隔線10. 3分隔線屮間標注該分隔線分隔截至的條目數(shù)或其他指不10. 4條目數(shù)指示同樣不易過于醒目10. 5分隔線的分隔效果必須有合適的留口10. 6分割線的寬度不能貫穿整個列表區(qū)域，兩邊必須

11、留一些余地10. 7適時捉供上/f條目跳轉(zhuǎn)、返回頂部等，并遵循相應(yīng)規(guī)范11.高級加密編號項目內(nèi)容11. 1在密碼輸入框附近，必須有一個可以指示打開和關(guān)閉高級加密輸入軟鍵盤的圖示 或按鈕：圖示在打開和收起兩種外觀上切換；11. 2軟鍵盤各按鍵及按鍵與按鍵之間的邊界必須非常清晰11. 3如果有人小寫指不或者shift切換，-泄要明確地表明當(dāng)前的狀態(tài)11. 4鼠標在軟鍵盤上移動、點擊和釋放某個鍵時，必須提供清晰的視覺反饋ii. 5鍵盤順序的變化必須要有規(guī)律11. 6軟鍵盤輸入方式與鍵盤輸入方式隨時可以切換11. 7用軟鍵盤輸入時，文本區(qū)無光標指示；用鍵盤方式輸入時，文本區(qū)內(nèi)才對有光標 指示11. 8

12、切換按鈕要明確，在位置上要與軟鍵盤區(qū)域離開一點距離11. 9町變區(qū)域的數(shù)字應(yīng)該與允許川戶輸入的數(shù)字范圍相匹配11. 10用戶點擊切換按鈕或圖標只提供有限的區(qū)域讓用戶選擇變換順序11. 11可變換的區(qū)域在視覺上必須有明確的標識12.進度條編號項目內(nèi)容12. 1根據(jù)需要顯示完成進度的百分比數(shù)值12. 2用戶可以對操作進行終止時，提供“取消”按鈕，按鈕必須高亮顯示12. 3針對不同的內(nèi)容添加相應(yīng)提示文字12. 4進度條說明文字后必須添加“”表示進行屮13.圖形化面包屑編號項目內(nèi)容13. 1路徑關(guān)系要正確，路徑文本必須與上下文相一致13. 2路徑文本與分隔符保持一定的間距（具體參見界面視覺規(guī)范）13.

13、 3在層級之間必須使用一個含義簡單明確的分隔符13. 4分隔符必須使用“ ”表示，即體現(xiàn)路徑間的層級關(guān)系乂表示可以點擊展開下 拉菜單；13. 5點擊分隔符展開下拉菜單，里面包含了當(dāng)前文件夾下的所有文件夾和文件；其中 當(dāng)前路徑文本區(qū)別與其他同級路徑文本13. 6面包屑的最末級，不再提供分隔符13. 7每個層次都是可點選的：當(dāng)點擊它時，就會替換當(dāng)前打開的文件或文件夾14.評鑒與評論15 保圖標編號項目內(nèi)容14. 1星級圖標前必須給出相應(yīng)文木提示14. 2初始打分區(qū)靜態(tài)顯示五顆空白星星圖標14. 3鼠標經(jīng)過和選屮星星時，星星圖標外觀要及時變化14. 4鼠標指針移開該評論層區(qū)域，評論層消失14. 5頁

14、而上出現(xiàn)文本框“謝謝您參與評論！ ”，片刻后消失編號項目內(nèi)容15. 1保留圖示的應(yīng)用范圍只能確定在以上兒方面，要避免在其它設(shè)計中使用15. 2國際通用的圖標必須保持原有意義16 彈出層編號項目內(nèi)容非獨占焦點層16. 1彈出層可以用鼠標隨意拖拽它在屏幕中的顯示位置16. 2主界面的操作不受彈出層的影響?yīng)氄冀裹c層16. 3彈出層耍居中顯示16. 4主頁而處于不可用狀態(tài)吋，不能進行任何操作16. 5彈出層不可以用鼠標拖拽，無法變換位置；16. 6必須對彈出層進行處理操作后，主界面才可以恢復(fù)繼續(xù)進行其它操作；局部獨占焦點層16. 7彈出層要顯示在局部范圍之內(nèi)，且居中（局部之內(nèi)）顯示16. 8彈出層不可

15、以用鼠標拖拽，無法變換位置16. 9點擊彈出層后主界面局部處于不町用狀態(tài)，不能進行任何操作，必須對彈出層進 行處理操作后，局部頁面才可以繼續(xù)進行操作17.搜索編號項目內(nèi)容模糊搜索17. 1搜索輸入框屮給出默認的提示文木弱化顯示17. 2提示文本的內(nèi)容必須簡潔并能夠指導(dǎo)用戶査詢17. 3當(dāng)鼠標在輸入框內(nèi)定位（單擊）時，提示文木自動清除，等待輸入17. 4當(dāng)鼠標移到輸入框外單擊時，默認的提示文本重新顯示17. 5根據(jù)輸入的關(guān)鍵詞搜索出相關(guān)內(nèi)容，要求對搜索結(jié)果有相應(yīng)文本統(tǒng)計或描述17. 6模糊搜索可以配合另外的梢確搜索條件一起使用；17. 7下拉框屮默認顯示“全部xx”選項，提示用戶可以進行選擇精確

16、搜索17. 8搜索條件要合理，容易理解17. 9各控件的排列順序，主要依照該條件的關(guān)鍵程度以及用戶對該條件的熟知程度， 其次依照控件的視覺布局效果；17. 10精確搜索根據(jù)搜索條件，提供輸入框、選擇下拉框或單選控件；17. 11在輸入框中默認顯示文本“不限”；17. 12當(dāng)用戶鼠標在輸入框內(nèi)定位（單擊）時，提示文本自動清除，等待輸入17. 13當(dāng)用戶鼠標移到輸入框外單擊時，默認的提示文木重新顯示17. 14在選擇下拉列表框中裁認顯示選項文字“不限”17. 15單選組中第一項默認選小17. 16對搜索結(jié)果有相應(yīng)文字統(tǒng)計或描述17. 17多類別搜索時，使用頁簽表示不同的類別。頁簽的順序遵循該條件的

17、關(guān)鍵程度以 及用戶對該條件的熟知程度，其次依照控件的視覺布局效果17. 18當(dāng)前選中的類別必須足夠明顯，并能清晰的表明頁簽與各搜索項是一體的關(guān)系17. 19不同頁簽里的搜索項，要m當(dāng)前頁簽相符。17. 20可提升為標簽的項目包含的選項不應(yīng)該超過3項（三項以上考慮應(yīng)用其它的控件 表現(xiàn),比如卜拉選框）；搜索結(jié)果17. 21對搜索結(jié)果要有相應(yīng)的數(shù)據(jù)統(tǒng)計或內(nèi)容描述17. 22根據(jù)輸入的關(guān)鍵詞搜索出相關(guān)內(nèi)容17. 23當(dāng)沒有搜索到符合條件的相關(guān)結(jié)果時，要給出相應(yīng)的反饋17. 24當(dāng)冇符合條件的相關(guān)數(shù)據(jù)時，要給出數(shù)據(jù)統(tǒng)計18.數(shù)據(jù)添加編號項目內(nèi)容添加單個文件18. 1選定圖標或按鈕釋義要清楚18. 2對于

18、表格的操作請遵循表格的相關(guān)規(guī)范18. 3彈出層只有點擊關(guān)閉按鈕才能被關(guān)閉18. 4當(dāng)選擇的文件人小超過約束范圍，系統(tǒng)給出提示添加多個文件18. 5對于表格的操作請遵循表格的相關(guān)規(guī)范18. 6彈出層只有點擊關(guān)閉按鈕才能被關(guān)閉18. 7添加按鈕要求包含文本標簽和代表方向的箭頭18. 8已經(jīng)添加過的數(shù)據(jù)和信息要給出明確的提示，避免用八重復(fù)多次添加；當(dāng)添加的 內(nèi)容垂復(fù)時，要給出提示18. 9當(dāng)讀取冋的文件路徑過長吋，要使用”；但耍保持路徑的前后半段清晰顯示， 中間部分用“”代替18. 10文件名必須要完整顯示18. 11所選擇的文件數(shù)量超過約束范圍，系統(tǒng)必須給出提示添加行18. 12每個數(shù)據(jù)項的約束，

19、要根據(jù)輸入的數(shù)據(jù)進行判斷和提不，一般不顯喬在頁面中18. 13默認顯示一條數(shù)據(jù)添加行18. 14正確添加內(nèi)容后，點“確定”數(shù)據(jù)被保存；18. 15點擊“編輯”，該數(shù)據(jù)行切換為編輯狀態(tài)：如果數(shù)據(jù)添加行中存在沒有保存的信 息時，系統(tǒng)必須給出提示，如“當(dāng)前添加的信息是否要保存”，選“是”則保存 數(shù)據(jù)再繼續(xù)對所選數(shù)據(jù)行進行編輯修改操作；選“否”則不保存數(shù)據(jù)再繼續(xù)對所 選數(shù)據(jù)行進行編輯修改操作；18. 16無論添加還是編輯，始終保持對一條數(shù)據(jù)進行操作，其他情況下都要給出相應(yīng) 變更提示，女口：“當(dāng)前的添加的信息是否要保存”。19.排序20.系統(tǒng)公告信編號項目內(nèi)容編號項目內(nèi)容編號項目內(nèi)容19. 1沒有選中操作對象時，默認時排序圖標不可用19. 2鼠標選中操作對彖時，必須出現(xiàn)提示“鼠標拖動排序”19. 3鼠標經(jīng)過數(shù)據(jù)行時，鼠標變?yōu)榭梢苿拥氖旨^形狀19. 4拖動分類進行排序時必須有一條基準線19. 5支持連續(xù)點擊右側(cè)的排序箭頭圖標進行排序操作19. 6對于頭尾兩個分類不存在置頂、置底操作時，相應(yīng)圖標必須顯示為不可用狀態(tài)19.