今天上午一個不錯的討論在Twitter上出現(xiàn)了，Twitter不是最好的即時會話平臺，但是我們各取所需。這個討論起因于Lukas Mathis的一篇文章，他在這篇文章說到，用戶體驗設(shè)計師知道如何編寫代碼會妨礙他做出優(yōu)良的以用戶為中心的設(shè)計。我非常不同意他文章里的觀點，我們在Twitter上為討論這個話題留下了很多會話記錄。

如果你還沒有看他的那篇文章，那么請先看一下，然后再回到這里。

設(shè)計師并不僅僅讓設(shè)計看起來美觀

很顯然，用戶體驗設(shè)計師設(shè)計用戶體驗，但是，我們所說到的“用戶體驗”到底是什么呢？在網(wǎng)絡(luò)上，當(dāng)用戶使用一個網(wǎng)站或者網(wǎng)頁應(yīng)用的時候，用戶的整體體驗由很多方面構(gòu)成：

網(wǎng)頁給人的視覺感受
用戶是否能達到他的目的
網(wǎng)頁響應(yīng)用戶的整體速度
預(yù)期是否發(fā)生，例如，如果用戶認為網(wǎng)頁會對自己的操作產(chǎn)生某種形式的響應(yīng)，但是卻并沒有，他會感到很失望。

以上只是舉些簡單的例子。那么什么才是良好用戶體驗的要素呢？可以這么說，所有的細節(jié)都是。

您網(wǎng)站的用戶體驗并不僅僅是指您的網(wǎng)頁看起來如何，或者是當(dāng)用戶點擊一個按鈕時會發(fā)生什么，也不僅僅是指用戶完成預(yù)定目標的流程，而是包括了一切細節(jié)。從用戶打開您的網(wǎng)站到離開的整個過程中，他所做的一切和經(jīng)歷的一切都是用戶體驗的組成部分。用戶體驗設(shè)計師的工作是非常重要的，多方面的知識能使他的工作發(fā)揮更大的效用。

用戶體驗設(shè)計師需要知道什么

用戶體驗設(shè)計與用戶界面設(shè)計并不相同，涉及的方面要多得多。個人認為，用戶體驗設(shè)計師的工作應(yīng)該包括用戶界面設(shè)計，以及用戶在達到目標過程中的任務(wù)流程設(shè)計，需要設(shè)計師了解可用性測試的知識，了解易用性和一些用戶的特殊需求，還需要了解系統(tǒng)的基本功能是怎么在運作的。

最優(yōu)秀的用戶體驗設(shè)計師能結(jié)合多個學(xué)科的知識（如設(shè)計、開發(fā)，心理學(xué)）運用到工作中以最大限度地使用戶受益。

例如我在Twitter上和Lukas的會話中舉過的一個例子，一個用戶體驗設(shè)計師需要知道Ajax如何工作才能更有效地使用它。如果你不知道Ajax如何工作或者服務(wù)器請求是如何工作，你又怎么能確定在某些特定的環(huán)境中，Ajax方式對于用戶體驗來說是最好的？Lukas在Twitter上的留言里這么回復(fù)：

這恰恰是忽視代碼實現(xiàn)而改善用戶體驗的一個完美的例子；頁面刷新會使頁面更容易和快速地執(zhí)行。

正如我在下一段留言里所指出的，Lukas所說的實際上并不正確——在很多情況下，相比整頁刷新頁面，Ajax請求事實上執(zhí)行得更快。刷新整頁會向服務(wù)器發(fā)送更多的HTTP請求（例如請求CSS、JavaScript和圖片文件），但在很多情況下，Ajax請求僅僅返回一段文本數(shù)據(jù)，所以它向服務(wù)器發(fā)送的請求要少得多。在絕大多數(shù)情況下，用Ajax請求來發(fā)送或者獲取數(shù)據(jù)比整頁刷新都要快。

