什么是交互設(shè)計(jì)用戶界面有兩部分的設(shè)計(jì)：交互設(shè)計(jì)和視覺(jué)設(shè)計(jì)。在下圖中，左邊和右邊分別是微信的交互設(shè)計(jì)和視覺(jué)設(shè)計(jì)。交互設(shè)計(jì)vs.視覺(jué)設(shè)計(jì)交互設(shè)計(jì)的產(chǎn)出物是可交互的低保真原型，設(shè)計(jì)內(nèi)容包括：信息架構(gòu)；頁(yè)面布局；流程跳轉(zhuǎn)。一、信息架構(gòu)信息架構(gòu)，是為了讓用戶在使用APP、軟件、網(wǎng)頁(yè)的時(shí)候，能夠快速找到自己需要的信息、資料、功能，并且在使用的過(guò)程不會(huì)迷路。它有層級(jí)、有邏輯順序、要能反映信息（功能）的重要程度和關(guān)系。信息架構(gòu)的組成部分：1.組織系統(tǒng)：關(guān)注如何組織信息。比如小說(shuō)，按篇幅，可以分為短篇、中篇、長(zhǎng)篇；按年代，可以分為：古代、近代、現(xiàn)代、當(dāng)代；按題材，可以分為武俠、推理、歷史、言情等等……從哪個(gè)角度來(lái)組織、到底多少層合適，需要設(shè)計(jì)者的判斷和權(quán)衡。比如當(dāng)當(dāng)網(wǎng)的商品組織方式：組織系統(tǒng)2.導(dǎo)航系統(tǒng)協(xié)助用戶了解他在哪個(gè)位置，以及可以到何處去。比如微信的功能導(dǎo)航：微信功能導(dǎo)航豆瓣的功能導(dǎo)航：豆瓣功能導(dǎo)航3.搜索系統(tǒng)關(guān)注用戶如何搜索信息。比如淘寶的搜索：搜索系統(tǒng)4.標(biāo)簽系統(tǒng)關(guān)注如何表示信息。我們可以把標(biāo)簽系統(tǒng)理解為如何為信息和它的組織方式命名。比如我們剛才提到的小說(shuō)按題材，可以分為武俠、推理、歷史、言情等等，其中的武俠、推理這些就是信息的標(biāo)簽。一些大型網(wǎng)站，比如淘寶、當(dāng)當(dāng)、京東等，設(shè)有專門的信息架構(gòu)師角色。而大部分的APP、應(yīng)用軟件中，信息架構(gòu)由交互設(shè)計(jì)師設(shè)計(jì)。[1]二、頁(yè)面布局頁(yè)面布局的工作，就是確定每個(gè)頁(yè)面有哪些元素，它們位置、順序、分組，要突出什么元素，弱化或隱藏什么元素。、頁(yè)面布局在設(shè)計(jì)布局時(shí)，有一個(gè)要特別注意的事情，就是盡可能減少父頁(yè)（所有布局抽象出來(lái)的模板）。比如說(shuō)360安全路由的APP，它的父頁(yè)如下，所有頁(yè)面布局，都是由這四個(gè)模板變化而來(lái)。這樣的軟件，用戶在使用時(shí)，會(huì)感覺(jué)統(tǒng)一、易學(xué)。360安全路由三、流程跳轉(zhuǎn)設(shè)計(jì)頁(yè)面之間的跳轉(zhuǎn)邏輯。通過(guò)鏈接、按鈕還是手勢(shì)；單擊還是雙擊；上劃還是下劃……我們?cè)谧隹山换サ脑蜁r(shí)，要盡可能貼近軟件的最終效果。流程跳轉(zhuǎn)交互和視覺(jué)的分工交互設(shè)計(jì)師在設(shè)計(jì)頁(yè)面布局時(shí)，為了突出主次，會(huì)設(shè)計(jì)字體大小、間距、顏色等內(nèi)容，但這不是最終效果。最終的字體、顏色、圖片、圖標(biāo)、大小、間距等，由視覺(jué)設(shè)計(jì)師確定。交互設(shè)計(jì)師在設(shè)計(jì)流程跳轉(zhuǎn)時(shí)，會(huì)設(shè)計(jì)過(guò)場(chǎng)動(dòng)畫，但這同樣不是最終效果。最終效果由視覺(jué)設(shè)計(jì)師（或動(dòng)畫設(shè)計(jì)師）確定。區(qū)分交互和視覺(jué)有一種快速判斷法，那就是web工程師平時(shí)寫的css里的屬性和參數(shù)，都屬于視覺(jué)設(shè)計(jì)的范疇。所以很多公司會(huì)多招幾個(gè)UI設(shè)計(jì)師，他們不僅僅負(fù)責(zé)視覺(jué)設(shè)計(jì)，還負(fù)責(zé)輸出css樣式表。交互和視覺(jué)對(duì)人的要求交互設(shè)計(jì)和視覺(jué)設(shè)計(jì)對(duì)人的要求不同，并且往往越往深入做，這兩者所需的性格、背景和思維方式差別越大?？梢院?jiǎn)單地理解，交互設(shè)計(jì)是靠理性和邏輯驅(qū)動(dòng)，而視覺(jué)設(shè)計(jì)是靠感性驅(qū)動(dòng)。這也是為什么目前的交互設(shè)計(jì)師中理工科院的學(xué)生占了很大比例。業(yè)界也有很多開發(fā)工程師轉(zhuǎn)做交互設(shè)計(jì)的成功案例。所以做開發(fā)，學(xué)交互設(shè)計(jì)有優(yōu)勢(shì)。交互和視覺(jué)高度交叉我上面說(shuō)，交互設(shè)計(jì)和視覺(jué)設(shè)計(jì)的分工，也說(shuō)它們對(duì)人的要求不同。這可能會(huì)讓大家誤以為，這兩個(gè)角色的工作比較獨(dú)立，各自負(fù)責(zé)各自的內(nèi)容。交互不用管視覺(jué)，視覺(jué)不用管交互。但這是不對(duì)的。交互和視覺(jué)，是高度交叉的兩個(gè)領(lǐng)域，無(wú)法簡(jiǎn)單的分隔。首先，交互設(shè)計(jì)師一定要有很好的視覺(jué)設(shè)計(jì)的感覺(jué)，因?yàn)橐粋€(gè)頁(yè)面布局的好壞，會(huì)直接影響視覺(jué)的發(fā)揮。如果交互設(shè)計(jì)師導(dǎo)入一個(gè)沒(méi)主次，結(jié)構(gòu)很糟糕的設(shè)計(jì)給視覺(jué)設(shè)計(jì)師，他只有兩個(gè)選擇，一、降低自己的水平，隨便做一個(gè)；二、自己動(dòng)手，重新設(shè)計(jì)一個(gè)。其次，交互設(shè)計(jì)會(huì)影響視覺(jué)設(shè)計(jì)，視覺(jué)設(shè)計(jì)也有可能反過(guò)來(lái)，讓交互設(shè)計(jì)做修改。舉個(gè)例子，我們最近正在做的一個(gè)功能。最早的交互設(shè)計(jì)里沒(méi)有列表選擇功能。后來(lái)在視覺(jué)設(shè)計(jì)過(guò)程中發(fā)現(xiàn)，我們的窗口大小，如果要保證視頻旁邊不出現(xiàn)黑邊，可能會(huì)留很大得空隙，如果布局滿了，又會(huì)導(dǎo)致視頻出現(xiàn)黑邊。一種方式，是把底下的點(diǎn)贊、分享、評(píng)論移上來(lái)，放到右邊，但這樣的排版怎么也不會(huì)滿意。況且我們這個(gè)頁(yè)面最核心的目的，是讓用戶看視頻。后來(lái)我們想了一下，增加了選集的功能，雖然這樣增加了開發(fā)工作量，但是對(duì)用戶來(lái)說(shuō)，在這頁(yè)面可以直接導(dǎo)航到其它視頻，使用體驗(yàn)更好，也解決了我們看視頻黑邊的問(wèn)題。說(shuō)這些想要表達(dá)的是，我們要時(shí)刻注意，自己是在同視覺(jué)設(shè)計(jì)師配合完成一個(gè)作品。我們?cè)O(shè)計(jì)的好壞，會(huì)影響他的工作。所以在介入真實(shí)項(xiàng)目前，我們要通過(guò)大量的學(xué)習(xí)+練習(xí)，達(dá)到準(zhǔn)設(shè)計(jì)師水平。如何學(xué)習(xí)交互設(shè)計(jì)1.看交互設(shè)計(jì)師需要有好的視覺(jué)設(shè)計(jì)的感覺(jué)，需要有基本的審美能力。如何提升審美能力？只有一種方法，看。我們要看大量?jī)?yōu)秀的設(shè)計(jì)作品?，F(xiàn)在有很多平臺(tái)可以很容易的找到世界上頂尖的設(shè)計(jì)師們?cè)O(shè)計(jì)的東西。比如behance、pinterest、FWA、dribbble等等……如果嫌國(guó)外的訪問(wèn)太慢，也可以選擇國(guó)內(nèi)的，比如花瓣。不要只看軟件界面，也看看其它領(lǐng)域的設(shè)計(jì)作品，好的產(chǎn)品、好的建筑、好的電影海報(bào)、好的攝影作品、好的藝術(shù)作品。看到喜歡的，把它們收集起來(lái)。看了后，該怎么判斷自己的審美能力有提升呢？隔幾個(gè)月去看看自己前幾個(gè)月喜歡的東西，當(dāng)時(shí)覺(jué)得不錯(cuò)，現(xiàn)在是不是覺(jué)得丑的掉渣？如果是的話，審美水平就在進(jìn)步。[3]還有一種辦法，把自己平時(shí)喜歡的、會(huì)分享的設(shè)計(jì)，同設(shè)計(jì)領(lǐng)域的人溝通，聽聽他們的意見。一個(gè)專業(yè)的設(shè)計(jì)師，不會(huì)只說(shuō)，這個(gè)好，那個(gè)不好，他們說(shuō)為什么好，為什么不好，比如「這個(gè)界面主次不夠突出，重點(diǎn)元素沒(méi)有強(qiáng)調(diào)出來(lái)」、「沒(méi)有引導(dǎo)用戶的視線」等等等等……2.用我們?cè)赿ribble、在花瓣，看的都是單個(gè)頁(yè)面。交互設(shè)計(jì)不只是設(shè)計(jì)一個(gè)個(gè)頁(yè)面，它還得把頁(yè)面串起來(lái)。所以看單個(gè)頁(yè)面還不行，我們要用、要體驗(yàn)實(shí)際的產(chǎn)品，看看別人是怎么把一個(gè)個(gè)頁(yè)面組合成產(chǎn)品，頁(yè)面和頁(yè)面間的過(guò)場(chǎng)是怎樣的。怎么用呢？很簡(jiǎn)單，我們每個(gè)人都有手機(jī)或pad。去下載優(yōu)秀的APP，每個(gè)APP花20分鐘，把所有頁(yè)面、所有功能跑一遍。優(yōu)秀的APP來(lái)源，可以是應(yīng)用市場(chǎng)每個(gè)分類下的Top20，也可以來(lái)自一些優(yōu)秀的組織、用戶推薦，如最美應(yīng)用、如知乎上的APP推薦等。我還有一個(gè)很誠(chéng)懇的建議。如果有條件的話，最好買個(gè)MAC。為什么設(shè)計(jì)師喜歡用MAC？我們看幾張對(duì)比圖。PC和MAC上的QQ。PC和MAC上的應(yīng)用市場(chǎng)。PC上的「精美」PPT模板，和MAC上的keynote模板。MAC的軟件比PC的軟件優(yōu)雅太多，完全不在一個(gè)level。如果我們每天看的、用的都是最好的產(chǎn)品，我們的審美能力自然會(huì)提升，對(duì)什么是好設(shè)計(jì)，什么是壞設(shè)計(jì)會(huì)更敏銳，更有感覺(jué)。3.想認(rèn)知科學(xué)研究發(fā)現(xiàn)：世界上最好的象棋選手之間的差距，其實(shí)并不是他們思考能力的差異，或者是否能走出一招妙棋，而是他們熟悉的棋譜的多寡。做交互設(shè)計(jì)也是這樣，決定交互設(shè)計(jì)師的設(shè)計(jì)水平，是在做設(shè)計(jì)時(shí)，設(shè)計(jì)師能夠想起多少個(gè)相似的的設(shè)計(jì)，并借鑒、組合、改進(jìn)它們，成為自己的設(shè)計(jì)。我們看了那么多優(yōu)秀的設(shè)計(jì)，我們用了那么多優(yōu)秀的產(chǎn)品，怎么樣才能在需要的時(shí)候記起它們呢？認(rèn)知科學(xué)給出的答案很簡(jiǎn)單，去想，去思考。一樣?xùn)|西進(jìn)入我們的大腦，如果我們沒(méi)有思考過(guò)，大腦會(huì)認(rèn)為這個(gè)東西沒(méi)用，就丟掉它，不存下來(lái)。但如果我們仔細(xì)思考過(guò)它，大腦就會(huì)自己做個(gè)判斷，認(rèn)為以后有可能要再度想起它，就把它存下來(lái)。所以不只要看，要用，還要想。比如我們看到這個(gè)頁(yè)面，要想：信息架構(gòu)是怎樣的？有沒(méi)有層級(jí)，有沒(méi)有邏輯順序？能不能反映它們的重要程度和關(guān)系？頁(yè)面布局是怎樣的？它們位置、順序是怎樣的？它是怎么分塊的？它是怎么突出主要任務(wù)的？有沒(méi)有其它設(shè)計(jì)亮點(diǎn)，比如好的隱喻，比如視覺(jué)怎么營(yíng)造氛圍。把所有思考結(jié)果記錄下來(lái)。記得多了，形成自己的觀點(diǎn)后寫成文章，同其他人分享。4.做一開始模仿，在這個(gè)過(guò)程中，學(xué)習(xí)工具的使用，把它用熟。為什么要先把工具用熟呢？道理很簡(jiǎn)單，如果工具還不熟悉，大腦會(huì)把主要精力都耗費(fèi)在工具的使用上，根本騰不出空間來(lái)思考設(shè)計(jì)的事。當(dāng)工具使用沒(méi)有任何問(wèn)題后，做真實(shí)的產(chǎn)品設(shè)計(jì)。我們可以直接在項(xiàng)目中實(shí)踐，但大部分人應(yīng)該沒(méi)這個(gè)條件，那怎么做？重新設(shè)計(jì)現(xiàn)有的產(chǎn)品。比如我們可以重新設(shè)計(jì)微信，重新設(shè)計(jì)簡(jiǎn)書；我們覺(jué)得某個(gè)軟件設(shè)計(jì)的不夠好，重新設(shè)計(jì)它。通過(guò)這種訓(xùn)練方式，提升設(shè)計(jì)技能，達(dá)到準(zhǔn)設(shè)計(jì)師的水平。那么，一個(gè)產(chǎn)品（或功能）的設(shè)計(jì)流程，是怎樣的呢？1.明確使用場(chǎng)景我們經(jīng)常看到一個(gè)被分解后的功能指標(biāo)項(xiàng)如下：我要一個(gè)遠(yuǎn)程控制的功能。老師可以控制某個(gè)學(xué)生的電腦。如果按照這個(gè)需求做的話，在產(chǎn)品首頁(yè)加一個(gè)遠(yuǎn)程控制的按鈕，點(diǎn)一下，老師可以選擇某個(gè)學(xué)生進(jìn)行控制，這個(gè)功能就設(shè)計(jì)好了。但是實(shí)際上老師是怎么用的呢？我們和產(chǎn)品經(jīng)理（或用戶）溝通，會(huì)發(fā)現(xiàn)老師使用這個(gè)功能的場(chǎng)景是：老師查看屏幕預(yù)覽圖，覺(jué)得某個(gè)學(xué)生可能做的不錯(cuò)，雙擊查看學(xué)生完整的屏幕。發(fā)現(xiàn)學(xué)生做的很好，就轉(zhuǎn)播給其他學(xué)生看，在這個(gè)過(guò)程中會(huì)協(xié)助學(xué)生微調(diào)作業(yè)。學(xué)生有問(wèn)題時(shí)，舉手請(qǐng)求老師協(xié)助，老師在講臺(tái)上協(xié)助解決問(wèn)題，（并將這個(gè)協(xié)助過(guò)程廣播給其它同學(xué)）。這就是使用場(chǎng)景。場(chǎng)景非常非常重要。它決定了功能入口放在哪里比較合適，應(yīng)該突出它，還是弱化它。它的前一步是什么，下一步是什么。只有明確了真實(shí)的使用場(chǎng)景，才能設(shè)計(jì)出用戶可用的產(chǎn)品。2.收集素材去前面提到的設(shè)計(jì)網(wǎng)站，或是平時(shí)用的軟件商找同類設(shè)計(jì)來(lái)對(duì)比和分析，看看其他人是怎么設(shè)計(jì)的。比如遠(yuǎn)程協(xié)助，可以看看QQ是怎么設(shè)計(jì)的。把它的整個(gè)流程跑幾遍，并且把每個(gè)過(guò)程截圖下來(lái)。借鑒它設(shè)計(jì)好的地方。QQ遠(yuǎn)程協(xié)助3.畫草圖有了想法以后，在紙上畫草圖。草圖里面，主要是把每個(gè)頁(yè)面都有哪些功能、元素，擺放順序定清楚。這個(gè)就是梳理我們?cè)O(shè)計(jì)思路的過(guò)程。這個(gè)過(guò)程一定要有。千萬(wàn)不要一上來(lái)就做原型，那會(huì)花很多時(shí)間在對(duì)齊、排版等等瑣碎的事情上，我們也沒(méi)辦法一下子看到全貌，把每個(gè)頁(yè)面都想清楚了，頁(yè)面流程怎么跳轉(zhuǎn)都想好了，再搬到Axure上。4.畫低保真原型把草圖搬到Axure上。這個(gè)過(guò)程還會(huì)調(diào)整，修改。5.可用性測(cè)試，調(diào)整設(shè)計(jì)做完動(dòng)態(tài)的、可交互的原型后，找三個(gè)用戶試用下（不一定要真實(shí)的最終用戶，另外，不用太多用戶，三個(gè)用戶就已經(jīng)能夠發(fā)現(xiàn)70%關(guān)鍵問(wèn)題），觀察他們?cè)谑褂玫臅r(shí)候會(huì)碰到什么問(wèn)題，找出最關(guān)鍵的問(wèn)題，進(jìn)行調(diào)整。這個(gè)階段完成后，就可以提交開發(fā)了。6.補(bǔ)充細(xì)節(jié)設(shè)計(jì)有一些很細(xì)節(jié)的流程，我們沒(méi)辦法在一個(gè)交互稿里面完全體現(xiàn)，比如頁(yè)面內(nèi)容為空時(shí)，怎么辦；數(shù)據(jù)加載出錯(cuò)時(shí)，怎么辦。這個(gè)時(shí)候用文檔來(lái)補(bǔ)充這些分支流程。我們就像寫開發(fā)文檔一樣，把整個(gè)軟件的所有分支流程、異常流程都過(guò)一遍，記下來(lái)，然后提交開發(fā)。文檔形式不重要，只要能傳遞思考結(jié)果就行。以上只是一個(gè)大概的流程，在實(shí)際操做的時(shí)候，還會(huì)碰到很多問(wèn)題。有一些東西我會(huì)在后面分享的時(shí)候再細(xì)講，還有一些東西，可能就需要大家實(shí)際動(dòng)手，自己去摸索和沉淀?？偨Y(jié)看、用、想、做。最后，我想說(shuō)的是，我們掌握一個(gè)東西，要下很大的功夫，沒(méi)有捷徑可走。那些想要走捷徑的人，往往到最后會(huì)發(fā)現(xiàn)，繞了一大圈，卻什么也沒(méi)得到。只有那些腳踏實(shí)地一步步前行的人，才有機(jī)會(huì)走到自己想要到達(dá)的地方。【最能借鑒的經(jīng)驗(yàn)都是實(shí)戰(zhàn)出來(lái)的】交互設(shè)計(jì)起源于網(wǎng)站設(shè)計(jì)和圖形設(shè)計(jì)，但現(xiàn)在已經(jīng)成長(zhǎng)為一個(gè)獨(dú)立的領(lǐng)域。現(xiàn)在的交互設(shè)計(jì)師遠(yuǎn)非僅僅負(fù)責(zé)文字和圖片，而是負(fù)責(zé)創(chuàng)建在屏幕上的所有元素，所有用戶可能會(huì)觸摸，點(diǎn)按或者輸入的東西：簡(jiǎn)而言之，產(chǎn)品體驗(yàn)中的所有交互。這篇文章對(duì)有興趣學(xué)習(xí)更多關(guān)于交互設(shè)計(jì)的知識(shí)的人來(lái)說(shuō)是一個(gè)很好的起點(diǎn)。我們將會(huì)簡(jiǎn)要討論交互設(shè)計(jì)的歷史，相關(guān)的指導(dǎo)原則，值得關(guān)注的貢獻(xiàn)者，以及有關(guān)這個(gè)迷人學(xué)科的工具。一、什么是交互設(shè)計(jì)？交互設(shè)計(jì)（IxD）定義了交互系統(tǒng)的結(jié)構(gòu)和行為。交互設(shè)計(jì)師努力在用戶和用戶使用的產(chǎn)品或者服務(wù)間創(chuàng)建有意義的關(guān)聯(lián)，不管是從電腦到移動(dòng)設(shè)備，家用電器或者其他。我們的實(shí)踐會(huì)與世界一同不斷發(fā)展?！薄换ピO(shè)計(jì)協(xié)會(huì)（IxDA）從第一臺(tái)用來(lái)容納靜態(tài)副本以外的信息的屏幕被設(shè)計(jì)出來(lái)的那天開始，交互設(shè)計(jì)就開始了。從按鈕，鏈接到表單的一切都是交互設(shè)計(jì)的一部分。在過(guò)去的幾十年里，有許多相關(guān)的書已經(jīng)出版了，這些書解釋了交互設(shè)計(jì)的方方面面，并探索了交互設(shè)計(jì)與體驗(yàn)設(shè)計(jì)間交叉和重疊的多種方式．交互設(shè)計(jì)的發(fā)展幫助和促進(jìn)了人和他們所在的環(huán)境之間的相互作用。不像用戶體驗(yàn)設(shè)計(jì)那樣占據(jù)所有面向用戶的系統(tǒng)，交互設(shè)計(jì)師只關(guān)心用戶和屏幕之間的特定相互作用。當(dāng)然，在實(shí)際中從來(lái)不會(huì)如此清楚地劃分開來(lái)。二、常見的交互設(shè)計(jì)方法盡管交互設(shè)計(jì)跨越了無(wú)數(shù)類型的Web和移動(dòng)應(yīng)用程序和網(wǎng)站，有一些固定的方法是所有設(shè)計(jì)師都可以依賴的。我們將探討一些比較常見的方法：目標(biāo)驅(qū)動(dòng)設(shè)計(jì)，可用性，五個(gè)維度理論，認(rèn)知心理學(xué)和人機(jī)界面指南。1.目標(biāo)驅(qū)動(dòng)的設(shè)計(jì)目標(biāo)驅(qū)動(dòng)的設(shè)計(jì)是由艾倫·庫(kù)珀在他的著作《囚犯正在逃出庇護(hù)：為什么高科技產(chǎn)品讓我們瘋狂，如何恢復(fù)理智》（出版于1999年）中推廣的。艾倫定義了目標(biāo)驅(qū)動(dòng)的設(shè)計(jì)是指把解決問(wèn)題作為最高優(yōu)先級(jí)的設(shè)計(jì)過(guò)程。換句話說(shuō)，目標(biāo)驅(qū)動(dòng)設(shè)計(jì)首先關(guān)注滿足終端用戶的具體需求和欲望，而不同于舊的設(shè)計(jì)方法只是專注于技術(shù)側(cè)上的能力。今天來(lái)看，艾倫提出的一些觀點(diǎn)是顯而易見的，因?yàn)樵O(shè)計(jì)師很少會(huì)選擇設(shè)計(jì)完全受制于技術(shù)發(fā)展約束的交互。然而，其核心的方法是滿足最終用戶的需要并想要的，也就是說(shuō)就這一點(diǎn)對(duì)現(xiàn)在和曾經(jīng)都是一樣必要的。根據(jù)艾倫所說(shuō)的，目標(biāo)驅(qū)動(dòng)的設(shè)計(jì)過(guò)程，需要作為交互設(shè)計(jì)師的我們進(jìn)行五個(gè)思維方式的轉(zhuǎn)變。1）先設(shè)計(jì)，再編程。換句話說(shuō)，目標(biāo)驅(qū)動(dòng)的設(shè)計(jì)首先要考慮用戶如何與產(chǎn)品交互，而不是以技術(shù)因素開始。2）獨(dú)立開設(shè)計(jì)和編程的負(fù)責(zé)。這其中的必要性是，這樣可以使交互設(shè)計(jì)師可以盡量擁護(hù)用戶，而不去擔(dān)心技術(shù)限制。一個(gè)設(shè)計(jì)師應(yīng)該信任他或她的開發(fā)人員來(lái)處理技術(shù)方面的問(wèn)題，事實(shí)上艾倫建議如此，否則會(huì)把設(shè)計(jì)師放在利益沖突的位置。3）設(shè)計(jì)師要對(duì)產(chǎn)品質(zhì)量和用戶滿意度負(fù)責(zé)。雖然利益相關(guān)者或客戶會(huì)有各自的目標(biāo)，交互設(shè)計(jì)師出也對(duì)任何在屏幕的另一邊的人有責(zé)任。4）為你的產(chǎn)品定義某個(gè)特定的用戶。這個(gè)想法已經(jīng)發(fā)展成為現(xiàn)在用戶研究最通常的東西：角色模型。然而艾倫依舊不斷提醒我們要把角色模型關(guān)聯(lián)回產(chǎn)品，不斷問(wèn)自己：這個(gè)用戶會(huì)在哪里使用這個(gè)產(chǎn)品？他或她是誰(shuí)？他或她想要完成什么目標(biāo)？5）結(jié)對(duì)工作。最后一點(diǎn)是，交互設(shè)計(jì)師不應(yīng)該獨(dú)自完成工作，而應(yīng)該與他人協(xié)作，艾倫稱其為關(guān)鍵的“設(shè)計(jì)溝通者”。雖然作為設(shè)計(jì)溝通者的艾倫，在1999年時(shí)的設(shè)想不過(guò)是一個(gè)典型的旨在提供營(yíng)銷產(chǎn)品副本的廣告文字撰稿人，但到今天已經(jīng)設(shè)計(jì)溝通者擴(kuò)展到了包括項(xiàng)目經(jīng)理、內(nèi)容策略師、信息架構(gòu)師等在內(nèi)的許多其他人。2.可用性可用性感覺(jué)起來(lái)可能是一個(gè)模糊的概念，但其核心只是設(shè)計(jì)師的一個(gè)簡(jiǎn)單問(wèn)題——“是不是誰(shuí)都可以輕松使用這個(gè)產(chǎn)品呢？“。這個(gè)概念在無(wú)數(shù)的書籍和網(wǎng)絡(luò)文章上解釋過(guò)，我們將回顧一些不同的定義來(lái)發(fā)現(xiàn)一些共同的主題和細(xì)微的差別：在艾倫迪克斯，珍妮特芬利，拉塞爾比爾，格里高利阿柏德幾個(gè)全著的書《人機(jī)交互》中，可用性被劃分成三個(gè)原則：易學(xué)性：新用戶學(xué)會(huì)在系統(tǒng)中導(dǎo)航的容易程度如何？靈活性：有多少種方法可以實(shí)現(xiàn)用戶和系統(tǒng)的交互？魯棒性：我們對(duì)用戶面對(duì)他們的操作錯(cuò)誤時(shí)的支持做得怎么樣？與此同時(shí)，由尼爾森和施耐德曼所解釋的可用性是由五項(xiàng)原則構(gòu)成的：易學(xué)性：新用戶學(xué)會(huì)在系統(tǒng)中導(dǎo)航的容易程度如何？有效性：用戶執(zhí)行任務(wù)的速度如何？記憶性：如果一個(gè)用戶一段時(shí)間沒(méi)有訪問(wèn)系統(tǒng)，他們對(duì)界面的記憶程度如何？錯(cuò)誤度：用戶一共犯了多少錯(cuò)誤，從錯(cuò)誤中恢復(fù)的速度如何？滿意度：用戶是否喜歡他們所使用的界面，以及他們是否對(duì)結(jié)果滿意？最后，國(guó)際標(biāo)準(zhǔn)（ISO9241）也把可用性這個(gè)詞也分解成五項(xiàng)原則：易學(xué)性：新用戶學(xué)會(huì)在系統(tǒng)中導(dǎo)航的容易程度如何？可理解性：用戶對(duì)他們所看到的界面的理解程度如何？可操作性：用戶對(duì)界面的控制程度如何？吸引度：界面在視覺(jué)上的吸引程度如何？易用性的依從性：界面是否遵循了標(biāo)準(zhǔn)？顯然，在這些解釋中，我們能看出構(gòu)成可用的界面是有一些共同的主題的，無(wú)論一個(gè)設(shè)計(jì)師依據(jù)的是哪條原則，在設(shè)計(jì)任何界面的時(shí)候可用性都是一個(gè)重要的考慮方面。3.五維度理論在比爾莫格里奇的訪談書籍《設(shè)計(jì)交互》中，吉莉安史密斯，一位交互設(shè)計(jì)學(xué)者，介紹了關(guān)于“交互設(shè)計(jì)語(yǔ)言“的四維空間的概念，。換句話說(shuō)，這些維度能夠構(gòu)成交互本身，因此它們最后形成了用戶和屏幕之間的溝通。原來(lái)的四個(gè)維度是這樣的：話語(yǔ)，視覺(jué)表征，物體或空間，以及時(shí)間。最近，凱文西爾韋，一位IDEXX實(shí)驗(yàn)室的資深交互設(shè)計(jì)師，增加了第五個(gè)維度，行為。一維：話語(yǔ)應(yīng)該盡量易于用戶理解，用這樣一種方式表達(dá)使信息能夠輕松傳達(dá)給最終用戶。二維：視覺(jué)表征一般都是圖形或圖像，基本上就是指一切非文本的東西。他們應(yīng)該適量地被使用，而不是壓倒。三維：物理對(duì)象或空間指的是物理硬件，無(wú)論是鼠標(biāo)和鍵盤，或者任何用戶能與之交互的移動(dòng)設(shè)備。四維：時(shí)間是指用戶與前三個(gè)維度交互所花費(fèi)的時(shí)間長(zhǎng)度。它也包括用戶可能的用來(lái)衡量進(jìn)展的方式，包括聲音和動(dòng)畫。五維：凱文西爾韋在他的文章《交互設(shè)計(jì)中的設(shè)計(jì)》中增加了行為這個(gè)維度。這是指用戶與系統(tǒng)交互時(shí)產(chǎn)生的情緒和反應(yīng)。通過(guò)使用這五個(gè)維度，交互設(shè)計(jì)師可以非常專注于用戶與系統(tǒng)通信和連接時(shí)的體驗(yàn)。4.認(rèn)知心理學(xué)認(rèn)知心理學(xué)是關(guān)于大腦如何工作，以其發(fā)生的心理過(guò)程的研究。根據(jù)美國(guó)心理協(xié)會(huì)的定義，這些過(guò)程包括了“注意力、語(yǔ)言的使用、記憶、感知、解決問(wèn)題，創(chuàng)造力和思考”。雖然心理學(xué)是一個(gè)非常廣泛的領(lǐng)域，認(rèn)知心理學(xué)尤為重視其中的某些關(guān)鍵的元素，實(shí)際上，這可能幫助了交互設(shè)計(jì)領(lǐng)域的形成。唐諾曼在他的書《日常生活的設(shè)計(jì)》中提到了其中的很多概念。以下只是那些概念中的一部分：1）心理模型是指的在用戶心中的一幅景像，使他們產(chǎn)生了對(duì)特定的交互或系統(tǒng)的期望。通過(guò)學(xué)習(xí)用戶的心智模型，交互設(shè)計(jì)師可以創(chuàng)建出使用戶有直觀感覺(jué)的系統(tǒng)。2）界面隱喻是指利用已知的行為來(lái)引導(dǎo)用戶產(chǎn)生新的行動(dòng)。例如，大多數(shù)計(jì)算機(jī)上的垃圾桶圖標(biāo)都類似于現(xiàn)實(shí)中的垃圾桶，這是為了提醒用戶做出預(yù)期的行動(dòng)。3）功能可見性是指界面元素不僅是為了達(dá)到功能而設(shè)計(jì)出來(lái)的，而且也是為了讓它們看起來(lái)像是可以達(dá)成功能而設(shè)計(jì)出來(lái)的。例如，按鈕看起來(lái)像一個(gè)可以按的物體，這就是一個(gè)功能可見性的設(shè)計(jì)，使得不熟悉按鈕的人仍能理解如何與之交互。5.人機(jī)界面指南這部分內(nèi)容其實(shí)有點(diǎn)不恰當(dāng)，實(shí)際上是沒(méi)有一整套完整的人機(jī)界面指南的。然而，創(chuàng)建人機(jī)界面指南背后的理念本身就是一種方法論。準(zhǔn)則是由主要的技術(shù)設(shè)計(jì)企業(yè)，包括蘋果和安卓、Java和微軟等構(gòu)建的。他們的目標(biāo)都是一樣的：用這些建議和推薦來(lái)提醒未來(lái)的設(shè)計(jì)師和開發(fā)者，這將幫助他們創(chuàng)建普遍意義上直觀的界面和程序。三、日常任務(wù)和可交付成果在整個(gè)開發(fā)過(guò)程中交互設(shè)計(jì)師是一名關(guān)鍵的球員。他或她從事的一系列的活動(dòng)都是項(xiàng)目團(tuán)隊(duì)的關(guān)鍵。這些活動(dòng)通常包括形成設(shè)計(jì)策略、將關(guān)鍵交互做成線框圖，以及將所有交互建立為產(chǎn)品原型。1.設(shè)計(jì)策略雖然這個(gè)將會(huì)物的界限比較模糊，但有一點(diǎn)是肯定的：一個(gè)交互設(shè)計(jì)師需要知道自己在為誰(shuí)設(shè)計(jì)，以及用戶的目標(biāo)是什么。通常情況下，這些信息會(huì)用戶研究員提供。然后，交互設(shè)計(jì)師在獨(dú)立或者受到團(tuán)隊(duì)中其他設(shè)計(jì)師的幫助的情況下，將會(huì)評(píng)估目標(biāo)并形成設(shè)計(jì)策略。好的設(shè)計(jì)策略將幫助團(tuán)隊(duì)成員對(duì)在哪些需要的地方應(yīng)該發(fā)生什么樣的交互有一個(gè)共同的理解，以方便用戶目標(biāo)。2.關(guān)鍵交互的線框圖交互設(shè)計(jì)師在用于激勵(lì)其設(shè)計(jì)的設(shè)計(jì)策略上有了好主意之后，就可以開始畫草圖，畫出那些可以促進(jìn)必要交互的界面。交互的妙門藏在細(xì)節(jié)中：在這個(gè)過(guò)程中，有一些專家會(huì)直接在紙板上素描，而有些則使用在線應(yīng)用程序來(lái)幫助他們，而有的則會(huì)使用兩者的組合。有一些專家會(huì)協(xié)同工作來(lái)創(chuàng)建這些界面，而有的則獨(dú)自創(chuàng)建。這一切都取決于交互設(shè)計(jì)師自己的特定工作流。3.原型根據(jù)項(xiàng)目的需要，交互設(shè)計(jì)師的下一個(gè)合乎邏輯的步驟可能涉及到創(chuàng)建原型。團(tuán)隊(duì)制作交互原型有許多不同的方法，比如html/css原型，或紙上原型，在這里，我們不會(huì)覆蓋廣泛的細(xì)節(jié)。4.保持流行性對(duì)一個(gè)現(xiàn)實(shí)中的交互設(shè)計(jì)師來(lái)說(shuō)，最難的部分是適應(yīng)工業(yè)發(fā)展變化的速度。每一天，新的設(shè)計(jì)師都可能要在不同的方向上看待媒介。結(jié)果便是，用戶也會(huì)預(yù)期這些新類型的交互會(huì)出現(xiàn)在你的網(wǎng)站上。謹(jǐn)慎的交互設(shè)計(jì)師會(huì)響應(yīng)這種演變，不斷探索在線交互以及利用新技術(shù)，但是我們總是要記住正確的交互或技術(shù)是最好地滿足角色用戶的需要的那些，而不只是最新穎或最令人興奮的那些。交互設(shè)計(jì)師還通過(guò)在推特上跟隨交互設(shè)計(jì)的思想領(lǐng)袖（比如下列的著名設(shè)計(jì)師）并主動(dòng)推動(dòng)媒介本身的發(fā)展，以保持流行性。四、著名的設(shè)計(jì)師從左到右，從上到下分別是：ALANCOOPER，BILLSCOTT，BRADFROST，BRENDALAUREL，BRENDASANDERSON，DANSAFFER，DONNORMAN，KARENMCGRANE，KIMGOODWIN，MATMARQUIS，MIKEMONTEIRO，THERESANEIL，WHITNEYHESS譯者注：此處篇幅過(guò)長(zhǎng)，因而對(duì)設(shè)計(jì)師作了聚合，可在原文中查看詳細(xì)個(gè)人說(shuō)明。五、工具交互設(shè)計(jì)師使用許多不同的工具來(lái)完成他們的工作。無(wú)論是在一張餐巾紙上畫交互草圖，還是向客戶展示原型，他們的目標(biāo)都是一樣的：通過(guò)對(duì)話來(lái)溝通。交互設(shè)計(jì)師最需要的就是溝通。下面的列表里是一系列用于促進(jìn)對(duì)話的工具。記住，最終創(chuàng)建的Web界面，通常與面向用戶的（前端）技術(shù)完成的，比如CSS/HTML。1.

