投入新的客戶項目時，你從何入手？一個項目取得成功的全過程中，扎實的工作流程能起到至關(guān)重要的作用，而這個流程卻是我們的行業(yè)里埋藏最深，也是最黑暗的秘密之一。從印刷、識別系統(tǒng)和廣告衍變而來，互聯(lián)網(wǎng)設(shè)計在方法和交付成果上保存了它的各個前身領(lǐng)域的印記，而那些前身領(lǐng)域所創(chuàng)造的產(chǎn)品其實是截然不同的。當我們向客戶提供帶有確定尺寸的詳細設(shè)計樣稿時，其中暗示著對最終成品的設(shè)計處理。這很可能使客戶產(chǎn)生與設(shè)計過程相脫節(jié)的感覺，由此帶來的那種已經(jīng)完工的錯覺會把客戶與我們的成品分離開來。為什么不能設(shè)計一種更加貼近客戶的期望和感情因素的工作流程呢？我們的交付成果必須進化到一種境界，使客戶能成為設(shè)計過程的積極參與者。

網(wǎng)站遠遠不止是一系列可用的界面：它能夠講述一個故事。“樣式板”是一種設(shè)計交付成果，它是結(jié)合字體、色彩和樣式組合的一套網(wǎng)站界面元素參考體系，與網(wǎng)站地圖、線型框架和其他有關(guān)用戶體驗的模型一同交付給客戶過目。與客戶探討視覺設(shè)計上的喜好是樣式板的基礎(chǔ)，它是一組樣本選項，以同一種視覺語言來激發(fā)與利益相關(guān)者的討論。樣式板包括用戶界面元素的設(shè)計樣本，體現(xiàn)設(shè)計師將用戶的品牌形象轉(zhuǎn)譯到互聯(lián)網(wǎng)的設(shè)計用意。當客戶用“友好”或“干凈”等詞語描述他們想要的網(wǎng)站時，樣式板用視覺的方式把這些形容詞體現(xiàn)出來。樣式板提供的是一種催化劑，能夠促進與客戶之間的討論，從而對設(shè)計喜好和目標加以澄清和細化。

感情層面上的交流

樣式板是項目開端的一個很有靈活性的工具，它用客戶能夠理解的語言定義了網(wǎng)站交流上的設(shè)計風格。相比傳統(tǒng)識別系統(tǒng)設(shè)計的風格展示板，樣式板包含更多的細節(jié)，但不像網(wǎng)站設(shè)計樣圖那么具體。室內(nèi)設(shè)計師對室內(nèi)空間進行再設(shè)計時，并不會把他們的多個設(shè)計意向塑造成型，而是提供一系列的織物和涂料配色樣本以及建筑表現(xiàn)圖。我們的樣式板就像網(wǎng)站界面的配色樣本，展現(xiàn)方案在任何顯示設(shè)備和任何尺度下的設(shè)計效果，是視覺設(shè)計上真正響應(yīng)式的解決方法。

識別系統(tǒng)設(shè)計常用的風格展示板是激發(fā)客戶討論的一個很好的啟動點，但它往往過于含糊而無法幫助客戶從討論中形成對網(wǎng)站清晰的感性認識。風格展示板可以很好地挖掘品牌形象的深度，但當我們需要把標識形象轉(zhuǎn)化到復(fù)雜的網(wǎng)站系統(tǒng)中時，這樣一個單薄的聯(lián)系很難使客戶理解并想象出最終的成果。相比之下，樣式板是一種較強的視覺設(shè)計產(chǎn)品，能夠幫助設(shè)計師展現(xiàn)各種設(shè)計樣式應(yīng)用在網(wǎng)站系統(tǒng)中，在包括電腦和移動終端等多種體驗下的視覺效果。

提出問題，從中抽取關(guān)鍵形容詞

樣式板流程能夠引出一個品牌背后的隱藏著的熱情，把客戶與項目聯(lián)系到一起的過程可以揭示大量有用的描述性語言。樣式板設(shè)計過程的第一步就是向與項目利益相關(guān)的客戶提問，可以使用統(tǒng)計調(diào)查的形式，或者在首次設(shè)計見面會上提出問題。首先，一定要請客戶在網(wǎng)站視覺設(shè)計上的列出目標，并對各項目標權(quán)衡輕重。從一開始就對目標進行定義，使項目在全過程中都能確認每一個設(shè)計決定的重要性。其次，在調(diào)查提問中要注意鼓勵客戶使用描述性形容詞。Adaptive Path的這篇文章中使用的比喻性提問就既有策略性又幫助打破僵局。例如，”如果你的網(wǎng)站是一輛汽車，它該是什么牌子的什么車呢？為什么？“這就是個極好的問題：圍繞不同的汽車品牌和種類，我們能找到很多社會性和文化層面的看法。不同的汽車品牌與不同的形容詞相聯(lián)系。對混合動力的豐田普銳斯（Prius）和運動休旅車（SUV），你的客戶肯定有不同的描述。

