如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

蘇格蘭有了第一座設(shè)計(jì)博物館，你永遠(yuǎn)不知道建筑和室內(nèi)設(shè)計(jì)的邊與限在哪里，它只有用不完的靈感之泉，和看不盡的精彩設(shè)計(jì)。建筑位于蘇格蘭東北海岸線上的懸崖，地理位置不平凡，它如何能平凡呢？

博物館外的材質(zhì)是預(yù)制混凝土，它沿著起伏的混凝土墻延伸，像千萬年前的高山被慢慢風(fēng)化，形成一種自然形狀，曾踏上高山環(huán)云游九天，曾在無數(shù)飄渺的歲月里看世間。當(dāng)太陽經(jīng)過的時(shí)候，奇妙的光影效果產(chǎn)生，它是建筑與自然的聯(lián)系。再看看室內(nèi)的設(shè)計(jì)，大廳和樓梯的地板使用愛爾蘭藍(lán)石灰?guī)r，數(shù)百萬年前的海洋動(dòng)植物化石藏在其中，寓意室外那片水。白色混凝土則是像瀕臨滅絕的淡水珍珠蚌致敬，混凝土里有不少貝殼，二樓和畫廊內(nèi)的地板材質(zhì)選用產(chǎn)自歐洲的橡木，餐廳和野餐屋的地板和墻面材質(zhì)是用的竹子，自然的聲音在這里每天奏響。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 

如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

好看的鎖骨千篇一律，

有趣的肚腩duang來duang去。

11月22日，

那一天，是西方的感恩節(jié)，

那一天，也是中國(guó)的小雪。

歪果仁感恩上帝的厚德與恩賜，

…

我只想感謝我身上的秋膘…

它，比秋褲更便利；

它，比暖寶更親膩；

它，比集體供暖更懂你；

它，比炭盆燒炕來的更容易。

感謝久坐，感謝外賣，感謝秋膘，

讓盡情放浪在暖冬的我，肥而不膩。

創(chuàng)意周報(bào) – 2018年11月第3周

一周熱銷圖片TOP5

NO.5 圖片ID：678491803（點(diǎn)擊查看圖片）

感恩節(jié)將近。

這張垂直視角的感恩節(jié)餐桌照片中，

果蔬與肉類食物顏色搭配鮮艷，

木質(zhì)桌面紋路不搶眼。

很適合作為網(wǎng)頁大圖、banner、

移動(dòng)端開屏背景和海報(bào)背景等用途使用。

NO.4 圖片ID：735764617（點(diǎn)擊查看圖片）

在國(guó)內(nèi)絕大多數(shù)人更熟識(shí)雙十一，

但“黑色星期五”才是世界范圍內(nèi)的購(gòu)物狂歡節(jié)。

在國(guó)內(nèi)的權(quán)重雖然不及雙十一，

但是黑五的影響力依舊不可小覷。

NO.3 圖片ID：1076345054（點(diǎn)擊查看圖片）

這張智能場(chǎng)景矢量圖在8月時(shí)曾經(jīng)上榜一次。