BalsamiqMockupsBalsamiq的界面簡(jiǎn)單,使用手繪風(fēng)格元素和comicsans字體，使得制作交互線框圖的過(guò)程變得簡(jiǎn)單，可以認(rèn)為它是一個(gè)在線版的紙上原型！2.

InvisionInVision是一個(gè)免費(fèi)的網(wǎng)站和移動(dòng)App的原型工具。InVision旨在通過(guò)結(jié)合Photoshop，Sketch等其他應(yīng)用促進(jìn)溝通。設(shè)計(jì)師可以上傳線框圖，并通過(guò)熱區(qū)來(lái)連接它們。客戶、利益相關(guān)者和他的同事設(shè)計(jì)可以直接添加評(píng)論，并有實(shí)時(shí)演示工具LiveShare。3.

OmnigroupOmnigraffle是OSX上的交互設(shè)計(jì)師可以利用的圖表軟件，用單調(diào)的審美創(chuàng)造的圖表軟件Omnigraffle更關(guān)注背后的交互設(shè)計(jì)而不是設(shè)計(jì)本身，同時(shí)其也具備許多優(yōu)秀的模擬功能。4.

Patternry沒(méi)有人愿意浪費(fèi)時(shí)間重新發(fā)明輪子。良好的交互設(shè)計(jì)或代碼聚合在一起更能節(jié)省時(shí)間和精力,并確保設(shè)計(jì)的一致性。Patternry是一種允許團(tuán)隊(duì)交互設(shè)計(jì)師分享并將其設(shè)計(jì)和代碼資產(chǎn)存儲(chǔ)在一個(gè)中央位置的工具。5.

