WEB管理系統(tǒng)交互設(shè)計(jì)規(guī)范

這一段時(shí)間以來(lái)做web端的產(chǎn)品較多,漸漸地覺(jué)得如果能積累一份規(guī)范的交互設(shè)計(jì)規(guī)范,能有效保證產(chǎn)品操作的一致性和連貫性拒秘,并能降低產(chǎn)品開(kāi)發(fā)中的溝通成本号显,所以趁著周末時(shí)間,在各種社區(qū)搜羅了一些前輩總結(jié)的經(jīng)驗(yàn)并加以自己的總結(jié)躺酒,形成本文押蚤。

本文是對(duì)邊跑邊學(xué)走的一篇《交互設(shè)計(jì)規(guī)范分享》的補(bǔ)充,已獲得原文作者的授權(quán)補(bǔ)充羹应,再此非常感謝原作者對(duì)于我的啟發(fā)揽碘,在此表示敬佩的感謝之情。同時(shí)园匹,本文也融入了個(gè)人項(xiàng)目工作中的復(fù)盤總結(jié)雳刺,總體來(lái)看還不夠完善,希望讀者多多指正和補(bǔ)充裸违。


目錄

1.????? 頁(yè)面信息展示規(guī)范

1.1.? 頁(yè)面命名

1.2.? 頁(yè)面兼容性

1.3.? 圖片文字展示

1.4.? 鏈接

2.????? 數(shù)據(jù)操作交互規(guī)范

2.1.? 展示數(shù)據(jù)

2.2.? 選中數(shù)據(jù)

2.3.? 新增數(shù)據(jù)

2.4.? 刪除數(shù)據(jù)

2.5.? 導(dǎo)入/導(dǎo)出

2.6.? 修改數(shù)據(jù)

2.7.? 提交/上傳數(shù)據(jù)

2.8.? 查詢數(shù)據(jù)

3.????? 數(shù)據(jù)校驗(yàn)規(guī)范

4.????? 通用組件規(guī)范

4.1.? 導(dǎo)航

4.2.? 表單

4.3.? 按鈕

4.4.? 分頁(yè)

4.5.? 加載

4.6.? 鼠標(biāo)

4.7.? 鍵盤

5.????? 提示信息規(guī)范

5.1.? 服務(wù)器錯(cuò)誤提示

5.2.? 預(yù)先信息提示

5.3.? 操作信息提示

5.4.? 結(jié)果信息提示

6.? ? ?系統(tǒng)通用功能性規(guī)范


以下為正文


1.? 頁(yè)面信息展示規(guī)范

1.1? 頁(yè)面命名

每個(gè)頁(yè)面都要有與之模塊對(duì)應(yīng)的名稱掖桦,且不易混淆。

1.2? 頁(yè)面兼容性

(1)自適應(yīng)1366*768px及以上的分辨率累颂。默認(rèn)窗口設(shè)置下滞详,不應(yīng)出現(xiàn)水平滾動(dòng)條,避免出現(xiàn)垂直滾動(dòng)條(當(dāng)內(nèi)容過(guò)多時(shí)允許滾動(dòng)條)

(2)要保證768高度的分辨率顯示正常紊馏,同時(shí)能移動(dòng)查看彈出框內(nèi)容料饥。彈出框高度為不超過(guò)450px,且顯示在內(nèi)容頁(yè)面相對(duì)水平朱监、垂直相對(duì)居中位置岸啡。

(3)兼容Chrome、Firefox赫编、Safari巡蘸、IE8及以上主流瀏覽器。

1.3? 圖片文字展示

(1)文字

文字用系統(tǒng)自帶的常規(guī)字體擂送,且分一級(jí)標(biāo)題悦荒、二級(jí)標(biāo)題、主內(nèi)容文字嘹吨、次內(nèi)容文字搬味、輔助文字(說(shuō)明或引導(dǎo)性文字,提醒性文字)蟀拷,分別用不同的字號(hào)碰纬、顏色。具體字號(hào)大小和顏色參考UI設(shè)計(jì)效果圖问芬。

(2)內(nèi)容圖片

內(nèi)容圖片均帶1px描邊(帶描邊主要是為了區(qū)分圖片邊界)悦析;內(nèi)容圖片未加載出來(lái)時(shí)顯示系統(tǒng)默認(rèn)圖片。

