起點課堂會員權益
職業(yè)體系課特權
線下行業(yè)大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業(yè)技能直播
會員專屬社群
榮耀標識從有贊的“審美缺失部”出發(fā)，聊聊后臺產品設計思維
編輯導語：有贊產品體驗部更名為“審美缺失部”這個事件背后，不僅是圖標設計審美的缺失，更是后臺界面設計的混亂。本文作者重新設計了一個后臺界面稿，并對自己的設計思維進行了闡述說明，與大家分享。
演示地址：https://www.pmdaniu.com/storages/121247/40cc6ae538e327a355492adc5d140ef6-27391/index.html
前言
前些日，我聽說某贊大哥吐槽設計部，怒把產品體驗部更名為“審美缺失部”，吐槽點好像不是后臺系統(tǒng)，而是上面的三個 圖標，但沒關系，某贊后臺功能真滴很強大，不吹不黑，但后臺界面……
于是我一時興起，下班時間劃水幾個小時（老板我下班時間搞的），懟了個高保真概念稿，來闡述下自己概念稿設計思路…
以下僅個人觀點與想法，我也是保持低調互相學習的態(tài)度，向各位在坐的各位大佬請教與指點…
非惡意搞針對：某贊確實是電商行業(yè)領軍者，不吹不黑，概念稿僅是個人觀點，非針對友商…
非炫耀想跳槽：更何況自己并不是很優(yōu)秀，也是自己瞎搞…而且，我現在工資很高，< – < 皮.
直入主題：B端產品TM來搶設計飯碗？逆子….
就搶你飯碗，你能怎么滴？
好吧，開個玩笑，先說出發(fā)角度闡述下這個觀點，
- B端產品設計后臺，關鍵詞：需求、邏輯、使用者；
- UI設計后臺，關鍵詞：實用、高效、一致性。
看上去確實是從設計思路來看，雙方的出發(fā)點都不一樣，但我覺得可能也就文案上不一樣，不管誰來設計，做出來的東西基本是供給需求方便捷實用，不管啥關鍵詞，其目的都是滿足使用者，便捷高效解決問題。
而目前絕大多數公司的情況是這樣：
我司資深產品專家——久經沙場，也可能是技術佬轉過去的，管NTM的啥好不好看，能用起來就行，要啥好看，做原型出文檔的時候，就恨不得把TM所有功能堆上去，怎么滴，我邏輯清晰，我功能強大，功能不夠強大哪來的投資，別整些華而不實用的東西，照著我的原型去做就行（你信么，我有一百種方式讓你離職，真丑到QM都不認識了）
我司高級設計總監(jiān)——花里胡哨，也可能是平面佬轉過去的，管NTM的….算了不吐槽了.
01 后臺框架
很多saas系統(tǒng)，之前搭建框架的時候，就固定死那些老到不能再老的組件，特別是銀行的……
困難點在：
- 前端修改過于復雜，浪費時間和精力，也沒啥必要（其實這都是主要的扯皮）；
- 設計也找不到前端可敲的組件框架，限制了設計思路（其實這都是次要的扯淡）；
而且真實使用者情況：能做就行，還想咋滴？難不成能給我退錢？
示例布局：
使用場景：
（1）17/19寸
分別率：1024×768（4：3）
用戶群體：大屏專業(yè)電商操作使用者（較少）
當前劣勢點：屏幕面積大、功能操作點多（視覺集中性）、中間區(qū)域滾動，浪費頂部區(qū)域操作區(qū)域
（2）16寸
分別率：1280×1024（5：4）
用戶群體：絕大多數商家普通筆記本/電腦（多數）
當前劣勢點：我不多BB，拿這種分別率的屏幕看這個后臺，是真滴丑
（3）13.3寸
分別率：1280×800（Mac）
用戶群體：老板級別蘋果裝逼電腦（重點保護對象）
當前劣勢點：你自己拿你的蘋果電腦看看，功能多了東西全部擠一起，沒有任何主次
02 后臺產品設計
在設計一套功能巨多后臺的，提前思考以下幾個點，才能把后期的需求迭代做到更順
- 可復用性：當前框架能否滿足今后所有需求。例子：萬一我后面有三級菜單了，萬一又有四級了，萬一運營要來插廣告了，萬一自己要埋點優(yōu)化首頁了
- 零教學性：當前后臺小白新手是不是都要教一遍才會用。例子：東西做出來是不是就你一個人用，做教程的小姐姐 是不是還要你教一遍再做教程，干脆你來做好了
- 最后，能1秒解決的事情就不要拖到5秒
示例對比：
我感覺我再說下去有點搞針對的意思，先從菜單欄去瓦解下我們的功能和需求，要不你們細品下他這個流程……
熱圖分析：應用——經營分析——熱力圖分析 / 數據——熱力圖分析
煮個栗子： 我們移動端熟悉的商品詳情頁，商品詳情頁的路徑有很多個
首頁列表——因為要買商品看看介紹
直播間——同理流量入口看介紹
購物車列表——再次確定商品內容
訂單列表——看看自己買的啥玩樣
移動端同一個頁面的路徑，來源不同的區(qū)域（需求不一樣）
但你會發(fā)現? 首頁列表、直播間、購物車列表、訂單列表 他并不是一個層級的（對，他們不是一級菜單）
回到后臺設計：我們也有商品詳情頁，也有列表頁，也有數據分析頁，但我們的一級菜單只有一種（并非放到左邊那一排就叫一級）
對，能用1秒解決的絕對不用5秒，后臺的每個功能設計，基本都影響到用戶的行為習慣，你們猜猜我下次會從哪里進去熱力圖分析，我啥時候會用熱力圖分析
不不不，你別猜了，某贊沒錯，錯在我瞎JB分析，再說要懟我黑人家了，也許只是別人只單純的先把功能上了再說（絕大多數產品思維）
最后你發(fā)現我一頓BB，并沒有扯到跟這套高保真有啥關系，
對，沒啥關系，他給我錢了嗎？我只是隨便搞搞怎么騷氣怎么來。
最后的最后表達下：現在絕大多數B端產品的思維（也是老板的想法）——功能上了再說，樣式差不多就行，樣式我也不負責，前端不好改就先做功能。
度娘今年改了個圓角搜索框樣式，是不是更親民了啊。
本文由 @TC_ZY 原創(chuàng)發(fā)布于人人都是產品經理，未經作者許可，禁止轉載。
題圖來自Unsplash，基于CC0協(xié)議。
非炫耀想跳槽：更何況自己并不是很優(yōu)秀，也是自己瞎搞…而且，我現在工資很高，< – < 皮
老板級別蘋果裝逼電腦…
我只感覺有一個精神小伙，邏輯不清不知道想表達什么，真是又土又下頭
寫的什么東西，看完只覺浪費時間
側邊欄沒有字就不符合有贊這種B端商家，他們是全行業(yè)，那么就是說可能沒什么文化，右邊的欄目需要用戶自己去猜圖標就很費解，我點的是什么都不知道，功能表達不清晰太C端，然后就是人家主色調時候紅色，不建議改，那是人家概念色，saas一想到紅色就是有贊，其次有贊首頁是以數據為主，試問為什么要這么多數據，是因為這是老板看的，他們喜歡一目了然看到自己所需數據，以方便作出判斷，你這邊數據減少，美觀實用就少了，其次柱狀圖下面的字折行是很不建議的，人習慣是看一行，這樣錯落，實際看起來是很煩惱的，其次無關緊要的內容盡量小一點，有贊自己廣告做那么大區(qū)域，還不如多放點店鋪相關的，商家買來是自己用的，并不想一直看有贊的廣告，建議小一點，以上個人意見，可能會有不好的。
額，這思路。
工資很高，感覺有點溢價~
寫的什么玩意，條理不清，吐槽一堆，貨不干
對不起我批評一句，原型看似統(tǒng)一，說不上酷炫，我就提一點，側邊欄只顯示圖標，怎么快速找到想找的入口，多了一步操作
原型效果確實做得很酷炫
不懂就問，你這樣設計真的好嗎？是不是一個頁面承載的內容太多了？感覺沒有重點。進入首頁，第一感覺就是頁面承載的內容太多給我?guī)淼膲毫Ω?，其次是迷茫。不知道點哪里
感覺你寫的文章邏輯很混亂，不知道你想表達的重點是什么
您好 想問一下這種原型圖是用什么畫的呀 是axure還是sketch呀
說實話，第一眼感覺很是“高大上、白富美”，但我瀏覽了整個頁面后，除了視覺上給我?guī)硪恍碌母杏X之外，其他的并沒有給我?guī)硖貏e之處（純自己的感受，不喜勿噴），在我理解，后臺最主要是業(yè)務人員進行操作，而對業(yè)務人員來說，最關鍵的是提升效率，只要頁面上不是太垃圾（像樓主說的那種銀行，或者是企事業(yè)單位的系統(tǒng)真的是讓人無力吐槽），基本都可以滿足業(yè)務人員的訴求，我也是有贊的忠實用戶，我也在用有贊系統(tǒng)，總體上來說，個人感覺還是不錯的，相比市面上的其他后臺系統(tǒng)UI，有贊還是首屈一指的。我個人對后臺系統(tǒng)UI方面的理解就是，簡單，實用為主，整臺花哨，說實話，有時候并不能解決用戶的實際問題，當然，我不否認樓主的實力，一個普通人的思考，不足之處，請指正~
第一