本文歸納總結(jié)了5個(gè)B端設(shè)計(jì)的思考，你可以看到高手如何分析工作中遇到的問題。
最近在一次大掃除當(dāng)中，不小心把廚房里的垃圾桶給摔壞了，于是乎想在網(wǎng)上選購一個(gè)合適的垃圾桶，而回顧了垃圾桶的選購經(jīng)歷，或許它是一個(gè)很好的例子，讓大家了解多入口的設(shè)計(jì)思考。
首先，究竟廚房需要是什么樣的垃圾桶？我陷入了嘀咕，因?yàn)槲易约阂膊惶靼，于是我在淘寶上看到了許多不同類型的垃圾桶。
把它們總結(jié)了一下，基本上可以分為兩類：直筒式、腳踏式
直筒式：采取頂部開放的結(jié)構(gòu)，使用者可以直接將垃圾扔到桶里。如果不夠有趣？你還可以將垃圾桶看作“籃筐”進(jìn)行投籃。
直筒式頂部開放的結(jié)構(gòu)，確實(shí)能夠給我們?nèi)永鴰聿簧俦憷，但同時(shí)也會(huì)暴露一些問題，就是蚊蟲。因?yàn)閺N房里的垃圾桶會(huì)有很多餐廚垃圾，也因此會(huì)滋生很多蚊蟲，特別是在一些剩下的水果核上，會(huì)留下很多蚊蟲。
腳踏式：頂部為蓋板，當(dāng)需要扔垃圾時(shí)，使用者需要用腳踏住蓋板，并將其抬起。這種方式就能夠避免廚房餐廚垃圾所滋生出來的蚊蟲
但問題又來了，在做菜時(shí)，扔垃圾通常十分頻繁，每一次都需要腳踏顯然效率太低。那能否既能腳踏又能隨手就扔呢？
面對(duì)這一問題，我發(fā)現(xiàn)了一個(gè)新式垃圾桶：
它在為用戶設(shè)計(jì)時(shí)，考慮到了兩種不同的模式，因而將兩種入口進(jìn)行巧妙的融合。通過頂部面板的開關(guān)，可以將垃圾桶設(shè)定為開啟或者關(guān)閉，能夠讓垃圾桶在你想要的時(shí)候保持開啟的狀態(tài)，這樣就能滿足在一小段時(shí)間內(nèi)的頻繁扔垃圾的需求。同時(shí)又能提供腳踏的形式，將垃圾桶蓋完整抬起，這樣的垃圾桶既可以腳踏也可以直接扔。
而在我們?cè)O(shè)計(jì) B 端產(chǎn)品時(shí)，同樣會(huì)有 “多入口”的情況。
比如在紛享銷客的設(shè)計(jì)當(dāng)中，新建客戶有著兩個(gè)不同的入口：
入口一：首頁 – 客戶及商機(jī)管理 – 客戶 – 新建
這是新建客戶最為常規(guī)的入口，它就類似垃圾桶的直筒式。通過表格頁操作的新建，讓用戶進(jìn)行表單的填寫，進(jìn)而新增客戶。
入口二：首頁 – 新建 – 客戶
這是紛享銷客的一個(gè)特別設(shè)計(jì)，它在導(dǎo)航菜單處設(shè)置一個(gè)全局的新建入口，當(dāng)用戶在系統(tǒng)的任意頁面，都可以進(jìn)行新建。
大家可以跟我一起思考一下，我們?nèi)绻且粋(gè)銷售人員，在我的工作當(dāng)中，會(huì)去經(jīng)常新建客戶、跟進(jìn)記錄等，那通過一個(gè)全局的新建入口，能幫助我們更快的進(jìn)行操作。這便是紛享銷客的第二個(gè)新建入口。
我再給大家舉一個(gè)簡(jiǎn)單例子，同樣我們?cè)诩娤礓N客當(dāng)中，表格當(dāng)中的篩選同樣也是有著兩個(gè)不同的入口：常規(guī)篩選與表頭篩選。
常規(guī)篩選：用于表格當(dāng)中一般和許多操作并排放置，算是一個(gè)較為基礎(chǔ)的入口
表頭篩選：點(diǎn)擊過后同樣也是進(jìn)入到篩選彈窗，但不同的是，表頭篩選點(diǎn)擊過后，會(huì)將表格的值帶入到篩選當(dāng)中，來實(shí)現(xiàn)篩選+選值這樣的兩步操作。
而為什么會(huì)有兩種不同的入口，我們回過頭來想想，就像我文章開頭說到的垃圾桶一樣，兩種不同的入口，其實(shí)是為了方便我在某一個(gè)場(chǎng)景下進(jìn)行使用（比如垃圾桶的持續(xù)丟垃圾與開關(guān)垃圾桶蓋；紛享銷客新建操作當(dāng)中的常規(guī)新建與快捷新建）而它正是因?yàn)橛脩粼诓煌膱?chǎng)景需求下，所設(shè)計(jì)的形式不同。
在 B 端產(chǎn)品當(dāng)中，不同場(chǎng)景的需求其實(shí)經(jīng)常存在，但為什么沒有暴露出來？其實(shí)是因?yàn)橛脩粼?B 端產(chǎn)品當(dāng)中，本身用戶就是處于弱勢(shì)群體，他們都是服從于上級(jí)的安排，而設(shè)計(jì)師不會(huì)分析，就會(huì)選擇最平庸的方式去處理需求。
咱們講了很多桌面端的交互設(shè)計(jì)，最近在使用 App 時(shí)發(fā)現(xiàn)了一個(gè)自己觀察到的小趨勢(shì)，隨便寫寫與大家探討探討～
不知道大家在處理移動(dòng)端導(dǎo)航中，有沒有遇到這樣的情況。公司的移動(dòng)端設(shè)計(jì)是 “優(yōu)雅降級(jí)” 即先滿足桌面端得到產(chǎn)品的設(shè)計(jì)后，再逐步去考慮如何適配移動(dòng)端。導(dǎo)致移動(dòng)端頁面中出現(xiàn)了意想不到的問題。最為常見的就是底部導(dǎo)航欄的導(dǎo)航菜單不夠用。
為什么不夠用，我拿釘釘桌面端進(jìn)行舉例：
在釘釘?shù)淖烂娑酥，包含有我的團(tuán)隊(duì)、消息、文檔、工作臺(tái)、通訊錄五大重要模塊，其次在左下方還會(huì)有日歷、待辦、DING、郵箱、會(huì)議、直播、收藏、更多等應(yīng)用功能。在桌面端將這些功能規(guī)劃完成后，你會(huì)如何設(shè)計(jì)移動(dòng)端導(dǎo)航呢？給大家是5秒鐘時(shí)間進(jìn)行思考～
我們先想想移動(dòng)端導(dǎo)航有哪些 “公式” 可以套，底部導(dǎo)航、頂部導(dǎo)航、桌面式導(dǎo)航、舵式導(dǎo)航，這便是移動(dòng)端導(dǎo)航設(shè)計(jì)中最為常見的幾個(gè)公式模型。而它的導(dǎo)航承載的最大數(shù)量不會(huì)超過五個(gè)，因此使用起來顯然不太滿足。
而在釘釘面臨的問題在我實(shí)際工作中遇到的問題類似，底部的導(dǎo)航可能會(huì)出現(xiàn) 10+ 的情況，究竟應(yīng)該怎么辦～
明白問題后我?guī)е魑贿M(jìn)行分析分析：
首先我們?cè)谠O(shè)計(jì)中，遇到數(shù)量多的內(nèi)容時(shí)，首先想到的應(yīng)該就是信息分層，無論是將10多個(gè)導(dǎo)航進(jìn)行拆分，顯然釘釘也是這么做的。
接下來你會(huì)發(fā)現(xiàn)釘釘在最近更新的版本中，出現(xiàn)一個(gè)不同尋常的交互。
通過上劃底部導(dǎo)航菜單，類似一個(gè)底部抽屜，將剩余的模塊放置在抽屜下。這樣就能將完整的導(dǎo)航形式在移動(dòng)端的方式展示給用戶。
說說這樣設(shè)計(jì)的優(yōu)點(diǎn)：
確實(shí)能夠保證在桌面端產(chǎn)品結(jié)構(gòu)不變的情況下，對(duì)移動(dòng)端的合理適配。因?yàn)榘凑諅鹘y(tǒng)的交互框架下難以滿足現(xiàn)在的問題
移動(dòng)端與桌面端的導(dǎo)航體驗(yàn)基本保持一致，滿足用戶對(duì)整個(gè)產(chǎn)品架構(gòu)的認(rèn)知
再聊聊缺點(diǎn)：
入口太深：因?yàn)榻换ト肟谛枰M(jìn)行上劃的操作才行，需要教育一段時(shí)間的用戶，讓大家熟悉這個(gè)方式
冗余：目前釘釘太多的內(nèi)容導(dǎo)致整個(gè)產(chǎn)品給人的感覺十分臃腫，再新增這個(gè)交互后需要的學(xué)習(xí)理解的內(nèi)容就過于繁多，說實(shí)話我作為一個(gè)釘釘?shù)挠脩，我要去寫一個(gè)工作中的項(xiàng)目文檔，我是應(yīng)該選擇：去協(xié)作？去工作臺(tái)？去項(xiàng)目？去最近使用？同時(shí)又擁有文檔、石墨文檔、Teambition 如何選擇？
雖然知道釘釘擁有強(qiáng)大的 ISV 生態(tài)，但目前很多 ISV 的功能與釘釘自身產(chǎn)品功能重疊，交集過多。
當(dāng)然這類交互并不是釘釘自己創(chuàng)新設(shè)計(jì)的，我是在 Teambition 以及飛書這兩款產(chǎn)品上首先發(fā)現(xiàn)（這兩款與釘釘?shù)淖龇ㄟ不太一樣），隨著釘釘?shù)母M(jìn)，相信這類交互很快會(huì)成為 一個(gè)移動(dòng)端的全新解決方式。
最后再說說飛書與 Teambition 在這個(gè)交互中的細(xì)節(jié)
首先在飛書中，底部導(dǎo)航的配置主要來源于兩個(gè)方面：
飛書管理后臺(tái)：提供入給管理員，讓公司的管理者可以對(duì)默認(rèn)的導(dǎo)航進(jìn)行一個(gè)統(tǒng)一配置
用戶：用戶可以根據(jù)自身的需求特定，對(duì)底部導(dǎo)航進(jìn)行自己個(gè)性化的配置
其次，飛書不會(huì)存在釘釘入口太深的問題，用戶點(diǎn)擊更多，就展開抽屜，用戶更容易理解。
Teambition 也是類似，就不做拓展，這便是移動(dòng)端設(shè)計(jì)的小趨勢(shì)，大家可以在實(shí)際工作中用起來～
表單作為一個(gè) B 端設(shè)計(jì)的重要場(chǎng)景，一直以來我都在想，究竟應(yīng)該如何高效的進(jìn)行信息錄入？今天我們就從文檔產(chǎn)品中，去“借鑒”一些表單效率提升的方法～
首先在錄入的場(chǎng)景中，我會(huì)想到寫作類的文檔軟件：
我自己是一個(gè)文檔軟件的重度使用者，我曾使用過 Bear、印象筆記、Notion、Ulysses、飛書文檔、石墨文檔、語雀等等…，而恰好你也是一個(gè)文章作者，也應(yīng)該嘗試過一種快捷信息錄入的方式：Markdown
1. Markdown
Markdown 是一種輕量的標(biāo)記語言，常用于文章排版中，這種標(biāo)記語言會(huì)讓你沉浸在寫作中而不是反復(fù)去糾結(jié)排版，進(jìn)而打斷你的思路。
比如我想設(shè)置一個(gè) “一級(jí)標(biāo)題”
沒有使用 Markdown，操作路徑是
- 先輸入文本內(nèi)容
- 使用鼠標(biāo)，選中想要文本內(nèi)容
- 點(diǎn)擊一級(jí)標(biāo)題按鈕，從而完成整個(gè)錄入形式
使用 Markdown 后，我只需要
輸入：#+空格+文本內(nèi)容即可快速完成上面三步的操作
我使用 Markdown 就可以提升我在信息錄入時(shí)的效率，手也可以不用去移動(dòng)鼠標(biāo)，減少切換控制設(shè)備所帶來的一系列的問題。在我看來這便是一個(gè)文本錄入效率提升的一個(gè)方式，而我們?cè)趺磳?Markdown 的思路落地到我們的 B 端表單場(chǎng)景中呢？
我本來也是沒有任何思路的，可是最近在使用滴答清單發(fā)現(xiàn)它的錄入特別有意思，當(dāng)我在新建一個(gè)待辦事項(xiàng)時(shí)：
輸入“！”符號(hào)后，即可設(shè)定該待辦事情的優(yōu)先級(jí)，同樣在輸入“～”符號(hào)后，即可設(shè)置該待辦事項(xiàng)的歸屬。
是不是和 Markdown 的特定規(guī)則有那么一點(diǎn)點(diǎn)類似了～
通過這樣設(shè)定特殊規(guī)則，我可以對(duì)待辦清單進(jìn)行快速選擇優(yōu)先級(jí)、歸屬箱等等…
不光是滴答清單，在 Notion、微信、語雀都有著類似的交互，我將此類交互稱為“特定規(guī)則錄入”
“特定規(guī)則錄入”：即使用特定的錄入規(guī)則，將用戶需要使用的信息進(jìn)行快速的錄入
- 優(yōu)點(diǎn)：能夠使用戶在不使用鼠標(biāo)的情況下進(jìn)行快速的信息錄入。
- 缺點(diǎn)：在日常真正需要使用該符號(hào)的情況下，下拉菜單會(huì)造成使用上的干擾。
比如我們?cè)?a href="https://www.uisdc.com/topic/%e5%be%ae%e4%bf%a1" class="tag_a" target="_blank" style="text-decoration: none; border-bottom: none; word-break: break-all; color: rgb(82, 82, 82); cursor: text;">微信中，如果聊天需要用到 @ ，不會(huì)采取符號(hào)的形式，而更多將 @ 變?yōu)?“艾特”
最后的落地，在我們實(shí)際的 B 端項(xiàng)目中，我們?cè)阡N售填寫跟進(jìn)記錄時(shí)也做了相應(yīng)的優(yōu)化：
我們可以用 @+空格 添加具體的銷售負(fù)責(zé)人員
輸入 #+空格 添加跟進(jìn)記錄的標(biāo)簽
輸入 ！+空格 添加跟進(jìn)記錄關(guān)聯(lián)的合同
（由于保密協(xié)議，這里就不展開去講，算是給大家提供一些思路）
不過通過這樣的改版，確實(shí)讓用戶在使用跟進(jìn)記錄這一模塊上有了極大的提升。當(dāng)然目前還是會(huì)有一些小問題，就是在輸入 “！+空格” 時(shí)，很多銷售還是會(huì)反饋這個(gè)的影響有些大，希望能夠進(jìn)行調(diào)整。
之后會(huì)考慮將這個(gè)快捷方式遷移到其他字母，希望能夠解決此問題。
在我日常的寫作中，我會(huì)新建一個(gè)思維導(dǎo)圖。
一方面思維導(dǎo)圖能夠幫助我去梳理我的思維結(jié)構(gòu)，整理一些腦袋中零散的知識(shí)點(diǎn)，另一方面我也可以通過導(dǎo)圖，幫助我進(jìn)行快速的知識(shí)調(diào)度。
但在飛書文檔中，因?yàn)閷挾认拗，?dǎo)致我在對(duì)導(dǎo)圖的編輯特別不友好，沒辦法正常的編輯我的思維導(dǎo)圖。這時(shí)候我可以雙擊導(dǎo)圖，進(jìn)入到全屏編輯的狀態(tài)，這就對(duì)大容量?jī)?nèi)容的編輯，帶來的非常多的便利。
當(dāng)然這只是在文檔場(chǎng)景下，其實(shí)我們?cè)谌粘５谋韱武浫氲倪^程中，同樣會(huì)面臨同樣的問題。
通常，表單的呈現(xiàn)都是采取彈窗的形式，但是當(dāng)信息錄入過多時(shí)，就需要考慮是否支持將彈窗擴(kuò)展至整個(gè)頁面，能夠?qū)⒈韱芜M(jìn)行更快速的錄入。
比如在 Gmail 中，當(dāng)你需要去新建一封郵件時(shí)，就有兩種不同的狀態(tài)：
- 一種是常駐在右下方，通過一個(gè)小窗口進(jìn)行展示
- 一種是點(diǎn)擊全屏按鈕，能夠?qū)⒄麄(gè)頁面進(jìn)行展開，作為全屏讓人進(jìn)行錄入
這種交互形式也被放在我們自身的產(chǎn)品中，因?yàn)樽鳛橐粋(gè) aPaaS 類的可配置化的表單，我們本身是不能確定用戶的內(nèi)容量，因此在采取彈窗的同時(shí)會(huì)為用戶增加大彈窗的入口，可以應(yīng)對(duì)用戶靈活多變的各種場(chǎng)景。
承擔(dān)因您的行為而導(dǎo)致的法律責(zé)任，
本站有權(quán)保留或刪除有爭(zhēng)議評(píng)論。
參與本評(píng)論即表明您已經(jīng)閱讀并接受
上述條款。