后臺(tái)設(shè)計(jì):掌握7個(gè)實(shí)用的方法,告別冗長的后臺(tái)

Lainey
36 評(píng)論 57848 瀏覽 625 收藏 7 分鐘

作者結(jié)合自身工作經(jīng)驗(yàn)分享了在后臺(tái)設(shè)計(jì)中幾個(gè)較為實(shí)用的方法,想必能夠給你帶來些幫助。

由于團(tuán)隊(duì)設(shè)計(jì)氛圍比較濃郁,幾款產(chǎn)品的后臺(tái)設(shè)計(jì)原型,也都經(jīng)由交互設(shè)計(jì)師在用戶體驗(yàn)上進(jìn)行了優(yōu)化。

B端后臺(tái)一般包含客戶使用端和平臺(tái)客服使用端,很多團(tuán)隊(duì)的做法對(duì)于客戶使用端會(huì)考慮用戶體驗(yàn),但對(duì)于平臺(tái)多用簡單粗暴的模版??紤]到以人為本的設(shè)計(jì),是能考慮到所有用戶的感受,并為其找到最適合的解決辦法,所以對(duì)于平臺(tái)的設(shè)計(jì),一樣需要有好的體驗(yàn)。

接下來我講到的幾個(gè)方法,在后臺(tái)設(shè)計(jì)中非常的實(shí)用。

1.高級(jí)搜索

當(dāng)搜索條件超過一定數(shù)量,我們可以將不是首要的的搜索條件隱藏,將頭部寶貴的空間釋放出來展示列表重要搜索內(nèi)容。高級(jí)搜索和普通搜索的切換就很好的實(shí)現(xiàn)相應(yīng)需求。

2.批量操作列表中多條信息

對(duì)于表單頁面,原始的excel表單可以做到批量選擇和批量操作。許多后臺(tái)對(duì)于表單的處理往往過于簡單,只能基本滿足增刪改查。

后臺(tái)也可以用自定義勾選的方式對(duì)多個(gè)列表內(nèi)容進(jìn)行批量操作,如圖可勾需多個(gè)列表或全選后進(jìn)行批量刪除、作廢、更改負(fù)責(zé)人、發(fā)郵件、發(fā)信息、轉(zhuǎn)移等等…

3.單個(gè)表單抬頭字段篩選

一般的數(shù)字、時(shí)間、字母排序單個(gè)表單都有隱形的排序框,數(shù)字從小到大、時(shí)間從近到遠(yuǎn)或者26個(gè)字母排序。但是對(duì)于其余抬頭篩選就只能做頂部選擇或文字輸入篩選,那樣浪費(fèi)的區(qū)域會(huì)增多。

而如果直接隱藏在抬頭下面作為一項(xiàng)列表內(nèi)容,自定義篩選的靈活度會(huì)大很多,整個(gè)頁面也會(huì)放出更大的空間展示列表內(nèi)容。

4.表頭、確定表單頁面和不操作頁面局部固定/自定義篩選字段

在瀏覽的眾多網(wǎng)站中,由于某一部分內(nèi)容都有高頻的操作或查看,頁面在設(shè)置的時(shí)候會(huì)有意識(shí)將這部分板塊固定,不隨其它內(nèi)容上下和左右滑動(dòng)。

在后臺(tái)也存在這樣的需求,除了抬頭部分還有特殊字段和對(duì)表單頁面的保存、取消、審核等高頻操作都可以設(shè)置為固定板塊存在在頁面中,使頁面的重點(diǎn)更為突出,內(nèi)容查看更有趣味性。

5.消息隱藏

消息隱藏也是在做一個(gè)電商的項(xiàng)目,學(xué)習(xí)到的一種方法。因?yàn)橄⒎诸愝^多,可操作和不可操作的消息類型疊加,并且消息的重要程度也是層次不齊,以至于消息列表點(diǎn)擊進(jìn)入查看還需要進(jìn)行分類。

但是在首頁,將消息分類的同時(shí),直接鏈接進(jìn)入相應(yīng)待辦和查看頁面進(jìn)行操作,用更直觀的方式轉(zhuǎn)達(dá)給用戶去查看或操作,也省去頁面跳轉(zhuǎn)間的頻率和時(shí)間。