我怎么知道這些的呢？因為作為一個網(wǎng)頁用戶體驗設(shè)計師，我需要知道HTTP請求如何工作以及Apache（譯注：一種服務(wù)器軟件）如何響應(yīng)瀏覽器端的請求，并且知道當(dāng)我發(fā)送一個Ajax請求的時候服務(wù)器端在執(zhí)行什么樣的代碼。只有知道這些，才能在使用Ajax或者刷新整頁之間選擇前者作為解決方案。很多時候我決定用Ajax，正是因為它更快速并且使應(yīng)用程序更加靈敏地響應(yīng)用戶操作。用戶體驗的很大一部分來自于用戶對應(yīng)用程序的響應(yīng)速度的感覺，所以，我使用Ajax是一個以用戶為中心的決定，因為我知道這樣做能提高用戶體驗。

如果有些人僅僅從表面上了解Ajax的運作（“頁面沒有刷新但是執(zhí)行了某些代碼”），那么，他在作出決定使用Ajax而不是整頁刷新時候，其實并不完全知道Ajax的運作機制，有什么好處，有什么弊端，對應(yīng)用程序的性能產(chǎn)生什么作用，以及如何影響應(yīng)用程序緩存等等。這僅僅是一個在對關(guān)鍵知識沒有全面了解的情況下靠拍拍腦門就做出的決定。

設(shè)計大師熟悉自己的工具

建筑設(shè)計師并不僅僅畫藍圖，他們需要知道工程地區(qū)的地形地貌、氣候特征，以及考慮這各種因素選擇什么樣的建筑材料才最合適。他們并不僅僅是畫圖，還需要了解建筑工藝和整體結(jié)構(gòu)，需要對建筑材料和建筑過程有深入的了解，這樣才能更有效地開展工作。

廚師并不僅僅是把各種食材配料堆在一起然后祈禱上天就可以變出美味的大餐，他們需要對食物以及不同人群的口味有深入了解。

陶藝師并不僅僅是雕刻出漂亮的泥坯，他們還要燒制泥坯成型。他們需要知道關(guān)于上釉、溫度和燒制的科學(xué)工藝，才能像制作藝術(shù)品一樣來完成他們的工作。

正如建筑設(shè)計師、廚師和陶藝師一樣，用戶體驗設(shè)計師也需要知道關(guān)于網(wǎng)絡(luò)環(huán)境和媒介的知識。網(wǎng)頁設(shè)計師設(shè)計網(wǎng)頁，并且熟知可以將他們的設(shè)計圖最終實現(xiàn)成用戶界面的HTML和CSS。如果他們不懂得HTML和CSS，那么他們并不是真正地設(shè)計網(wǎng)頁，因為他們的設(shè)計不會考慮網(wǎng)絡(luò)環(huán)境的制約。當(dāng)一個自詡為網(wǎng)頁設(shè)計師的人對網(wǎng)絡(luò)媒介并沒有深入了解的時候會出現(xiàn)什么情況呢？在對自己的設(shè)計將如何影響用戶體驗缺乏足夠了解的情況下做出的決定，無疑是很糟糕的。舉個例子：

設(shè)計師A傳給HTML/CSS開發(fā)人員B一個用戶界面的設(shè)計圖稿。這是一個由多種元素組成的復(fù)雜的界面，每個框的每個角都是圓角，并且有3種不同的邊框，還加上了陰影效果。設(shè)計稿上的字體都是設(shè)計師專用的字體，而沒有任何用戶電腦上默認的網(wǎng)頁字體。

這個例子里，由于設(shè)計師對于網(wǎng)絡(luò)環(huán)境的一些局限并不熟悉，他們選擇了大量給用戶體驗帶來負面影響的素材來做設(shè)計。為了實現(xiàn)那些框的圓角，并且考慮到框會隨著里面內(nèi)容而被撐大，你需要增加HTML標記，CSS和圖片來實現(xiàn)。復(fù)雜的邊框樣式？意味著更多的代碼標記和圖片。陰影效果？那簡直需要一摞的具有半透明特殊效果的PNG格式的圖片。自定義的設(shè)計字體？你可能需要用到“可伸縮Inman Flash替換”技術(shù)來實現(xiàn)了（譯注：即sIFR技術(shù)，可參考百度百科：http://baike.baidu.com/view/1311052.htm）。

