那些你想太多的“過度設(shè)計”

14 評論 20435 瀏覽 180 收藏 15 分鐘

本文整理了一些出現(xiàn)在現(xiàn)實工作中的過度設(shè)計案例以及改進方式,希望對你的工作能夠有所幫助。

過度設(shè)計,一般是說過度滿足用戶需求的設(shè)計,用戶想要A,你給了他ABCDE,結(jié)果BCDE全部用不上,既讓用戶選擇困難,又浪費了團隊開發(fā)時間。

即使是有經(jīng)驗的設(shè)計師,有時也容易陷入自己的“小循環(huán)”中難以自拔,過度追求一些體驗的完美、或者需求的滿足,而導(dǎo)致最終的實際使用體驗下降,或者偏離產(chǎn)品設(shè)計初衷的悲劇結(jié)果。

本文整理了一些自己踩過的坑,希望能為設(shè)計師們提供一些前車之鑒以作參考。

過度追求精準(zhǔn)

例1:我們都知道載入內(nèi)容時需要loading狀態(tài),如下圖:

現(xiàn)實的業(yè)務(wù)場景中,需要加載的內(nèi)容往往不只一個,如下圖:雖然圖表比較多,但排列整齊有序,所以看上去還是比較舒適的。

再來看第三張:這樣的loading,是你想要的嗎?

這是一個曾真實存在過的業(yè)務(wù)場景圖,儀表盤中的圖表排版是用戶自行構(gòu)建的。大部分儀表盤中的圖表都不少于5張,且大小不一。每張圖表中的數(shù)據(jù)來源于不同的數(shù)據(jù)模型,模型大小會影響加載速度,所以加載速度有快有慢,再加上網(wǎng)速等一些客觀原因,有時就是會出現(xiàn)參差不齊一片loading的場景,而且出現(xiàn)的頻率還不低。

這時,就不應(yīng)該過于追求每張圖表與其loading狀態(tài)一一對應(yīng),用戶需要的是反饋,雖然精準(zhǔn)提示了反饋來自于哪張圖表,但如果界面展示反而讓用戶煩躁和混亂,那就得不償失了。

比較合理的做法是,把局部loading設(shè)計成全局loading ,起到反饋作用就可以了。如圖:雖然犧牲了一點精確性,但在體驗上用戶會更容易接受。

例2:這是一個篩選器控件的樣式設(shè)置頁面,有兩種樣式:縱向、橫向。

縱向的列表篩選器,相信大部分人都能理解。如下圖:當(dāng)你勾選了需要篩選的內(nèi)容時,相對應(yīng)的內(nèi)容就會被展示。

好了,現(xiàn)在來想象一下,橫向,是什么?是這樣的:

會發(fā)現(xiàn),橫向的列表篩選器比較難理解,甚至之前根本沒有看到過,僅僅從文案,很難聯(lián)想到最終的展示形式。橫向和縱向,從文案上來說是一個精準(zhǔn)的表達,同樣的功能,只是方向發(fā)生了改變,所以你不能說他錯。但用戶理解不了,就得換個設(shè)計思維。

重新從用戶的使用場景著手,大部分用戶習(xí)慣將橫向列表篩選器和圖表搭配在一起這么使用:

這非常像一個導(dǎo)航,切換導(dǎo)航就是篩選的過程,最終,我們把設(shè)置面板改成了下圖:“列表”和“導(dǎo)航”。雖讓從含義上不如前者精準(zhǔn),但對用戶來說,看到文案能夠直觀地聯(lián)想到最終展現(xiàn)形式,體驗上會更友好。

死板遵循設(shè)計法則

幾乎所有的設(shè)計師,在入門時都會接觸設(shè)計法則,設(shè)計法則為我們提供設(shè)計規(guī)范和評判標(biāo)準(zhǔn),運用這些法則,能讓我們在設(shè)計時更得心應(yīng)手,在闡述自己的方案時也會更有底氣。但所有的法則都不能盲目地遵守,得根據(jù)不同的場景靈活運用。

尼而森可用性原則中有一條叫做:一致性原則。同一用語、功能、操作需要保持一致。 這可以幫助我們的產(chǎn)品看起來更加統(tǒng)一和規(guī)范,但一些設(shè)計師會機械地執(zhí)行這條原則。如下圖:這是一個數(shù)據(jù)格式的設(shè)定彈窗,通過點擊btn,能夠激活該面板