SketchSketch是一種設(shè)計(jì)工具（Mac），最好用于圖標(biāo)的中高級(jí)保真度模型，是一個(gè)AdobePhotoshop的一個(gè)輕量級(jí)替代。6.

AxureAxureRP可以說(shuō)是市場(chǎng)上最好的交互設(shè)計(jì)工具。比Balsamiq擁有更強(qiáng)大的功能，內(nèi)置的協(xié)作和共享功能，并且能夠輕松地實(shí)現(xiàn)線框原型。缺點(diǎn)是，它可能提供了太多，這意味著它有一個(gè)緩慢的學(xué)習(xí)曲線。7.UxpinUXPin是一個(gè)協(xié)同設(shè)計(jì)平臺(tái),支持低保真的線框圖和高保真的動(dòng)畫原型。設(shè)計(jì)師使用Photoshop或Sketch制作的分層原型可以直接導(dǎo)入，然后從利益相關(guān)者處得到反饋。該工具還包括可用性測(cè)試和現(xiàn)場(chǎng)演示功能。六、協(xié)會(huì)和組織不管交互設(shè)計(jì)師是否屬于任何特定的組織，其仍然是一個(gè)交互設(shè)計(jì)者。不過(guò)，找到其他設(shè)計(jì)師的網(wǎng)絡(luò)是向他人學(xué)習(xí)的好方法。這些協(xié)會(huì)在美國(guó)都有，有一些則是國(guó)際性組織。1）IXDA－InteractionDesignAssociation交互設(shè)計(jì)協(xié)會(huì)，其提供了一個(gè)討論交互設(shè)計(jì)問(wèn)題的在線論壇。2）AGIA－AmericanInstituteofGraphicArts美國(guó)平面藝術(shù)學(xué)院，組織中的平面設(shè)計(jì)師更經(jīng)常地為新媒體設(shè)計(jì)作品，交互設(shè)計(jì)在其中扮演了重要組成部分。七、書籍其實(shí)相關(guān)的交互設(shè)計(jì)書籍列表可以占掉好多頁(yè)。在這里，我們縮小成幾本標(biāo)志性的圖書的列表。如果你真的渴望擴(kuò)大你的圖書收藏，可以看看我們網(wǎng)站搜索用戶體驗(yàn)的推薦書集：/book/從左到右依次是《交互設(shè)計(jì)：創(chuàng)建創(chuàng)新應(yīng)用和設(shè)備(第二版)》《設(shè)計(jì)數(shù)字時(shí)代：如何創(chuàng)建以人為本的產(chǎn)品和服務(wù)》《設(shè)計(jì)界面》《交互設(shè)計(jì)：超越人機(jī)交互》《日常生活的設(shè)計(jì)》\o"優(yōu)設(shè)"Home