1.4? 鏈接

(1)鏈接文字或圖片當(dāng)鼠標(biāo)劃過(guò)時(shí)會(huì)變成點(diǎn)擊手形此衅。

(2)本窗口打開(kāi):查詢結(jié)果强戴、上下翻頁(yè)亭螟、新增、修改等操作在本窗口或彈窗打開(kāi)酌泰。

(3)新窗口打開(kāi):各類詳情媒佣、預(yù)覽頁(yè)面等采用新窗口打開(kāi)。

2.? 數(shù)據(jù)操作交互規(guī)范

2.1? 展示數(shù)據(jù)

(1)表頭:字體加粗陵刹、且比單元格內(nèi)容字體大一號(hào)默伍,且字體大小參照UI效果圖;

(2)單元格:文字圖片內(nèi)容左對(duì)齊衰琐,數(shù)字也糊、金額內(nèi)容右對(duì)齊;

(3)操作內(nèi)容原則上用圖標(biāo)表達(dá)羡宙,如“ ”“”狸剃;

(4)鼠標(biāo)在頁(yè)面列表移動(dòng),所落腳的行應(yīng)高亮顯示狗热;

(5)原則上每頁(yè)顯示15-20條數(shù)據(jù)钞馁,實(shí)際顯示條數(shù)據(jù)可按設(shè)計(jì)排列效果而定;

(6)表格中不定長(zhǎng)的字段匿刮,固定顯示寬度僧凰,超出內(nèi)容用“…”顯示光標(biāo)停留后,在浮動(dòng)層顯示詳細(xì)內(nèi)容熟丸;

(7)某一條數(shù)據(jù)禁止點(diǎn)擊某按鈕操作训措,這個(gè)時(shí)候有3種解決辦法:1隱藏按鈕;2按鈕置灰光羞,鼠標(biāo)移入顯示為禁止樣式绩鸣;3按鈕不變,點(diǎn)擊之后彈出提示纱兑。本系統(tǒng)規(guī)定選擇第1種方式呀闻;

(8)數(shù)據(jù)加密展示規(guī)則:對(duì)于公司、公司聯(lián)系人的基本信息潜慎,一般不加密总珠,僅對(duì)于c端個(gè)人的身份證、手機(jī)號(hào)等敏感信息加密處理勘纯,數(shù)據(jù)中間用****展示。

2.2? 選中數(shù)據(jù)

(1)勾選全選則選中當(dāng)頁(yè)所有記錄钓瞭;

(2)去掉當(dāng)頁(yè)某個(gè)記錄的勾選驳遵,則全選也去掉勾選;

(3)翻頁(yè)后是否進(jìn)行選擇記錄的保留應(yīng)試具體業(yè)務(wù)而定山涡;

(4)刷新頁(yè)面后堤结,自動(dòng)去掉已勾選的記錄及全選的勾選唆迁;

(5)如列表有復(fù)選框,則點(diǎn)擊除某一行的按鈕之外其他區(qū)域竞穷,應(yīng)支持選中唐责,而不必點(diǎn)擊復(fù)選框才選中。

2.3? 新增數(shù)據(jù)

(1)下拉框:默認(rèn)為“請(qǐng)選擇”

? 如果為下拉聯(lián)動(dòng)瘾带,用同一顏色標(biāo)識(shí)本組下拉聯(lián)動(dòng)鼠哥,下拉框內(nèi)容變動(dòng)時(shí),下級(jí)內(nèi)容跟隨變動(dòng)看政,下級(jí)的所有下級(jí)默認(rèn)為請(qǐng)選擇朴恳,以此類推;

(2)輸入框默認(rèn)為空允蚣,按照業(yè)務(wù)需要可提示輸入內(nèi)容于颖;

(3)復(fù)選框、復(fù)選框默認(rèn)為不選中嚷兔;

(4)新增時(shí)按照業(yè)務(wù)需要記錄操作人員和時(shí)間森渐;

(5)新增的記錄必須排在新增頁(yè)的首行;

(6)除特殊標(biāo)記或規(guī)定冒晰,所有列表頁(yè)面默認(rèn)按數(shù)據(jù)新增時(shí)間倒序排列同衣。