在另一個界面,也有數(shù)據(jù)格式的設(shè)置,為了遵循操作方式一致,設(shè)計成了這樣,如圖:

細(xì)看后是否覺得有些地方比較違和,雖然都是通過點擊操作激活設(shè)置彈窗,但表單中的鏈接一般不會孤零零地出現(xiàn)在某一個條目中,其次,在彈窗中,應(yīng)該盡量避免再出一層彈窗,所以設(shè)置入口放在這里,是不合適的。

 

修改一下,這樣看上去是不是順眼多了?

雖然操作方式?jīng)]有完全統(tǒng)一,但彈窗和下拉菜單面板中的內(nèi)容布局是一致的,除此之外,下拉框和上一個表單條目也保持了形式統(tǒng)一,整體更和諧。靈活而不機械地運用設(shè)計法則,才能將其作用發(fā)揮到最大。

過度假設(shè)用戶行為

在設(shè)計的過程中,經(jīng)常會走著走著就進入了一個誤區(qū),“用戶可能會如何如何操作,所以我們應(yīng)該….”這樣的想法經(jīng)常會伴隨著大量的競品參考愈演愈烈,競品如果有的,而自己沒有就會覺得似乎少了什么。

舉個例子:漸變色的設(shè)置面板,有的色板是如下圖這樣的:類型、方向、角度、透明度、亮度等等,一眼看過去十分專業(yè)。

并不是每一個顏色設(shè)置場景都需要使用到到漸變色板,相對于一般的純色色板,它的使用門檻更高。對于這類設(shè)置較多的模塊,有時我們并不能確定是所有內(nèi)容全部提供還是只提供其中最常用的一部分,畢竟每一個功能似乎都有需求,難以舍棄;再加上設(shè)計迭代周期短,沒有足夠的時間做一次完整的可用性測試來研究和驗證用戶到底想要那些功能,所以就會陷入糾結(jié)。

可以試著先將所有的內(nèi)容歸類,同類組合,視覺上精簡內(nèi)容,內(nèi)容一旦形成區(qū)塊就比較容易區(qū)分出優(yōu)先級,優(yōu)先級低的內(nèi)容暫時先不放出來,如圖:

建議剛開始選擇較為簡單的方案,同時留出可擴展的空間,如果簡單的設(shè)計方案已經(jīng)能滿足用戶了,就不用盲目做加法,如果根據(jù)后期的可用性測試驗證用戶還有新的需求,再逐步添加。不要一下子就把用戶行為想得太復(fù)雜,設(shè)計太多,吃力還不討好。

過多展示內(nèi)在業(yè)務(wù)邏輯

To? b產(chǎn)品往往業(yè)務(wù)屬性較強,內(nèi)部邏輯比較復(fù)雜,概念定義也多。如圖:

報告設(shè)置針對的是全局的內(nèi)容,頁面設(shè)置針對的是當(dāng)前頁的內(nèi)容,由于技術(shù)是按照兩個入口實現(xiàn)該功能的,邏輯上也清晰,所以設(shè)計時兩個入口都暴露給了用戶,但經(jīng)過可用性測試,這兩者的概念區(qū)別對用戶來說都需要一定的理解時間,首次選擇時也容易疑惑。其實這些定義產(chǎn)品內(nèi)部分清就足夠了,不需要額外暴露給用戶

把兩個概念合二為一,直接進入當(dāng)前頁面設(shè)置,如果有需要,再勾選應(yīng)用到全局,用戶不需要在不同的入口之間猶豫選擇,體驗上會好很多。

過于把用戶當(dāng)“小白”

產(chǎn)品設(shè)計中經(jīng)常會強調(diào):把“用戶當(dāng)小白”,但這更多適合to c類產(chǎn)品,to c產(chǎn)品的操作流程更有規(guī)律性,做好引導(dǎo)或者在操作過程中自然地提示的確能夠幫助用戶更快上手。

而 to b類產(chǎn)品,尤其是工具類產(chǎn)品,使用者本身是有一定的專業(yè)基礎(chǔ)的,再加上操作頻繁,形式多樣,想要預(yù)判用戶的下一步的操作并不容易。如果老抱著一種我要去教用戶使用的想法,每一步都去提示、引導(dǎo),只會不停打斷操作流程,降低用戶體驗。

