資訊專欄INFORMATION COLUMN
摘要：做前端也有一段時(shí)間了，對(duì)于實(shí)現(xiàn)各種需求來說已經(jīng)是游刃有余了，代碼的質(zhì)量和可擴(kuò)展性都能把控。目前最缺乏的就是所謂的用戶體驗(yàn)。這樣體驗(yàn)具有層次感，而且用戶不會(huì)因?yàn)橐淮蠖褩l件輸入框而感到厭煩。避免全部頁面，只用局部。
做前端也有一段時(shí)間了，對(duì)于實(shí)現(xiàn)各種需求來說已經(jīng)是游刃有余了，代碼的質(zhì)量和可擴(kuò)展性都能把控。目前最缺乏的就是所謂的用戶體驗(yàn)。 用戶體驗(yàn)說起來是一個(gè)比較模糊的概念，但是又是實(shí)實(shí)在在地決定著用戶用起來爽不爽。
典型的中后臺(tái)應(yīng)用，大多數(shù)是對(duì)表格的增刪改查，有如下改進(jìn)
頭部添加菜單解釋說明，一個(gè)菜單標(biāo)題只有簡簡單單的幾個(gè)字，用戶一開始用起來可能都不知道該菜單是干說明用的，增加的解釋說明能很好的幫用戶了解該頁面功能
操作按鈕的歸類，之前一般將增加，刪除，修改，導(dǎo)出表格，搜索，搜索條件等都放在一塊，這樣給人一種很雜亂的感覺，現(xiàn)在將這些控件分為兩類（搜索條件和搜索按鈕，增刪導(dǎo)出刷新等操作按鈕）。其中 增刪導(dǎo)出刷新等操作按鈕 放到頭部菜單里，和下面的 搜索條件和搜索按鈕 區(qū)分開來。
對(duì)于復(fù)雜的搜索條件，劃分為基礎(chǔ)查詢條件和全部查詢條件，基礎(chǔ)查詢條件涵蓋用戶常用的幾個(gè)搜索條件，其余高級(jí)搜索條件先隱藏，通過 顯示全部 按鈕顯示全部搜索條件。這樣體驗(yàn)具有層次感，而且用戶不會(huì)因?yàn)橐淮蠖褩l件輸入框而感到厭煩。
對(duì)于表格，如果查詢數(shù)據(jù)為空，則顯示 暫無數(shù)據(jù)； 如果是后臺(tái)報(bào)錯(cuò)，則顯示 網(wǎng)絡(luò)異常，請(qǐng)點(diǎn)擊按鈕刷新，之前都是通過提示框顯示接口報(bào)錯(cuò)等。這樣的好處有兩點(diǎn)，一是如果用戶想嘗試重新獲取數(shù)據(jù)不用再點(diǎn)刷新整個(gè)頁面了，二是提示框會(huì)打斷用戶聚焦的視線，對(duì)于用戶來說是不好的體驗(yàn)。
當(dāng)表格的列數(shù)很多時(shí)，操作一欄要固定住，方便用戶操作。
左側(cè)菜單樹，當(dāng)菜單過多時(shí)，增加搜索框，可以快速定位到該菜單頁面，方便用戶操作。
避免全部頁面loading，只用局部loading。
大數(shù)據(jù)項(xiàng)目的一些用戶體驗(yàn)優(yōu)化的點(diǎn)
指標(biāo)卡片 加問號(hào)圖標(biāo)，用tooltip顯示指標(biāo)的含義；包括頁面上一些文案，如果含義難懂的都可以加tooltip
可點(diǎn)擊的元素鼠標(biāo)變成手型
前端緩存優(yōu)化（用戶點(diǎn)擊過的圖標(biāo)數(shù)據(jù)緩存起來）
表單要盡可能簡單，負(fù)責(zé)的表單會(huì)讓用戶失去耐心
下拉框如果選項(xiàng)比較少，可以直接用radio來代替，用戶可以省一步點(diǎn)擊下拉框的操作
查詢圖表的時(shí)候需要填時(shí)間區(qū)間，可以放一些常見的時(shí)間區(qū)間給用戶選擇，比如今天/昨天/上周/上月/前三月, 避免用戶去手動(dòng)選擇兩個(gè)時(shí)間框
to be continued!
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/106668.html
摘要：做前端也有一段時(shí)間了，對(duì)于實(shí)現(xiàn)各種需求來說已經(jīng)是游刃有余了，代碼的質(zhì)量和可擴(kuò)展性都能把控。目前最缺乏的就是所謂的用戶體驗(yàn)。這樣體驗(yàn)具有層次感，而且用戶不會(huì)因?yàn)橐淮蠖褩l件輸入框而感到厭煩。避免全部頁面，只用局部。 做前端也有一段時(shí)間了，對(duì)于實(shí)現(xiàn)各種需求來說已經(jīng)是游刃有余了，代碼的質(zhì)量和可擴(kuò)展性都能把控。目前最缺乏的就是所謂的用戶體驗(yàn)。 用戶體驗(yàn)說起來是一個(gè)比較模糊的概念，但是又是實(shí)實(shí)在在...
2013年，你是甲方，我是乙方，我為你云適配。 2014年，我的地盤你做主，云適配攻城獅們的工作陣地將全權(quán)授權(quán)給你，你可以自由的 DIY 您的網(wǎng)站，No more time，No Money，只要1天，只要1個(gè)人，只要2步，云適配開放平臺(tái)一站搞定，您的跨屏網(wǎng)站即刻誕生了！?。?BUT，BUT，BUT，在你開始完全做主前，我們想邀請(qǐng)您來參與云適配開放平臺(tái)的內(nèi)測(cè)，只要您具備最基礎(chǔ)的前端開發(fā)技術(shù)，擁有一...
2013年，你是甲方，我是乙方，我為你云適配。 2014年，我的地盤你做主，云適配攻城獅們的工作陣地將全權(quán)授權(quán)給你，你可以自由的 DIY 您的網(wǎng)站，No more time，No Money，只要1天，只要1個(gè)人，只要2步，云適配開放平臺(tái)一站搞定，您的跨屏網(wǎng)站即刻誕生了！??！ BUT，BUT，BUT，在你開始完全做主前，我們想邀請(qǐng)您來參與云適配開放平臺(tái)的內(nèi)測(cè)，只要您具備最基礎(chǔ)的前端開發(fā)技術(shù)，擁有一...
摘要：阿里妹導(dǎo)讀如同我們?nèi)ツ暝略诜鍟?huì)所約，阿里巴巴內(nèi)部版本將于年月底正式開源?；诘挠?jì)算平臺(tái)于年正式上線。截至目前，阿里絕大多數(shù)的技術(shù)部門都在使用。在那之后，阿里巴巴將直接使用用于生產(chǎn)，并同時(shí)協(xié)助社區(qū)一起來維護(hù)。 showImg(https://segmentfault.com/img/remote/1460000018041567); 阿里妹導(dǎo)讀：如同我們?nèi)ツ?2月在 Flink Forw...
閱讀 3670·2021-10-11 10:58
閱讀 2255·2021-10-08 10:05
閱讀 2040·2021-09-27 13:34
閱讀 3583·2019-08-30 15:53
閱讀 2738·2019-08-30 14:02
閱讀 3574·2019-08-29 16:55
閱讀 628·2019-08-29 15:41
閱讀 1077·2019-08-29 15:23
