摘 要：設(shè)計(jì)模式思想的主旨是針對(duì)常見(jiàn)的設(shè)計(jì)問(wèn)題提供已被驗(yàn)證為有效的解決方案，從而充分利用前人經(jīng)驗(yàn)和成果解決設(shè)計(jì)問(wèn)題，避免無(wú)意義的重復(fù)勞動(dòng)。近年來(lái)，該思想在界面設(shè)計(jì)領(lǐng)域逐漸受到重視，出現(xiàn)了一批重要的研究和應(yīng)用成果，但同時(shí)也暴露出了現(xiàn)有研究的一些不足?？傮w而言，界面設(shè)計(jì)模式在界面設(shè)計(jì)領(lǐng)域仍有很大發(fā)展?jié)摿Γ写谠O(shè)計(jì)研究者進(jìn)一步探索。

關(guān)鍵詞：設(shè)計(jì)模式；界面設(shè)計(jì)；交互設(shè)計(jì)

1 設(shè)計(jì)模式思想簡(jiǎn)介

設(shè)計(jì)模式思想的主旨是針對(duì)常見(jiàn)的設(shè)計(jì)問(wèn)題提供已被驗(yàn)證為有效的解決方案，從而充分利用前人經(jīng)驗(yàn)和成果解決設(shè)計(jì)問(wèn)題，避免無(wú)意義的重復(fù)勞動(dòng)。該思想最早由建筑師、加州大學(xué)伯克利分校建筑學(xué)教授Christopher Alexander在20世紀(jì)70年代提出。Alexander如此論述建筑設(shè)計(jì)模式的價(jià)值：“每一模式描述我們周?chē)h(huán)境中一再反復(fù)發(fā)生的某個(gè)問(wèn)題，接著敘述解決這一問(wèn)題的關(guān)鍵所在，這樣，你就能千百次地重復(fù)利用這種解決問(wèn)題的辦法而又不會(huì)有老調(diào)重彈之感。” [1]

Alexander闡述了設(shè)計(jì)模式的基本構(gòu)成要素，他認(rèn)為，每個(gè)模式都是一個(gè)規(guī)則，由三部分組成，表達(dá)了一個(gè)特定情境、一個(gè)問(wèn)題和一個(gè)解決方案之間的關(guān)系。[2]其中，“情境”表示該模式在解決問(wèn)題時(shí)的周?chē)h(huán)境和狀況，“問(wèn)題”表示該模式的目的或預(yù)期目標(biāo)，“解決方案”表示解決該問(wèn)題的方法的核心。然而，設(shè)計(jì)模式思想影響最為深遠(yuǎn)的領(lǐng)域并非建筑，而是軟件工程。20世紀(jì)90年代，Erich Gamma等人將設(shè)計(jì)模式思想推廣到了軟件工程領(lǐng)域。在Alexander的理論基礎(chǔ)上，Gamma等人制定了軟件設(shè)計(jì)模式的格式規(guī)范。他們認(rèn)為一個(gè)模式有四個(gè)基本要素：模式名稱(chēng)、問(wèn)題、解決方案、模式效果。[3]

Alexander和Gamma等人并沒(méi)有發(fā)明新的解決方案，而只是分別對(duì)建筑和軟件設(shè)計(jì)中現(xiàn)存的“無(wú)名”（即存在于設(shè)計(jì)實(shí)踐中，但尚未被人明確命名并提出）的優(yōu)秀解決方案進(jìn)行了系統(tǒng)化的總結(jié)和歸納，并以設(shè)計(jì)模式的形式表述出來(lái)。盡管如此，設(shè)計(jì)模式的價(jià)值仍得到了高度認(rèn)可。尤其是在軟件工程領(lǐng)域，設(shè)計(jì)模式已成為重要的程序設(shè)計(jì)指導(dǎo)理論。近年來(lái)，設(shè)計(jì)模式思想在界面設(shè)計(jì)領(lǐng)域也逐漸受到重視。