對于工具類的to b產(chǎn)品,與其不斷提醒,造成大量提示文案,不如在一些復(fù)雜概念或者復(fù)雜操作旁提供幫助,供用戶自己查閱學(xué)習(xí)。

例如:提供搜索入口幫助用戶快速定位到問題。

如果一些內(nèi)容難以理解,可以在一旁放上注釋框,hover時tooltip顯示。

如果注釋框難以解釋清復(fù)雜問題,可以直接提供幫助手冊的鏈接,點擊跳轉(zhuǎn)到新頁面查看詳細(xì)說明。

對于有一定專業(yè)基礎(chǔ)的用戶來說,提供工具書,當(dāng)他遇到問題時自行查閱,比強制性的手把手教往往作用更大。

盲目滿足用戶需求

參與過用戶訪談和可用性測試的設(shè)計師可能會有一個體會,經(jīng)常會出現(xiàn)“希望馬上把這個用戶提出的問題解決掉”的心理:”這個用戶提出的問題很有價值一定要記錄下來”,“那個用戶提出的抱怨確實忽略了馬上去改”。

這其實是對用戶的聲音缺乏篩選,很多用戶并不是產(chǎn)品人員,對于一些設(shè)計的考慮是缺乏理性的,只是片面的在抱怨一些主觀意見,夾雜了很多個人的喜好,“我不喜歡這個設(shè)計,感覺怪怪的”,“這個icon我看不懂,不知道什么意思”,如果不加篩選的就聽取意見,很容易就被上面的問題牽著鼻子走,造成不必要的過度設(shè)計,不僅會增加開發(fā)成本,還會喪失自己最初的設(shè)計原則。

在聽取用戶的聲音時,一定要保持冷靜和理智的頭腦,推演一遍真實的使用場景,判斷出哪些問題是普遍存在的,哪些問題只是個人主觀偏好,哪些問題改動成本小見效快,哪些改動牽一發(fā)動全身。不要過度滿足用戶需求。

結(jié)語

設(shè)計不足,顯得粗糙,設(shè)計過度,顯得花哨,剛剛好的精妙設(shè)計與這兩者的差別往往就在一念之間,對于度的把握,是需要設(shè)計師不斷積累和總結(jié)才能有所提升的,注意盡量不要用自己的標(biāo)準(zhǔn)來衡量大部份用戶,當(dāng)一個方案考慮過多時,需要暫時重新思考,檢查思維有沒有陷入死胡同或者越跑越偏,想出一個解決方案時盡量不要直接下定論,可以多與他人討論,觀察別人是否能直觀、迅速地理解設(shè)計,如果沒有,不要第一時間去爭論和捍衛(wèi)自己的方案,應(yīng)該詢問別人哪里覺得違和,然后不斷調(diào)整和完善,慢慢找到最恰到好處的設(shè)計。

 

作者:魏辛逸,網(wǎng)易高級交互設(shè)計師。

本文來源于人人都是產(chǎn)品經(jīng)理合作媒體@網(wǎng)易UEDC,作者@魏辛逸

題圖來自 Unsplash,基于 CC0 協(xié)議

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 請問截圖的是什么軟件工具 ??

    來自廣東 回復(fù)
  2. 過多展示內(nèi)在業(yè)務(wù)邏輯體會很深,也就是重后端輕前端了

    回復(fù)
  3. 請問截圖是什么軟件工具?

    回復(fù)
    1. 我也想知道???

      回復(fù)
  4. 精彩

    回復(fù)
  5. 總結(jié)的非常好 受教啦

    回復(fù)
  6. 很有用

    回復(fù)
  7. 很棒,我盡然是一路回想方案策劃看下來的,有異曲同工之處

    回復(fù)
  8. 從ToB的實際角度出發(fā),希望能夠看到連續(xù)的文章,加油!

    來自江蘇 回復(fù)
  9. 受教了

    來自黑龍江 回復(fù)
  10. 很多還沒有遇見的問題都被羅列出來大開眼界諾~那么想問,如果是客戶交付型To B的設(shè)計,如何最大化發(fā)揮設(shè)計者的作用呢

    回復(fù)
  11. 例子很貼合實際,學(xué)習(xí)了

    回復(fù)
  12. 總結(jié)的很好!贊

    來自北京 回復(fù)