聊聊UX設計中的“干”“濕”模式

0 評論 7253 瀏覽 19 收藏 17 分鐘

在做用戶體驗設計時,我們可能會不小心對用戶的交互效率視而不見,導致讓用戶不斷重復低效的活動。這個時候,我們可以借助一些概念來提升交互效率。這篇文章里,作者就總結了“干”(Don't Repeat Youself)、“濕”(Waste Everyone's Time)模式及相關應用,一起來看。

一、什么是“干”模式?

如果你想的是一種不含潮濕或液體的狀態,的確沒錯。但是我想說的卻不是這個。

我所講的“干”(DRY)是“不要重復”(Don’t Repeat Yourself )的縮寫。這是一個軟件開發原則,由 Andy Hunt 和 Dave Thomas 在他們的《程序員修煉之道》(The Pragmatic Programmer)一書中提出。該原則指出,“在一個系統中,每個知識點都必須有一個單一、明確、權威的表述”。

“干”原則提倡盡量使用抽象來代替,以減少代碼的重復,避免冗余。

二、什么是“濕”模式?

而另一方面,除了用來描述一種潮濕的狀態,“濕”(WET)也是“浪費大家的時間”(Waste Everyone’s Time)、“我們喜歡打字”(We Enjoy Typing)、“每次都要寫字”(Write Every Time)和“所有東西都要寫兩遍”(Write Everything Twice)的縮寫。這是一種有趣的說法來表示當你的代碼不夠“干”時會發生什么。

打住,我們現在是在談論 UX 設計嗎?當然了,跟著我繼續往下走。

三、為什么需要“干”模式

高效!這就是原因。

為什么在同個環境里只寫一個就足以用九十九次,甚至數千次或在數千個地方應用的指令集,我還需要不斷重復地寫呢?

當我需要去修改指令中的某些東西的時候會發生什么?難道要做數千個“復制粘貼”的動作嗎?

“干”原則通過使用戶(即程序員)以較少的時間和精力成本來實現更高的投產比,從而節省時間、精力和金錢。

反過來,“濕”模式將會耗費人力、時間和金錢,投產比卻更低甚至沒有。簡直就效率殺手。

四、兩個“星球”的故事

“干”模式是一個原則,而不是一個具體的方法。要通過“干”模式來實現高效率,你需要在特定的環境中去使用它,例如編程語言、數據庫、測試計劃或文檔。因此,你需要可以實現的工具。

現在,盡管軟件工程界非??粗匦?,看重到刻意把他們所有的編程工具都建立在“干”原則上,但是 UX 設計界卻把它留給了設計師自由判斷的波動和偏見。(譯者注:即沒有上升成為行業內的共識)

除了最佳實踐的灌輸外,通過給所有開發軟件都配上可以實現“干”模式的工具包,軟件工程界已經消除了在他們“星球”上不實踐的所有借口。他們不僅非常高效,而且還在沿著生產力的軸線推動邊界的發展。

在我們的“星球” ——數字產品設計界,卻是另一番景象。盡管我們有一大堆優秀的原則、規則和流程,使我們可以確定機會、識別和定義解決方案、創造以用戶為中心的體驗,但是我們卻很少有甚至沒有基本的結構來保證效率,并為用戶提供最大的生產力。因為這不是我們設計思維過程中的一部分。

盡管“干”原則是軟件工程“星球”上,每個程序員在上班第一天就必須遵守的基本法則;但在 UX 設計“星球”的頂層,它都不是必需遵守的部分。因此,用戶的交互效率就往往取決于設計師的奇思妙想了。如果我們中有些人關注到且貫徹了這個原則,用戶會很高興;而當我們忘記或忽略了它時,用戶就會受苦。設計團隊越晚關注到,用戶就受越久的苦。

這點對于那些設計幫助用戶生成和管理信息(尤其是重復性內容)的應用或功能的設計師來說,尤為真實。甚至那些頂尖的產品都可能沒有做好 —— 沒錯,說的就是你,微軟、谷歌、蘋果、Canva、Medium 和 Figma。

五、UX設計中的“濕”模式