6.抬頭標(biāo)題操作切換

看過線下excel表單的抬頭有幾十個(gè)的情況,A4紙打印都得有好幾頁才能展示全面,網(wǎng)頁的寬度最多也只能容納15-20個(gè)抬頭(抬頭文字全部展示完的情況下),怎么解決數(shù)據(jù)量太大,抬頭區(qū)域不夠展示的情況呢?只能做隱藏。

隱藏字段是否展示或者展示優(yōu)先集的權(quán)利都交到用戶手上,給他們一個(gè)最自由化的配置,只選擇自己想要查看的字段,選擇過多的字段導(dǎo)致文字省略用戶也會(huì)理解而進(jìn)行合理的分配。

7.切換當(dāng)前內(nèi)容的視圖,突出角色主要內(nèi)容

在淘寶移動(dòng)端的商品列表中,我們經(jīng)常根據(jù)自己的喜好來切換展示方式。是單行顯示單個(gè)商品,還是單行顯示兩個(gè)商品,切換方式能讓用戶更大限度的看到自己想看的商品信息。

后臺(tái)也可以切換視圖使用戶用更習(xí)慣的方式,展示列表內(nèi)容。切換視圖有許多表現(xiàn)方式來表現(xiàn),如列表、地圖、剖面圖、折線圖、扇型圖…

顧名思義,視圖就是更換另一種表現(xiàn)形式。一定要選取與設(shè)計(jì)的產(chǎn)品相符合的表現(xiàn)形式,才能更加突出這是一種技巧,如果只為了炫酷的效果,而增加多種視圖,沒有需求人群,那這種轉(zhuǎn)換也是沒有意義的。

總結(jié)

所有總結(jié)出來的方法,都是在解決人們遇到的問題而迸發(fā)出,有些可能是偽需求或自臆需求。做有效的判斷也是工作日常的必備。所有在積累方法經(jīng)驗(yàn)的同時(shí),也要慎重選擇交互方式,判斷與產(chǎn)品的符合度,是否能做到有效的定制化、是否讓用戶覺得功能好用且持續(xù)受用,提高用戶效率和提升用戶體驗(yàn)才是正解。

 

