Halo，這里是設(shè)計(jì)夾，今天分享的是「改版復(fù)盤」。

在小微企業(yè)中，時(shí)間緊的情況下，設(shè)計(jì)改版的工作是如何進(jìn)行的？B端產(chǎn)品是否能大幅改動(dòng)？產(chǎn)品經(jīng)理問不到有啥價(jià)值的東西？產(chǎn)品讓你抄競品有怎么辦？….

本文沒有什么花里胡哨的推導(dǎo)，也沒有自下而上的包裝美化，有的只有前期思考不周后、需求變更的改圖和暫未解決的問題…

1.產(chǎn)品定義

我就不細(xì)說了，大致就是提取數(shù)據(jù)的軟件，且后面的界面都會(huì)脫敏處理。

2.改版背景

主要源于客戶投訴，老板表示很生氣，催促體驗(yàn)優(yōu)化。那么我們從客戶哪里收集到了部分吐槽，以及開會(huì)分析了自家軟件的問題。下圖隨意羅列了一部分，不全僅示意。

3.定義問題

擰巴的適配

因?yàn)槲覀冇袃深惪蛻?，分別使用的是帶魚屏和普通屏。之前設(shè)計(jì)的時(shí)候，可能是因?yàn)橘Y源和難度問題，設(shè)計(jì)只出一套圖，而且還要考慮到兩個(gè)屏幕。

就像一個(gè)老實(shí)人，兩邊都想討好，把自己弄得不倫不類，其實(shí)雙方都不舒服。那怎么辦哪呢?

要么堅(jiān)持自己，不一樣的煙火，只為遇見共鳴的人。(當(dāng)然我們產(chǎn)品肯定不能這樣)

要么給自己賦予不同身份，不同身份下做不同事。（也就是大屏身份和小屏身份，故不干擾）

不合理的布局

就像汽車啟動(dòng)按鈕裝在了后座，左撇子使用左開門冰箱….

無動(dòng)于衷的反饋

之前客戶提到的不流暢，有部分原因就是因?yàn)榉答伻笔?。就像領(lǐng)導(dǎo)分配了任務(wù)，員工不回應(yīng)，默默做完了，最后做完還不告知。（小樣，你還挺有脾氣，我要炒了你）

4.構(gòu)思點(diǎn)子

作為設(shè)計(jì)師，“抄”我為什么說的這么理直氣壯，因?yàn)椴皇俏姨?，嘿嘿?/p>

首先，這個(gè)客戶喜歡某競品的方案，且咱們產(chǎn)品經(jīng)理其實(shí)一開始就計(jì)劃用競品的方案。

那就這么聽他們的？也不是，當(dāng)然要驗(yàn)證抄的可行性。

能否大改動(dòng)？

一般來說，B/G端客戶歡迎“增加”,反對“修改”，抵制“刪除”。本來已經(jīng)用慣的東西，突然改變，自然就不能快速幫他們完成目標(biāo)。

就比如我而言，之前有個(gè)網(wǎng)銀轉(zhuǎn)賬的網(wǎng)站。老版本開始的時(shí)候邊用邊罵，也用習(xí)慣了。后來某一天，來了一個(gè)全新的版本。我進(jìn)去看來下，還是切換老版本了。因?yàn)槭侨碌模兇嬖诹瞬淮_定性，沒有掌控感。我擔(dān)心這次操作時(shí)間會(huì)不會(huì)變長，會(huì)不會(huì)使用過程會(huì)出錯(cuò)。

所以，一般來說，就修修補(bǔ)補(bǔ)即可了。

而抄競品，意味著徹底拋棄了用戶原來的習(xí)慣，貌似抄的方案不可行。是這樣嗎？接下來再了解下實(shí)際情況。

1.沒吃習(xí)慣

咱們的客戶根本就沒習(xí)慣吃那，投訴很多。

2.平時(shí)也喝牛奶

據(jù)了解，咱們客戶平時(shí)用的更多的是咱們競品，喜歡用，用的習(xí)慣。

