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

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

感情層面上的交流

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

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

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

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

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

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

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

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

最初向《華盛頓審查者報(bào)》展示的三個(gè)樣式板

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

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

 《華盛頓審查者報(bào)》最后批準(zhǔn)的樣式板

以往的習(xí)慣

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

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

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

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

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