可愛、生動(dòng)的形象和冷靜、嚴(yán)謹(jǐn)?shù)睦渖{(diào)是讓這張圖片

從眾多固有風(fēng)格的科技主題畫面中脫穎而出的重要原因。

NO.2 圖片ID：1071512777（點(diǎn)擊查看圖片）

這張3D霓虹場(chǎng)景利用簡(jiǎn)單的幾何結(jié)構(gòu)搭建亮部背景，

前景空間的留白倒影也為畫面增加了立體感和質(zhì)感。

是一張通用型很強(qiáng)的背景圖。

NO.1 圖片ID：1092261245（點(diǎn)擊查看圖片）

經(jīng)典的紅、金配色，剪紙風(fēng)格設(shè)計(jì)。

中國(guó)傳統(tǒng)的窗框輪廓，左右對(duì)稱的排版。

可見該作者對(duì)于傳統(tǒng)題材的理解和用心。

一周熱銷題材TOP5

NO.5 健身（點(diǎn)擊查看該題材）

進(jìn)入秋冬之后，健身題材屢次上榜。

除了有氧運(yùn)動(dòng)的內(nèi)容以外，力量訓(xùn)練內(nèi)容增加明顯。

不論男女對(duì)身體線條的追求越來越以歐美為目標(biāo)。

NO.4 城市（點(diǎn)擊查看該題材）

從后臺(tái)數(shù)據(jù)來看城市題材攝影畫面在上周的熱銷，

主要是互聯(lián)網(wǎng)公司的采購(gòu)為主。

在互聯(lián)網(wǎng)企業(yè)不斷發(fā)展的過程中，

以城市為核心、為載體的成長(zhǎng)方式需要更多的城市影像

來傳遞各類品牌理念、產(chǎn)品訴求等信息。

NO.3 圣誕（點(diǎn)擊查看該題材）

圣誕題材毫無懸念入榜，

小編目測(cè)未來幾周內(nèi)圣誕題材會(huì)一直榜上有名。

圣誕裝飾主題的照片在上周比較搶眼。

NO.2 科技（點(diǎn)擊查看該題材）

本次熱銷的科技題材中，以太空科技畫面為主。

太空技術(shù)不但是各國(guó)國(guó)力競(jìng)爭(zhēng)的重點(diǎn)項(xiàng)目，

也承載了人類不斷探索和追求超越的夢(mèng)想。

NO.1 金融（點(diǎn)擊查看該題材）

雙十一之后，人們結(jié)束了購(gòu)物狂歡。

把視線集中在了各種銷售行為背后的商業(yè)邏輯上。

中產(chǎn)階級(jí)也更關(guān)心各種商業(yè)頂層的內(nèi)容。

金融題材內(nèi)容作為嚴(yán)肅話題一直處在討論熱點(diǎn)。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 

如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

一、配色常見的誤區(qū)

很多人之所以怕配色，或者說配不好色的原因是自己一直深處誤區(qū)中而渾然不知，接下來希望大家不要對(duì)號(hào)入座。

誤區(qū)一：配色的過程在整體之前。也就是常說的先配色，后設(shè)計(jì)。

誤區(qū)二：只會(huì)配不會(huì)選。這是最常見的一種，只會(huì)在有基礎(chǔ)色或者主色的前提下配色，而不懂得選一個(gè)符合整體的基礎(chǔ)色遠(yuǎn)比配色更重要。

誤區(qū)三：被理論所局限。配色的過程是偏感性的，理論雖然沒錯(cuò)，但是它只是輔助提供一種方向的，而不是完全要依靠理論去配色。

接下來就繼續(xù)今天的主題：色，從哪里來？也就是基礎(chǔ)色應(yīng)該怎么選？

二、顏色來源 —— 主體

在設(shè)計(jì)中，主體也就是畫面中最重要的部分，它可以是產(chǎn)品、模特、抽象圖形等等，基礎(chǔ)色來源最常用的方式就是在主體身上提取，可以是主體中比重較大的顏色，這樣有利于主色與主體形成更強(qiáng)烈的呼應(yīng)關(guān)系，也可以是比重相比較小的顏色，這樣在形成呼應(yīng)關(guān)系的同時(shí)，拓展性更強(qiáng)，下面舉個(gè)例子：

假如我們?cè)谶@個(gè)人物的基礎(chǔ)上去選背景的基礎(chǔ)色，我們就可以用到這里說到的理論：基礎(chǔ)色來源于主體，那么我們可以有哪幾種選色的形式呢？下面我們繼續(xù)看：

配色形式一：將主體整體比例最大的顏色作為主色，整體在色彩上與主體形成很強(qiáng)烈的呼應(yīng)關(guān)系，這樣做的目的在于整體很和諧、舒服，易于接受，畫面更統(tǒng)一，整體視覺沖擊力偏柔軟一些。下面看另外一種形式：

配色形式二：將主體整體比例較小的顏色作為主色，同樣整體在色彩上也與主體形成了一定的呼應(yīng)關(guān)系，而正是因?yàn)橹魃侵黧w比重較小的顏色，這也使得畫面整體在于主體形成呼應(yīng)關(guān)系的前提下，也拉開了主體與背景的層次，整體視覺沖擊力增強(qiáng)，畫面統(tǒng)一性減弱，整體性并沒有因?yàn)橹魃母淖兌档?。下面嘗試將文字的顏色也稍加改動(dòng)：

不難發(fā)現(xiàn)，無論上面哪種主色的形式，配黃色字都很融合，且都增強(qiáng)了視覺沖擊力。其原因在于畫面整體顏色與主體都形成了呼應(yīng)關(guān)系，使得配色不會(huì)給用戶一種很突兀、毫無依據(jù)的感覺。而這種形式的選色在工作中也是用到最多的，比如：

其實(shí)，這種通過提取主體色作為配色參考的形式在接受程度上是很高的，通過搭配一些點(diǎn)綴色，整體上也不會(huì)給人一種很單調(diào)的視覺感受；利用主體選色的配色方式是將原本有可能茫無頭緒、感性的配色工作，轉(zhuǎn)化為一種可以有所依據(jù)、有所參考的配色技法，同時(shí)也能提升一定的工作效率。再舉個(gè)例子：

三款牙刷，三種不同的主色方案，但是每一個(gè)給人的感覺都很舒服、和諧，呼應(yīng)明確，這就是提取主體色方式的好處。

三、顏色來源 —— 風(fēng)格

不管是做海報(bào)還是頁面，在最初都要確定一個(gè)風(fēng)格路線，然后圍繞確定好的風(fēng)格選材、選色、搭配主體等。那么很多情況下，確定風(fēng)格也就等于間接性的確定了一個(gè)選色的區(qū)間，所以結(jié)合風(fēng)格特征選色也是一種很實(shí)用的方式，比如我們要做「狂暑季」風(fēng)格的專題頁，那么在用色方面就要避免大面積暖色調(diào)用色，而要著重使用冷色調(diào)的顏色，目的很簡(jiǎn)單：大面積的暖色會(huì)給人一種熱鬧、狂熱、張揚(yáng)、溫馨的感受，和暑季需要清爽、降溫的感覺不相匹配，所以我們會(huì)盡可能采用主色冷色調(diào)的用色形式，搭配一些輔助色、點(diǎn)綴色，比如：