調(diào)查提問中的語義性差異問題是了解客戶的審美喜好的好方法。你可以舉出成對的反義詞，請客戶在兩者之間的標尺上選擇他們對網(wǎng)站的定位。他們想要的網(wǎng)站是現(xiàn)代的？傳統(tǒng)的？還是介于兩者之間的？這類問題幫助我們衡量客戶對網(wǎng)站潛在風格的描述語的認同度。你也可以請客戶評估“插畫型”“攝影型”和“文字型”等描述語，來體會他們對網(wǎng)站風格的偏愛。我經(jīng)常會為每一個描述語配一個網(wǎng)站范例使客戶理解其中的關(guān)聯(lián)，比如MailChimp可以作為“插畫型”的典型，而NPR則可代表“文字型”。

你所得到的答案可以形成一條感情層面的紐帶，把二維的視覺設(shè)計理念與客戶對品牌的熱情聯(lián)系起來。仔細地去傾聽，整理和剖析客戶的反饋，從而把客戶的描述明確地反映到樣式板中的視覺元素上。盡可能多地從客戶原話的字面上做文章，這樣客戶就能夠更有參與設(shè)計的感覺。如此建立起客戶的信任，能夠為設(shè)計順利獲得批準鋪平道路。

一旦客戶利益相關(guān)方完成了調(diào)查問卷，或在見面會上回答了提問，就要開始對取得的信息進行分析了。研究客戶反饋時，找到重點形容詞編輯為列表，看看是否有些詞出現(xiàn)的頻率較高，這些詞應(yīng)當歸到最前列。在這個過程中，設(shè)計的主題會開始確立，從中便可以形成網(wǎng)上品牌定位。這個定位可能成功地概括之前的研究，但也有可能證明客戶中的利益相關(guān)群體無法達成共識。不管得到的網(wǎng)上品牌定位是明確的還是分裂的，它為你向客戶展示樣式板、探討下一步方案提供了一個出發(fā)點。

Phase2 Technology的設(shè)計團隊最近與《華盛頓審查者報》（The Washington Examiner）合作建立了2012年競選活動微型網(wǎng)站，用來實時報道選情。網(wǎng)站的目標是將審查者報的傳統(tǒng)形象以愛國的基調(diào)作一個延伸性的更新，從而激起讀者對即將到來的大選的熱情。利用審查者報團隊提供的形容詞，Phase2把該報的品牌形象詮釋為三種不同風格的樣式，共客戶選擇。這些樣式反映了該報現(xiàn)有的網(wǎng)上品牌形象的三種不同的體現(xiàn)。設(shè)計團隊向客戶呈現(xiàn)的三個樣式板如下：  

最初向《華盛頓審查者報》展示的三個樣式板

集團修整階段
在審查者的報客戶們對自己品牌的描述中有一些多次出現(xiàn)的形容詞幫助我們形成了一個鮮明的品牌定位�！皭蹏�主義”一詞決定了美國星條旗的紅白藍配色方案，該報在出版界悠久的歷史啟發(fā)我們使用了幾種為出版業(yè)量身定做的醒目的粗襯線字體�？蛻羰褂昧恕爱斍啊�、“現(xiàn)代”等詞，同時因為網(wǎng)站是為2012當年大選而建，我們選用了總統(tǒng)候選人的標識形象中用到的質(zhì)感和深度的處理。在幾個常用的形容詞之外，我們還看到了“干凈”、“強烈”和“友好”，這三個詞代表了我們的總體設(shè)計可以進一步發(fā)展的方向。由此我們制作了大量運用留白的“清爽版”、以拉絲鋁板為標志元素的“強勁版”，和大面積使用活力色塊的“友善版”。

在修整階段，客戶決定選用第一個樣式板，加上第二個選項中的紅色星形圖案和第三個選項中的字體。在這一輪的討論中他們傾向于使用有親和力的粗襯線字體，我們于是選用了一款他們喜愛的Adelle字體。這輪產(chǎn)生的樣式板成果圖則直接轉(zhuǎn)化為網(wǎng)站的最終設(shè)計。

 《華盛頓審查者報》最后批準的樣式板

以往的習慣

