文章是作者根據(jù)自己近期工作總結(jié)的關(guān)于To B系統(tǒng)的工單設(shè)計(jì)的一些交互要點(diǎn)，希望對(duì)大家有益。

最近一直在設(shè)計(jì)To B系統(tǒng)的工單，從手機(jī)端到PC端，終于快上線了，在項(xiàng)目里遇到的各種坑，在這里總結(jié)一下，讓后人可以避開(kāi)。針對(duì)于To B系統(tǒng)，我這次主要設(shè)計(jì)的是工單，以前也設(shè)計(jì)過(guò)訂單的內(nèi)容。它們有著一定的相似性。所以，這里提到的一些要點(diǎn)，幾乎可以覆蓋所有和單子有關(guān)的設(shè)計(jì)。

什么是工單

根據(jù)字面意思我們可以把它理解為工作單據(jù)。工單定義：是由一個(gè)和多個(gè)作業(yè)組成的簡(jiǎn)單維護(hù)或處理問(wèn)題，上級(jí)部門下達(dá)任務(wù)，下級(jí)部門領(lǐng)受任務(wù)的依據(jù)。

工單的機(jī)制

工單的來(lái)源主要是兩種人：一個(gè)是用戶提出問(wèn)題，由客服人員來(lái)生成一個(gè)工單；另一個(gè)是由公司內(nèi)部人員產(chǎn)生的工單

在提交工單的時(shí)候，就會(huì)選擇相應(yīng)的業(yè)務(wù)線去處理，工單提出之后，相關(guān)的信息會(huì)上傳到服務(wù)器，經(jīng)過(guò)判斷指派給不同業(yè)務(wù)線，業(yè)務(wù)線各自去處理自己負(fù)責(zé)的任務(wù)。都處理完成后，如果是用戶提出的工單，三天沒(méi)有回復(fù)，則自動(dòng)關(guān)單，如果是公司內(nèi)部提出的，則需要手動(dòng)關(guān)單。

大體了解了工單是什么之后，就可以進(jìn)一步以交互設(shè)計(jì)師的角度去解讀工單了。作為工單系統(tǒng)，主要的頁(yè)面就是工單列表頁(yè)面，工單詳情頁(yè)面，新建工單頁(yè)面。雖然只有簡(jiǎn)單的三個(gè)頁(yè)面，但是索要考慮的內(nèi)容卻很多。

工單系統(tǒng)

1、用戶角色

所謂的工單系統(tǒng)，就是工單和一堆人的千絲萬(wàn)縷的關(guān)系。那么，首先確定都有哪些人就顯得很重要。像我做的工單主要就是工單發(fā)起人以及工單的受理人，但是受理人又分成客戶人員，業(yè)務(wù)線人員。針對(duì)每一類人員，他們功能權(quán)限不一樣，對(duì)應(yīng)的在頁(yè)面內(nèi)的設(shè)計(jì)就不一樣。同樣一個(gè)工單詳情頁(yè)面，不同的角色所看到和能做的事情是不一樣的。所以，在設(shè)計(jì)之前，一定要前梳理清楚用戶角色有哪些，每一類人有哪些功能權(quán)限，對(duì)應(yīng)的頁(yè)面內(nèi)容有哪些區(qū)別。

2、工單的類型

不同的平臺(tái)發(fā)出的工單的類型是不一樣的，由客戶從pc端發(fā)出的工單為線上工單，而由手機(jī)端提交的為線下工單，因?yàn)樘峤欢丝诓灰粯樱蔚膬?nèi)容也不一樣。這就要求我們梳理針對(duì)不同類型的工單，用戶在填寫的時(shí)候分別需要填寫那些字段，提交工單后，不同的工單類型的處理方式，附帶著哪些功能按鈕。

3、工單的狀態(tài)

工單從提交開(kāi)始，就跟隨著狀態(tài)的改變，不同的狀態(tài)，表現(xiàn)形式不一樣，訂單里面的內(nèi)容也不一樣，需要設(shè)計(jì)人員把所有的訂單狀態(tài)都列出來(lái)，然后進(jìn)行分類、劃分，根據(jù)不同的狀態(tài)設(shè)計(jì)出不同的模板。

設(shè)計(jì)原則

