在做用戶體驗(yàn)設(shè)計(jì)時(shí)，我們可能會(huì)不小心對(duì)用戶的交互效率視而不見，導(dǎo)致讓用戶不斷重復(fù)低效的活動(dòng)。這個(gè)時(shí)候，我們可以借助一些概念來(lái)提升交互效率。這篇文章里，作者就總結(jié)了“干”（Don't Repeat Youself)、“濕”(Waste Everyone's Time）模式及相關(guān)應(yīng)用，一起來(lái)看。

一、什么是“干”模式？

如果你想的是一種不含潮濕或液體的狀態(tài)，的確沒(méi)錯(cuò)。但是我想說(shuō)的卻不是這個(gè)。

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

“干”原則提倡盡量使用抽象來(lái)代替，以減少代碼的重復(fù)，避免冗余。

二、什么是“濕”模式？

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

打住，我們現(xiàn)在是在談?wù)?UX 設(shè)計(jì)嗎？當(dāng)然了，跟著我繼續(xù)往下走。

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

高效！這就是原因。

為什么在同個(gè)環(huán)境里只寫一個(gè)就足以用九十九次，甚至數(shù)千次或在數(shù)千個(gè)地方應(yīng)用的指令集，我還需要不斷重復(fù)地寫呢？

當(dāng)我需要去修改指令中的某些東西的時(shí)候會(huì)發(fā)生什么？難道要做數(shù)千個(gè)“復(fù)制粘貼”的動(dòng)作嗎？

“干”原則通過(guò)使用戶（即程序員）以較少的時(shí)間和精力成本來(lái)實(shí)現(xiàn)更高的投產(chǎn)比，從而節(jié)省時(shí)間、精力和金錢。

反過(guò)來(lái)，“濕”模式將會(huì)耗費(fèi)人力、時(shí)間和金錢，投產(chǎn)比卻更低甚至沒(méi)有。簡(jiǎn)直就效率殺手。

四、兩個(gè)“星球”的故事

“干”模式是一個(gè)原則，而不是一個(gè)具體的方法。要通過(guò)“干”模式來(lái)實(shí)現(xiàn)高效率，你需要在特定的環(huán)境中去使用它，例如編程語(yǔ)言、數(shù)據(jù)庫(kù)、測(cè)試計(jì)劃或文檔。因此，你需要可以實(shí)現(xiàn)的工具。

現(xiàn)在，盡管軟件工程界非常看重效率，看重到刻意把他們所有的編程工具都建立在“干”原則上，但是 UX 設(shè)計(jì)界卻把它留給了設(shè)計(jì)師自由判斷的波動(dòng)和偏見。（譯者注：即沒(méi)有上升成為行業(yè)內(nèi)的共識(shí)）

除了最佳實(shí)踐的灌輸外，通過(guò)給所有開發(fā)軟件都配上可以實(shí)現(xiàn)“干”模式的工具包，軟件工程界已經(jīng)消除了在他們“星球”上不實(shí)踐的所有借口。他們不僅非常高效，而且還在沿著生產(chǎn)力的軸線推動(dòng)邊界的發(fā)展。

在我們的“星球” ——數(shù)字產(chǎn)品設(shè)計(jì)界，卻是另一番景象。盡管我們有一大堆優(yōu)秀的原則、規(guī)則和流程，使我們可以確定機(jī)會(huì)、識(shí)別和定義解決方案、創(chuàng)造以用戶為中心的體驗(yàn)，但是我們卻很少有甚至沒(méi)有基本的結(jié)構(gòu)來(lái)保證效率，并為用戶提供最大的生產(chǎn)力。因?yàn)檫@不是我們?cè)O(shè)計(jì)思維過(guò)程中的一部分。

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

這點(diǎn)對(duì)于那些設(shè)計(jì)幫助用戶生成和管理信息（尤其是重復(fù)性內(nèi)容）的應(yīng)用或功能的設(shè)計(jì)師來(lái)說(shuō)，尤為真實(shí)。甚至那些頂尖的產(chǎn)品都可能沒(méi)有做好 —— 沒(méi)錯(cuò)，說(shuō)的就是你，微軟、谷歌、蘋果、Canva、Medium 和 Figma。

五、UX設(shè)計(jì)中的“濕”模式