(7)點(diǎn)擊返回或者取消,直接回到查詢列表界面翩剪。

2.4? 刪除數(shù)據(jù)

(1)本系統(tǒng)無(wú)物理刪除乳怎,所有刪除均為邏輯刪除;

(2)必須有確認(rèn)刪除的提示信息前弯。如果確定刪除蚪缀,則進(jìn)行刪除,否則恕出,取消操作询枚;

(3)刪除成功后需要更新查詢結(jié)果列表中對(duì)應(yīng)的狀態(tài)。

(4)刪除成功后返回到原記錄所在頁(yè)面浙巫,而當(dāng)原記錄所在頁(yè)不存在時(shí)金蜀,則返回上一頁(yè)。

(5)當(dāng)被刪除的記錄與其他記錄存在關(guān)聯(lián)時(shí)的畴,請(qǐng)示需求界面給予不允許刪除渊抄、更明細(xì)提示等信息。

(6)點(diǎn)擊返回或者取消丧裁,直接回到查詢列表界面护桦。

2.5? 導(dǎo)入/導(dǎo)出

(1)導(dǎo)入需要提供導(dǎo)入模板,模板上的字段需要與新增頁(yè)面字段保持一致煎娇;

(2)導(dǎo)入的數(shù)據(jù)校驗(yàn)規(guī)則要與新增頁(yè)面的校驗(yàn)規(guī)則保持一致二庵;

(3)導(dǎo)出的數(shù)據(jù)范圍可分為2種:1.按照搜索條件查詢出來(lái)的全部數(shù)據(jù)項(xiàng)贪染;2.選中的數(shù)據(jù)項(xiàng);催享。根據(jù)業(yè)務(wù)需要杭隙,本系統(tǒng)選擇第1種,導(dǎo)出的內(nèi)容為搜索條件的全部?jī)?nèi)容因妙,與勾選無(wú)關(guān)痰憎。

(4)點(diǎn)擊返回或者取消,直接回到查詢列表界面兰迫。

2.6? 修改數(shù)據(jù)

(1)修改時(shí)按照業(yè)務(wù)需要記錄操作人員和時(shí)間信殊;

(2)修改完成后必須回到原記錄所在位置,且刷新顯示修改后的值汁果。

(3)在查詢條件下修改返回后涡拘,保留原有查詢條件,且修改后的數(shù)據(jù)如果不滿足查詢條件則不顯示据德。

(4)進(jìn)入到修改界面時(shí)鳄乏,所有的輸入項(xiàng)要和新增(也有可能是修改后)的輸入值保持一致;

(5)點(diǎn)擊返回或者取消棘利,直接回到查詢列表界面橱野。

2.7? 提交/上傳數(shù)據(jù)

(1)提交時(shí)需對(duì)主標(biāo)識(shí)字段進(jìn)行重復(fù)值、空值(空格)判斷善玫;

(2)提交成功后不可重復(fù)提交水援,有列表展示提交內(nèi)容的直接返回到展示頁(yè)面;

(3)必須要有“取消或返回”功能茅郎;

(4)取消必須給予提示蜗元,取消操作后須返到原記錄所在狀態(tài);

(5)當(dāng)從一個(gè)頁(yè)面點(diǎn)擊按鈕或鏈接進(jìn)入子頁(yè)面時(shí)系冗,子頁(yè)面必須提供返回按鈕奕扣;

(6)保存成功應(yīng)給出保存成功提示,一般提示格式為“XXX信息保存成功掌敬!”惯豆,點(diǎn)擊提示框中確定或者提示框消失后,需要跳轉(zhuǎn)到數(shù)據(jù)列表界面奔害;

(7)提交失敗后留在當(dāng)前提交頁(yè)楷兽,并且給出明確的提交失敗原因,改正做法华临,點(diǎn)擊確定后留在當(dāng)前界面且保存用戶已經(jīng)輸入的內(nèi)容以便再次提交芯杀;

(8)點(diǎn)擊返回或者取消,直接回到查詢列表界面;

2.8? 查詢數(shù)據(jù)

查詢條件區(qū)域

(1)每個(gè)查詢條件必須有預(yù)置文案瘪匿;

(2)點(diǎn)擊查詢按鈕后,顯示查詢結(jié)果列表寻馏;