設(shè)計(jì)時(shí)要考慮的內(nèi)容梳理完，就可以著手設(shè)計(jì)了。對(duì)于工單的內(nèi)容，可以用雜、亂、多來(lái)形容，填寫工單時(shí)有些內(nèi)容是必須填寫的，但是同時(shí)還有很多內(nèi)容可以選填；工單詳情時(shí)，更是嚴(yán)重。所以，在設(shè)計(jì)時(shí)，我們要參照以下的原則：

1、刪除

根據(jù)2/8法則，通常一個(gè)頁(yè)面80%的用戶只看了20%的內(nèi)容，那么其他的內(nèi)容幾乎都是無(wú)用的，那么為什么還要留著他們。

砍掉無(wú)用的內(nèi)容有時(shí)候是個(gè)血腥無(wú)情的過(guò)程，我們?cè)谶^(guò)需求的時(shí)候，最常聽(tīng)到的一句話就是“假如用戶想看…..”,就因?yàn)檫@樣一個(gè)假如，讓很多基本上沒(méi)有用的內(nèi)容躺在頁(yè)面里，讓頁(yè)面越來(lái)越腫，那么下一次，當(dāng)你在聽(tīng)到“假如用戶想看…..”這樣的話時(shí)，就繼續(xù)問(wèn)，這個(gè)內(nèi)容對(duì)目標(biāo)用戶是否真的重要，如果去掉了，對(duì)用戶會(huì)有什么影響，如果沒(méi)有影響或者影響很小，那么絕對(duì)不要手軟，果斷砍掉。

2、隱藏

隱藏的內(nèi)容通常是不常用但是又不能少的，有的人認(rèn)為，隱藏是刪除的開(kāi)始，把它隱藏起來(lái)，然后在黑暗中死去，如果是因?yàn)檫@要的理由將它隱藏，那么，還不如直接刪掉的好。通常選擇隱藏的內(nèi)容有：事關(guān)細(xì)節(jié)（個(gè)人設(shè)置或郵件簽名）、選項(xiàng)和偏好（繪圖的單位，又英寸改成厘米）、特定地區(qū)的信息（如時(shí)間和日期需要自動(dòng)更新的信息）等。

在做工單的時(shí)候，我按用戶的使用場(chǎng)景，將內(nèi)容進(jìn)行了隱藏。

3、組織

刪掉了不必要的內(nèi)容，那么剩下信息就需要有組織的放在一起。根據(jù)“7加減2”原則，人瞬間能記住的最大條數(shù)不能超過(guò)9項(xiàng)，否則就會(huì)像“狗熊掰棒子”，最后都忘了。分塊越少，選擇越少，用戶負(fù)擔(dān)越輕。

工單的信息比較雜，各種各樣的信息都有，如果就散亂無(wú)章的放在那，只會(huì)增加用戶閱讀負(fù)擔(dān)。所以，將信息有效的分類然后組織在一起就顯得很重要。這時(shí)候，卡片的設(shè)計(jì)就很實(shí)用，將相關(guān)的信息放在一張卡片上，不同的信息劃分成不同的卡片，劃分清晰，容易識(shí)別。

4、極限

因?yàn)楣斡泻芏嗵顚懙膬?nèi)容，雖然有字?jǐn)?shù)限制，但是在手機(jī)端很多時(shí)候不能全顯示，就需要考慮各種顯示不全的極限情況，對(duì)于重要的信息，如果一行顯示不下，就只能折行顯示，對(duì)于一些次要信息，如果顯示不下，可以選擇省略顯示。

最后總結(jié)一下

當(dāng)交互設(shè)計(jì)師拿到設(shè)計(jì)需求后，不要馬上開(kāi)始設(shè)計(jì)，因?yàn)楹蛦巫佑嘘P(guān)的設(shè)計(jì)里，往往有著不同的角色，不同的類型，不同的狀態(tài)，如果沒(méi)有梳理明白，你就會(huì)發(fā)現(xiàn)你設(shè)計(jì)的只是冰山一角，有好多的情況都沒(méi)有考慮，越設(shè)計(jì)越混亂。只有將所有的內(nèi)容都梳理明白，才能將設(shè)計(jì)做明白，不至于遺漏。然后著手設(shè)計(jì)的時(shí)候，一定不能把所有的內(nèi)容都顯示在那，這樣會(huì)嚴(yán)重的干擾用戶，一定要將信息按重要程度處理，相關(guān)的內(nèi)容放在一起，還要多考慮一些極限的情況。

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