在UX設(shè)計(jì)中，“濕”模式就是那些對(duì)效率有負(fù)面影響的設(shè)計(jì)結(jié)構(gòu)或構(gòu)成。它們之所以存在，從根本上說(shuō)，是因?yàn)樨?fù)責(zé)的設(shè)計(jì)團(tuán)隊(duì)沒(méi)有一個(gè)質(zhì)量控制原則，來(lái)確保交付到用戶的東西都是通過(guò)了“干”測(cè)試。因此，他們發(fā)布的產(chǎn)品或功能就效率低下，迫使用戶在同一環(huán)境的不同實(shí)例下需要重復(fù)同樣的動(dòng)作。“濕”模式導(dǎo)致了低效和冗余，損害了效率和生產(chǎn)力。

5 條線，端點(diǎn)分別代表用戶的努力和結(jié)果。5 次的努力產(chǎn)出 5 個(gè)結(jié)果，努力和結(jié)果的比例為 1:1。

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

盡管工程界將“濕”模式視為禁忌，但是設(shè)計(jì)界卻淡化、忽視、推脫甚至為其辯護(hù)。以下是一些數(shù)字產(chǎn)品中的“濕”模式案例：

1. Medium

如果你花了 10 分鐘在 Medium 上寫了一個(gè)草稿，然后你需要將一個(gè)已經(jīng)在 30 處不同的地方出現(xiàn)過(guò)的詞“聰明”替換成“靈動(dòng)”，你就需要掃描找到每一處的“聰明”，然后輸入或填充“靈動(dòng)”替換它。

你可能會(huì)想到，Office 的 Word 和同樣用于編寫 Medium 的 IDE [1]，比如 VSCode ，就有好的對(duì)應(yīng)的處理方式。產(chǎn)品團(tuán)隊(duì)其實(shí)從一開始就要想到應(yīng)該給 Medium 編輯器加上查找和替換的功能，因?yàn)樗且粋€(gè)文字處理工具，而作者需要經(jīng)常更換或替換一些內(nèi)容。但事實(shí)并非如此，我們不得不接受重復(fù)勞動(dòng)。

（ [1] IDE: Integrated Development Environment（集成開發(fā)環(huán)境）的縮寫，是一種綜合性的開發(fā)工具，通常包括編輯器、編譯器、調(diào)試器和其他工具，用于開發(fā)、測(cè)試和調(diào)試軟件應(yīng)用程序。IDE 提供了許多有用的功能，例如語(yǔ)法高亮、自動(dòng)補(bǔ)全、調(diào)試和測(cè)試工具、版本控制等，可以提高開發(fā)效率和代碼質(zhì)量。）

同樣的用戶流程也發(fā)生在 Medium 文章中將 URL 添加到高亮顯示的字符串中，也可用于將其替換為另一個(gè)字符串，而不會(huì)對(duì)界面結(jié)果產(chǎn)生任何影響。然而，由于用戶的交互被留給設(shè)計(jì)師隨性裁定， Medium 的產(chǎn)品負(fù)責(zé)人最終就讓用戶接受了“濕”模式。如果“干”原則是設(shè)計(jì)的基本原則，那么這種討論就沒(méi)有必要了，因?yàn)檫@個(gè)原則第一天就應(yīng)該出現(xiàn)在 PRD 文檔上。

2. Figma

你在使用 Figma 的時(shí)候是否遇到過(guò)這樣的情況，你已經(jīng)將顏色、字號(hào)、位置等屬性應(yīng)用到了一組形狀上，現(xiàn)在需要替換為另一種形狀，但不要改變?cè)瓉?lái)的屬性？

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

那么 Figma 實(shí)際上是怎么做的呢？你猜的沒(méi)錯(cuò)，它迫使我們每次要做這樣變換的時(shí)候，都需要重復(fù)做所有的事，又讓我們接受“濕”模式。

有趣的是，我在 Freepik 上遇到了同樣的功能，但他們卻實(shí)現(xiàn)了“干”模式。我心想：Figma 在最不需要的小點(diǎn)上都做到了，為什么在最需要的地方卻忽略了呢？答案是：他們并不是有意為之，而是因?yàn)椤案伞痹瓌t并不是其基本設(shè)計(jì)原則之一。

3. Apple

在 2023 年 1 月 iOS 16.2 發(fā)布之前，如果你想給每張圖片獨(dú)特的設(shè)置，在 iPhone 上編輯多張圖片是非常好的。

然而，如果你拍了一百?gòu)堈掌?，且需要?duì)里面的多張照片進(jìn)行同樣的編輯時(shí)，你可能會(huì)嘗試通過(guò)從一張圖片復(fù)制設(shè)置到另一張，而不是為每張圖片重復(fù)編輯步驟，以此來(lái)節(jié)省時(shí)間。然而，你的愿望落空了，蘋果公司選擇了讓我們?yōu)樗械?100 張圖片重復(fù)相同的步驟，直到 2023 年 1 月。