(3)要有“重置”功能棋弥,重置后恢復(fù)到初始狀態(tài);

(4)除了用戶明確要求不需要外诚欠,需提供模糊查詢功能顽染;

(5)輸入框:如果內(nèi)容為中文,一般為模糊查詢轰绵,如果為數(shù)字粉寞、編碼、手機(jī)號(hào)或者用戶名左腔,則為精確查詢唧垦;

(6)下拉框:常規(guī)排序如是-否,上架-下架液样,有效-無(wú)效等振亮,非常規(guī)按照數(shù)據(jù)庫(kù)中順序;

(7)日期控件:一般為起止兩個(gè)控件鞭莽,精確到年月日坊秸,默認(rèn)起止日期為當(dāng)前日期往前一個(gè)月或7天;sql語(yǔ)句中查詢條件為閉區(qū)間(>=或者<=)澎怒;

查詢結(jié)果區(qū)域

(1)查詢后保留當(dāng)前輸入的查詢條件褒搔;

(2)當(dāng)未查詢到任何記錄時(shí),需給予未查找到相關(guān)記錄的提示信息喷面;

(3)排序:按日期倒序排序星瘾,查詢結(jié)果中的時(shí)間一般精確到年月日時(shí)分秒;

3.? 數(shù)據(jù)校驗(yàn)規(guī)范

(1)非空校驗(yàn):提示內(nèi)容—“XX不能為空乖酬,請(qǐng)輸入死相!”;

(2)超長(zhǎng)限制:提示內(nèi)容—“XX最大不能超過(guò)XX個(gè)字咬像,請(qǐng)檢查算撮!”;

(3)“*”標(biāo)識(shí):*標(biāo)識(shí)字段為必填項(xiàng)县昂,需要進(jìn)行非空校驗(yàn)肮柜;

(4)下拉框:一般為必選項(xiàng),默認(rèn)為“請(qǐng)選擇”倒彰;

(5)備注項(xiàng):一般為選填項(xiàng)审洞,字段長(zhǎng)度一般不超過(guò)400個(gè)字;

(6)用戶輸入完成時(shí)校驗(yàn):需對(duì)主要標(biāo)識(shí)字段進(jìn)行重復(fù)值、空值(空格)判斷

(7)輸入項(xiàng)內(nèi)容應(yīng)該滿足一般性校驗(yàn)要求芒澜,如手機(jī)號(hào)規(guī)則(以1開(kāi)頭仰剿,11位數(shù)字),身份證號(hào)規(guī)則(15或者18位數(shù)字痴晦,末尾可以為X)南吮,郵箱規(guī)則(XX@XX),價(jià)格(允許兩位小數(shù))誊酌,數(shù)量(0或者正整數(shù))部凑,日期(一般精確到年月日,有時(shí)需要精確到時(shí)分秒碧浊,具體功能具體說(shuō)明)涂邀,名稱規(guī)則(中文為2-8位,不允許有空格箱锐;英文2-24位比勉,允許有空格)輸入長(zhǎng)度限制等;

(8)輸入項(xiàng)默認(rèn)為空瑞躺;

(9)數(shù)據(jù)回顯:如無(wú)特殊說(shuō)明敷搪,在執(zhí)行修改類或刪除類操作后均需要執(zhí)行數(shù)據(jù)回顯;

4.? 通用組件規(guī)范

4.1? 導(dǎo)航

菜單導(dǎo)航欄

(1)導(dǎo)航路徑:原則上不超過(guò)三級(jí)就能到達(dá)用戶想要的主要頁(yè)面幢哨,且隨時(shí)能返回赡勘。

(2)導(dǎo)航菜單:各級(jí)別的菜單寬高一致,樣式一致捞镰。鼠標(biāo)劃過(guò)或點(diǎn)擊選中菜單模塊時(shí)會(huì)有突出(比如高亮)狀態(tài)顯示闸与。

(3)有子菜單的模塊默認(rèn)不顯示子菜單,點(diǎn)擊后顯示子菜單岸售,再次點(diǎn)擊時(shí)可收起践樱。

當(dāng)前位置導(dǎo)航