這些都是依據(jù)風(fēng)格最直觀的選色形式，這樣做的目的是將整體用色盡可能的貼合主題風(fēng)格，同時(shí)再結(jié)合主體選色的形式，將配色的過程盡可能做到有據(jù)可循。風(fēng)格選色的形式在日常工作中也是很實(shí)用的，比如：促銷，我們會(huì)用紅色、藍(lán)紫色、黃色的用色形式；春節(jié)，則是以紅、黃為主；七夕，多以紫色、紅色為主；暑期購(gòu)，多以藍(lán)色、青色、綠色為主。比如：

這些海報(bào)的配色形式很大程度上是依據(jù)風(fēng)格來決定的，這樣的選色方式也不會(huì)顯得很突兀，且擴(kuò)展性相對(duì)更高。

四、顏色來源 —— 文案

做設(shè)計(jì)目的是服務(wù)于商業(yè)，很多時(shí)候我們都要圍繞文案、產(chǎn)品去制定風(fēng)格、主題，所以選色同樣可以參考文案，從文案中提取關(guān)鍵詞，依據(jù)關(guān)鍵詞同樣也可以提取相對(duì)應(yīng)的顏色，比如：

文案在一個(gè)畫面中的重要性也是很高的，因?yàn)橛脩粼诓豢次陌傅那疤嵯吕斫庠O(shè)計(jì)畫面速度是相對(duì)緩慢的，所以文案結(jié)合畫面的方式能夠大大的提升用戶對(duì)整體的理解速度，也就是捕捉信息的速度，將文案與畫面很好的結(jié)合在一起也是設(shè)計(jì)師所必備的技能，這樣做的目的在于讓文案與畫面形成視覺上的呼應(yīng)，也更利于視覺信息的傳遞。

五、來源 —— 主體反色

前面說的大多都是通過顏色找整體的呼應(yīng)關(guān)系，這樣做的目的是讓畫面整體更和諧、整體性更強(qiáng)。而還有一種選色的形式，即以主體顏色的反色作為主色調(diào)，也可以理解為：主體比重較大顏色的對(duì)比色或間隔色作為主色。比如：

將主色和主體色通過對(duì)比色或間隔色的關(guān)系拉開對(duì)比，目的是讓主體在整個(gè)畫面中的視覺形象更加鮮明，視覺感受更加強(qiáng)烈，但是要注意的是：在選反色時(shí)，盡量選用主體色中比重較大顏色的反色，這樣才能起到強(qiáng)烈對(duì)比的效果。

再說下點(diǎn)綴色，點(diǎn)綴色的作用很大程度上是豐富畫面整體色感的，它的用色比例只占畫面整體的5%~10%左右，點(diǎn)綴色的選色很多時(shí)候是畫面主色的反色，目的是讓畫面整體色感不顯得單調(diào)、缺少變化，同時(shí)也有豐富畫面的作用，但是要注意不要大面積的使用，起到點(diǎn)綴、打破的作用即可。

總結(jié)

總的來說，其實(shí)配圖的過程就是在配色，當(dāng)一個(gè)畫面的主體、風(fēng)格、文案確定時(shí)，我們就可以依據(jù)這些進(jìn)行選整體色，只有主色確定時(shí)才有必要進(jìn)行下面配色的工作，而不是把配色放在所有工作之前。今天主要說的就是選色的幾種常用方式，選色的過程其實(shí)也是在配色，配色合不合理要看整體效果，設(shè)計(jì)的整體感也是很重要的，凡事要做到有所依據(jù)。最后還是那句話，配色是感性的，理論是提供思路和方向的，兩者相互結(jié)合才能把配色做的更出彩。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。

如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

在設(shè)計(jì)環(huán)節(jié)中，對(duì)于視覺次序的營(yíng)造是每個(gè)設(shè)計(jì)師所必須精通的，視覺次序也可以理解為視覺層次，它是設(shè)計(jì)中的必然，無論是海報(bào)設(shè)計(jì)還是頁面設(shè)計(jì)，從整體來看總會(huì)有強(qiáng)弱、主次之分，因?yàn)橛辛艘曈X上的變化，才使得整體更富有層次感。從大體來說：當(dāng)用戶在瀏覽信息很多的網(wǎng)頁時(shí)，作為設(shè)計(jì)師要做到，即使用戶只是簡(jiǎn)單的瀏覽，也要有能在用戶腦海中形成記憶的視覺元素，而這些元素就是視覺中的主，而當(dāng)用戶仔細(xì)閱讀時(shí)才能記憶到的元素才是視覺上的次。從局部來說，要能在視覺上形成先后順序。這期的內(nèi)容就是設(shè)計(jì)中體現(xiàn)視覺次序手法有哪些？這些也是打破版式的常用手法。