過去在設(shè)計階段，我們經(jīng)�？匆娫O(shè)計師向客戶提供多個設(shè)計樣圖。客戶喜歡選擇，多個不同的樣圖使客戶感覺他們付出了設(shè)計費用，得到了物有所值。設(shè)計意味著銷售，而我們喜歡讓客戶高興，但是提供多個完整展示的設(shè)計樣稿對與設(shè)計流程來說利大于弊。人生來是喜歡挑選和搭配的，提供多個不同的設(shè)計樣稿使客戶有機會用一時的喜好去破壞原本對設(shè)計項目來說最好的解決方法。最終得到的結(jié)構(gòu)是個設(shè)計樣稿雜交而成的科學怪人，一個遠離網(wǎng)站設(shè)計意圖的界面元素混合體。

決定最終成果的流程與方法
設(shè)計是個微妙的行業(yè)，因為每個人都有各自的審美觀�？蛻羰窃O(shè)計過程中的非常重要的一環(huán)：沒有了客戶你就沒有了收入來源，這樣設(shè)計就不能算一項工作，而僅僅變?yōu)榱艘粋�興趣愛好。喜好決定樣式，而目標驅(qū)動設(shè)計。要想幫助客戶理解樣式和設(shè)計的分別可能很難，但以樣式板作為互聯(lián)網(wǎng)設(shè)計過程中的關(guān)鍵，能夠使你有機會把客戶融入互動的設(shè)計和修改流程。當設(shè)計過程的交付成果以板塊的形式呈現(xiàn)出可更迭的版本，客戶可以提供更多的反饋，更有參與感，也可能成為對最終的設(shè)計極有價值的合作伙伴。

設(shè)計是一種信賴
樣式板方法重新定義了客戶和設(shè)計師角色之間的關(guān)系。遇到人生的難題時，人們會求助于心理醫(yī)師。而客戶求助于設(shè)計師則是為了解決交流上的問題。如果設(shè)計師站在心理醫(yī)師的角度去開導(dǎo)客戶如何尋求解決問題的方法，那你們之間的信賴就會在每一輪修整之中建立起來。如果你一走進診所，醫(yī)生就馬上根據(jù)你的病史取出一套完整的康復(fù)計劃，你會信賴他（她）嗎？不會。一個品牌和它的交流方式是很復(fù)雜的問題，絕不比家庭關(guān)系和婚姻問題簡單。你作為設(shè)計師所提出的方法，傳遞的語調(diào)和處理問題的過程對客戶關(guān)系的影響非常大。樣式板設(shè)計法能幫助你直接面對客戶，引導(dǎo)他們加入你的流程方案，以漸進的方式深入設(shè)計，這些都有助于建立無價的客戶信賴。

響應(yīng)式設(shè)計
互聯(lián)網(wǎng)設(shè)計如今再也不是960像素寬的設(shè)計了。適應(yīng)多種不同的屏幕寬度和顯示設(shè)備的網(wǎng)站設(shè)計需求不僅改變了固定設(shè)計樣稿的重要性，也改變了設(shè)計團隊之間的交流需要。為每一種不同設(shè)備與屏幕尺寸制作設(shè)計樣稿非常費時，也會對客戶造成困惑。樣式板則成為了一個完整的設(shè)計體系的基石，它既能清楚確立客戶的設(shè)計需求，又能把設(shè)計中的視覺要素同時傳達到項目的各個成員團隊。樣式板設(shè)計的是一套體系而不是幾個單獨的頁面，它為你的設(shè)計團隊提供的是創(chuàng)造一個有生命有呼吸的網(wǎng)站的必要工具。在經(jīng)過客戶批準的樣式板的基礎(chǔ)上，你可以建立其他的視覺設(shè)計的素材，諸如涉及常用元素的樣式標準等。

設(shè)計流程的設(shè)計
作為互聯(lián)網(wǎng)設(shè)計師，我們的職業(yè)是為用戶打造體驗，但我們經(jīng)常忽略的是客戶在設(shè)計過程中的體驗。用設(shè)計的思路可以改善我們解決挑戰(zhàn)性問題，與客戶交流，以及展現(xiàn)交付成果的體驗。樣式板設(shè)計法加快了設(shè)計進程，把受益的客戶加入到集思廣益的設(shè)計過程，是響應(yīng)式設(shè)計流程中必不可少的組成部分。在項目開端及時聽取客戶意見，在不牽涉布局的設(shè)計圖中選擇性地組合樣式，這些都能對整個團隊和項目的結(jié)果產(chǎn)生戲劇性的影響。