使用大量額外的代碼標記、圖片、Flash文件和javascript僅僅為了實現(xiàn)一個對用戶來說并沒有多大益處的效果。用戶在看到他們期望看到的網(wǎng)頁之前需要下載許多字節(jié)的數(shù)據(jù)。加載頁面額外的耗時僅僅因為對網(wǎng)絡(luò)媒介缺乏了解的設(shè)計師在設(shè)計網(wǎng)頁的時候腦袋中并沒有考慮網(wǎng)絡(luò)環(huán)境和網(wǎng)絡(luò)媒介的局限性。

這是否意味著你在網(wǎng)頁上不能實現(xiàn)一些漂亮的界面效果呢？當(dāng)然不是，看看網(wǎng)上有那么多看起來漂亮的網(wǎng)頁，運行起來也很漂亮。但是那種繪畫風(fēng)格濃重的網(wǎng)頁，體積難道不是都很龐大并且很慢？難道不是有很多對用戶體驗并無好處的視覺效果？事實上他們并不是那么漂亮，并且這也不應(yīng)該是你設(shè)計網(wǎng)頁的方式。

你不需要是專家

要理解Ajax請求如何工作，并不意味著你需要為實現(xiàn)Ajax請求去親手編寫JavaScript代碼，或者研究Apache服務(wù)器的進程處理，但是你需要對它足夠理解，才能對它的用途作出合理的判斷。正如建筑師在選擇各種建筑材料時，并不會因為某種材料看起來比較酷而選擇它，他們在做出選擇時會綜合考慮各方面因素，例如材料的結(jié)構(gòu)硬度、價格、以及缺陷等等。他們在對材料足夠了解的基礎(chǔ)上作出合理判斷，合理選擇材料以使物盡其用。

網(wǎng)頁用戶體驗設(shè)計師做出以用戶為中心的高質(zhì)量的決策也需要對網(wǎng)絡(luò)環(huán)境和媒介有充分了解。如果一個用戶體驗設(shè)計師想要使用一個復(fù)雜的交互模型，例如拖放效果，他需要了解程序?qū)崿F(xiàn)的這種效果應(yīng)用在網(wǎng)頁上的局限。網(wǎng)頁上的拖放和桌面應(yīng)用的拖放并不相同，因此你需要知道為什么不同，有哪些不同，以及如何正確有效地應(yīng)用它。如果你時常被網(wǎng)頁應(yīng)用的速度問題所困擾，那么，了解一些關(guān)于頁面加載執(zhí)行JavaScript文件的字節(jié)數(shù)方面的知識就顯得非常重要了。你還需要知道身體有殘障的用戶（譯注：例如無法進行精確的鼠標操作的用戶）如何來使用網(wǎng)頁，以及如何讓他們也能使用那些拖放功能。在用戶禁用JavaScript的情況下，你知道如何去應(yīng)對。

做出一個關(guān)于設(shè)計的決策并不像看起來那么簡單。這個決策的制定需要基于很多相關(guān)因素，如設(shè)計、開發(fā)、結(jié)構(gòu)、可用性以及易用性。用戶體驗設(shè)計師的工作需要從整體上考量各種情景和環(huán)境因素，以盡可能地使自己的工作卓有成效。是否掌握足夠的和自己的決策有關(guān)的知識，直接決定著用戶體驗朝好的或者負面的方向發(fā)展。

這有助于你成為專家

掌握足夠的知識來做出一些以用戶為中心的好的決策，當(dāng)然非常好，但是如果能對知識有更加深入、高級的了解，則是最好不過的了。如果你作為一個用戶體驗設(shè)計師，希望在某個界面中使用拖放，如果你能實現(xiàn)整個交互的原型，真切感受一下拖放操作的整體體驗，對你的工作將會是非常有幫助的。實踐出真知，如果你沒有動手去用過一個實際的界面，有些東西你很難真正了解。在設(shè)計工作之前能夠制作出一個實際的界面原型，及時發(fā)現(xiàn)一些你所不了解的東西，這是對你的工作是非常有價值的。