(1)原則上每個(gè)頁(yè)均有“當(dāng)前位置導(dǎo)航”,但彈出頁(yè)凸丸、預(yù)覽頁(yè)等特殊頁(yè)面無(wú)需當(dāng)前導(dǎo)航拷邢;

(2)若當(dāng)前位置導(dǎo)航有多個(gè)層級(jí),則當(dāng)前層級(jí)的前面層級(jí)均可鏈接到相應(yīng)頁(yè)面屎慢;

(3)當(dāng)前位置導(dǎo)航位置固定瞭稼,具體位置參考UI設(shè)計(jì)效果圖。

頁(yè)簽

頁(yè)簽即工作臺(tái)菜單欄腻惠,出現(xiàn)的名稱除首頁(yè)外环肘,其他都應(yīng)是菜單名稱;

頁(yè)簽與當(dāng)前位置導(dǎo)航保留一個(gè)即可集灌,當(dāng)前頁(yè)面所在頁(yè)簽應(yīng)高亮標(biāo)記悔雹,支持刷新;

從菜單進(jìn)入后,某頁(yè)面下的子頁(yè)面腌零,都應(yīng)該在本菜單下梯找,不應(yīng)該再跳轉(zhuǎn)打開(kāi)一個(gè)新的頁(yè)面;

子頁(yè)面回到主頁(yè)面時(shí)益涧,一般是點(diǎn)擊子頁(yè)面的返回按鈕初肉,回到主頁(yè)面;

切換頁(yè)簽不刷新新進(jìn)的頁(yè)面饰躲,若前臺(tái)操作時(shí)校驗(yàn)到后臺(tái)數(shù)據(jù)已發(fā)生變動(dòng),提示“當(dāng)前數(shù)據(jù)已發(fā)生變化”臼隔,并刷新頁(yè)面嘹裂;

點(diǎn)擊瀏覽器的刷新按鈕,刷新當(dāng)前頁(yè)簽所在的頁(yè)面摔握。

4.2? 表單

(1)表單輸入框由表單字段名稱: + 輸入框組成寄狼,字段名稱原則上2-4個(gè)漢字。

(2)預(yù)置文案:輸入框內(nèi)均需有預(yù)置文案氨淌,且光標(biāo)進(jìn)入輸入框獲得焦點(diǎn)時(shí)文案自動(dòng)消失泊愧,若輸入框失去焦點(diǎn)且未輸入任何文字時(shí)恢復(fù)預(yù)置文案。

(3)下拉選擇框中內(nèi)容有多級(jí)時(shí)盛正,只顯示一級(jí)删咱,其他級(jí)呈灰色不可用狀態(tài),選擇一級(jí)后才會(huì)激活第二級(jí)豪筝,以此類推痰滋。如:部門作為查詢條件時(shí),點(diǎn)擊下拉框续崖,默認(rèn)只有一級(jí)部門可用敲街,點(diǎn)擊一級(jí)部門再激活開(kāi)顯示二級(jí)部門。

(4)界面的必填項(xiàng)以紅色*號(hào)標(biāo)識(shí)出來(lái)严望,且標(biāo)識(shí)在“表單字段名稱”前面多艇。存在必填項(xiàng)未填寫(xiě)時(shí),輸入框失去焦點(diǎn)即時(shí)提示像吻,輸入框紅色描邊峻黍,且輸入框下方左有相應(yīng)紅色提示文案。輸入框未曾獲得過(guò)焦點(diǎn)直接提交時(shí)萧豆,同樣輸入框紅色描邊+紅色提示文案提醒奸披。

(5)單行輸入框:在未限制字?jǐn)?shù)情況下,當(dāng)輸入文字比前輸入框長(zhǎng)時(shí)涮雷,最先輸入的文字隱藏阵面,光標(biāo)和最后一個(gè)輸入的文字顯示在輸入框尾部。

(6)多行輸入框:需要有“當(dāng)前已輸入字?jǐn)?shù)/最多可輸入字?jǐn)?shù)”(如:50/100)。

(7)與限制條件不符的非法輸入應(yīng)即時(shí)提醒样刷;

(8)只允許輸入日期仑扑、時(shí)間的輸入框需要通過(guò)格式化方式約束輸入,而不是輸入非法值后給出提示置鼻;

4.3? 按鈕

(1)按鈕種類:優(yōu)先操作按鈕镇饮,次要按鈕,不可用按鈕箕母。