2 界面設(shè)計(jì)領(lǐng)域的設(shè)計(jì)模式研究現(xiàn)狀

Alexander的設(shè)計(jì)模式思想很早就已進(jìn)入交互設(shè)計(jì)研究者的視線(xiàn)。早在1988年，Donald A.Norman就在他影響深遠(yuǎn)的著作《The Psychology of Everyday Things》（后更名為《The Design of Everyday Things》）中提到了Alexander的研究成果。[4]但設(shè)計(jì)模式在該領(lǐng)域的發(fā)展較為緩慢，直到2000年前后，國(guó)外的交互設(shè)計(jì)和界面設(shè)計(jì)研究者對(duì)設(shè)計(jì)模式的關(guān)注才開(kāi)始逐漸加深，并逐漸出現(xiàn)了一些重要的研究成果。一些研究者和機(jī)構(gòu)提出了自己的界面設(shè)計(jì)模式規(guī)范和模式庫(kù)，如Jenifer Tidwell在《界面設(shè)計(jì)模式》一書(shū)中以設(shè)計(jì)模式的形式總結(jié)了界面設(shè)計(jì)的法則，給出了常見(jiàn)問(wèn)題的解決方法及其在實(shí)踐中的運(yùn)用，并以該書(shū)內(nèi)容為基礎(chǔ)構(gòu)建了一個(gè)設(shè)計(jì)模式庫(kù)。[5]雅虎公司也發(fā)布了一套具有影響力的網(wǎng)頁(yè)設(shè)計(jì)模式庫(kù)。[6]其他知名模式庫(kù)包括Welie.com、Quince等。

相對(duì)于國(guó)外研究的逐漸興起，國(guó)內(nèi)對(duì)于數(shù)字產(chǎn)品界面設(shè)計(jì)模式的相關(guān)研究和應(yīng)用則十分匱乏。雖然近年來(lái)出現(xiàn)了少量關(guān)于界面設(shè)計(jì)模式的論文和著作，如《Web2.0界面設(shè)計(jì)模式》，但這些文獻(xiàn)并未深入挖掘設(shè)計(jì)模式的思想，也未能提出較為系統(tǒng)、規(guī)范和全面的設(shè)計(jì)模式庫(kù)，實(shí)用價(jià)值有限?？傮w而言，國(guó)內(nèi)的相關(guān)研究和應(yīng)用與國(guó)外相比有較大差距，研究文獻(xiàn)的數(shù)量極少，深度不足，極其缺乏理論化、系統(tǒng)化的中文研究資料。

目前，界面設(shè)計(jì)模式相關(guān)研究主要集中于設(shè)計(jì)模式個(gè)體的研究和構(gòu)建。雖然也涉及不同設(shè)計(jì)模式之間的關(guān)系，但并未系統(tǒng)和深入地探討設(shè)計(jì)模式的編目方法，即如何將多個(gè)設(shè)計(jì)模式組織、統(tǒng)籌起來(lái)，以跳出單個(gè)設(shè)計(jì)模式的狹窄范圍，服務(wù)于更高層次的用戶(hù)目標(biāo)。這是目前相關(guān)研究的一個(gè)不足之處。Alexander雖然提出了“模式語(yǔ)言”的編目思想，但該思想仍然主要基于個(gè)人的主觀(guān)經(jīng)驗(yàn)，缺乏可推廣性。Robert Hoekman，Jr.和Jared Spool的研究起到了一定彌補(bǔ)作用。他們?cè)凇毒W(wǎng)站設(shè)計(jì)解構(gòu)：有效的交互設(shè)計(jì)框架和模式》一書(shū)中提出，應(yīng)將多個(gè)設(shè)計(jì)模式組織成框架體系，從而從全局的角度指導(dǎo)由多個(gè)設(shè)計(jì)模式組成的完整的界面系統(tǒng)設(shè)計(jì)。[7]在該書(shū)理論的基礎(chǔ)上，他們創(chuàng)建了一個(gè)公共的框架體系資源庫(kù)，包含了網(wǎng)頁(yè)交互設(shè)計(jì)的幾種常見(jiàn)框架示例。其框架格式與設(shè)計(jì)模式格式類(lèi)似，主要包含應(yīng)用情境、用戶(hù)目標(biāo)、任務(wù)流程、所用模式等。[8]