一、大小對(duì)比

首先，每個(gè)人在瀏覽東西時(shí)都會(huì)有自己固有的習(xí)慣，比如：從上到下、從左到右，這叫常規(guī)方式，而作為設(shè)計(jì)師，不能僅僅局限于常規(guī)形式，完全的常規(guī)帶來的是設(shè)計(jì)上的枯燥、乏味。要學(xué)會(huì)利用設(shè)計(jì)知識(shí)打造不同的視覺次序，營(yíng)造出更強(qiáng)烈的設(shè)計(jì)感、層次感。

在眾多營(yíng)造視覺次序的手法中，大小對(duì)比幾乎是每個(gè)人都能想到的一種形式，也是很多人認(rèn)為的最簡(jiǎn)單的一種，比如：

通過大小對(duì)比的形式能直觀營(yíng)造出視覺焦點(diǎn)，這種形式在設(shè)計(jì)中也是最容易接受的一種。如果左側(cè)放置的也是四塊小的產(chǎn)品，給人的感覺就會(huì)顯得枯燥、乏味，版式太過統(tǒng)一，而正是因?yàn)檫@種放大產(chǎn)品的處理手法，拉開了對(duì)比，才使得版式不顯呆板。這種形式無論是在文字排版、海報(bào)、頁面都是很實(shí)用的一種，合成設(shè)計(jì)中的近大遠(yuǎn)小也同樣適用，只是在做對(duì)比效果時(shí)一定要大膽。

二、配色方式

通過改變不同的配色方式，也能在視覺上營(yíng)造出視覺層次的變化，比如我們常見的通過有彩色與無彩色進(jìn)行區(qū)分的手法：

在原本無彩色的排列方式中加入有彩色，在視覺上就形成了很強(qiáng)烈的差異化，而正是因?yàn)橛辛藦?qiáng)烈的差異，使得存在差異的部分成為了更容易吸引用戶的區(qū)域，所以就在視覺上形成了先后順序，同時(shí)這種差異的形式也能起到一定打破版式、活躍版式的作用。而在有彩色之間，同樣也能通過差異化形成視覺上的主次，比如：

第一行色塊能最快引起注意的是第二個(gè)，通過色彩飽和度的不同，在視覺上形成了很明顯的差異化，進(jìn)一步改變了原本的做從左往右的習(xí)慣性視覺次序。而第二行色塊中最快能引起注意的是紅色，因?yàn)檫@里用到了改變色系的形式進(jìn)行視覺上的次序劃分。之所以在有彩色中也能很好的體現(xiàn)視覺層次最重要的一點(diǎn)是，他們之間形成的差異足夠明顯，而不是似有非有。

三、形態(tài)的不同

營(yíng)造不同的視覺次序最重要的就是在正常人習(xí)慣的固有次序上尋找變化，那么我們同樣可以以形態(tài)上的變化作為差異化的形式，比如：

在固有的形態(tài)中尋找其中可以引起差異化的元素，從視覺感受而言可以分為兩種：第一，改變了原本的習(xí)慣性的閱讀方式，也使得整體主次發(fā)生了變化；第二，原本枯燥、呆板的重復(fù)式的結(jié)構(gòu)上因?yàn)樵匦螒B(tài)的改變，也起到了打破整體版式的作用，使得整體版式變化更多，層次感更強(qiáng)且版式因此也變得更加活躍。形態(tài)上的變化還可以這么體現(xiàn)：

雖然都是矩形框，但是線框與色塊形成了很明顯的差異，同樣也可以體現(xiàn)視覺層次，而這種形式在很多頁面中也很常見：

這也是版式設(shè)計(jì)中很重要的一部分，也就是尋找可以打破版式且營(yíng)造視覺層次的元素，正是因?yàn)檫@些手法，才使得版式更豐富、更富有多變性。

四、空間留白

當(dāng)要求不能改變很多時(shí)，在原有的基礎(chǔ)上只需要改變空間位置或者留白方式，也可以營(yíng)造不同的視覺次序，比如：

在不改變其大小、顏色、形態(tài)的前提下，只是改變了空間留白，也能起到改變視覺次序的作用；而在編排或者標(biāo)題設(shè)計(jì)中，通過空間留白的方式拉開層次、次序也很常見：

同樣是重復(fù)的形式，左側(cè)完全沒有給人一種有層次、有次序的感覺，在用戶眼中，這只不過是一團(tuán)信息；而右側(cè)通過改變留白的方式充分的體現(xiàn)出視覺上的層級(jí)關(guān)系，每一個(gè)獨(dú)立存在的標(biāo)題或者欄目之間都應(yīng)該用留白的方式體現(xiàn)，這種留白要遵循的原則是：標(biāo)題與文案的留白要小于欄目與欄目之間且大于說明性文字信息之間，只要這樣才能真正意義上的將層次拉開。