在UX設計中,“濕”模式就是那些對效率有負面影響的設計結構或構成。它們之所以存在,從根本上說,是因為負責的設計團隊沒有一個質量控制原則,來確保交付到用戶的東西都是通過了“干”測試。因此,他們發布的產品或功能就效率低下,迫使用戶在同一環境的不同實例下需要重復同樣的動作。“濕”模式導致了低效和冗余,損害了效率和生產力。

UX設計中的“干”“濕”模式

5 條線,端點分別代表用戶的努力和結果。5 次的努力產出 5 個結果,努力和結果的比例為 1:1。

六、“濕”模式的一些案例

盡管工程界將“濕”模式視為禁忌,但是設計界卻淡化、忽視、推脫甚至為其辯護。以下是一些數字產品中的“濕”模式案例:

1. Medium

如果你花了 10 分鐘在 Medium 上寫了一個草稿,然后你需要將一個已經在 30 處不同的地方出現過的詞“聰明”替換成“靈動”,你就需要掃描找到每一處的“聰明”,然后輸入或填充“靈動”替換它。

你可能會想到,Office 的 Word 和同樣用于編寫 Medium 的 IDE [1],比如 VSCode ,就有好的對應的處理方式。產品團隊其實從一開始就要想到應該給 Medium 編輯器加上查找和替換的功能,因為它是一個文字處理工具,而作者需要經常更換或替換一些內容。但事實并非如此,我們不得不接受重復勞動。

( [1] IDE: Integrated Development Environment(集成開發環境)的縮寫,是一種綜合性的開發工具,通常包括編輯器、編譯器、調試器和其他工具,用于開發、測試和調試軟件應用程序。IDE 提供了許多有用的功能,例如語法高亮、自動補全、調試和測試工具、版本控制等,可以提高開發效率和代碼質量。)

同樣的用戶流程也發生在 Medium 文章中將 URL 添加到高亮顯示的字符串中,也可用于將其替換為另一個字符串,而不會對界面結果產生任何影響。然而,由于用戶的交互被留給設計師隨性裁定, Medium 的產品負責人最終就讓用戶接受了“濕”模式。如果“干”原則是設計的基本原則,那么這種討論就沒有必要了,因為這個原則第一天就應該出現在 PRD 文檔上。

2. Figma

你在使用 Figma 的時候是否遇到過這樣的情況,你已經將顏色、字號、位置等屬性應用到了一組形狀上,現在需要替換為另一種形狀,但不要改變原來的屬性?

反正我是遇到了好多次了。每一次,我都希望可以選擇想要改變的形狀,右鍵點擊替換的形狀,從下拉菜單中點擊“替換已選”,然后立馬看到生效?;蛘?,更好的是,在選擇了前者后直接點擊新的,就完事兒了。

那么 Figma 實際上是怎么做的呢?你猜的沒錯,它迫使我們每次要做這樣變換的時候,都需要重復做所有的事,又讓我們接受“濕”模式。

有趣的是,我在 Freepik 上遇到了同樣的功能,但他們卻實現了“干”模式。我心想:Figma 在最不需要的小點上都做到了,為什么在最需要的地方卻忽略了呢?答案是:他們并不是有意為之,而是因為“干”原則并不是其基本設計原則之一。

3. Apple

在 2023 年 1 月 iOS 16.2 發布之前,如果你想給每張圖片獨特的設置,在 iPhone 上編輯多張圖片是非常好的。

然而,如果你拍了一百張照片,且需要對里面的多張照片進行同樣的編輯時,你可能會嘗試通過從一張圖片復制設置到另一張,而不是為每張圖片重復編輯步驟,以此來節省時間。然而,你的愿望落空了,蘋果公司選擇了讓我們為所有的 100 張圖片重復相同的步驟,直到 2023 年 1 月。

謝天謝地,他們在 2023 年終于看到這點。但是蘋果公司,你怎么會花了這么長的時間?是不是因為你們的設計原則和最佳實踐從未將“干”原則包含在內。

七、UX設計中的“干”模式

在 UX 設計中的“干”模式就是那些最大化效率的設計結構或構成。它們的存在,從根上說,是因為負責的設計團隊有意為他們的用戶打造高效的工作流程。

“干”模式會優化設計,使效率最大化,同時最大限度地減少用戶交互的冗余。

UX設計中的“干”“濕”模式

1條線代表用戶的努力,與代表結果的5條線平行地連接。同樣的努力產生了5倍的結果,努力和結果的比例為1:5。