3.能否解決上面定義的問題？

基本能解決，但也要做調(diào)整。

4.答案呼之欲出，抄吧

競品的牛奶可能是純牛奶，不甜。我們可以抄的同時(shí)，點(diǎn)糖。

5.設(shè)計(jì)探索

1.頁面布局探索

下面主要針對帶魚屏的設(shè)計(jì)。

方案A

黑框假設(shè)為屏幕。軟件大小普通屏幕和帶魚屏尺寸保持一致。區(qū)別在于，兩側(cè)空余部分提供了小組件。

比如可以提供一些快捷入口，無視層級；又或者提供當(dāng)前任務(wù)時(shí)，需要借助到的工具，包括現(xiàn)在很火的AI，都可以考慮進(jìn)去。

但是產(chǎn)品經(jīng)理覺得是費(fèi)時(shí)間，而且他也不知道要提供什么，就放棄了。（雖然我自己挺喜歡這個(gè)的）

方案B

程序鋪滿屏幕。里面的表單項(xiàng)左對齊，不平鋪滿。非設(shè)計(jì)人員一致覺提取表單區(qū)域，右邊留白太多不好看。

方案C

我將表單項(xiàng)，拆成2列，不常操作的放右邊。

產(chǎn)品：單獨(dú)一列。反而有強(qiáng)調(diào)的意思。

我：初次使用存在這個(gè)情況，之后反而更容易選擇性忽略，效率會(huì)更高。

產(chǎn)品：我們那個(gè)功能沒做完善，最好不要給他們看到。

我：…

（還有其他討論，就不說了，比如隱藏之類的）

方案D

我：太長了，看起來費(fèi)勁。

產(chǎn)品：好看，就他了。

我：…

（改多了，爭多了，身心會(huì)疲憊的，你說啥就啥吧。）

2.階段性總結(jié)

2.1 美即好用效應(yīng)

公司同事是女生，所以特意找了男明星的圖。人們對長得好看的人的容忍度都比較高，容易原諒他，容易幫助他….

同理，當(dāng)產(chǎn)品或服務(wù)的設(shè)計(jì)在美學(xué)上令人愉悅時(shí)，人們會(huì)更容忍次要的可用性問題。

很多人對空好像過分在意，但是上邊方案的不空的美感也就一般般吧？所以這時(shí)候，沒有更好的方案之前，好用比好看重要。

還是不認(rèn)可是吧？那么，而且再類比下。若情侶因顏值在一起。時(shí)間一久，也有看厭的時(shí)候，那這時(shí)候，包容性也開始下降了，開始容易挑剔毛病。（你們對號(hào)入座，是否這樣）

所以我給這個(gè)效應(yīng)加個(gè)前提。適用于前期，初次見面，初次使用。也就是產(chǎn)品推銷的時(shí)候，還是需要好看的。

2.2 假想人

評審的時(shí)候，往往會(huì)把自己帶入成用戶，當(dāng)時(shí)會(huì)把當(dāng)前所處的環(huán)境（比如觀看距離、燈光、設(shè)備…）誤以為是實(shí)際使用環(huán)境，也經(jīng)常僅以初次使用的角度去看待產(chǎn)品的好壞。總結(jié)來說，容易局限在當(dāng)前。

《設(shè)計(jì)的陷阱：用戶體驗(yàn)設(shè)計(jì)案例透析》中通過一項(xiàng)研究指出，人們越是努力猜測用戶會(huì)想什么或做什么，就越會(huì)將自己的偏好和偏見融入對用戶的判斷之中，甚至更可能忽略與自己的猜測相悖的證據(jù)?？肯胫皇且环N虛假的同理心，只有真正的體驗(yàn)過實(shí)際情景，才能理解用戶需求。

不過我們平時(shí)工作中，一般也體驗(yàn)不到。更多的只能靠去問，去了解行業(yè)。除此之外，我們可以盡量去模擬環(huán)境、去了解心理學(xué)，了解人的共性，而不靠空想，靠自己這個(gè)假想人。