五、投影的方式

投影在設(shè)計(jì)環(huán)節(jié)中是很常用的一種手法，通過投影可以體現(xiàn)出前后層次，也能改變視覺次序，比如頁面設(shè)計(jì)中的：

這里只是在色塊上添加了簡(jiǎn)單的投影效果，原本的視覺次序就瞬間被打破，而這種投影在海報(bào)設(shè)計(jì)中最常用的是打破前后關(guān)系，使得海報(bào)更有層次感：

這種大投影的方式，是很多海報(bào)以及頁面中常用的手法之一，因?yàn)橛辛送队?，使得畫面整體形成了明顯的層次關(guān)系，而投影對(duì)于用戶來說也是很容易接受的，比如：按鈕的投影、主體的投影等等，看似很小的改變，往往能給頁面帶來很明顯的效果。這種形式也可以理解為形成遮擋關(guān)系，在一些小場(chǎng)景的設(shè)計(jì)中，一樣很實(shí)用：

有了遮擋關(guān)系，就會(huì)形成視覺上的層次，這種看似簡(jiǎn)單的手法，最終所呈現(xiàn)的效果卻是立竿見影的。

六、高斯模糊

拉開視覺次序的另一種手法：模糊，很多人對(duì)于 PS 里的模糊工具并不陌生，而通過將視覺元素模糊化處理，一樣能起到營(yíng)造視覺層次的效果，比如我們常見的電影海報(bào)中：

通過虛實(shí)對(duì)比，使得視覺層次變化更強(qiáng)，這也是合成設(shè)計(jì)中常用的手法之一，而在文字設(shè)計(jì)中，一樣可以通過這樣的手法來拉開視覺次序關(guān)系，比如：

通過模糊字體中某個(gè)筆畫，在視覺上形成了一定的空間關(guān)系，也使得整體層次感更加豐富，這也是很多設(shè)計(jì)師喜歡在作品的最后環(huán)節(jié)加一些飄飛模糊的點(diǎn)狀元素豐富整體的原因：

視覺層次的變化對(duì)于整體而言是不可缺少的一部分，有時(shí)只需要一點(diǎn)點(diǎn)的變化就可以帶來意想不到的效果。

七、應(yīng)用于版式中

這期所說的很多都屬于細(xì)節(jié)上的變化，但是很多人對(duì)于細(xì)節(jié)并不重視，認(rèn)為不重要，但其實(shí)優(yōu)秀的版式設(shè)計(jì)基本上都是用不同的細(xì)節(jié)處理方式堆砌而成的，這期所說的這些形式用于版式設(shè)計(jì)中也同樣很實(shí)用，如果你的版式太過呆板，可以通過考慮這些方面在適當(dāng)?shù)奈恢眠M(jìn)行打破，打破的意思是：在原本很呆板的基礎(chǔ)上尋找視覺上的層次變化，使得整體版式活躍起來且富有細(xì)節(jié)感，比如：

這是從一個(gè)頁面中選取的一個(gè)局部信息，上側(cè)版式給人的感覺毫無變化，如果頁面中出現(xiàn)大面積這種形式的版式，會(huì)使得整體單調(diào)、枯燥，很容易形成視覺疲勞。而下側(cè)區(qū)域則是為了避免這些，在形式上改變了許多：第一，顏色上有輕微的變化，這樣做的目的是區(qū)分開每個(gè)欄目。第二，形式上第三個(gè)模塊做了很明顯的層次變化，顏色明顯加深了，且投影效果加重，而且按鈕區(qū)域也用色塊的形式代替邊框，使得整體層次感更強(qiáng)且有保持在一個(gè)很協(xié)調(diào)的范圍內(nèi)。這里用到的手法，正是這期所說的。

同樣我們也可以在網(wǎng)上找一些版式感很強(qiáng)的頁面進(jìn)行分析，去理解這些手法是如何在版式中體現(xiàn)的，比如一些官網(wǎng)的設(shè)計(jì)，看似很簡(jiǎn)潔、元素很少，而往往這種頁面對(duì)于版式的要求更高，因?yàn)橐脴O少的元素體現(xiàn)其版式變化、層次。

總結(jié)

視覺層次感是提升整體設(shè)計(jì)感很重要的一種形式，如何在固有的視覺基礎(chǔ)上打破束縛，在形式上形成變化，對(duì)于每個(gè)設(shè)計(jì)師而言都是至關(guān)重要的；而很多設(shè)計(jì)手法都存在著共通性，只要學(xué)會(huì)靈活運(yùn)用，那么我們的設(shè)計(jì)作品就不會(huì)顯得平庸無常。當(dāng)然這期所說的也并非全部，這些只是很常用的一些形式。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)

如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。

如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

如何從無到有設(shè)計(jì)一款字體