/

\o"查看PS教程&設(shè)計(jì)文章中的全部文章"PS教程&設(shè)計(jì)文章

/

正文超實(shí)用！移動(dòng)端界面中的版式設(shè)計(jì)原理(上)推薦:

\o"cyRotel"cyRotel

2016/01/04

in

PS教程&設(shè)計(jì)文章

\o"分享到微信"\o"分享到新浪微博"\o"分享到QQ空間"\o"分享到花瓣"\o"分享到騰訊微博"\o"分享到豆瓣網(wǎng)"\o"分享到人人網(wǎng)"\o"分享到有道云筆記"\o"分享到QQ好友"更多45justinlam：“我總覺(jué)得頁(yè)面不太好看但是我又說(shuō)不出來(lái)”，“我不懂設(shè)計(jì)，但是我就是覺(jué)得不協(xié)調(diào)”，“你覺(jué)得這好看？你的審美要加強(qiáng)啊”這些聽著熟悉的話往往是產(chǎn)品和設(shè)計(jì)產(chǎn)生矛盾的開端。還有一種評(píng)價(jià)叫說(shuō)不出哪里好也說(shuō)不出哪里不好，相信很多人也有過(guò)感同身受的無(wú)奈。其實(shí)設(shè)計(jì)本身就是一門理性的學(xué)科，審美因人而異，只有言之有理的設(shè)計(jì)才能夠說(shuō)服別人。當(dāng)設(shè)計(jì)師拿到產(chǎn)品的原型開始做設(shè)計(jì)時(shí)，如果只是單純的按照原型進(jìn)行而不考慮任何規(guī)則，那么很多時(shí)候就會(huì)產(chǎn)生一些不協(xié)調(diào)的結(jié)果。設(shè)計(jì)完之后產(chǎn)品不滿意，自己也不滿意。在UI設(shè)計(jì)中其實(shí)也存在大量的版式設(shè)計(jì)原理，如果產(chǎn)品和設(shè)計(jì)都能對(duì)版式設(shè)計(jì)有一定的了解，那么設(shè)計(jì)師拿到原型的時(shí)候，評(píng)審設(shè)計(jì)輸出稿的時(shí)候大家都能更好地理解對(duì)方的設(shè)計(jì)。以下我總結(jié)了幾種常見的版式設(shè)計(jì)原理，是工作當(dāng)中做出良好視覺(jué)效果的前提。1.信息的排布對(duì)任何信息進(jìn)行排布的時(shí)候，首先必須要掌握的是對(duì)齊/重復(fù)/親密/對(duì)比，貫穿設(shè)計(jì)的四大原則。對(duì)齊除了能建立一種清晰精巧的外觀，還能方便開發(fā)的實(shí)現(xiàn)?；趶淖笊现劣蚁碌拈喿x習(xí)慣，移動(dòng)端界面中內(nèi)容的排布通常使用左對(duì)齊和居中對(duì)齊，表單填寫的輸入項(xiàng)使用右對(duì)齊。設(shè)計(jì)和做其他事情一樣，也要有輕重緩急之分，不要讓用戶去找重點(diǎn)/需要注意的地方，應(yīng)該讓用戶流暢地接收到我們想要傳達(dá)的重要的信息。重復(fù)和對(duì)比是一套組合拳，讓設(shè)計(jì)中的視覺(jué)元素在整個(gè)設(shè)計(jì)中重復(fù)出現(xiàn)既能增加條理性也可以加強(qiáng)統(tǒng)一性，降低用戶認(rèn)知的難度。那么在需要突出重點(diǎn)的時(shí)候就可以使用對(duì)比的手法，例如圖片大小的不同或者顏色的不同表示強(qiáng)調(diào)，讓用戶直觀地感受到最重要的信息。在排布復(fù)雜信息的時(shí)候，如果沒(méi)有規(guī)則地排布那么文本的可讀性就會(huì)降低。組織信息可以根據(jù)親密性的原則，把彼此相關(guān)的信息靠近，歸組在一起。如果多個(gè)項(xiàng)相互之間存在很近的親密性，它們就會(huì)成為一個(gè)視覺(jué)單元，而不是多個(gè)孤立的元素。這有助于減少混亂，為讀者提供清晰的結(jié)構(gòu)。在設(shè)計(jì)表達(dá)的時(shí)候，一定要考慮內(nèi)容的易讀性。適當(dāng)使用圖形可以增加易讀性和設(shè)計(jì)感，而且圖形的理解比文字更高效。那些用文字方式表現(xiàn)時(shí)顯得冗長(zhǎng)的說(shuō)明，一旦換成可視化的表現(xiàn)方式也會(huì)變得簡(jiǎn)明清晰，可視化的圖形可以將說(shuō)明/標(biāo)題/數(shù)值這種比較生硬的內(nèi)容，以比較柔和的方式呈現(xiàn)出來(lái)。2.圖片的使用App的頁(yè)面結(jié)構(gòu)和文本確定之后，就要開始安排圖標(biāo)/按鈕/圖片的安排了，這時(shí)頁(yè)面也就從單純文本的“閱讀”型結(jié)構(gòu)調(diào)整為“觀看”型結(jié)構(gòu)，對(duì)于頁(yè)面的易讀性以及頁(yè)面整體的效果會(huì)產(chǎn)生巨大的影響。頁(yè)面中圖片所占的比率叫做圖版率，通常情況下降低圖版率會(huì)給人一種寧?kù)o典雅、高級(jí)的感覺(jué)。提升圖版率會(huì)有充滿活力，使畫面有富有感染力的效果。實(shí)際中也跟選取圖片的元素/色調(diào)/表達(dá)出來(lái)的情感有關(guān)系，合適的圖片也能散發(fā)出整個(gè)應(yīng)用的氣質(zhì)，直接傳達(dá)給人“高級(jí)”，“平民化”，“友好”等不同的感覺(jué)。在內(nèi)容比較少但是又想提高版面率的話可以采用一些色塊，或者抽象化模擬現(xiàn)實(shí)存在的物件，例如電影票，書本紙張，優(yōu)惠券，便簽等的效果，使界面更友好也降低空洞的感覺(jué)。通過(guò)這種方式也可以改變頁(yè)面所呈現(xiàn)出的視覺(jué)感受，只是這種方法最多改變頁(yè)面的色調(diào)/質(zhì)感，并不能改改變“閱讀”內(nèi)容的比例，這點(diǎn)是需要注意的。3.顏色的使用不同的顏色可以帶給用戶不同的感覺(jué)，這點(diǎn)應(yīng)該是常識(shí)。在移動(dòng)端界面中通常需要選取主色，標(biāo)準(zhǔn)色，點(diǎn)晴色。移動(dòng)端與網(wǎng)頁(yè)端稍微不同，主色雖然是決定了畫面風(fēng)格的色彩但是往往不會(huì)被大面積的使用。通常在導(dǎo)航欄/部分按鈕/icon/特殊頁(yè)面等地方出現(xiàn)，會(huì)有點(diǎn)晴，定調(diào)的作用。統(tǒng)一的主色調(diào)也能讓用戶找到品牌感的歸屬，例如網(wǎng)易紅/騰訊藍(lán)/京東紅/阿里橙等等。標(biāo)準(zhǔn)色指的是整套移動(dòng)界面的色彩規(guī)范，確定文本/線段/圖標(biāo)/背景等等的顏色。點(diǎn)晴色通常會(huì)用在標(biāo)題文本/按鈕/icon等地方，通常起強(qiáng)調(diào)和引導(dǎo)閱讀的作用。主色在選擇上可能不止一個(gè)，點(diǎn)睛色通常也由兩三個(gè)顏色組成，標(biāo)準(zhǔn)色更是一套從強(qiáng)到弱的標(biāo)準(zhǔn)群，那么在點(diǎn)晴色與主色，主色與主色之間的選擇上便有不同的方法。第一種是鄰近色配色(色相環(huán)上鄰近的顏色)，這種方法比較常用因?yàn)樯嗳岷瓦^(guò)渡也非常自然。第二種是同色系配色(色相一致，飽和度不同)，主色和點(diǎn)晴色都在統(tǒng)一的色相上，給用戶一種一致化的感受。第三種是點(diǎn)亮色配色，主色用相對(duì)沉穩(wěn)的顏色，點(diǎn)晴色采用一個(gè)高亮的顏色，起帶動(dòng)頁(yè)面氣氛，強(qiáng)調(diào)重點(diǎn)的作用。第四種是中性色配色，用一些中性的色彩為基調(diào)搭配，弱化干擾。這種方法在移動(dòng)端是最常見的方法。還有一些漸變，明暗調(diào)對(duì)比，多色搭配等方法在這里不一一說(shuō)明，你感受一下。未完待續(xù)。內(nèi)容預(yù)告：4.留白的藝術(shù)

5.視覺(jué)心理的靈活運(yùn)用

6.沒(méi)有設(shè)計(jì)的設(shè)計(jì)【為了這8個(gè)指南也得存書簽！】平面設(shè)計(jì)：《超贊！設(shè)計(jì)師完全自學(xué)指南》交互設(shè)計(jì)