隨著Apple操作系統(tǒng)的演化，他們的用戶交互方式也在不斷改進。在Apple公司最新操作系統(tǒng)Leopard以及Apple的許多最新應(yīng)用中，動畫效果和更高級的用戶交互方案已作為用戶體驗的一部分得到運用。如果Apple公司的用戶體驗設(shè)計師完全不了解動畫的核心實現(xiàn)，他們就不可能運用Keynote和Flash之類的應(yīng)用技術(shù)來實現(xiàn)動畫效果，那么，他們發(fā)布的某個用戶界面版本很難有實質(zhì)上的更新。實際上，Apple公司的視覺界面設(shè)計師應(yīng)該知道Flash和Keynote并能用它們來實現(xiàn)用戶界面。呃，用戶界面設(shè)計師應(yīng)該知道如何編寫ActionScript代碼才能開展工作？我想是的，如果你不會，那么你團隊中會這些技術(shù)的那個同事工作上就會比你更加出色。

看看那些那些創(chuàng)建Mac和iPhone應(yīng)用程序的設(shè)計師，他們對于自己設(shè)計的界面是如何開發(fā)實現(xiàn)的都很精通。設(shè)計師們研究Cocoa（譯注：Apple的面向?qū)ο箝_發(fā)環(huán)境，用來生成 Mac OS X 的應(yīng)用程序），以期能夠創(chuàng)建iPhone的界面，因為一個優(yōu)秀的iPhone界面設(shè)計，關(guān)鍵部分并不僅僅是視覺效果，還包括交互行為。iPhone開發(fā)上最成功的設(shè)計師應(yīng)該是這樣的——他們熟悉設(shè)計和開發(fā)的知識，并且深入地知道兩者的局限制約?？纯磇Phone吧，他非常輕便，節(jié)能，并且沒有鍵盤。整部機器其實就是一個最大的制約，你首先需要知道這些限制是什么，才能在這個平臺上獲得成功。

用戶體驗設(shè)計師對你來說意味著什么？

現(xiàn)在，對于各種從事網(wǎng)頁工作的人有如此之多的頭銜，這讓我感到滑稽可笑。你可能被稱作界面設(shè)計師、界面工程師，視覺設(shè)計師、用戶界面工程師，信息架構(gòu)師或者用戶體驗設(shè)計師。甚至，你還會被叫做可用性工程師、可用性測試工程師、網(wǎng)頁設(shè)計師，或者網(wǎng)頁工程師。有著這么多的頭銜，并且這么多的職業(yè)技能需要互相跨越，那么，我們怎么知道用戶體驗設(shè)計師和用戶界面工程師的工作如何來進行劃分和銜接呢？

我只能結(jié)合自己職業(yè)生涯中的成功之處來談一談自己的看法，那就是，盡可能地學(xué)習(xí)和自己的工作平臺有關(guān)的知識。在網(wǎng)絡(luò)上，我的工作是設(shè)計用戶流程、交互方案、用戶界面模型，所有的HTML/CSS/Javascript雛形，并且有時候還需要把這些原型放到后臺與數(shù)據(jù)庫連接。我從開始設(shè)計網(wǎng)頁入手，學(xué)習(xí)了HTML和Javascript，然后學(xué)習(xí)了CSS、jQuery和Prototype框架，再到后來學(xué)習(xí)了PHP、MySQL和一些Ruby編程的知識。只要有機會我無處不在學(xué)習(xí)，因為，對于那些與你做出正確決策有關(guān)的知識，當(dāng)然是越熟悉越好。如果你掌握的信息越多，能獲得真實體驗，并且很深入地了解相關(guān)知識，那么你作出的決策會更加正確，你的網(wǎng)站和應(yīng)用程序?qū)τ脩魜碚f也更加地友好。

當(dāng)你需要作出一些重要的，以用戶為中心的決策的時候，你掌握的知識永遠不會嫌多。掌握越多的知識，你看待問題就會越全面。

英文原文：Designers Who Are Technical: The More You Know, The Better Your Work
原文作者：Mike Rundle
中文翻譯：rukey67

編后：有些做人做事的道理，其實咱都懂，說來說去也不愛聽了。但從人家老外嘴里說出來的東西，就可以扯上與國際接軌的大旗，就像咱們國家的油價一樣，一廂情愿地希望可信度會更高一點。所以翻譯了這么個東西。好久不碰外語，翻這么大一段，其實挺痛苦，尤其對于一個對語言表達很敏感的人來說。
precious sword is not yet old