本文由 @Lainey 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自PEXELS,基于CC0協(xié)議

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 對(duì)強(qiáng)迫癥友好 對(duì)用戶 開發(fā) 設(shè)計(jì) 交互都不友好

    來自福建 回復(fù)
    1. 僅提供方法,可根據(jù)實(shí)際場景取用

      來自浙江 回復(fù)
    2. 僅提供方法,可根據(jù)實(shí)際場景取用

      來自浙江 回復(fù)
  2. 大佬,我有個(gè)后臺(tái)設(shè)計(jì)小私活,能聊下嗎?

    來自日本 回復(fù)
    1. 并不是大佬,但有需求可以聊下

      來自浙江 回復(fù)
    2. 這個(gè)網(wǎng)站沒有私信功能么,暈菜

      來自日本 回復(fù)
    3. +we~chat方便么,lgy052772

      來自日本 回復(fù)
  3. 受教了,看了您的文章,我發(fā)現(xiàn)自己把后臺(tái)弄得太復(fù)雜了。 ?

    來自福建 回復(fù)
    1. 客氣 ??

      來自浙江 回復(fù)
  4. 太有用了 我是個(gè)設(shè)計(jì)這一陣子要做交互的事情 剛好在做后臺(tái) 那些很長復(fù)雜的表單 看了您的文章 受益匪淺啊

    來自上海 回復(fù)
    1. 后臺(tái)設(shè)計(jì)設(shè)計(jì)完善后,是可以復(fù)用的。提升開發(fā)效率

      來自浙江 回復(fù)
  5. 感覺操作效率上高了很多,我目前還是前端,準(zhǔn)備入坑中,學(xué)習(xí)了

    來自廣東 回復(fù)
    1. 前端小哥能在開發(fā)前考慮這些 就完美了。

      來自浙江 回復(fù)
  6. 挺實(shí)用的,我現(xiàn)在既是在干產(chǎn)品經(jīng)理的活兒又是在做交互設(shè)計(jì),一直都在苦惱怎樣將設(shè)計(jì)好的功能界面變成操作良好的交互界面

    來自四川 回復(fù)
  7. 看了這個(gè),反正自己以前設(shè)計(jì)的需要改進(jìn)的空間還很大,受教了

    來自福建 回復(fù)
    1. 敏感留意些細(xì)節(jié),互相請(qǐng)教啦

      來自浙江 回復(fù)
  8. 問下,字段這么多,頁面打開時(shí)一次性加載所有數(shù)據(jù)?還是只加載默認(rèn)顯示字段的數(shù)據(jù)?例如,列表有20個(gè)字段,默認(rèn)顯示10個(gè)字段,10個(gè)隱藏,那也沒加載時(shí),加載20個(gè),還是10個(gè)?有哪些辦法能優(yōu)化數(shù)據(jù)加載和導(dǎo)出很慢的通???

    來自浙江 回復(fù)
    1. 先加載默認(rèn)的10個(gè)字段,因?yàn)橛脩粼谶x定字段后不會(huì)頻繁更改,所以另外的數(shù)據(jù)后緩存影響不大。優(yōu)化數(shù)據(jù)加載是程序調(diào)整數(shù)據(jù)庫來實(shí)現(xiàn)的,但讓用戶對(duì)數(shù)據(jù)加載過慢感受的調(diào)整,就需要設(shè)計(jì)加載響應(yīng)式的反饋了。

      來自浙江 回復(fù)
    2. x售易

      回復(fù)
    3. 多謝

      來自浙江 回復(fù)
  9. 厲害,有些是工作中已有的,但是沒有總結(jié),這才是真正的干貨

    來自四川 回復(fù)
    1. 用上就是硬道理。

      來自浙江 回復(fù)
    2. 厲害了

      來自北京 回復(fù)
  10. 牛,開闊視野了,發(fā)現(xiàn)我設(shè)計(jì)的太low了

    來自北京 回復(fù)
    1. 都有參考的,打開思維方式比較重要

      來自浙江 回復(fù)
  11. XX銷客?

    來自廣東 回復(fù)
    1. 一部分是,在體驗(yàn)版中有借鑒到

      來自浙江 回復(fù)
    2. 什么產(chǎn)品,想去看看

      來自日本 回復(fù)
  12. 學(xué)習(xí)了!不過貴司后臺(tái)數(shù)據(jù)量不大吧?

    來自廣東 回復(fù)
    1. 互相學(xué)習(xí)

      來自浙江 回復(fù)
  13. 挺好的,目前處理簡單粗暴的低級(jí)階段

    來自北京 回復(fù)
    1. 可以在設(shè)計(jì)的時(shí)候有意識(shí)的使用一下~

      來自浙江 回復(fù)
  14. 想了解一下,這個(gè)后臺(tái)所用的頁面模型,是你們自己開發(fā)的還是第三方的哪個(gè)框架?表示程序員想知道~

    來自上海 回復(fù)
    1. 程序員表示:UI組件可以實(shí)現(xiàn)

      來自浙江 回復(fù)
  15. 1、2、3點(diǎn)經(jīng)常用,其他的就很少用到過或者從未用過。

    來自上海 回復(fù)
    1. 根據(jù)實(shí)際的業(yè)務(wù)需求來使用,事例都是提供交互思路。

      來自浙江 回復(fù)
专题
72294人已学习13篇文章
产品经理天天跟“需求”打交道,产品经理的核心价值就是处理“需求”的能力。
专题
53205人已学习15篇文章
无论是个人运营体系还是公司运营体系的构建,你都能在这里找到。
专题
15173人已学习12篇文章
用户体验五要素包括战略层、范围层、框架层、结构层、表现层五个方面,本专题的文章分享了用户体验五要素的看法。
专题
88173人已学习12篇文章
世间万物皆有套路,面试更是如此,多拿几个靠谱offer。
专题
40131人已学习22篇文章
不想当CEO的产品经理不是好运营
专题
17115人已学习14篇文章
RFM模型是与用户价值相关的常见模型之一。本专题的文章分享了什么是RFM模型?如何应用RFM模型?