八、“干”模式的一些案例

盡管在UX設計“星球”上有一些“濕”模式,但是我們同樣也有一些“干”模式的案例,它們解放了我們的生產力,使我們從中受益。我將會強調這些模式,以幫助加強和鼓勵采用干式原則作為 UX 設計的基本原則。

當然,案例非常多,我只舉以下的一些內容。

1. 圖形設計——Adobe 的智能對象

“智能對象”是一種容器,可以將一組的內容鏈接到 Photoshop 中的多個圖層。它可以使設計師們對這些圖層應用狀態進行更改,同時保護原始或父級的內容?!爸悄軐ο蟆惫δ苓€可以支持將其他項目(Project)中的圖像鏈接到現在的工作中。對“智能對象”所做的更改會自動同步到所有的實例(Instances)。我現在仍能夠記得 Adobe 在 2014 年推出這個功能時的盛況,感謝他們的付出。

2. UI設計和原型——組件

在設計中,組件就是用戶界面中可以重復使用的構件。它們是設計領域中最突出的“干”式案例之一。它們使設計師們可以在不同的地方使用同樣的設計對象,同時在一個父級的對象管理它們的屬性。試想一下,如果我們不得不在設計項目的 50 個不同地方單獨交互或操作 50 個主按鈕屬性,多么可怕。Figma,、AxureRP、Sketch 、UXPin 以及其他原型設計工具通過組件讓我們保持“干”模式和理智。

3. 文字處理——查找和替換

用過微軟的 Word 或者類似于 Atom 或者 VScode 的代碼 IDE 的人,都會在某個時刻,需要在他們的文檔中用另一個詞或短語替換一個常見的單詞或短語,而不用多次復制或輸入相同的內容。像 Word 和代碼編輯器這樣的文字處理軟件通過“查找和替換”功能使這成為可能。

4. 圖像處理——Apple

Apple 更新了 iOS 16.2,增加了一項功能,允許用戶將一張圖片的編輯同時也可以應用于其他的圖片?,F在就是“干”模式了。

三張iPhone截圖演示iOS 16.2的“復制編輯”與“填充編輯”功能

九、總結:讓我們更加重視效率吧

用戶交互的效率不應該完全由設計團隊決定。我們是人類,我們可能會忘記、有偏見或者無知。這是正常的,我們都在成長中。但是,就像我們的工程師同事們,我么應該確保這些弱點不會擾亂我們的工作質量。

我們在設計思維上做得很好,取得了很多成果。但我們應該更加有意抽“干”用戶的交互。我們可以從確立“干”原則作為 UX 設計的基本原則之一,與 “以用戶為中心” “一致性” “層級” “上下文” “用戶控制” “無障礙性” “可用性” 齊名開始。

盡管“效率”是以上提到的第七個基本原則“可用性”的 5 個組成部分之一,但是我仍然建議設計界可以考慮將“干”原則作為第 8 個基本設計原則,以在各方面指導我們的設計決策。

此外,我們也可以將它添加到我們的設計啟發式 [2] 中,并向初學者傳授這一理念。更加認真地對待效率,認真到將我們的所有產品、流程和功能都“干”化。只要我們愿意,就可以做到。

( [2]“設計啟發式”(design heuristics)指的是一系列被設計師用來指導和評估設計的通用原則或規則。這些原則或規則旨在幫助設計師在設計過程中更好地了解用戶需求,提高設計的質量和效率。常見的設計啟發式包括可用性原則、用戶體驗原則、信息架構原則等等。)

原文作者:Samuel Anwakang(本文翻譯已獲得作者的正式授權)

原文:https://bootcamp.uxdesign.cc/dry-vs-wet-patterns-in-ux-design-e0ff4d1fd2ac

譯者:藍建杭;審核:李澤慧;編輯:韓碩;微信公眾號:TCC翻譯情報局(ID:TCC-design);連接知識,了解全球精選設計干貨。

本文由@TCC翻譯情報局 翻譯發布于人人都是產品經理,未經許可,禁止轉載。

題圖來自 Unsplash,基于 CC0 協議。

該文觀點僅代表作者本人,人人都是產品經理平臺僅提供信息存儲空間服務。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發揮!