(2)按鈕狀態(tài):默認(rèn)顯示狀態(tài)储藐,鼠標(biāo)經(jīng)過(guò)狀態(tài),點(diǎn)擊狀態(tài)嘶是。

(3)按鈕位置:按windows交互習(xí)慣先優(yōu)先后次要(左確定钙勃,右取消)。

(4)按鈕樣式:可直接寫(xiě)文字聂喇,或文字+圖標(biāo)(具體方案參照UI設(shè)計(jì)效果圖)辖源,原則上按鈕上文字為2-4個(gè)漢字。

4.4? 分頁(yè)

(1)分頁(yè)控件:置于數(shù)據(jù)列表下方希太,無(wú)結(jié)果時(shí)不顯示克饶;在某一查詢條件下翻頁(yè),改變單頁(yè)展示數(shù)據(jù)條數(shù)誊辉,應(yīng)不改變查詢條件矾湃。

(2)當(dāng)對(duì)查詢結(jié)果進(jìn)行分頁(yè)時(shí),分頁(yè)的同時(shí)需要能夠執(zhí)行查詢功能堕澄;

(3)當(dāng)頁(yè)數(shù)較多時(shí)洲尊,允許輸入具體頁(yè)數(shù)進(jìn)行查詢;

4.5? 加載

當(dāng)數(shù)據(jù)獲取較慢奈偏,或網(wǎng)絡(luò)狀況不佳時(shí)坞嘀,要有統(tǒng)一的加載方案圖示告訴用戶“數(shù)據(jù)正在加載中……”如:漏斗、菊花惊来、進(jìn)度條等丽涩,具體圖文可參考UI設(shè)計(jì)效果。

4.6? 鼠標(biāo)

默認(rèn)狀態(tài)鼠標(biāo)為“箭頭形狀”裁蚁,經(jīng)過(guò)可點(diǎn)擊元素時(shí)變?yōu)椤笆种笭睢笔冈ǎ诳奢斎肟蛑袨椤柏Q線光標(biāo)狀”

4.7? 鍵盤

(1)支持回車鍵提交

(2)支持回車鍵查詢

(3)支持tab鍵移動(dòng)光標(biāo)焦點(diǎn),移動(dòng)遵循從左至右枉证,從上至下的原則

5.? 提示信息規(guī)范

5.1? 服務(wù)器錯(cuò)誤提示

(1)403:您沒(méi)有訪問(wèn)權(quán)限哦矮男;

(2)404:您訪問(wèn)的頁(yè)面不存在或暫時(shí)無(wú)法訪問(wèn);

(3)500:Sorry室谚,內(nèi)部服務(wù)器錯(cuò)誤毡鉴;

(4)如果為界面跳轉(zhuǎn)崔泵,出現(xiàn)錯(cuò)誤時(shí),請(qǐng)?zhí)D(zhuǎn)到錯(cuò)誤界面猪瞬;

5.2? 預(yù)先信息提示

(1)內(nèi)容提交類:每個(gè)輸入項(xiàng)憎瘸、條件選選項(xiàng)(包括時(shí)間選擇)均需要給出提示信息。該提示信息可放置在輸入框內(nèi)或者控件尾部(如密碼要多少位陈瘦,搜索框提示用戶輸入什么內(nèi)容等)

(2)謹(jǐn)慎類操作:針對(duì)不可修改幌甘、重要操作選擇等操作屬于謹(jǐn)慎類操作,均需給出提示信息痊项。如審核是否通過(guò)操作锅风、退款申請(qǐng)操作、價(jià)格輸入等鞍泉。

5.3? 操作信息提示

(1)確認(rèn)提示:修改設(shè)置遏弱、刪除數(shù)據(jù)等操作時(shí)需要彈出提示框,用戶需要選擇后方可執(zhí)行塞弊;

(2)錯(cuò)誤提示:當(dāng)用戶的操作不符合規(guī)則、輸入數(shù)據(jù)不符合規(guī)則需要給出操作提示泪姨。比如輸入數(shù)值不符系統(tǒng)規(guī)定游沿,則進(jìn)行提示;

(3)錯(cuò)誤提示分為:即時(shí)提示肮砾、提交后提示诀黍。本系統(tǒng)這里統(tǒng)一用即時(shí)提示;