總體來(lái)說(shuō)，現(xiàn)有的界面設(shè)計(jì)模式研究主要存在三點(diǎn)不足：（1）缺乏對(duì)模式在設(shè)計(jì)實(shí)踐中的使用方式、方法和流程的研究。 （2）缺乏對(duì)模式編目方式（即如何綜合運(yùn)用多個(gè)模式解決問(wèn)題）的研究。 （3）缺乏對(duì)模式庫(kù)建立（包括模式識(shí)別、模式記錄）及擴(kuò)充過(guò)程的系統(tǒng)化研究。目前，模式庫(kù)的建立主要依靠建立者個(gè)人的經(jīng)驗(yàn)和觀(guān)察。

3 界面設(shè)計(jì)模式的應(yīng)用價(jià)值

在交互界面設(shè)計(jì)中，設(shè)計(jì)模式的價(jià)值主要在于[9]： （1）設(shè)計(jì)模式包含了問(wèn)題的相關(guān)信息，使得解決方案能夠確實(shí)地發(fā)揮作用。 （2）設(shè)計(jì)模式詳細(xì)闡述了解決方案是如何受上下文（即情境）限制的。 （3）設(shè)計(jì)模式闡述了解決方案的基本原理，其中包括了前人積累下來(lái)的經(jīng)驗(yàn)性知識(shí)。 （4）設(shè)計(jì)模式具有一種潛力：多個(gè)模式可以組織成一種模式語(yǔ)言，使設(shè)計(jì)師能夠以一種積極活躍的方式來(lái)跨越性地解決不同細(xì)節(jié)層次上的設(shè)計(jì)問(wèn)題。

如上所述，設(shè)計(jì)模式不僅能有效地解決問(wèn)題，而且充分考慮到了問(wèn)題的上下文情境，并從方法論的角度闡述解決方案的原理。這是設(shè)計(jì)模式與一般的零散性設(shè)計(jì)原則的重要區(qū)別。

設(shè)計(jì)模式的另一個(gè)應(yīng)用價(jià)值是它有效地彌補(bǔ)了目前廣泛應(yīng)用的設(shè)計(jì)指南（guideline）的不足。設(shè)計(jì)指南通常由企業(yè)發(fā)布，為該企業(yè)相關(guān)產(chǎn)品的界面設(shè)計(jì)提供指導(dǎo)和參考，以保證設(shè)計(jì)的一致性，幫助設(shè)計(jì)師提高設(shè)計(jì)質(zhì)量。典型例子有蘋(píng)果公司發(fā)布的《iOS Human Interface Guidelines》《iOS 7 UI Transition Guide》等。與設(shè)計(jì)模式庫(kù)相比，設(shè)計(jì)指南通常實(shí)例數(shù)量較少，且多闡述抽象和綱領(lǐng)性原理，而非像設(shè)計(jì)模式那樣提供具體設(shè)計(jì)案例，因而難以為設(shè)計(jì)師提供具體問(wèn)題的解決方法。而利用設(shè)計(jì)模式，設(shè)計(jì)師可以更為系統(tǒng)化、具體化地解決設(shè)計(jì)問(wèn)題。例如，西門(mén)子公司在實(shí)踐中成功運(yùn)用設(shè)計(jì)模式提高了其軟件開(kāi)發(fā)效率。該公司從2000年起就持續(xù)對(duì)界面設(shè)計(jì)模式進(jìn)行探索，并建立起了一個(gè)內(nèi)部界面設(shè)計(jì)模式庫(kù)，其模式的應(yīng)用范圍覆蓋了桌面、網(wǎng)頁(yè)應(yīng)用和移動(dòng)設(shè)備等不同平臺(tái)。[10]

4 總結(jié)與展望