3.提取配置頁探索

3.1 提取應(yīng)用模塊

看到原型，最費(fèi)解且覺得有問題的地方，如下圖（且是老版本已經(jīng)再用的設(shè)計(jì)）

現(xiàn)有的交互是，每個(gè)選項(xiàng)下，都是相同的應(yīng)用列表，無非是應(yīng)用的選中與否。（快速選擇：系統(tǒng)默認(rèn)選中高頻項(xiàng)。自定義：對比其他，就多了個(gè)搜索框）

如果我全部選擇，那么下面取消勾選了部分，又會(huì)怎么樣，是不讓我取消了嗎？如果在快速選擇項(xiàng)下面，我想在多勾選加個(gè)，不也叫”自定義“嗎？

當(dāng)時(shí)我就覺得一個(gè)簡單的任務(wù)怎么搞的這么復(fù)雜，具體讓我再說原因，我也說不上來 (當(dāng)時(shí)沒有思考原型方案適合用在哪，只覺得有更合適的就直接設(shè)計(jì)了。后面我會(huì)說說原型方案)

方案A

側(cè)重要于應(yīng)用的選擇，刪除原先的單選，對應(yīng)的功能轉(zhuǎn)成輔助操作。

優(yōu)點(diǎn)：三個(gè)選擇變成一個(gè)選擇，相對比較簡單易理解

方案B

采用線框按鈕的形式，強(qiáng)化了輔助操作。應(yīng)用選項(xiàng)采用卡片式，更好點(diǎn)擊。且相對于方案A,不會(huì)有滿屏的應(yīng)用，視覺壓力小。

方案C（最終方案）

復(fù)選框后移，方案B 圖標(biāo)和復(fù)選框也一起，不容易找到是否勾選；改用灰色大背景，且選中色也用灰色，防止視覺疲勞。（因?yàn)槟J(rèn)全選）

方案D（復(fù)盤案例）

現(xiàn)在再來回顧一下原型方案的可行性。我先上一個(gè)微調(diào)版本。

如圖所示，只有在自定義的時(shí)候才會(huì)出現(xiàn)應(yīng)用列表，看起來仿佛不累贅了。

那么我想，為什么不用這個(gè)方案呢。無果，我去一個(gè)社群咨詢了，人家提到“選項(xiàng)優(yōu)先”。

豁然開朗了，我聚焦在了應(yīng)用列表而不是選項(xiàng)上（當(dāng)然業(yè)務(wù)也是如此），所以我沒做思考直接進(jìn)行了修改。感覺有時(shí)候拋開業(yè)務(wù)，好像思路還能跟開闊下。

所以改成上圖這樣，強(qiáng)業(yè)務(wù)相關(guān)，分門別類的，是否更適合這個(gè)方案了呢？

3.2 提取按鈕

方案A

表單項(xiàng)采用了頂對齊，按鈕左對齊。想當(dāng)然得，覺得這樣效率最高最快,以及滿足所謂的一致性。

然而，得知客戶往往不需要從上至下一項(xiàng)項(xiàng)填過去，進(jìn)而導(dǎo)致提取按鈕不容易被一下子找到。（這個(gè)簡圖看起來是挺清晰的，其實(shí)慢慢的應(yīng)用列表等，按鈕簡直就是融入其中）

方案B

如圖，居中展示，實(shí)際效果挺清楚的。所以，比如一些設(shè)計(jì)原則之類的，千萬不要死板硬套。

最后

就挑了幾個(gè)設(shè)計(jì)點(diǎn)講講，對我來說有意義的不是設(shè)計(jì)方案本身（種種原因，感覺設(shè)計(jì)的也不滿意），而是這次設(shè)計(jì)中碰到的一些問題和思考。

最后因?yàn)橐淮纬晌?，沒做調(diào)整修改，也沒照顧到觀眾老爺?shù)挠脩趔w驗(yàn)了，見諒見諒。