(4)讀取提示:涉及到大量信息讀取緩慢的時(shí)候應(yīng)該進(jìn)行提示仗处。比如進(jìn)入后臺(tái)查看商品列表時(shí)眯勾,由于網(wǎng)絡(luò)、數(shù)據(jù)量大等原導(dǎo)致載入緩慢婆誓,應(yīng)該顯示讀取提示信息吃环,已避免用戶過(guò)度重復(fù)點(diǎn)擊操作。

5.4? 結(jié)果信息提示

(1)當(dāng)頁(yè)面沒(méi)有數(shù)據(jù)洋幻、加載失敗或出錯(cuò)時(shí)郁轻,要有統(tǒng)一的提示文案圖標(biāo)告訴用戶“頁(yè)面加載失敗/暫無(wú)數(shù)據(jù)/頁(yè)面出錯(cuò)”,具體圖文可參考UI設(shè)計(jì)效果文留。

(2)保存結(jié)果提示:當(dāng)進(jìn)行商品添加/修改此類涉及到數(shù)據(jù)保存的操作好唯,不管是否成功均需給出提示。統(tǒng)一用Toast提示燥翅,內(nèi)容為“保存成功骑篙!”原則上保存之后直接顯示結(jié)果頁(yè)(也可視具體情況定)。

(3)查詢結(jié)果提示:任何信息列表森书、查詢結(jié)果靶端,當(dāng)對(duì)應(yīng)信息結(jié)果的時(shí)候需要給出有無(wú)結(jié)果狀態(tài)提示谎势,不得使用空白信息。

6.? 系統(tǒng)通用功能性規(guī)范

(1)所有信息保存時(shí)均需記錄操作人員代碼躲查、操作日期它浅、修改人員代碼和修改日期,日期格式精確到年月日時(shí)分秒镣煮;

(2)對(duì)于外部系統(tǒng)通過(guò)接口修改的信息需要在操作人員代碼或者修改人員代碼字段記錄外部系統(tǒng)的系統(tǒng)id姐霍,記錄操作日期或者修改日期,日期格式精確到年月日時(shí)分秒典唇,且根據(jù)插入數(shù)據(jù)或者修改數(shù)據(jù)的情況進(jìn)行字段的選擇镊折;

(3)對(duì)于業(yè)務(wù)流程中的刪除流程,需要進(jìn)行有痕跡的刪除介衔,即增加刪除標(biāo)志位而不是物理刪除條目恨胚,并且需要記錄刪除人員代碼,刪除日期炎咖,日期格式精確到年月日時(shí)分秒赃泡;

(4)用戶每次登錄系統(tǒng)(內(nèi)網(wǎng))均需要記錄登錄日期、登陸人代碼(操作人員代碼)乘盼、是否登錄成功升熊、退出日期、登錄機(jī)器ip和mac地址绸栅,其中日期格式精確到年月日時(shí)分秒级野;

(5)可設(shè)置用戶登錄無(wú)前后臺(tái)交互時(shí)間,延時(shí)自動(dòng)斷開(kāi)該操作人員登錄鏈接粹胯,默認(rèn)交互時(shí)間間隔為30分鐘蓖柔;

(6)操作人員權(quán)限控制,會(huì)在具體需求描述中予以表述风纠。

