編輯導(dǎo)語：有贊產(chǎn)品體驗部更名為“審美缺失部”這個事件背后，不僅是圖標(biāo)設(shè)計審美的缺失，更是后臺界面設(shè)計的混亂。本文作者重新設(shè)計了一個后臺界面稿，并對自己的設(shè)計思維進(jìn)行了闡述說明，與大家分享。
演示地址：https://www.pmdaniu.com/storages/121247/40cc6ae538e327a355492adc5d140ef6-27391/index.html
前言
前些日，我聽說某贊大哥吐槽設(shè)計部，怒把產(chǎn)品體驗部更名為“審美缺失部”，吐槽點好像不是后臺系統(tǒng)，而是上面的三個 圖標(biāo)，但沒關(guān)系，某贊后臺功能真滴很強大，不吹不黑，但后臺界面……
于是我一時興起，下班時間劃水幾個小時（老板我下班時間搞的），懟了個高保真概念稿，來闡述下自己概念稿設(shè)計思路…
以下僅個人觀點與想法，我也是保持低調(diào)互相學(xué)習(xí)的態(tài)度，向各位在坐的各位大佬請教與指點…
非惡意搞針對：某贊確實是電商行業(yè)領(lǐng)軍者，不吹不黑，概念稿僅是個人觀點，非針對友商…
非炫耀想跳槽：更何況自己并不是很優(yōu)秀，也是自己瞎搞…而且，我現(xiàn)在工資很高，< – < 皮.
直入主題：B端產(chǎn)品TM來搶設(shè)計飯碗？逆子….
就搶你飯碗，你能怎么滴？
好吧，開個玩笑，先說出發(fā)角度闡述下這個觀點，
- B端產(chǎn)品設(shè)計后臺，關(guān)鍵詞：需求、邏輯、使用者；
- UI設(shè)計后臺，關(guān)鍵詞：實用、高效、一致性。
看上去確實是從設(shè)計思路來看，雙方的出發(fā)點都不一樣，但我覺得可能也就文案上不一樣，不管誰來設(shè)計，做出來的東西基本是供給需求方便捷實用，不管啥關(guān)鍵詞，其目的都是滿足使用者，便捷高效解決問題。
而目前絕大多數(shù)公司的情況是這樣：
我司資深產(chǎn)品專家——久經(jīng)沙場，也可能是技術(shù)佬轉(zhuǎn)過去的，管NTM的啥好不好看，能用起來就行，要啥好看，做原型出文檔的時候，就恨不得把TM所有功能堆上去，怎么滴，我邏輯清晰，我功能強大，功能不夠強大哪來的投資，別整些華而不實用的東西，照著我的原型去做就行（你信么，我有一百種方式讓你離職，真丑到QM都不認(rèn)識了）
我司高級設(shè)計總監(jiān)——花里胡哨，也可能是平面佬轉(zhuǎn)過去的，管NTM的….算了不吐槽了.
01 后臺框架
很多saas系統(tǒng)，之前搭建框架的時候，就固定死那些老到不能再老的組件，特別是銀行的……
困難點在：
- 前端修改過于復(fù)雜，浪費時間和精力，也沒啥必要（其實這都是主要的扯皮）；
- 設(shè)計也找不到前端可敲的組件框架，限制了設(shè)計思路（其實這都是次要的扯淡）；
示例布局：
使用場景：
（1）17/19寸
分別率：1024×768（4：3）
用戶群體：大屏專業(yè)電商操作使用者（較少）
當(dāng)前劣勢點：屏幕面積大、功能操作點多（視覺集中性）、中間區(qū)域滾動，浪費頂部區(qū)域操作區(qū)域
（2）16寸
分別率：1280×1024（5：4）
用戶群體：絕大多數(shù)商家普通筆記本/電腦（多數(shù)）
當(dāng)前劣勢點：我不多BB，拿這種分別率的屏幕看這個后臺，是真滴丑
（3）13.3寸
分別率：1280×800（Mac）
用戶群體：老板級別蘋果裝逼電腦（重點保護對象）
當(dāng)前劣勢點：你自己拿你的蘋果電腦看看，功能多了東西全部擠一起，沒有任何主次
02 后臺產(chǎn)品設(shè)計
在設(shè)計一套功能巨多后臺的，提前思考以下幾個點，才能把后期的需求迭代做到更順
- 可復(fù)用性：當(dāng)前框架能否滿足今后所有需求。例子：萬一我后面有三級菜單了，萬一又有四級了，萬一運營要來插廣告了，萬一自己要埋點優(yōu)化首頁了
- 零教學(xué)性：當(dāng)前后臺小白新手是不是都要教一遍才會用。例子：東西做出來是不是就你一個人用，做教程的小姐姐 是不是還要你教一遍再做教程，干脆你來做好了
- 最后，能1秒解決的事情就不要拖到5秒
我感覺我再說下去有點搞針對的意思，先從菜單欄去瓦解下我們的功能和需求，要不你們細(xì)品下他這個流程……
熱圖分析：應(yīng)用——經(jīng)營分析——熱力圖分析 / 數(shù)據(jù)——熱力圖分析
煮個栗子： 我們移動端熟悉的商品詳情頁，商品詳情頁的路徑有很多個
首頁列表——因為要買商品看看介紹
直播間——同理流量入口看介紹
購物車列表——再次確定商品內(nèi)容
訂單列表——看看自己買的啥玩樣
移動端同一個頁面的路徑，來源不同的區(qū)域（需求不一樣）
但你會發(fā)現(xiàn) 首頁列表、直播間、購物車列表、訂單列表 他并不是一個層級的（對，他們不是一級菜單）
回到后臺設(shè)計：我們也有商品詳情頁，也有列表頁，也有數(shù)據(jù)分析頁，但我們的一級菜單只有一種（并非放到左邊那一排就叫一級）
對，能用1秒解決的絕對不用5秒，后臺的每個功能設(shè)計，基本都影響到用戶的行為習(xí)慣，你們猜猜我下次會從哪里進(jìn)去熱力圖分析，我啥時候會用熱力圖分析
不不不，你別猜了，某贊沒錯，錯在我瞎JB分析，再說要懟我黑人家了，也許只是別人只單純的先把功能上了再說（絕大多數(shù)產(chǎn)品思維）
最后你發(fā)現(xiàn)我一頓BB，并沒有扯到跟這套高保真有啥關(guān)系，
對，沒啥關(guān)系，他給我錢了嗎？我只是隨便搞搞怎么騷氣怎么來。
最后的最后表達(dá)下：現(xiàn)在絕大多數(shù)B端產(chǎn)品的思維（也是老板的想法）——功能上了再說，樣式差不多就行，樣式我也不負(fù)責(zé)，前端不好改就先做功能。
度娘今年改了個圓角搜索框樣式，是不是更親民了啊。
本文由 @TC_ZY 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)作者許可，禁止轉(zhuǎn)載。
題圖來自Unsplash，基于CC0協(xié)議。
聲明：本文由網(wǎng)站用戶香香發(fā)表，超夢電商平臺僅提供信息存儲服務(wù)，版權(quán)歸原作者所有。若發(fā)現(xiàn)本站文章存在版權(quán)問題，如發(fā)現(xiàn)文章、圖片等侵權(quán)行為，請聯(lián)系我們刪除。