對(duì)于很多剛接觸字體設(shè)計(jì)的同學(xué)經(jīng)常會(huì)遇到一種情況那就是想法高大上，結(jié)果很悲傷，為什么會(huì)造成這樣的結(jié)果？歸根結(jié)底是對(duì)字體設(shè)計(jì)本身了解還不夠細(xì)致就照葫蘆畫瓢直接上，為了避免這種尷尬的結(jié)果，我們應(yīng)該在開始著手做字體之前要做好各項(xiàng)準(zhǔn)備工作，不斷去瀏覽優(yōu)秀的字體設(shè)計(jì)從中尋找設(shè)計(jì)的感覺，確定感覺后建立網(wǎng)格系統(tǒng)，開始逐步設(shè)計(jì)字體。我在做字體設(shè)計(jì)的時(shí)候會(huì)把握幾個(gè)步驟「建網(wǎng)格」——「選字體」——「拆字體」——「繪筆畫」——「綁骨架」——「粗與細(xì)」——「取與舍」——「磨細(xì)節(jié)」——「去感受」。

下面我們就以大家最常見的矩陣字體為例來給大家分享如何制作字體。

1. 建網(wǎng)格

建立網(wǎng)格系統(tǒng)，萬丈高樓平地起，要做一款扎實(shí)的字體離不開網(wǎng)格系統(tǒng)的規(guī)范。

2. 拆字體

以「燃」為例——選取一個(gè)默認(rèn)字體，按照字體結(jié)構(gòu)對(duì)筆畫進(jìn)行拆分。

3. 繪筆畫

將拆分出的筆畫用橫線和豎線在網(wǎng)格系統(tǒng)里進(jìn)行筆畫重繪，此時(shí)不要做細(xì)節(jié)，撇、捺和點(diǎn)根據(jù)自身走向和結(jié)構(gòu)特點(diǎn)也歸屬為橫豎線。

4. 綁骨架

拆分繪制的字體筆畫就是字體的骨骼，筆畫間的連接處可以理解成是人體的關(guān)節(jié)，關(guān)節(jié)的意義在于保證字體穩(wěn)固的同時(shí)又靈活多變，字體的筆畫可以根據(jù)視覺需要圍繞關(guān)節(jié)在一定范圍內(nèi)做活動(dòng)，也可調(diào)整長(zhǎng)短比例。

5. 粗與細(xì)

筆畫的粗細(xì)與硬度由你想要的字體氣質(zhì)來決定，細(xì)筆畫與曲筆畫柔美氣質(zhì)，粗筆畫與直筆畫沉穩(wěn)大氣，雖說設(shè)計(jì)是一種感覺，但是這種感覺對(duì)于初學(xué)者來說很難把控，所以跟大家共享一下常用的幾種筆畫的粗細(xì)，在1000PX*1000PX畫板里采用6px，10px和20px為基礎(chǔ)筆畫粗細(xì)，根據(jù)想要的業(yè)務(wù)氣質(zhì)選取即可。

6. 解與構(gòu)

常見的字體結(jié)構(gòu)有「上下結(jié)構(gòu)」「上中下結(jié)構(gòu)」「左右結(jié)構(gòu)」「左中右結(jié)構(gòu)」「半包圍結(jié)構(gòu)」和「全包圍結(jié)構(gòu)」。其中「上下結(jié)構(gòu)」中著重強(qiáng)調(diào)占比較小的那部分筆畫，進(jìn)而達(dá)到字體本身的平衡，例如「感」字著重設(shè)計(jì)心字；「上中下結(jié)構(gòu)」中一般會(huì)在不影響識(shí)別性的前提下去掉中間部分橫行筆畫，進(jìn)而達(dá)到字體本身的平衡，例如「享」字著重設(shè)計(jì)口字；左中右結(jié)構(gòu)中在不影響識(shí)別性的前提下會(huì)簡(jiǎn)化左邊部分筆畫，進(jìn)而達(dá)到字體本身的平衡，例如「燃」字著重設(shè)計(jì)火字。

7. 取與舍

筆畫變粗后整個(gè)字體筆畫間的空間比例會(huì)受到一定影響，因此為了字體的美觀度和透氣性我們會(huì)對(duì)字體結(jié)構(gòu)進(jìn)行一些取舍和整合。

8. 磨細(xì)節(jié)

為了讓字體看起來更加舒適，我們將字體的拐角做圓，做圓角的同時(shí)也要根據(jù)網(wǎng)格系統(tǒng)來調(diào)整圓的度數(shù)。

9. 去感受

打磨整體字體，繼續(xù)刻畫細(xì)節(jié)。