以上况鸣。歡迎各位一起探討交互、用戶體驗(yàn)和產(chǎn)品等內(nèi)容竹观,個(gè)人微信:ZYQ616418389

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末懒闷,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子栈幸,更是在濱河造成了極大的恐慌愤估,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,378評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件速址,死亡現(xiàn)場(chǎng)離奇詭異玩焰,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)芍锚,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,356評(píng)論 2 382
  • 文/潘曉璐 我一進(jìn)店門昔园,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)蔓榄,“玉大人,你說(shuō)我怎么就攤上這事默刚∩#” “怎么了?”我有些...
    開(kāi)封第一講書(shū)人閱讀 152,702評(píng)論 0 342
  • 文/不壞的土叔 我叫張陵荤西,是天一觀的道長(zhǎng)澜搅。 經(jīng)常有香客問(wèn)我,道長(zhǎng)邪锌,這世上最難降的妖魔是什么勉躺? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 55,259評(píng)論 1 279
  • 正文 為了忘掉前任,我火速辦了婚禮觅丰,結(jié)果婚禮上饵溅,老公的妹妹穿的比我還像新娘。我一直安慰自己妇萄,他們只是感情好蜕企,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,263評(píng)論 5 371
  • 文/花漫 我一把揭開(kāi)白布。 她就那樣靜靜地躺著冠句,像睡著了一般轻掩。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上轩端,一...
    開(kāi)封第一講書(shū)人閱讀 49,036評(píng)論 1 285
  • 那天,我揣著相機(jī)與錄音逝变,去河邊找鬼基茵。 笑死,一個(gè)胖子當(dāng)著我的面吹牛壳影,可吹牛的內(nèi)容都是我干的拱层。 我是一名探鬼主播,決...
    沈念sama閱讀 38,349評(píng)論 3 400
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼宴咧,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼根灯!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起掺栅,我...
    開(kāi)封第一講書(shū)人閱讀 36,979評(píng)論 0 259
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤烙肺,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后氧卧,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體桃笙,經(jīng)...
    沈念sama閱讀 43,469評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,938評(píng)論 2 323
  • 正文 我和宋清朗相戀三年沙绝,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了搏明。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片鼠锈。...
    茶點(diǎn)故事閱讀 38,059評(píng)論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖星著,靈堂內(nèi)的尸體忽然破棺而出购笆,到底是詐尸還是另有隱情,我是刑警寧澤虚循,帶...
    沈念sama閱讀 33,703評(píng)論 4 323
  • 正文 年R本政府宣布同欠,位于F島的核電站,受9級(jí)特大地震影響邮丰,放射性物質(zhì)發(fā)生泄漏行您。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,257評(píng)論 3 307
  • 文/蒙蒙 一剪廉、第九天 我趴在偏房一處隱蔽的房頂上張望娃循。 院中可真熱鬧,春花似錦斗蒋、人聲如沸捌斧。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,262評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)捞蚂。三九已至,卻和暖如春跷究,著一層夾襖步出監(jiān)牢的瞬間姓迅,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 31,485評(píng)論 1 262
  • 我被黑心中介騙來(lái)泰國(guó)打工俊马, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留丁存,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 45,501評(píng)論 2 354
  • 正文 我出身青樓柴我,卻偏偏與公主長(zhǎng)得像解寝,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子艘儒,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,792評(píng)論 2 345

推薦閱讀更多精彩內(nèi)容

  • Web網(wǎng)站測(cè)試流程和方法(轉(zhuǎn)載) 1測(cè)試流程與方法 1.1測(cè)試流程 進(jìn)行正式測(cè)試之前聋伦,應(yīng)先確定如何開(kāi)展測(cè)試,不可盲...
    夏了夏夏夏天閱讀 1,274評(píng)論 0 0
  • 兼容性 1界睁、自適應(yīng)1280*768px及以上的分辨率 默認(rèn)窗口設(shè)置下觉增,不應(yīng)出現(xiàn)水平滾動(dòng)條,盡量避免出現(xiàn)垂直滾動(dòng)條(...
    reloaded么閱讀 1,996評(píng)論 0 0
  • 前些時(shí)間正準(zhǔn)備寫(xiě)交互規(guī)范,就去網(wǎng)上搜羅了一下交互規(guī)范的一些范本杨赤,想作為借鑒參考敞斋,但卻沒(méi)能找到比較滿意的截汪,找到了一些...
    如月公子閱讀 1,317評(píng)論 0 7
  • 前些時(shí)間正準(zhǔn)備寫(xiě)交互規(guī)范,就去網(wǎng)上搜羅了一下交互規(guī)范的一些范本植捎,想作為借鑒參考衙解,但卻沒(méi)能找到比較滿意的,找到了一些...
    邊跑邊學(xué)走閱讀 16,994評(píng)論 10 140
  • 01 第四道基本原理之一是焰枢,人必須付出代價(jià)蚓峦,才能進(jìn)化。 什么是付出代價(jià)济锄?努力記得自己暑椰,不斷保持覺(jué)知。 沒(méi)有覺(jué)知荐绝,就...
    Rogerchan2018閱讀 301評(píng)論 0 0