從以上研究可以看出，設(shè)計(jì)模式在交互設(shè)計(jì)和界面設(shè)計(jì)領(lǐng)域的研究和應(yīng)用已取得了一定進(jìn)展，但近年來(lái)數(shù)字產(chǎn)品發(fā)展迅速，以iPhone等移動(dòng)設(shè)備為代表的新一代數(shù)字產(chǎn)品在我國(guó)迅速普及，扁平化、模塊化等新設(shè)計(jì)思想不斷涌現(xiàn)，設(shè)計(jì)模式思想也需要不斷跟進(jìn)，以符合時(shí)代快速發(fā)展的需求，體現(xiàn)出新一代數(shù)字產(chǎn)品的界面設(shè)計(jì)理念。國(guó)內(nèi)雖然引進(jìn)出版了《界面設(shè)計(jì)模式》等一批重要著作，但設(shè)計(jì)模式思想的影響力仍然不足，并未在界面設(shè)計(jì)領(lǐng)域得到廣泛認(rèn)知。如何挖掘設(shè)計(jì)模式的優(yōu)點(diǎn)，將其推介給國(guó)內(nèi)設(shè)計(jì)界，從而對(duì)產(chǎn)品的界面設(shè)計(jì)有所助益，是國(guó)內(nèi)界面設(shè)計(jì)研究者應(yīng)該思考的方向。該領(lǐng)域還存在其他一些有待探索的研究方向，比如如何將零散的設(shè)計(jì)模式以系統(tǒng)化的方法組織起來(lái)構(gòu)成整體框架，以及如何將設(shè)計(jì)模式應(yīng)用到硬件界面的設(shè)計(jì)中。此外，最新涌現(xiàn)的扁平化設(shè)計(jì)、響應(yīng)式界面設(shè)計(jì)等界面設(shè)計(jì)思想也亟須得到設(shè)計(jì)模式理論的支持?？傮w而言，界面設(shè)計(jì)模式在界面設(shè)計(jì)領(lǐng)域仍有很大發(fā)展?jié)摿Γ写谠O(shè)計(jì)研究者進(jìn)一步探索。

參考文獻(xiàn)：

[1] Christopher Alexander，et al.建筑模式語(yǔ)言[M].北京：知識(shí)產(chǎn)權(quán)出版社，2002：3.

[2] Christopher Alexander.建筑的永恒之道[M].北京：知識(shí)產(chǎn)權(quán)出版社，2002：194.

[3] Erich Gamma，et al.設(shè)計(jì)模式：可復(fù)用面向?qū)ο筌浖幕A(chǔ)[M].北京：機(jī)械工業(yè)出版社，2000：2.

[4] D.A.Norman.The Psychology of Everyday Things[M].Basic Books，New York，1988：229.

[5] Jenifer Tidwell.界面設(shè)計(jì)模式[M].北京：電子工業(yè)出版社，2013.

[6] Yahoo！Inc.[DB/OL]http：//developer.yahoo.com/ypatterns/.

[7] Robert Hoekman Jr.，Jared Spool.網(wǎng)站設(shè)計(jì)解構(gòu)：有效的交

互設(shè)計(jì)框架和模式[M].北京：人民郵電出版社，2010.

[8] Robert Hoekman Jr.，Jared Spool.[DB/OL]http：//webanatomy.rhjr.net/.

[9] Stefan L.Pauwels，Christian Hübscher，Javier A.Bargas-Avila，Klaus Opwis.Building an interaction design pattern language：A case study[J].Computers in Human Behavior，2009，26（3）：452-463.

[10] Helmut Degen，袁小偉.UX最佳實(shí)踐：提高用戶(hù)體驗(yàn)影響

力的藝術(shù)[M].北京：機(jī)械工業(yè)出版社，2013：174.

作者簡(jiǎn)介：石曦，北京服裝學(xué)院設(shè)計(jì)學(xué)專(zhuān)業(yè)研究生在讀。

通訊作者：楊九瑞，北京服裝學(xué)院副教授。