注意：在一組字里，每個(gè)單字的結(jié)構(gòu)都存在差異，適當(dāng)調(diào)整字體內(nèi)部的比例，形成感官上舒適的筆勢(shì)，對(duì)保持視覺上大小一致很重要。漢字字體類型繁多，但是如果我們用幾何法則來劃分字體類型其實(shí)大致可以歸納為三種：方形，圓形和三角形，從面積上來看方形和圓形的面積最大，三角形次之，所以我們?yōu)榱吮３肿种卮笮〉囊恢滦孕枰{(diào)整他們之間的大小比例，做到大小均勻，筆畫一致，結(jié)構(gòu)嚴(yán)謹(jǐn)和間隙適中。

△ 圖源：ElethomHunter

為了拉出字體的氣質(zhì)，一般會(huì)把字體做的稍微偏瘦長(zhǎng)一些。

字體設(shè)計(jì)的手段是多種多樣的，每個(gè)設(shè)計(jì)師都有自己擅長(zhǎng)的切入點(diǎn)，最后的結(jié)果是自己想要的就好。上述的分享希望能給字體設(shè)計(jì)初學(xué)者一點(diǎn)幫助，也歡迎各位同行大神交流切磋。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。

經(jīng)驗(yàn)分享 | 如何讓設(shè)計(jì)團(tuán)隊(duì)的工作效率提升50%？

對(duì)于大部分的射擊濕以及設(shè)計(jì)團(tuán)隊(duì)來講，都會(huì)遇到如何提升設(shè)計(jì)效率的問題；尤其是在創(chuàng)業(yè)公司，最浪費(fèi)時(shí)間的莫過于：永遠(yuǎn)擼不完的圖及與開發(fā)中的設(shè)計(jì)反復(fù)；接下來我將通過自身的一些設(shè)計(jì)管理經(jīng)驗(yàn)，從工具使用提升工作效率的角度，跟大家分享下我解決這兩個(gè)問題的方法。

擼不完的圖-處理各方設(shè)計(jì)需求

一、為什么有擼不完的圖？

1、設(shè)計(jì)的需求方在不斷增多：產(chǎn)品、運(yùn)營(yíng)、市場(chǎng)、地推、策劃等等；

對(duì)于大部分的射擊濕來說，設(shè)計(jì)的需求都是越來越多的；尤其是中小型公司由于發(fā)展的的需要，公司的人員及部門會(huì)越來越多；也就導(dǎo)致后期的設(shè)計(jì)需求慢慢增加；我們公司就是醬紫的，原來只要考慮產(chǎn)品需求的，現(xiàn)在要考慮運(yùn)營(yíng)日常海報(bào)、活動(dòng)設(shè)計(jì)、市場(chǎng)推廣素材、線下門店品牌視覺系統(tǒng)、還有老板的PPT等等。

2、需求不清導(dǎo)致變動(dòng)頻繁：沒有目的下需求，缺少需求細(xì)節(jié)；

在日常的工作中，最麻煩的就是跟需求方確認(rèn)需求；尤其是口述的需求，沒有文案、時(shí)間節(jié)點(diǎn)及具體的需求描述；比如，我要“五彩斑斕的黑”或者“字要大”這種奇葩需求想一出就是一出的隨性需求。

3、對(duì)接、確認(rèn)流程不清晰：沒有一套完整有效的對(duì)接流程，導(dǎo)致雙方扯皮；

二、產(chǎn)生的問題？

1、設(shè)計(jì)效率及產(chǎn)出質(zhì)量不高：需求方不滿意，然后設(shè)計(jì)反復(fù)浪費(fèi)時(shí)間；

2、項(xiàng)目推進(jìn)速度變緩：有限的時(shí)間達(dá)不到設(shè)計(jì)要求拖慢項(xiàng)目進(jìn)度，影響業(yè)務(wù)目標(biāo)；

三、怎么解決？

1、建立和規(guī)范有效的需求對(duì)接確認(rèn)流程：從制度層面解決跨部門協(xié)調(diào)問題；

首先，對(duì)內(nèi)規(guī)范接收和分發(fā)需求的流程；將原來粗放的接收方式改為協(xié)作工具接收分發(fā)需求；其次，對(duì)外規(guī)范需求下方的格式規(guī)范。

2、使用“團(tuán)隊(duì)協(xié)作工具”統(tǒng)一輸入/輸出需求：運(yùn)用工具解決需求接收下放問題；

3、規(guī)范需求方下需求的格式：需求包含的各項(xiàng)要點(diǎn)：

• 時(shí)間節(jié)點(diǎn)：最好提前幾天；

• 需求描述：需要什么樣的；

• 文案描述：傳達(dá)什么內(nèi)容。

開發(fā)中的設(shè)計(jì)反復(fù)

一、為什么會(huì)出現(xiàn)反復(fù)？

1、工具不統(tǒng)一，協(xié)作較難：PS與Sketch混用；

我剛進(jìn)公司的時(shí)候，設(shè)計(jì)團(tuán)隊(duì)的三個(gè)人用的設(shè)計(jì)工具和設(shè)備都不一樣；有的用PS，有的用Sketch，這就造成設(shè)計(jì)協(xié)作難而且設(shè)計(jì)稿輸出格式不同意，開發(fā)抱怨的情況，工作推進(jìn)艱難。

2、標(biāo)注切圖耗時(shí)太長(zhǎng)：頁面中的各個(gè)元素都要進(jìn)行大小、顏色、間距及格式的標(biāo)注；

設(shè)計(jì)給開發(fā)的輸出物有三種：視覺稿、標(biāo)注及安卓、IOS不同尺寸的切圖；以上是保證上線效果的關(guān)鍵；但是傳統(tǒng)的手動(dòng)標(biāo)注和切圖是很浪費(fèi)時(shí)間的。

3、IOS、安卓設(shè)計(jì)規(guī)范差異：兩個(gè)平臺(tái)系統(tǒng)差異，有時(shí)候要輸出兩套設(shè)計(jì)素材；

二、怎么解決？

1、統(tǒng)一設(shè)計(jì)工具：移動(dòng)端的設(shè)計(jì)統(tǒng)一Sketch輸出；

2、利用第三方工具Zeplin自動(dòng)標(biāo)注設(shè)計(jì)稿：工具代替原來的手動(dòng)標(biāo)注；

3、工具zeplin工具的優(yōu)勢(shì)：

• 自動(dòng)匹配IOS及安卓平臺(tái)設(shè)計(jì)單位、顏色及字體大小等；

• 設(shè)計(jì)一套搞定，減少設(shè)計(jì)師工作量；

• 設(shè)計(jì)溝通的效率和質(zhì)量大大提升；

總結(jié)

以上就是我在做設(shè)計(jì)管理過程中摸索的一些的經(jīng)驗(yàn)，無論是跟需求方的設(shè)計(jì)溝通還是和開發(fā)的協(xié)同配合，都非常的和諧；希望通過此次分享能給遇到相同困惑的小伙伴們一些啟發(fā)~

《延禧攻略》輸了！這部劇的畫面更高級(jí)？

BIGD

如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

一定會(huì)成為優(yōu)秀設(shè)計(jì)師的朋友們！

最近劇真的太多了，

小編還沒從衛(wèi)龍女孩的隊(duì)伍里脫離出來，

如懿傳就已經(jīng)安排上了。

而且小編最近又發(fā)現(xiàn)一部新劇！

《天盛長(zhǎng)歌》

對(duì)比《如懿傳》大紅大綠的配色

（雖然浮夸的色彩更符合乾隆時(shí)期的蜜汁審美）

它的配色和畫風(fēng)簡(jiǎn)直良心的不要！

而且官宣也很佛系，

總之就是沒見著過啥大動(dòng)靜，

可是豆瓣評(píng)分居然比《延禧攻略》還要高

雖然憑借“IP+超級(jí)卡司+大制作”

獲得了較高的評(píng)分，

但《天盛長(zhǎng)歌》自播出后就反響平平，

收視一度撲街，

雖然小編還沒看劇不知道它撲街的原因，

但單單從劇照和海報(bào)就能看出

劇組是真的下功夫了??！

服裝精致，布景豪華，

還專門使用了電影的寬畫幅比

場(chǎng)面變得更加宏大更有代入感！

官方發(fā)布的色卡看起來也很高級(jí)

海報(bào)也值得一看~

 主題海報(bào) 

- 壁影成雙版海報(bào) -

這世間自有百態(tài)浮生，千種際遇，萬般遼闊山河。

看似光影闌珊，皆在你我眸間。

 微雨細(xì)語版海報(bào) 

感謝這亭外風(fēng)雨漫天，你我才能在這亭中獨(dú)處片刻。

 咫尺千山版海報(bào) 

此愛隔山海，山可平，海可越；

此義重天地，天有道，地有情。

家國(guó)在心，蒼生在肩，不敢忘，莫能負(fù)。

 眸繪天光版海報(bào) 

天高地闊，可納日月山河于懷，可藏情深意篤于心。

此念，不滅。

丹心一片，不曾忘情忘恩忘前塵，惟愿守己守家守蒼生。

此意，可鑒。

風(fēng)霜不顧，只求守得云開；此身不吝，但求所愿得償。

此途，不忘。

趁年華歲月，追隨不棄；經(jīng)世事不易，伴君功成。

此生，不枉。

愿安一隅，享人世繁華；縱有風(fēng)雨，念郎君順?biāo)臁?/span>

此求，可得。

扎心劇照海報(bào) 

在光影間蓬勃而生，于明暗外纖毫畢現(xiàn)。

君有箴言相贈(zèng)，吾自銘感于心。

 開播倒計(jì)時(shí)海報(bào) 

圓融不爭(zhēng)，鋒霜無畏。一方明鏡如水，此情，不負(fù)。

距離相遇，還有3天

善惡得報(bào)，世存公道。一盞心燈如舊，此志，不改。

距離相識(shí)，還有2天。

六合既定，共享安寧。一卷長(zhǎng)書如悟，此意，不移。

距離相知，還有1天。

熱點(diǎn)節(jié)點(diǎn)借勢(shì)海報(bào) 

- 七夕 | 天盛七夕節(jié) -

看完這些海報(bào)和劇照之后，

你們有沒有被吸引到呢？

留言告訴小編吧~

小編休假回來了，今天第一篇推送的是中國(guó)風(fēng)的折頁設(shè)計(jì)，內(nèi)容不重要，看板式！往下走！