從和(he)客戶溝(gou)通了(le)解客戶需(xu)求到畫出草圖(tu)進行構思和(he)創意(yi)，直至打(da)開Photoshop完成(cheng)整個(ge)(ge)的設(she)計，每(mei)一個(ge)(ge)網頁設(she)計師都(dou)在(zai)每(mei)一個(ge)(ge)新(xin)的設(she)計項目中不斷(duan)重復這(zhe)(zhe)個(ge)(ge)過程。整個(ge)(ge)看上去規范而流程化的工作方(fang)式似乎按部就(jiu)班就(jiu)能(neng)夠順利(li)拿(na)到讓大家都(dou)滿(man)意(yi)的結果，但其實在(zai)每(mei)一個(ge)(ge)步驟中都(dou)存在(zai)難度，某(mou)一個(ge)(ge)方(fang)面沒有做(zuo)好，可能(neng)就(jiu)會影響(xiang)到最終設(she)計稿的質量。因此在(zai)這(zhe)(zhe)篇文章(zhang)中我就(jiu)來結合自己的設(she)計體(ti)會談(tan)談(tan)這(zhe)(zhe)其中存在(zai)的常見問題，以及我們應該(gai)如何有意(yi)識的避(bi)免或者解決它們。
問(wen)題(ti)一(yi)、和客戶溝通的不夠(gou)充分，導致設計(ji)方(fang)向出現偏差(cha)。
這(zhe)個問題(ti)是在設計(ji)流程中出現最多(duo)，也(ye)最容易導致客(ke)戶和設計(ji)師(shi)產生(sheng)矛盾的問題(ti)。最終(zhong)的結果是客(ke)戶覺得怎么修改設計(ji)都不能讓自己(ji)滿意，而設計(ji)師(shi)卻不勝其煩，認(ren)為客(ke)戶太難說話，原因其實(shi)就出在雙(shuang)方的溝通(tong)上。
作(zuo)為客(ke)戶(hu)來(lai)說(shuo)，很多時(shi)候他們對于期望的(de)(de)設(she)計(ji)(ji)(ji)產品(pin)腦(nao)子里往往只(zhi)有模糊的(de)(de)概(gai)念，只(zhi)能交代(dai)給(gei)設(she)計(ji)(ji)(ji)師一(yi)(yi)個過于粗略的(de)(de)設(she)計(ji)(ji)(ji)方向(xiang)，甚(shen)至有些客(ke)戶(hu)提出”先做(zuo)一(yi)(yi)稿出來(lai)我再(zai)看”的(de)(de)要求。遇到這種情況，設(she)計(ji)(ji)(ji)師要清楚客(ke)戶(hu)自己的(de)(de)設(she)計(ji)(ji)(ji)需(xu)求是不明(ming)晰(xi)的(de)(de)，而作(zuo)為設(she)計(ji)(ji)(ji)師來(lai)說(shuo)，這時(shi)就需(xu)要積極(ji)地引導(dao)客(ke)戶(hu)，使他們明(ming)晰(xi)設(she)計(ji)(ji)(ji)需(xu)求，從而避(bi)免(mian)由于雙方未在設(she)計(ji)(ji)(ji)目標和期許上達成一(yi)(yi)致，造成設(she)計(ji)(ji)(ji)方向(xiang)上出現偏差，而導(dao)致設(she)計(ji)(ji)(ji)中(zhong)大(da)范圍、不斷的(de)(de)修(xiu)改設(she)計(ji)(ji)(ji)稿，甚(shen)至一(yi)(yi)遍一(yi)(yi)遍的(de)(de)推倒重(zhong)來(lai)的(de)(de)結果。
要使(shi)雙方(fang)對最(zui)終的(de)(de)(de)(de)設(she)計(ji)(ji)都(dou)滿意，就(jiu)需(xu)要盡可能詳(xiang)細的(de)(de)(de)(de)溝通(tong)(tong)，客戶(hu)(hu)和設(she)計(ji)(ji)師之(zhi)間理(li)解程度越高，最(zui)后達成的(de)(de)(de)(de)一致(zhi)性也越高，這(zhe)兩(liang)者是(shi)呈正相關(guan)的(de)(de)(de)(de)關(guan)系(xi)。要做(zuo)到這(zhe)一點，我(wo)個人的(de)(de)(de)(de)方(fang)法是(shi)在(zai)溝通(tong)(tong)的(de)(de)(de)(de)環(huan)節(jie)設(she)計(ji)(ji)系(xi)統的(de)(de)(de)(de)調(diao)查問(wen)(wen)卷(juan)讓客戶(hu)(hu)作答，以幫助客戶(hu)(hu)梳理(li)、明晰設(she)計(ji)(ji)需(xu)求(qiu)。下面是(shi)我(wo)經常使(shi)用的(de)(de)(de)(de)調(diao)查問(wen)(wen)卷(juan)內容，其中需(xu)要客戶(hu)(hu)作答7個問(wen)(wen)題(ti)，這(zhe)些問(wen)(wen)題(ti)基(ji)本可以幫助客戶(hu)(hu)和設(she)計(ji)(ji)師明確設(she)計(ji)(ji)方(fang)向，你(ni)也可以依(yi)據在(zai)和客戶(hu)(hu)溝通(tong)(tong)中的(de)(de)(de)(de)具體情(qing)況修改(gai)或者完善這(zhe)些問(wen)(wen)題(ti)。
1、當訪問者(zhe)訪問你的(de)網(wang)站的(de)時(shi)候，你希望它們做(zuo)什么？（比(bi)如購買某種(zhong)產品、服(fu)務，或者(zhe)展示企業的(de)形象(xiang)等）
2、網站的主(zhu)體用戶是(shi)哪部分人群？（白領(ling)年(nian)(nian)輕女性、有某方面需求(qiu)的老(lao)年(nian)(nian)人等(deng)）
3、網(wang)站的整(zheng)體風(feng)格是(shi)什么？當訪問(wen)者進入你的網(wang)站，你希望他們有(you)什么感覺(jue)？不希望他們有(you)什么感覺(jue)？
4、舉幾個(ge)你喜歡的(de)網(wang)(wang)站(zhan)，并說明(ming)原(yuan)因(yin)；例舉幾個(ge)你討厭的(de)網(wang)(wang)站(zhan)，也說明(ming)原(yuan)因(yin)。（請將網(wang)(wang)站(zhan)鏈接(jie)或者截圖粘貼在下(xia)方）
5、網(wang)站欄(lan)目有哪些？并提供具體信息內容（可(ke)粘貼在下方）
6、請提供網站(zhan)設(she)計的資(zi)料，包(bao)括logo，公司圖片，產品圖片等（打包(bao)以附(fu)件形式發(fa)送(song)至設(she)計師郵箱）
7、請提供(gong)您的聯系方式。（QQ、手(shou)機或者郵箱）
問題二：跳過網站(zhan)功能及信息架構上的研究，直接開始視覺創作(zuo)。
網站(zhan)的(de)(de)(de)(de)功(gong)能和(he)信息(xi)架構(gou)是(shi)(shi)(shi)網站(zhan)的(de)(de)(de)(de)核(he)心，一個(ge)(ge)(ge)網站(zhan)不是(shi)(shi)(shi)單純的(de)(de)(de)(de)讓訪問者(zhe)去感受視(shi)覺上的(de)(de)(de)(de)美觀，美觀永遠是(shi)(shi)(shi)第二位的(de)(de)(de)(de)，而功(gong)能性卻是(shi)(shi)(shi)第一位的(de)(de)(de)(de)。一個(ge)(ge)(ge)企(qi)業(ye)網站(zhan)是(shi)(shi)(shi)為了展示企(qi)業(ye)的(de)(de)(de)(de)形象、售賣企(qi)業(ye)的(de)(de)(de)(de)產品和(he)服務(wu)；一個(ge)(ge)(ge)門(men)戶網站(zhan)是(shi)(shi)(shi)為了更好的(de)(de)(de)(de)提供(gong)信息(xi)內容，一個(ge)(ge)(ge)個(ge)(ge)(ge)人博客是(shi)(shi)(shi)為了分享個(ge)(ge)(ge)人的(de)(de)(de)(de)觀點，樹(shu)立個(ge)(ge)(ge)人品牌等等，保證了這些功(gong)能更好的(de)(de)(de)(de)實現了之后才應(ying)該去考慮視(shi)覺上是(shi)(shi)(shi)否美觀的(de)(de)(de)(de)問題。
我(wo)在(zai)(zai)之前的(de)(de)(de)一(yi)篇文(wen)章(zhang)《從千鳥(niao)志看(kan)網頁設計中(zhong)的(de)(de)(de)功能(neng)性》中(zhong)分析過千鳥(niao)的(de)(de)(de)個(ge)人博客在(zai)(zai)功能(neng)性和用戶體驗方(fang)面(mian)的(de)(de)(de)優點，雖然初次打開該博客并不(bu)會(hui)被它看(kan)上去似乎(hu)沒怎么(me)設計的(de)(de)(de)灰白界面(mian)所吸引，但(dan)這個(ge)網站良好的(de)(de)(de)用戶體驗卻(que)一(yi)定會(hui)讓你記憶深刻。
問題(ti)三、缺乏(fa)對(dui)網站整體(ti)風格的思考(kao)和把握，做到哪里算(suan)哪里。
這個(ge)問(wen)題(ti)也非常常見，以下是一(yi)個(ge)設計師發給我的問(wen)題(ti)及(ji)我的答復，應該說非常典(dian)型的反映了這個(ge)問(wen)題(ti)。
“想請教你一(yi)下，一(yi)個學校的(de)網站，客戶說(shuo)要(yao)做活(huo)潑一(yi)點，怎么搞呀？我(wo)設(she)計了(le)一(yi)個頭部，我(wo)發給你看一(yi)下啊！指(zhi)點一(yi)下但是下面我(wo)就不知道怎么布局了(le)，現在(zai)頭都(dou)想大了(le)。”
答復：這是(shi)一個沒有系統的(de)考(kao)慮整體風(feng)格而(er)急(ji)于(yu)動手(shou)的(de)例子。
問題(ti)主要由以下(xia)幾個方面(mian)：
一、布(bu)局上(shang)，Banner割裂(lie)的(de)(de)邊(bian)緣限制(zhi)(zhi)了視線的(de)(de)拓展，顯得(de)死板而不夠透氣(qi)。其他元素(su)也是(shi)大框(kuang)(kuang)(kuang)套小框(kuang)(kuang)(kuang)的(de)(de)思(si)(si)路。總(zong)體(ti)(ti)的(de)(de)布(bu)局思(si)(si)路沒(mei)有(you)逃脫條(tiao)條(tiao)框(kuang)(kuang)(kuang)框(kuang)(kuang)(kuang)的(de)(de)限制(zhi)(zhi)，看得(de)出來，整個(ge)設(she)計是(shi)思(si)(si)路沒(mei)有(you)打開卻急于(yu)(yu)動手的(de)(de)表現。要做到(dao)活(huo)潑的(de)(de)設(she)計，不是(shi)用(yong)(yong)一張(zhang)現成(cheng)的(de)(de)關于(yu)(yu)兒(er)童的(de)(de)圖(tu)(tu)片放上(shang)去(qu)就(jiu)行了，要讓個(ge)的(de)(de)設(she)計元素(su)往(wang)這個(ge)方向走，比如(ru)布(bu)局，比如(ru)色彩，比如(ru)質感(gan)，比如(ru)插圖(tu)(tu)和圖(tu)(tu)標的(de)(de)使(shi)用(yong)(yong)，比如(ru)字體(ti)(ti)的(de)(de)選擇等等，所以(yi)你的(de)(de)問(wen)題(ti)(ti)是(shi)完全(quan)沒(mei)有(you)系統的(de)(de)思(si)(si)考(kao)這些問(wen)題(ti)(ti)，還沒(mei)找(zhao)到(dao)答案就(jiu)急于(yu)(yu)往(wang)前走，結(jie)果肯定是(shi)剛剛開始就(jiu)感(gan)覺無所適從。
二、再來說說具體的(de)(de)(de)問題，Banner的(de)(de)(de)設(she)計(ji)在整(zheng)個(ge)頁面(mian)中通常起到(dao)非常重(zhong)要的(de)(de)(de)作用，是視(shi)(shi)覺(jue)的(de)(de)(de)焦(jiao)點(dian)，先(xian)不(bu)說你選的(de)(de)(de)這個(ge)圖(tu)片(pian)方向(xiang)對不(bu)對，但這個(ge)設(she)計(ji)看上去過(guo)于小(xiao)氣(qi)，原因(yin)是圖(tu)片(pian)中的(de)(de)(de)元素(su)視(shi)(shi)覺(jue)比重(zhong)都差不(bu)多，沒有(you)重(zhong)點(dian)，沒有(you)主次。其次是Logo文(wen)字以及宣傳語文(wen)字的(de)(de)(de)設(she)計(ji)，感覺(jue)太(tai)散、太(tai)單薄，需(xu)要加(jia)強他們(men)的(de)(de)(de)視(shi)(shi)覺(jue)比重(zhong)和氣(qi)氛感受(shou)。Banner底(di)部的(de)(de)(de)弧(hu)形邊緣不(bu)僅沒有(you)起到(dao)給整(zheng)個(ge)氣(qi)氛加(jia)分的(de)(de)(de)效果(guo)，反(fan)而割裂了Banner的(de)(de)(de)設(she)計(ji)，看上去很不(bu)美(mei)觀。
如何避免盲目(mu)開(kai)始，途中(zhong)無從下手的(de)問(wen)題(ti)出現(xian)？很簡單，畫草圖(tu)(tu)。雖然我(wo)個人有時候也會省略畫圖(tu)(tu)的(de)步驟，但(dan)每次至少會在PS中(zhong)做(zuo)(zuo)一個主頁的(de)設計方案，其中(zhong)包(bao)括需要放置的(de)信息內容、排版、色彩方案以(yi)(yi)及設計方案的(de)說(shuo)明文字。但(dan)我(wo)發現(xian)相較(jiao)于紙和(he)筆(bi)來說(shuo)，這樣的(de)方式還是(shi)限制了創(chuang)意的(de)拓展(zhan)。所以(yi)(yi)還是(shi)強烈(lie)建議大家(jia)在開(kai)始設計之前畫草圖(tu)(tu)。很難想象，不(bu)通過畫草圖(tu)(tu)的(de)方式能(neng)做(zuo)(zuo)出來下面(mian)的(de)設計效果。
但是紙(zhi)和筆的方式也(ye)有它的缺陷就是在設計(ji)排版方面(mian)(mian)不能精確的定位元素(su)的空間。所(suo)以為了(le)彌補這個缺憾，建議大(da)家使用960像素(su)網格系統(tong)的草圖稿紙(zhi)。紙(zhi)和筆的自由(you)保證了(le)創意(yi)的拓展(zhan)，而(er)不用糾纏于實現方面(mian)(mian)的技(ji)術問題(ti)。
另外，在平時的學習積累中，多從整(zheng)體風(feng)(feng)格(ge)上分析(xi)優秀的設計作品(pin)是如何考慮和實現的，可以嘗(chang)試從以下幾個方(fang)(fang)面分析(xi)網站風(feng)(feng)格(ge)：一、概念元素(su)(su)：背(bei)景(jing)、修飾圖(tu)(tu)形(xing)等(deng)；二、具象元素(su)(su)：文字、照片(pian)、插(cha)圖(tu)(tu)、圖(tu)(tu)標圖(tu)(tu)形(xing)；三、關系元素(su)(su)：方(fang)(fang)向(xiang)、位置、空(kong)間、重心；四、交互方(fang)(fang)式：節奏、運動方(fang)(fang)式；五(wu)、色彩方(fang)(fang)案。
問題四、設(she)計過(guo)程中遇(yu)到困難，隨(sui)意調整設(she)計方向。
畫好了(le)草圖就(jiu)(jiu)要按照設(she)計(ji)(ji)方(fang)向堅決執行(xing)，這樣(yang)(yang)才能(neng)保證前(qian)期的(de)(de)(de)創(chuang)(chuang)意(yi)階段的(de)(de)(de)工作不(bu)(bu)被浪(lang)費。很多(duo)設(she)計(ji)(ji)師(shi)前(qian)期的(de)(de)(de)創(chuang)(chuang)意(yi)構思都很有(you)想法(fa)，但是(shi)一(yi)旦開始設(she)計(ji)(ji)，途中遇到(dao)尋找(zhao)(zhao)素材或者(zhe)(zhe)技術(shu)方(fang)面的(de)(de)(de)困難，或者(zhe)(zhe)突(tu)然發現某一(yi)個素材很不(bu)(bu)錯(cuo)，很漂亮(liang)，馬上拋(pao)棄前(qian)面的(de)(de)(de)整(zheng)個創(chuang)(chuang)意(yi)，開辟(pi)一(yi)條新路從頭(tou)開始，但往往做到(dao)半(ban)中間(jian)就(jiu)(jiu)再(zai)做不(bu)(bu)下去(qu)了(le)，導致設(she)計(ji)(ji)總是(shi)半(ban)途而廢，情緒上不(bu)(bu)斷受挫(cuo)，焦(jiao)躁(zao)不(bu)(bu)堪。而我(wo)(wo)們(men)如果看過高手(shou)的(de)(de)(de)設(she)計(ji)(ji)過程，比(bi)如文子的(de)(de)(de)光大(da)銀行(xing)的(de)(de)(de)設(she)計(ji)(ji)視頻，我(wo)(wo)們(men)就(jiu)(jiu)會發現高手(shou)從來都不(bu)(bu)輕易的(de)(de)(de)改變已(yi)經設(she)定好的(de)(de)(de)設(she)計(ji)(ji)方(fang)向，并且總能(neng)把我(wo)(wo)們(men)看來完全用(yong)不(bu)(bu)著(zhu)的(de)(de)(de)素材變廢為寶，從而擁有(you)化(hua)腐朽為神奇的(de)(de)(de)本事。千萬不(bu)(bu)要花費大(da)量時(shi)間(jian)去(qu)尋找(zhao)(zhao)完美的(de)(de)(de)、拿來不(bu)(bu)用(yong)調整(zheng)就(jiu)(jiu)能(neng)用(yong)的(de)(de)(de)設(she)計(ji)(ji)素材，能(neng)找(zhao)(zhao)到(dao)這樣(yang)(yang)的(de)(de)(de)素材的(de)(de)(de)幾率比(bi)中彩票還要低，而是(shi)要不(bu)(bu)斷提(ti)高我(wo)(wo)們(men)將看上去(qu)和(he)整(zheng)體(ti)設(she)計(ji)(ji)毫不(bu)(bu)搭邊的(de)(de)(de)素材融合進(jin)整(zheng)體(ti)設(she)計(ji)(ji)的(de)(de)(de)能(neng)力。
問題五、細節不夠講究，顯得粗糙。
一些(xie)設計(ji)師給(gei)我(wo)發(fa)來個(ge)(ge)人作(zuo)品(pin)讓我(wo)給(gei)說說建議，我(wo)發(fa)現其zg同存在的(de)問題就(jiu)是設計(ji)中細節做(zuo)的(de)不(bu)好。漸(jian)變和高光(guang)過于(yu)生硬、陰影的(de)距(ju)離(li)和不(bu)透明(ming)度太高、對(dui)齊方式偏差幾個(ge)(ge)像素、上(shang)下左(zuo)右邊距(ju)距(ju)離(li)太小、元素和背景的(de)反差不(bu)夠(gou)造成元素清(qing)晰度不(bu)夠(gou)等幾個(ge)(ge)問題是常見的(de)設計(ji)毛病(bing)。這(zhe)些(xie)問題雖(sui)然也(ye)涉(she)及到(dao)技術的(de)問題，但(dan)是最重(zhong)要(yao)的(de)我(wo)認(ren)為還(huan)是用心不(bu)夠(gou)、認(ren)為做(zuo)到(dao)差不(bu)多就(jiu)行了的(de)態度問題。
問題六、技術不(bu)過關(guan)，創意無法得到(dao)實現。
只(zhi)有通(tong)過(guo)(guo)(guo)(guo)大量的(de)設計(ji)和練習才能盡可能多(duo)的(de)掌握(wo)具體的(de)技(ji)術。但是無論是跟著網(wang)上的(de)設計(ji)教(jiao)程學習，還是通(tong)過(guo)(guo)(guo)(guo)研究別(bie)人的(de)PSD文件也好，不能做過(guo)(guo)(guo)(guo)一(yi)遍就過(guo)(guo)(guo)(guo)去了(le)(le)。一(yi)般來說我(wo)們經常需(xu)要需(xu)要通(tong)過(guo)(guo)(guo)(guo)教(jiao)程掌握(wo)的(de)是如(ru)(ru)何處(chu)理手(shou)(shou)頭的(de)素(su)材，將(jiang)其融合于(yu)整(zheng)體的(de)場景(jing)之中(zhong)的(de)思路的(de)方法(fa)，看看高(gao)手(shou)(shou)是如(ru)(ru)何通(tong)過(guo)(guo)(guo)(guo)使用(yong)調整(zheng)圖層、自(zi)由變換(huan)、色(se)彩范圍選擇等一(yi)系(xi)列的(de)技(ji)術去實現(xian)需(xu)要的(de)效果，而不僅(jin)僅(jin)是按照教(jiao)程做一(yi)遍就完了(le)(le)，下次遇到(dao)需(xu)要自(zi)己(ji)動手(shou)(shou)創建(jian)場景(jing)的(de)時(shi)候依(yi)然無所適從。如(ru)(ru)果你已經有了(le)(le)一(yi)定的(de)PS基(ji)礎(chu)，應該多(duo)練習些圖標和場景(jing)的(de)創建(jian)，認真研究，你一(yi)定能學到(dao)很多(duo)東(dong)西。
從和(he)客戶溝通(tong)了解客戶需求到畫出草圖進(jin)行構思和(he)創意(yi)，直至打(da)開Photoshop完成(cheng)整(zheng)個(ge)的(de)(de)設(she)(she)計(ji)(ji)，每(mei)一(yi)個(ge)網頁設(she)(she)計(ji)(ji)師都在(zai)每(mei)一(yi)個(ge)新(xin)的(de)(de)設(she)(she)計(ji)(ji)項(xiang)目中(zhong)(zhong)不斷重復(fu)這個(ge)過程(cheng)。整(zheng)個(ge)看(kan)上去規范而流(liu)程(cheng)化的(de)(de)工作(zuo)方(fang)式似乎按部(bu)就班就能夠順利拿到讓(rang)大家(jia)都滿(man)意(yi)的(de)(de)結(jie)果，但其實(shi)在(zai)每(mei)一(yi)個(ge)步(bu)驟中(zhong)(zhong)都存在(zai)難度，某一(yi)個(ge)方(fang)面(mian)沒(mei)有(you)做好，可能就會影響到最(zui)終設(she)(she)計(ji)(ji)稿的(de)(de)質(zhi)量。因此(ci)在(zai)這篇文(wen)章中(zhong)(zhong)我就來結(jie)合自己的(de)(de)設(she)(she)計(ji)(ji)體會談談這其中(zhong)(zhong)存在(zai)的(de)(de)常(chang)見問題，以及我們(men)(men)應該如何有(you)意(yi)識的(de)(de)避免(mian)或者解決它們(men)(men)。
問題一、和客戶溝通的不夠充分，導致設計方向出現偏差。
這(zhe)個問題是(shi)在(zai)設(she)計(ji)流程中出(chu)(chu)現最(zui)多，也最(zui)容易導致客(ke)戶(hu)(hu)和(he)設(she)計(ji)師產生矛(mao)盾的(de)問題。最(zui)終的(de)結果是(shi)客(ke)戶(hu)(hu)覺得怎么修改設(she)計(ji)都(dou)不能讓自己滿意，而(er)設(she)計(ji)師卻不勝其煩(fan)，認為客(ke)戶(hu)(hu)太難說(shuo)話，原因(yin)其實(shi)就(jiu)出(chu)(chu)在(zai)雙(shuang)方的(de)溝通上(shang)。
作為客(ke)戶來(lai)說，很多時(shi)候他(ta)們對(dui)于(yu)期望(wang)的(de)設(she)(she)(she)(she)計(ji)(ji)產(chan)品腦子(zi)里往往只有(you)模(mo)糊的(de)概念，只能交代(dai)給設(she)(she)(she)(she)計(ji)(ji)師(shi)一(yi)個過(guo)于(yu)粗(cu)略的(de)設(she)(she)(she)(she)計(ji)(ji)方(fang)向，甚至(zhi)有(you)些(xie)客(ke)戶提出”先做一(yi)稿(gao)出來(lai)我再看”的(de)要求(qiu)(qiu)。遇到(dao)這種情況，設(she)(she)(she)(she)計(ji)(ji)師(shi)要清楚客(ke)戶自己的(de)設(she)(she)(she)(she)計(ji)(ji)需求(qiu)(qiu)是不明(ming)晰的(de)，而作為設(she)(she)(she)(she)計(ji)(ji)師(shi)來(lai)說，這時(shi)就需要積極(ji)地(di)引導(dao)客(ke)戶，使他(ta)們明(ming)晰設(she)(she)(she)(she)計(ji)(ji)需求(qiu)(qiu)，從而避免由(you)于(yu)雙方(fang)未(wei)在(zai)設(she)(she)(she)(she)計(ji)(ji)目標和期許上達成(cheng)一(yi)致，造(zao)成(cheng)設(she)(she)(she)(she)計(ji)(ji)方(fang)向上出現偏差(cha)，而導(dao)致設(she)(she)(she)(she)計(ji)(ji)中大范圍、不斷的(de)修改設(she)(she)(she)(she)計(ji)(ji)稿(gao)，甚至(zhi)一(yi)遍一(yi)遍的(de)推(tui)倒(dao)重來(lai)的(de)結果(guo)。
要(yao)(yao)使雙方(fang)對最終的(de)設(she)計(ji)(ji)都滿意(yi)，就需要(yao)(yao)盡可能詳細的(de)溝(gou)通，客戶(hu)(hu)(hu)和(he)設(she)計(ji)(ji)師(shi)(shi)之間(jian)理(li)解程度越(yue)高，最后達成的(de)一致性也越(yue)高，這(zhe)兩者(zhe)是呈正相關的(de)關系。要(yao)(yao)做到這(zhe)一點，我個(ge)人的(de)方(fang)法是在溝(gou)通的(de)環節設(she)計(ji)(ji)系統(tong)的(de)調查問(wen)卷讓客戶(hu)(hu)(hu)作(zuo)答，以幫助客戶(hu)(hu)(hu)梳理(li)、明(ming)晰設(she)計(ji)(ji)需求。下面是我經常使用的(de)調查問(wen)卷內容，其中需要(yao)(yao)客戶(hu)(hu)(hu)作(zuo)答7個(ge)問(wen)題，這(zhe)些問(wen)題基(ji)本可以幫助客戶(hu)(hu)(hu)和(he)設(she)計(ji)(ji)師(shi)(shi)明(ming)確設(she)計(ji)(ji)方(fang)向，你也可以依據在和(he)客戶(hu)(hu)(hu)溝(gou)通中的(de)具(ju)體情況修改或者(zhe)完善這(zhe)些問(wen)題。
1、當訪問者(zhe)訪問你的網站的時候，你希望它們做什么？（比如購(gou)買某種產品、服務，或者(zhe)展示企業(ye)的形象等）
2、網(wang)站的主體用戶是(shi)哪部分人群？（白領年輕(qing)女性、有某方面需(xu)求的老年人等）
3、網站的(de)整體風格是什(shen)么？當訪(fang)問者進入你的(de)網站，你希望他們(men)有(you)什(shen)么感覺？不希望他們(men)有(you)什(shen)么感覺？
4、舉幾(ji)個你(ni)喜歡的(de)網站(zhan)，并說(shuo)明原因(yin)；例舉幾(ji)個你(ni)討厭的(de)網站(zhan)，也說(shuo)明原因(yin)。（請將網站(zhan)鏈接或者截圖粘貼(tie)在下方(fang)）
5、網站欄目有哪些？并提供(gong)具(ju)體(ti)信息(xi)內容（可(ke)粘貼(tie)在(zai)下(xia)方）
6、請提供網站設(she)計(ji)的資料，包(bao)括logo，公司(si)圖(tu)片(pian)，產品圖(tu)片(pian)等（打包(bao)以附件形式(shi)發送(song)至(zhi)設(she)計(ji)師郵箱）
7、請提供(gong)您的聯系方式。（QQ、手(shou)機或(huo)者郵(you)箱）
問題二：跳過網站功能及信息架構上的研究，直接開始視覺創作。
網(wang)站(zhan)的(de)(de)(de)(de)功能和信息(xi)架(jia)構是(shi)網(wang)站(zhan)的(de)(de)(de)(de)核心，一個(ge)(ge)(ge)網(wang)站(zhan)不是(shi)單(dan)純的(de)(de)(de)(de)讓訪問者去(qu)感(gan)受視覺(jue)上(shang)的(de)(de)(de)(de)美觀(guan)(guan)，美觀(guan)(guan)永遠是(shi)第(di)二位的(de)(de)(de)(de)，而(er)功能性卻(que)是(shi)第(di)一位的(de)(de)(de)(de)。一個(ge)(ge)(ge)企(qi)業網(wang)站(zhan)是(shi)為了(le)展示企(qi)業的(de)(de)(de)(de)形象、售賣企(qi)業的(de)(de)(de)(de)產(chan)品(pin)和服務；一個(ge)(ge)(ge)門戶(hu)網(wang)站(zhan)是(shi)為了(le)更好(hao)的(de)(de)(de)(de)提供信息(xi)內容，一個(ge)(ge)(ge)個(ge)(ge)(ge)人(ren)(ren)博客(ke)是(shi)為了(le)分享個(ge)(ge)(ge)人(ren)(ren)的(de)(de)(de)(de)觀(guan)(guan)點，樹立(li)個(ge)(ge)(ge)人(ren)(ren)品(pin)牌(pai)等等，保證了(le)這(zhe)些(xie)功能更好(hao)的(de)(de)(de)(de)實現了(le)之后(hou)才應(ying)該去(qu)考慮(lv)視覺(jue)上(shang)是(shi)否美觀(guan)(guan)的(de)(de)(de)(de)問題。
我(wo)在之前的一篇文章《從千鳥(niao)志看(kan)網頁設計(ji)中的功(gong)(gong)能性》中分析(xi)過(guo)千鳥(niao)的個人博客(ke)在功(gong)(gong)能性和用戶(hu)體驗(yan)方(fang)面的優(you)點，雖然(ran)初次打開(kai)該博客(ke)并不會被它看(kan)上去似乎沒怎么設計(ji)的灰(hui)白界面所吸引(yin)，但這個網站良好的用戶(hu)體驗(yan)卻(que)一定會讓你(ni)記憶深(shen)刻(ke)。
問題三、缺乏對網站整體風格的思考和把握，做到哪里算哪里。
這個(ge)(ge)問題(ti)也非常常見，以下是一個(ge)(ge)設(she)計師(shi)發給我的問題(ti)及我的答復，應該說(shuo)非常典型的反映了這個(ge)(ge)問題(ti)。
“想(xiang)請教你一下(xia)，一個學(xue)校(xiao)的網站，客戶說要做活潑一點(dian)(dian)，怎(zen)(zen)么(me)(me)搞呀？我(wo)設(she)計了(le)一個頭(tou)部(bu)，我(wo)發給你看一下(xia)啊！指點(dian)(dian)一下(xia)但(dan)是下(xia)面我(wo)就不知道怎(zen)(zen)么(me)(me)布(bu)局了(le)，現在頭(tou)都想(xiang)大(da)了(le)。”
答復：這(zhe)是一個沒有(you)系統的考(kao)慮整體(ti)風格而急于(yu)動手(shou)的例子(zi)。
問題(ti)主要由以下幾個方面：
一、布(bu)局上，Banner割裂的(de)(de)(de)邊緣限制(zhi)了視線的(de)(de)(de)拓展(zhan)，顯得死(si)板而不夠透(tou)氣。其(qi)他元素也(ye)是大框套小框的(de)(de)(de)思路。總體的(de)(de)(de)布(bu)局思路沒有逃脫(tuo)條(tiao)條(tiao)框框的(de)(de)(de)限制(zhi)，看(kan)得出來，整個設計(ji)是思路沒有打開(kai)卻急于動手的(de)(de)(de)表(biao)現。要(yao)做(zuo)到活(huo)潑的(de)(de)(de)設計(ji)，不是用一張(zhang)現成的(de)(de)(de)關(guan)于兒童的(de)(de)(de)圖(tu)片放上去就(jiu)(jiu)行了，要(yao)讓個的(de)(de)(de)設計(ji)元素往這(zhe)個方向走，比如(ru)(ru)布(bu)局，比如(ru)(ru)色彩，比如(ru)(ru)質感，比如(ru)(ru)插圖(tu)和圖(tu)標的(de)(de)(de)使用，比如(ru)(ru)字體的(de)(de)(de)選(xuan)擇(ze)等等，所以你的(de)(de)(de)問(wen)題(ti)是完全沒有系(xi)統(tong)的(de)(de)(de)思考(kao)這(zhe)些(xie)問(wen)題(ti)，還沒找到答案(an)就(jiu)(jiu)急于往前走，結果(guo)肯定是剛剛開(kai)始就(jiu)(jiu)感覺無(wu)所適從。
二、再來說(shuo)(shuo)說(shuo)(shuo)具體(ti)的(de)(de)問題，Banner的(de)(de)設計(ji)(ji)在整個(ge)頁(ye)面中通常(chang)(chang)起到非常(chang)(chang)重要的(de)(de)作用，是視覺的(de)(de)焦點，先不說(shuo)(shuo)你選(xuan)的(de)(de)這個(ge)圖(tu)片(pian)方向(xiang)對(dui)不對(dui)，但這個(ge)設計(ji)(ji)看(kan)上去(qu)過于小氣，原(yuan)因是圖(tu)片(pian)中的(de)(de)元素視覺比(bi)重都差不多，沒(mei)有(you)重點，沒(mei)有(you)主(zhu)次(ci)。其(qi)次(ci)是Logo文字以及宣傳語文字的(de)(de)設計(ji)(ji)，感(gan)覺太散(san)、太單薄(bo)，需要加強他們的(de)(de)視覺比(bi)重和氣氛(fen)(fen)感(gan)受(shou)。Banner底部的(de)(de)弧形邊(bian)緣不僅沒(mei)有(you)起到給整個(ge)氣氛(fen)(fen)加分的(de)(de)效(xiao)果(guo)，反而割裂了Banner的(de)(de)設計(ji)(ji)，看(kan)上去(qu)很不美觀。
如(ru)何避免盲目(mu)開始(shi)，途中無(wu)從(cong)下手(shou)的(de)問題出現(xian)？很簡單，畫草圖(tu)(tu)。雖然我個人有時候也會(hui)省略畫圖(tu)(tu)的(de)步驟，但(dan)每次(ci)至少會(hui)在PS中做(zuo)一個主(zhu)頁的(de)設(she)計(ji)(ji)(ji)方案，其中包括需要放置的(de)信息內容、排(pai)版、色彩方案以及(ji)設(she)計(ji)(ji)(ji)方案的(de)說明(ming)文(wen)字。但(dan)我發現(xian)相(xiang)較(jiao)于(yu)紙和筆來說，這樣的(de)方式還是(shi)限制了(le)創意(yi)的(de)拓展。所以還是(shi)強烈建(jian)議大家在開始(shi)設(she)計(ji)(ji)(ji)之前畫草圖(tu)(tu)。很難(nan)想象，不通(tong)過畫草圖(tu)(tu)的(de)方式能做(zuo)出來下面的(de)設(she)計(ji)(ji)(ji)效果(guo)。
但是(shi)紙和筆的(de)(de)方式也有它的(de)(de)缺陷就是(shi)在(zai)設計排版方面(mian)不能精確的(de)(de)定(ding)位元素(su)的(de)(de)空間(jian)。所(suo)以(yi)為(wei)了彌補這(zhe)個缺憾，建議大家使用(yong)960像素(su)網格系統的(de)(de)草圖稿紙。紙和筆的(de)(de)自由保證了創(chuang)意的(de)(de)拓展，而不用(yong)糾(jiu)纏(chan)于(yu)實現方面(mian)的(de)(de)技(ji)術(shu)問題。
另(ling)外，在平(ping)時的(de)(de)(de)學習積累中(zhong)，多(duo)從整體風格(ge)上分(fen)(fen)析優秀的(de)(de)(de)設計作(zuo)品是如何考慮(lv)和實(shi)現(xian)的(de)(de)(de)，可以嘗(chang)試(shi)從以下幾(ji)個方面分(fen)(fen)析網站風格(ge)：一、概念(nian)元(yuan)素：背景、修飾圖(tu)形等(deng)；二、具象元(yuan)素：文字、照片、插圖(tu)、圖(tu)標(biao)圖(tu)形；三、關(guan)系元(yuan)素：方向、位(wei)置、空間、重心；四、交(jiao)互方式：節奏(zou)、運動方式；五(wu)、色彩方案。
問題四、設計過程中遇到困難，隨意調整設計方向。
畫(hua)好(hao)了(le)(le)草圖就(jiu)(jiu)要(yao)按照(zhao)設(she)(she)(she)計(ji)方(fang)向堅決執(zhi)行(xing)(xing)，這樣才能(neng)保證前(qian)期的(de)(de)(de)(de)(de)創(chuang)意(yi)階段的(de)(de)(de)(de)(de)工作不(bu)(bu)(bu)(bu)(bu)被浪費。很多設(she)(she)(she)計(ji)師前(qian)期的(de)(de)(de)(de)(de)創(chuang)意(yi)構思都很有想法，但是一(yi)旦開(kai)始設(she)(she)(she)計(ji)，途中遇到尋找素(su)(su)(su)材(cai)(cai)(cai)或(huo)者技術(shu)方(fang)面的(de)(de)(de)(de)(de)困(kun)難(nan)，或(huo)者突然發現某(mou)一(yi)個素(su)(su)(su)材(cai)(cai)(cai)很不(bu)(bu)(bu)(bu)(bu)錯，很漂亮，馬上拋棄前(qian)面的(de)(de)(de)(de)(de)整(zheng)個創(chuang)意(yi)，開(kai)辟一(yi)條新路從(cong)(cong)頭開(kai)始，但往往做到半中間就(jiu)(jiu)再做不(bu)(bu)(bu)(bu)(bu)下去(qu)了(le)(le)，導致設(she)(she)(she)計(ji)總(zong)是半途而(er)(er)廢(fei)，情緒上不(bu)(bu)(bu)(bu)(bu)斷受挫(cuo)，焦躁不(bu)(bu)(bu)(bu)(bu)堪。而(er)(er)我們如果看過高手的(de)(de)(de)(de)(de)設(she)(she)(she)計(ji)過程，比如文(wen)子的(de)(de)(de)(de)(de)光大(da)銀行(xing)(xing)的(de)(de)(de)(de)(de)設(she)(she)(she)計(ji)視頻(pin)，我們就(jiu)(jiu)會發現高手從(cong)(cong)來都不(bu)(bu)(bu)(bu)(bu)輕易的(de)(de)(de)(de)(de)改變已經設(she)(she)(she)定(ding)好(hao)的(de)(de)(de)(de)(de)設(she)(she)(she)計(ji)方(fang)向，并且總(zong)能(neng)把(ba)我們看來完全用不(bu)(bu)(bu)(bu)(bu)著的(de)(de)(de)(de)(de)素(su)(su)(su)材(cai)(cai)(cai)變廢(fei)為寶，從(cong)(cong)而(er)(er)擁有化(hua)腐朽為神(shen)奇(qi)的(de)(de)(de)(de)(de)本事。千萬不(bu)(bu)(bu)(bu)(bu)要(yao)花(hua)費大(da)量時間去(qu)尋找完美的(de)(de)(de)(de)(de)、拿(na)來不(bu)(bu)(bu)(bu)(bu)用調(diao)整(zheng)就(jiu)(jiu)能(neng)用的(de)(de)(de)(de)(de)設(she)(she)(she)計(ji)素(su)(su)(su)材(cai)(cai)(cai)，能(neng)找到這樣的(de)(de)(de)(de)(de)素(su)(su)(su)材(cai)(cai)(cai)的(de)(de)(de)(de)(de)幾率(lv)比中彩票(piao)還要(yao)低(di)，而(er)(er)是要(yao)不(bu)(bu)(bu)(bu)(bu)斷提(ti)高我們將看上去(qu)和整(zheng)體設(she)(she)(she)計(ji)毫不(bu)(bu)(bu)(bu)(bu)搭邊的(de)(de)(de)(de)(de)素(su)(su)(su)材(cai)(cai)(cai)融合進(jin)整(zheng)體設(she)(she)(she)計(ji)的(de)(de)(de)(de)(de)能(neng)力(li)。
問題五、細節不夠講究，顯得粗糙。
一(yi)些(xie)設(she)計(ji)師給(gei)我(wo)發來個(ge)人作(zuo)品讓我(wo)給(gei)說(shuo)說(shuo)建議(yi)，我(wo)發現其zg同存在的(de)問(wen)題(ti)就是(shi)設(she)計(ji)中細節做的(de)不(bu)(bu)好。漸(jian)變和(he)高光(guang)過于生硬、陰影的(de)距(ju)(ju)離和(he)不(bu)(bu)透明度太(tai)(tai)高、對(dui)齊方式偏(pian)差幾個(ge)像素(su)、上下左右邊距(ju)(ju)距(ju)(ju)離太(tai)(tai)小、元(yuan)素(su)和(he)背景的(de)反差不(bu)(bu)夠造成元(yuan)素(su)清晰度不(bu)(bu)夠等幾個(ge)問(wen)題(ti)是(shi)常見的(de)設(she)計(ji)毛病。這(zhe)些(xie)問(wen)題(ti)雖然也涉及到技術(shu)的(de)問(wen)題(ti)，但是(shi)最(zui)重要的(de)我(wo)認為還是(shi)用(yong)心不(bu)(bu)夠、認為做到差不(bu)(bu)多(duo)就行了的(de)態度問(wen)題(ti)。
問題六、技術不過關，創意無法得到實現。
只有通過大量的(de)(de)設計和練(lian)習才能盡可能多(duo)(duo)的(de)(de)掌握具(ju)體(ti)的(de)(de)技術。但是(shi)(shi)(shi)(shi)無論是(shi)(shi)(shi)(shi)跟(gen)著網(wang)上的(de)(de)設計教程(cheng)學(xue)習，還是(shi)(shi)(shi)(shi)通過研究(jiu)別人的(de)(de)PSD文(wen)件(jian)也好，不(bu)能做過一(yi)遍就過去了。一(yi)般來說我們經常(chang)需(xu)(xu)(xu)要需(xu)(xu)(xu)要通過教程(cheng)掌握的(de)(de)是(shi)(shi)(shi)(shi)如(ru)何處理手(shou)頭的(de)(de)素材(cai)，將其融合于(yu)整(zheng)(zheng)體(ti)的(de)(de)場景(jing)之中的(de)(de)思路的(de)(de)方法，看看高(gao)手(shou)是(shi)(shi)(shi)(shi)如(ru)何通過使用調整(zheng)(zheng)圖(tu)層、自(zi)由(you)變換、色彩(cai)范圍選(xuan)擇等一(yi)系列的(de)(de)技術去實現需(xu)(xu)(xu)要的(de)(de)效果(guo)，而不(bu)僅(jin)僅(jin)是(shi)(shi)(shi)(shi)按照教程(cheng)做一(yi)遍就完(wan)了，下次(ci)遇(yu)到(dao)需(xu)(xu)(xu)要自(zi)己動手(shou)創(chuang)(chuang)建場景(jing)的(de)(de)時候(hou)依然(ran)無所適從(cong)。如(ru)果(guo)你(ni)已經有了一(yi)定的(de)(de)PS基礎，應該(gai)多(duo)(duo)練(lian)習些圖(tu)標(biao)和場景(jing)的(de)(de)創(chuang)(chuang)建，認真研究(jiu)，你(ni)一(yi)定能學(xue)到(dao)很多(duo)(duo)東西。