謝天謝地，他們?cè)?2023 年終于看到這點(diǎn)。但是蘋果公司，你怎么會(huì)花了這么長(zhǎng)的時(shí)間？是不是因?yàn)槟銈兊脑O(shè)計(jì)原則和最佳實(shí)踐從未將“干”原則包含在內(nèi)。

七、UX設(shè)計(jì)中的“干”模式

在 UX 設(shè)計(jì)中的“干”模式就是那些最大化效率的設(shè)計(jì)結(jié)構(gòu)或構(gòu)成。它們的存在，從根上說(shuō)，是因?yàn)樨?fù)責(zé)的設(shè)計(jì)團(tuán)隊(duì)有意為他們的用戶打造高效的工作流程。

“干”模式會(huì)優(yōu)化設(shè)計(jì)，使效率最大化，同時(shí)最大限度地減少用戶交互的冗余。

1條線代表用戶的努力，與代表結(jié)果的5條線平行地連接。同樣的努力產(chǎn)生了5倍的結(jié)果，努力和結(jié)果的比例為1:5。

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

盡管在UX設(shè)計(jì)“星球”上有一些“濕”模式，但是我們同樣也有一些“干”模式的案例，它們解放了我們的生產(chǎn)力，使我們從中受益。我將會(huì)強(qiáng)調(diào)這些模式，以幫助加強(qiáng)和鼓勵(lì)采用干式原則作為 UX 設(shè)計(jì)的基本原則。

當(dāng)然，案例非常多，我只舉以下的一些內(nèi)容。

1. 圖形設(shè)計(jì)——Adobe 的智能對(duì)象

“智能對(duì)象”是一種容器，可以將一組的內(nèi)容鏈接到 Photoshop 中的多個(gè)圖層。它可以使設(shè)計(jì)師們對(duì)這些圖層應(yīng)用狀態(tài)進(jìn)行更改，同時(shí)保護(hù)原始或父級(jí)的內(nèi)容。“智能對(duì)象”功能還可以支持將其他項(xiàng)目（Project）中的圖像鏈接到現(xiàn)在的工作中。對(duì)“智能對(duì)象”所做的更改會(huì)自動(dòng)同步到所有的實(shí)例（Instances）。我現(xiàn)在仍能夠記得 Adobe 在 2014 年推出這個(gè)功能時(shí)的盛況，感謝他們的付出。

2. UI設(shè)計(jì)和原型——組件

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

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

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

4. 圖像處理——Apple

Apple 更新了 iOS 16.2，增加了一項(xiàng)功能，允許用戶將一張圖片的編輯同時(shí)也可以應(yīng)用于其他的圖片?，F(xiàn)在就是“干”模式了。

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

九、總結(jié)：讓我們更加重視效率吧

用戶交互的效率不應(yīng)該完全由設(shè)計(jì)團(tuán)隊(duì)決定。我們是人類，我們可能會(huì)忘記、有偏見或者無(wú)知。這是正常的，我們都在成長(zhǎng)中。但是，就像我們的工程師同事們，我么應(yīng)該確保這些弱點(diǎn)不會(huì)擾亂我們的工作質(zhì)量。

我們?cè)谠O(shè)計(jì)思維上做得很好，取得了很多成果。但我們應(yīng)該更加有意抽“干”用戶的交互。我們可以從確立“干”原則作為 UX 設(shè)計(jì)的基本原則之一，與 “以用戶為中心” “一致性” “層級(jí)” “上下文” “用戶控制” “無(wú)障礙性” “可用性” 齊名開始。

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

此外，我們也可以將它添加到我們的設(shè)計(jì)啟發(fā)式 [2] 中，并向初學(xué)者傳授這一理念。更加認(rèn)真地對(duì)待效率，認(rèn)真到將我們的所有產(chǎn)品、流程和功能都“干”化。只要我們?cè)敢猓涂梢宰龅健?/p>

（ [2]“設(shè)計(jì)啟發(fā)式”（design heuristics）指的是一系列被設(shè)計(jì)師用來(lái)指導(dǎo)和評(píng)估設(shè)計(jì)的通用原則或規(guī)則。這些原則或規(guī)則旨在幫助設(shè)計(jì)師在設(shè)計(jì)過(guò)程中更好地了解用戶需求，提高設(shè)計(jì)的質(zhì)量和效率。常見的設(shè)計(jì)啟發(fā)式包括可用性原則、用戶體驗(yàn)原則、信息架構(gòu)原則等等。）