前言

2021年至今「逆反差字體」這個(gè)原本偏小眾的字體設(shè)計(jì)風(fēng)格，從卷土重來到廣泛應(yīng)用，再次受到諸多設(shè)計(jì)師的追捧，一股新浪潮撲面而來。

縱觀它的出現(xiàn)、流行與發(fā)展，身為設(shè)計(jì)師，期待本文可以通過對經(jīng)典設(shè)計(jì)的客觀分析，蓄力字體設(shè)計(jì)領(lǐng)域的經(jīng)驗(yàn)和技巧，為2022年的創(chuàng)作積累更多靈感。

特征

PART 1.

——————————

商業(yè)的發(fā)展與驅(qū)動

Reverse contrast現(xiàn)在國內(nèi)被稱為「逆反差字體」。設(shè)計(jì)師皮特·比亞克（Peter Bi?ak）在2012年發(fā)表的文章中曾提到：這種逆反差字體的設(shè)計(jì)是有意通過違背讀者的預(yù)期來吸引注意的，怪異的字母形式在日益飽和的商業(yè)信息世界中脫穎而出。

PART 2.

——————————

打破認(rèn)知 重塑觀感

二十世紀(jì)中，荷蘭著名書法家和設(shè)計(jì)師格里特·諾澤爾（Gerrit Noordzij）倡導(dǎo)以書寫走向作為字體設(shè)計(jì)的基礎(chǔ)，通過習(xí)慣來定義書寫理論：平移和擴(kuò)張。這個(gè)邏輯反映出人們對拉丁字母普遍造型認(rèn)知：橫細(xì)豎粗。

豎筆畫在西文字體中起到承重、平衡結(jié)構(gòu)的作用。如果顛倒粗細(xì)對比關(guān)系，使其橫粗豎細(xì)，就會造成橫向視覺，讓人產(chǎn)生印錯的感覺，這與傳統(tǒng)的三大主流西文字體的設(shè)計(jì)方法也是相差甚遠(yuǎn)。

逆向設(shè)計(jì)的規(guī)則營造出視覺上強(qiáng)烈的差異感，比起普通字體更怪誕、夸張，更具有戲劇性和情緒化，讓人印象深刻。它最大的特點(diǎn)是重構(gòu)了拉丁字母的視覺比例。經(jīng)發(fā)展，中文表達(dá)上使用“逆反差”還是生動準(zhǔn)確的。

知丨西字歷史（逆反差字體的思辨）

PART 1-1

——————————

溯源

在商業(yè)廣告海報(bào)張貼應(yīng)用中Caslon Italian字體被鑄造出來。這是19世紀(jì)初，工業(yè)革命在金屬活字印刷領(lǐng)域的一個(gè)新奇的創(chuàng)新。

1825年，印刷工和社會改革家托馬斯·卡森·漢薩德（Thomas Curson Hansard）把逆反差字體描述為“排版怪物”。

1854年，F(xiàn)rench Antique字體發(fā)行，造型如鐵軌般的字型引來了一種新的風(fēng)格——French Clarendon。它在美國廣告制作中展開了大量生產(chǎn)使用。在獲得市場認(rèn)可后的半個(gè)多世紀(jì)，它仍在馬戲團(tuán)的海報(bào)和西部電影宣傳上被廣泛應(yīng)用。

這組彩色的活字印刷樣本，讓逆反差的設(shè)計(jì)風(fēng)格在當(dāng)下更顯復(fù)古。

19世紀(jì)，在追求創(chuàng)新的歐洲人看來，逆反差字體的古怪造型仍是離經(jīng)叛道的。而現(xiàn)代設(shè)計(jì)師則帶著更多反思和辯證，以非傳統(tǒng)的審美來認(rèn)識這種字體風(fēng)格。

PART 1-2

——————————

遍布世界

20世紀(jì)，逆反差字體的浪潮席卷歐洲。瑞士著名的字體設(shè)計(jì)師馬克斯·米丁格（Max Miedinger）于 1954年設(shè)計(jì)了自己的第一款逆反差字體Pro Arte。大名鼎鼎的Helvetica字體就是由他設(shè)計(jì)的。

20世紀(jì)80年代，遠(yuǎn)在亞洲的日本也接受了這股“逆浪潮”。當(dāng)時(shí)的動漫和游戲開始風(fēng)靡，熱血與科幻的世界里結(jié)合字體夸張的造型，讓設(shè)計(jì)簡直天衣無縫。

1980年，在游戲UI中誕生了世界上第一款逆反差像素字體，讓游戲世界充滿著奇幻感。

這種像素化的設(shè)計(jì)方法，如今是很潮的視覺表達(dá)。

80年代，逆反差字體在音樂和書籍等多個(gè)包裝領(lǐng)域的應(yīng)用也是繼往開來。

PART 1-3

——————————

今日應(yīng)用

逆反差字體從未真正流行但也從未被拋棄過。如今，除了趣味盎然，又增加了更加瘋狂的風(fēng)格效果，最為典型的是Maelstrom。很多字體的誕生，都證明著逆反差的無無限可能性。

感丨漢字之力（民族文化的養(yǎng)分）

西文有著較為完整的逆反差字體更迭歷史，漢字相對創(chuàng)造力偏弱。中國設(shè)計(jì)師在進(jìn)行漢字逆反差設(shè)計(jì)的探索時(shí)，不妨大膽些，打破局限，從中國書法中吸取創(chuàng)作養(yǎng)分，這是民族文化理解上的考驗(yàn)，也是對民族文化的尊重。

PART 2-1

——————————

漢字書法與逆反差實(shí)踐

大多書法風(fēng)格多變，并沒有嚴(yán)謹(jǐn)?shù)臋M粗豎細(xì)。不過，難得能在清代的漆書中找到橫粗豎細(xì)的規(guī)律存在，它犧牲了部分漢字的視覺結(jié)構(gòu)，傳達(dá)出一種鈍拙感和趣味性，這正是漆書的魅力所在。

漢儀2020年1月出品一款漢儀吉金，靈感來源就是漆書，在其基礎(chǔ)之上造型更加現(xiàn)代。

民國時(shí)期，在廣告招貼、書籍封面上，也能發(fā)現(xiàn)很多逆反差風(fēng)格的字體設(shè)計(jì)。這些都是漢字設(shè)計(jì)上逆反差的初次實(shí)驗(yàn)。

PART 2-2

——————————

漢字逆反差的設(shè)計(jì)鑒賞

徐學(xué)成是中國第一代字體設(shè)計(jì)師，在晚年仍堅(jiān)持實(shí)驗(yàn)性設(shè)計(jì)的嘗試，1998年他主持設(shè)計(jì)出華康雅藝體這款逆反差字體。

造字工房也推出過幾款視覺沖擊力強(qiáng)、節(jié)奏分明、充滿藝術(shù)張力的字體：造字工房溢尚真體、彩體、超凡體等。

3type（三言）設(shè)計(jì)研發(fā)的基本美術(shù)體，在2020年10月進(jìn)入試用階段。它簡單明了，擁有大膽靈動的字形，是為數(shù)不多的優(yōu)秀中字逆反差字體。

基本美術(shù)體也是本文的靈感來源。曾路過順愛烤肉公司，被牌匾上的字體所吸引，便開始了我對逆反差風(fēng)格字體的探索研究。

日本一度受到美國Fantail（扇形尾）風(fēng)格的西字影響，也展開過一系列的實(shí)驗(yàn)性嘗試。最為典型的是寫研在80年代，推出的「扇尾蘭」字體，它憑借寫研在行業(yè)內(nèi)的影響力得以廣泛的運(yùn)用。

其后，C&G 花束字體、TA-Sigma字體等，這些極具逆反差風(fēng)格的扇尾字形也在市場應(yīng)用中大放異彩。

PART 2-3

——————————

案例賞析

歷經(jīng)200年的鍛造與發(fā)展，逆反差字體如今獲得了越來越多設(shè)計(jì)師的青睞，中外設(shè)計(jì)有目共睹。

野獸派美學(xué)（The brutalist aesthetic）頻繁的應(yīng)用于當(dāng)代平面設(shè)計(jì)和網(wǎng)頁設(shè)計(jì)中，逆反差字體有著原始且未經(jīng)雕琢的質(zhì)樸風(fēng)格，往往在簡潔精致的物體上形成鮮明對比，增加設(shè)計(jì)內(nèi)容的趣味性。

悟丨關(guān)聯(lián)與創(chuàng)造（結(jié)語）

近兩年，看到了很多比例夸張、造型狂野的驗(yàn)性字體形式出現(xiàn)，這要?dú)w功于酸性設(shè)計(jì)的盛行。

酸性設(shè)計(jì)，是一種主觀情緒化、美感與欲望交織、傳達(dá)致幻又辛辣酸澀的一種復(fù)雜感受的體現(xiàn)。它強(qiáng)調(diào)出了失調(diào)和混沌共存的狀態(tài)，這和逆反差字體的反叛精神極為契合，二者結(jié)合來表達(dá)科幻感與未來主義時(shí)情緒飽滿而熱烈。希望本文能幫助更多朋友梳理逆反差字體與設(shè)計(jì)風(fēng)格的關(guān)聯(lián)性。

逆反差字體是一場字體設(shè)計(jì)的視覺革命?？此乒终Q，其實(shí)是對視覺設(shè)計(jì)規(guī)律的突破與創(chuàng)新，雖“有悖常理”，但并非曇花一現(xiàn)，它在字體設(shè)計(jì)的歷史上擁有自己長久的舞臺。

任何一個(gè)新穎的設(shè)計(jì)浪潮，都會影響設(shè)計(jì)師的設(shè)計(jì)表達(dá)。我們能做的就是感受浪潮、尋找源頭、思考走向，隨時(shí)精準(zhǔn)有力的擁抱變化。

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請掃碼ben_lanlan，報(bào)下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(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ù)

本次跟大家聊一個(gè)比較純粹的藝術(shù)風(fēng)格，英文原名叫“Minimal Art”，為什么一開始就上英文呢，因?yàn)檫@個(gè)風(fēng)格特別多不同的翻譯名，如果只看中文資料有時(shí)候你不知道原來不同書籍中談的是同一回事。

我列舉幾個(gè)常見的名稱，分別有“減少主義“、”極少主義“、”質(zhì)樸藝術(shù)“、”ABC 藝術(shù)“跟”極限藝術(shù)“等，因?yàn)椤盡inimal“是極少的意思，所以不同的研究者根據(jù)理解作了不同翻譯。

極限藝術(shù)雕塑作品

這個(gè)藝術(shù)的特征是用極少的形式，極簡單的色彩，通過繪畫或者雕塑來表達(dá)一種周密的理念。

“ABC 藝術(shù)“這個(gè)名稱要特別說明一下，因?yàn)?ABC 是拉丁字母表開始的字母，有簡單初步的意思，而且順口，所以在運(yùn)動初期就有人以這個(gè)名字來稱呼。

極限藝術(shù)繪畫作品

在我們的講述內(nèi)容中，統(tǒng)一以“極限藝術(shù)“來稱呼。

大家對這個(gè)藝術(shù)相信比較陌生，因?yàn)榇_實(shí)是比較“脫離群眾“，史太濃可以列舉一個(gè)歷史作品拉近這種距離，那就是 1957 年在米蘭畫展上誕生的《純藍(lán)》，作者是法國藝術(shù)家伊夫·克萊因（Yves Klein）。

克萊因作品《純藍(lán)》

這個(gè)作品就是一張圖上鋪滿一片由克萊因自己混合的藍(lán)色，其它什么都沒有，但是這個(gè)藍(lán)色純凈得直擊心靈，藍(lán)得很理想，很絕對，展出后馬上引發(fā)轟動，克萊因跟他的藍(lán)色都一炮而紅，這個(gè)藍(lán)色就是后來大名鼎鼎的“國際克萊因藍(lán)”（International Klein Blue，簡稱 IKB）。

伊夫·克萊因

說到這里肯定還有朋友不甚了解，不過沒關(guān)系，這個(gè)“克萊因藍(lán)”誕生后曾經(jīng)火遍過時(shí)尚圈，迪奧（Dior）、紀(jì)梵希（Givenchy）等大品牌都曾經(jīng)推出過“克萊因藍(lán)”色的服裝設(shè)計(jì)。

迪奧曾經(jīng)推出的“克萊因藍(lán)“包包

而在 2021 年時(shí)候，這個(gè)藍(lán)色又再復(fù)興，被不少設(shè)計(jì)師用于商業(yè)設(shè)計(jì)，比如知名設(shè)計(jì)師潘虎老師不久之前為植物醫(yī)生設(shè)計(jì)的產(chǎn)品包裝就采用了這個(gè)“克萊因藍(lán)”，效果非常驚艷。

植物醫(yī)生的產(chǎn)品包裝設(shè)計(jì)

克萊因當(dāng)時(shí)的這個(gè)叫《純藍(lán)》的作品，就屬于一種極限藝術(shù)的一種。

為什么產(chǎn)生極限藝術(shù)

“至上主義”繪畫作品

第二個(gè)端點(diǎn)就是在 1960 年代的美國，我們先從這里講會比較好理解，因?yàn)檫@個(gè)運(yùn)動其實(shí)主要就發(fā)生在美國，在歐洲的影響都不算太大。

如果一直有看史太濃「風(fēng)格列傳」的朋友就清楚，1950-60 年代的美國曾經(jīng)有過“抽象表現(xiàn)主義”（Abstractexpressionism）跟“波普藝術(shù)”兩個(gè)重要藝術(shù)運(yùn)動，而極限藝術(shù)的誕生跟兩者密切相關(guān)。

抽象表現(xiàn)主義風(fēng)格作品

此處順便多說一句「風(fēng)格列傳」的正確“打開方式”，就是每一個(gè)篇章的內(nèi)容雖然各自獨(dú)立，但應(yīng)該順著時(shí)間線順序來看，這樣會更加清楚很多藝術(shù)風(fēng)格的承接關(guān)系。

因?yàn)闃O限藝術(shù)可以說就是針對抽象表現(xiàn)主義與波普藝術(shù)而發(fā)起的。

極限藝術(shù)陣營中的成員認(rèn)為，抽象表現(xiàn)主義僅僅是表達(dá)藝術(shù)家一種瞬間的感覺，太不嚴(yán)肅，而波普藝術(shù)更是刻意要打破藝術(shù)中的高低雅俗，是反藝術(shù)的行為，這兩種運(yùn)動對于藝術(shù)發(fā)展而言都有著高度危害性。

60 年代的波普風(fēng)格作品

當(dāng)然，這是極限藝術(shù)陣營的看法，所以它的誕生就是要明確的反對前兩者，并消滅他們。

極限藝術(shù)主張藝術(shù)創(chuàng)作必須通過精心設(shè)計(jì)，有周密計(jì)劃，而且作品必須是通過高度專業(yè)訓(xùn)練形成的結(jié)果，類似抽象表現(xiàn)主義那種隨意性及波普藝術(shù)中的平庸商業(yè)感都是“垃圾“。

有了戰(zhàn)略目標(biāo)隨之就是戰(zhàn)術(shù)考慮，于是極限藝術(shù)的成員們就從 1910 年代時(shí)候馬列維奇創(chuàng)作的《白上白》這個(gè)作品中找到形式的靈感。

馬列維奇作品《白上白》

馬列維奇曾經(jīng)說過：藝術(shù)不為政府與宗教服務(wù)，不描述行為歷史，僅僅表達(dá)客觀對象，表明簡單的客觀對象可以存在，不依賴于任何東西。

這種理念被極限藝術(shù)者們十分推崇，聽上去也確實(shí)非常高端。

因此至上主義這樣極其簡潔的表現(xiàn)形式就成為極限藝術(shù)的首選，由此可見極限藝術(shù)在反對“抽象表現(xiàn)主義”的時(shí)候，其實(shí)也是從他們的源頭“抽象主義”那里分割出來。

馬列維奇作品《黑色正方形》

這種關(guān)系真心不好理解，我舉個(gè)宗教發(fā)展的例子，比如天主教中曾經(jīng)分裂出東正教，隨后又再分裂出新教，但三者的主張不相同，而且新教是因?yàn)榉磳η皟烧叨Q生的，大致這樣，也許還不夠貼切。

極限藝術(shù)源自抽象主義還有兩個(gè)佐證，就是他們的思想根源除了靠攏馬列維奇，跟“風(fēng)格派”（詳見「風(fēng)格列傳」-風(fēng)格派篇）中蒙德里安（Piet Cornelies Mondrian）的藝術(shù)思想也十分一致，蒙德里安認(rèn)為藝術(shù)品被創(chuàng)作出來以前，必須在藝術(shù)家的頭腦中完全成熟。

蒙德里安的風(fēng)格派作品

蒙德里安的繪畫藝術(shù)曾經(jīng)被我們收錄進(jìn)抽象主義的范圍進(jìn)行講述，這里要補(bǔ)充一句，就是關(guān)于藝術(shù)流派之間的關(guān)系難以理清，通常每個(gè)研究者都只能是無限接近，或者說各自有一套歸納方法。

另一個(gè)佐證就是很多極限藝術(shù)家之前就是搞抽象表現(xiàn)主義的，我們后面會介紹一下，這種情況太常見了，比如很多后現(xiàn)代主義設(shè)計(jì)師是從國際主義陣營中轉(zhuǎn)變的，超現(xiàn)實(shí)主義藝術(shù)家很多從達(dá)達(dá)主義中產(chǎn)生。

我們在談抽象表現(xiàn)主義的時(shí)候講過一個(gè)分支，就是色域繪畫，其實(shí)跟極限藝術(shù)在形式上已經(jīng)非常相似。

抽象表現(xiàn)主義中的色域繪畫

當(dāng)然，極限藝術(shù)家們指責(zé)抽象表現(xiàn)主義與波普藝術(shù)的作品沒有思考是有些過分與不厚道的，等于說人家混飯吃，也等于一些甲方苛責(zé)設(shè)計(jì)師設(shè)計(jì)出品不上心一樣，這些其實(shí)都無法證明，只能是主觀感受或者是刻意發(fā)難。

那么，極限藝術(shù)在抨擊他人的時(shí)候，自身的表現(xiàn)形式有什么特點(diǎn)呢，我們接下來看看。

表現(xiàn)形式與奠基人

其實(shí)馬列維奇的至上主義具有很理性的本質(zhì)，簡潔圖形的背后都有嚴(yán)謹(jǐn)?shù)臄?shù)學(xué)與幾何思維，這一點(diǎn)就屬于極限藝術(shù)的理論基礎(chǔ)。

馬列維奇

他跟馬列維奇是老鄉(xiāng)，構(gòu)成主義跟至上主義有著師承關(guān)系，意思是構(gòu)成主義的一些思路源自至上主義，兩種風(fēng)格基本上是并行發(fā)展的，而構(gòu)成主義更偏向設(shè)計(jì)這個(gè)端口多一些。

塔特林當(dāng)時(shí)提出過一個(gè)藝術(shù)理念，就是：真實(shí)的空間感與真實(shí)的質(zhì)感。

工作中的塔特林

這種理念跟至上主義一樣，都尊崇嚴(yán)謹(jǐn)?shù)睦硇灾髁x及數(shù)學(xué)思維，再形成審美品味，而且是一種比較曲高和寡的高度審美化。

塔特林的這個(gè)理念后來主要體現(xiàn)在極限藝術(shù)的雕塑作品中。

這里我想到了古龍小說中的小李飛刀李尋歡，他的武功特點(diǎn)就是不管對方怎么厲害，他都是一刀解決，所謂“小李飛刀，例不虛發(fā)”，沒有任何花哨的招式，一招致命。

《小李飛刀》又名《多情劍客無情劍》

確實(shí)是種深不可測的武功，這個(gè)時(shí)候我們再回看克萊因的《純藍(lán)》也許就是這種味道。

但如果你讓我說清楚《純藍(lán)》到底表達(dá)了什么，坦白說不可能，我不認(rèn)為除了作者之外有人有資格談作品的創(chuàng)作概念，如果談都是扯淡居多，賞析沒問題，可以談感受，或者揣摩作者想法。

克萊因作品《純藍(lán)》

但有一點(diǎn)可以肯定，克萊因調(diào)出這個(gè)顏色花的功夫費(fèi)的心思不亞于愛迪生研究他的電燈泡。

極限藝術(shù)正式的開始被定義在 1959 年，當(dāng)時(shí)美國紐約的現(xiàn)代藝術(shù)博物館舉辦了一個(gè)畫展，一名 23 歲名叫法蘭克·史提拉（Frank Stella）的青年藝術(shù)家展出一張名為《16 個(gè)美國人》的作品。

史提拉作品《16 個(gè)美國人》

作品畫面空空如也，只是黑色畫面上有簡單白色直線條，非常耐人尋味，但產(chǎn)生很大影響，極限藝術(shù)第一槍就這樣打響，或者說浮出水面，開始逐漸形成流派與理論。

這個(gè)風(fēng)格另外還有兩位重要奠基人，分別是巴涅特·紐曼（Barnett Newman）及阿德·萊因哈特（Ad Reinhardt），兩人最初也是活躍于抽象表現(xiàn)主義陣營，后來投身到極限藝術(shù)的探索。

紐曼與萊因哈特

先說一下紐曼，他在美國屬于波蘭的移民，生于 1905 年，1922 年開始學(xué)習(xí)繪畫與藝術(shù)，1930 年代之后逐漸全職從事藝術(shù)創(chuàng)作。

1948 年時(shí)候，43 歲的他創(chuàng)作了一張名為《溫曼一號》（Onement 1）的繪畫，畫面就是黑紅的底色上畫了一條橙黃色條紋，非常簡單，屬于極限藝術(shù)的潛伏期作品。

《溫曼一號》

紐曼從這個(gè)作品開始就一直以這種風(fēng)格進(jìn)行創(chuàng)作，他的作品尺寸非常大，而且?guī)缀醵际且粋€(gè)底色上畫些橫線或者畫些豎線，然后就沒有然后了。

所以當(dāng)他在 1950 年開始搞個(gè)展的時(shí)候引發(fā)藝術(shù)評論界的批判，因?yàn)橐灿谢祜埑缘南右?，直?1960 年代極限藝術(shù)理論體系逐步完善，而且有走紅跡象的時(shí)候評論界才改變對他的態(tài)度，轉(zhuǎn)而將他奉為極限藝術(shù)的大師。

紐曼的極限藝術(shù)繪畫作品

所以有時(shí)候，成也媒體敗也媒體，評論界有一部分評論家對藝術(shù)的評價(jià)常常見風(fēng)使舵，針對自身利益出發(fā)，比如希望吸引大家注意力，就像如今很多吃“人血饅頭”的自媒體。

不管如何，60 年代的紐曼成名了，然后他的作品影響另一位藝術(shù)家，那就是前面談到的另一位奠基人阿德·萊因哈特。

萊因哈特比紐曼年輕 8 歲，生于 1913 年，早年從學(xué)習(xí)設(shè)計(jì)轉(zhuǎn)而進(jìn)修藝術(shù)，1937 年到 1947 年期間都是抽象表現(xiàn)主義流派的成員。

他的早期作品色彩鮮艷明亮，有著硬邊幾何的形式風(fēng)格，有點(diǎn)像立體主義，也像風(fēng)格派。

萊因哈特早期作品

1950 年代開始他就將自己的創(chuàng)作形式變得越來越簡單，比如將作品限制在單色范圍，而到了 1960 年代，因?yàn)榧~曼的影響，他堅(jiān)決投身于極限藝術(shù)的創(chuàng)作中。

他的作品開始表現(xiàn)變得更加極致，大部分都是采用不同明暗程度的黑色長方形進(jìn)行重疊，非常單純，如果用前些年比較流行的網(wǎng)絡(luò)語句來形容看他的畫，就是“看了個(gè)寂寞”。

萊因哈特極限藝術(shù)繪畫作品

萊因哈特除了創(chuàng)作之外，熱心于通過寫作及演講來推廣極限藝術(shù)，產(chǎn)生不錯的效果，所以大家將其視為極限藝術(shù)的奠基人之一。

極限藝術(shù)與雕塑

極限藝術(shù)除了在繪畫中表現(xiàn)，還有一個(gè)重要載體是雕塑。

有些從事極限藝術(shù)的藝術(shù)家本身橫跨繪畫與雕塑兩個(gè)領(lǐng)域，其中最突出的就是法蘭克·史提拉（Frank Stella）。

法蘭克·史提拉

他被譽(yù)為美國最知名的極限藝術(shù)大師，原因在于他的作品有強(qiáng)烈個(gè)人特色，早期主要進(jìn)行繪畫創(chuàng)作，隨之轉(zhuǎn)向雕塑與裝置，正是雕塑作品讓他成了大名。

史提拉成大名的原因在于他反其道而行，不是采用“少即是多”（Less is more）的原則，而是“多即是少”（More is less），將作品做得非常繁雜。

史提拉的繪畫作品

這里很多朋友就奇怪了，那不是跟極限藝術(shù)中的“極少”產(chǎn)生矛盾嗎？所以史提拉是將極限藝術(shù)拔高到哲學(xué)高度，讓人產(chǎn)生深刻的思辨。

情況如同硬幣的兩面，如果在一張白色畫紙上只畫上一筆黑色，大家的注意力就只集中黑色，但當(dāng)黑色的筆畫不停增加，直到最后只剩下一小片白色底色時(shí)，大家則變成關(guān)注白色，所以“以少見多”變成了“以多見少”。

史提拉的繪畫作品

再比如一個(gè)人最開始只擁有一個(gè)專業(yè)身份的時(shí)候，他感覺很少，但其實(shí)因?yàn)檫@種少形成的專注讓他擁有更多，分別是專業(yè)領(lǐng)域深度上的多跟時(shí)間自由上的多，因?yàn)閷I(yè)上的極致能讓回報(bào)更大，越到后面越輕松自如，能騰出更多時(shí)間放在生活。

而當(dāng)身份越來越多自以為擁有更多時(shí)，因?yàn)樯⒔狗炊屖斋@更少，疲于奔命失去生活。

史提拉的繪畫作品

舉個(gè)更現(xiàn)實(shí)的例子，當(dāng)你買多一部車或者買多一套房子的時(shí)候，確實(shí)物質(zhì)的擁有多了，但會相應(yīng)產(chǎn)生一系列更多的問題，比如忙于車的停放、保養(yǎng)、改裝，俱樂部活動。

擁有多一套房子就要多思考新的裝修，擺設(shè)，還不得不做更多工作還貸，所以這時(shí)候“多”與“少”讓人迷惑，根本無法分辨清楚到底是多還是少。

史提拉在這方面最著名的雕塑作品是 1990 年創(chuàng)作的《梅杜莎之筏·之一》（法國浪漫主義畫家席里柯有同名作品《梅杜莎之筏》）。

史提拉作品《梅杜莎之筏·之一》

這個(gè)作品使用一個(gè)堅(jiān)固的金屬支架，橫向支撐出一大堆支離破碎，纏繞在一起的金屬片、金屬線與金屬構(gòu)件，看上去就是一團(tuán)亂糟糟。

史提拉對這個(gè)作品沒有作任何解釋，他說作品沒有象征意義，沒有隱喻，所有內(nèi)容與思想都在作品本身，大家只需要觀察，這一點(diǎn)倒是很符合前面談到的塔特林藝術(shù)理念，就是：真實(shí)的空間感與真實(shí)的質(zhì)感。

史提拉的其它雕塑作品

其他極限藝術(shù)的雕塑作品則跟主流的極限藝術(shù)繪畫差不多，都是用最少最簡單的形式進(jìn)行創(chuàng)作。

比如卡爾·安德勒（CarlAndre）在 1969 年創(chuàng)作的《鎂和鎂》（Magnesium-Magnesiumplain）,其實(shí)就是用 30 厘米見方的鎂金屬以 6*6 的數(shù)量（有一個(gè)版本是 12*12）鋪在地上，簡單到不得了。

安德勒作品《鎂和鎂》

展覽過程中也沒設(shè)阻擋，所以經(jīng)常有觀眾很自然的從上面走過，以為是金屬地板。

安德勒的創(chuàng)作特點(diǎn)就是喜歡采用現(xiàn)成品以數(shù)學(xué)的韻律進(jìn)行不同方式的組合、排列、堆砌形成簡單的雕塑，大部分是金屬片材、磚頭、木塊等。

安德勒與他的雕塑作品

還有一位知名的極限藝術(shù)雕塑家名為羅伯特·莫里斯（Robert Morris）。

他在 1988 年時(shí)候創(chuàng)作名為《艾爾斯》（The Ells）的雕塑作品，其實(shí)就是三個(gè) L 字形狀的鐵籠用非對稱的方法進(jìn)行擺設(shè)。

莫里斯作品《艾爾斯》

莫里斯有時(shí)候也很喜歡采用圓形進(jìn)行創(chuàng)作，這種幾何中最基本的形式被很多極限藝術(shù)家喜愛，因?yàn)閳A形統(tǒng)一又簡單，同時(shí)具有飽滿的形式特點(diǎn)，他的作品常有這種元素。

莫里斯極限藝術(shù)雕塑作品

極限藝術(shù)的雕塑情況大致如此，余不一一。

結(jié)案陳詞

極限藝術(shù)其實(shí)發(fā)展到如今都仍然存在，但聲勢明顯變得比較弱，因?yàn)樗髁Ψ磳Φ某橄蟊憩F(xiàn)主義及波普藝術(shù)都衰退了，等于也失去發(fā)展的著力點(diǎn)。

現(xiàn)代家居中的極限藝術(shù)裝飾畫

情況就如同商業(yè)市場，百事可樂需要可口可樂的存在，麥當(dāng)勞需要肯德基的存在，所謂遇強(qiáng)越強(qiáng)，對手變?nèi)跎踔料В矔屪约阂膊辉龠M(jìn)步甚至消亡。

我們?nèi)缃襁€經(jīng)常會聽到設(shè)計(jì)中的 “極簡主義”，其實(shí)并非完全一回事， “極簡主義”更多是種延展的設(shè)計(jì)概念，還是屬于基于功能問題為基礎(chǔ)的形式考慮，而極限藝術(shù)不需要考慮任何功能。

極限藝術(shù)海報(bào)《皮爾斯怪獸公司》

在一些概念海報(bào)，裝飾畫或者公眾裝置藝術(shù)中極限藝術(shù)仍然適用，至于怎么才能真正用好，這期分享相信一定對你有所幫助。

文章來源：優(yōu)設(shè)   作者：設(shè)計(jì)史太濃VS遠(yuǎn)麥劉斌


分享此文一切功德，皆悉回向給文章原作者及眾讀者.

免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(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ù)

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請掃碼ben_lanlan，報(bào)下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(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ù)

為什么需要高效？

當(dāng)下互聯(lián)網(wǎng)進(jìn)入以內(nèi)容運(yùn)營為核心的時(shí)代，市場競爭激烈，需要對于市場的熱點(diǎn)進(jìn)行快速反應(yīng)，持續(xù)迭代。不管是大廠還是小廠的UI設(shè)計(jì)師多多少少需要支援運(yùn)營需求。U1S1 做簡單運(yùn)營圖對于體驗(yàn)設(shè)計(jì)方向的設(shè)計(jì)師來說，性價(jià)比確實(shí)有點(diǎn)低，一般難度較高的運(yùn)營設(shè)計(jì)需求都由專業(yè)的視覺設(shè)計(jì)師來做，體驗(yàn)設(shè)計(jì)師一般接到的都是比較簡單或者緊急的需求，這對于設(shè)計(jì)的能力提升來說是比較有限的，大量的時(shí)間被占用在運(yùn)營設(shè)計(jì)上，持續(xù)被榨干，有些本末倒置，但人生就是這么操蛋，總得想辦法解決。

Banner構(gòu)成拆解

就目前大部分互聯(lián)產(chǎn)品的Banner而言。

其構(gòu)成一般由標(biāo)題文案、主體元素（人物、物品等）、背景（場景、底色等）元素構(gòu)成。

模板化沉淀

面向設(shè)計(jì)師：模板化運(yùn)營設(shè)計(jì) + 素材資源同步盤

第一種方法是本文的核心方法，原理很簡單，其實(shí)就是利用Sketch和或者Figma的組件化（為了統(tǒng)一語義本文統(tǒng)一稱為組件，其子集為用例）進(jìn)行設(shè)計(jì)。

我們將這些元素分別打包成組件.

把組件的用例調(diào)整后放置在預(yù)覽區(qū)所有不同尺寸的畫板中。

當(dāng)出現(xiàn)需要特殊調(diào)整的時(shí)候可以解綁微調(diào)。如果希望給畫面添加一些細(xì)節(jié)的話，再另外添加即可～

這么一波操作，大概1個(gè)多鐘就可以輸出一整套7個(gè)圖，足以應(yīng)付一周22套運(yùn)營圖的需求了（悲傷的故事）

當(dāng)然要達(dá)到這種速度還需要一個(gè)通用素材庫的加持?？臻e時(shí)間把一些KV的圖素拆出來放到Eagle共享盤，這樣你和你的小伙伴們就可以高效愉快地拉圖了...

面向運(yùn)營同學(xué)：創(chuàng)客貼等第三方設(shè)計(jì)平臺

在創(chuàng)客貼搞個(gè)團(tuán)隊(duì)模式，然后設(shè)計(jì)師把常用的一些模板上傳上去，運(yùn)營同學(xué)只要自己改改文案，換換人就可以啦

設(shè)計(jì)規(guī)范制定

雖然有了模板化的設(shè)計(jì)工具，但如果缺少了設(shè)計(jì)規(guī)范的引導(dǎo)，就會宛如脫韁野馬，設(shè)計(jì)出各種偏離業(yè)務(wù)需求或風(fēng)格不一致的Banner出來。

設(shè)計(jì)規(guī)范需要與運(yùn)營同學(xué)共同協(xié)商制定，比如標(biāo)題最長長度、排版構(gòu)圖、圖素尺寸等等。具體規(guī)范需要根據(jù)不同的業(yè)務(wù)需求進(jìn)行定制化。

下面就以我們團(tuán)隊(duì)的制定方式作為范例說明一下。

排版構(gòu)圖

常規(guī)的排版構(gòu)圖模式有居中式構(gòu)圖、左右構(gòu)圖。

居中式構(gòu)圖：居中式構(gòu)圖是將主體放置畫面的中心進(jìn)行構(gòu)圖。這種構(gòu)圖方式這種構(gòu)圖方式的最大優(yōu)點(diǎn)就在于主體突出、明確而且畫面容易取得左右平衡的效果

左右式構(gòu)圖：左右構(gòu)圖將文字標(biāo)題元素和主體物按照比例分割進(jìn)行位置安排。符合用戶閱讀習(xí)慣：閱讀視線要符合用戶從左到右或從上到下的瀏覽習(xí)慣。

尺寸

Banner的尺寸需要根據(jù)UI界面的需求進(jìn)行制定。

例如針對我司的產(chǎn)品，一個(gè)活動最多有7個(gè)運(yùn)營位的樣式，分別在首頁、搜索位、文章封面、活動中心、閃屏等。

標(biāo)題長度限制

由于運(yùn)營同學(xué)有時(shí)候?qū)τ跇?biāo)題的長度沒有經(jīng)過精簡優(yōu)化，標(biāo)題特別長長長長長長長長，加上Banner本身就小，在手機(jī)屏幕上基本看不清，也就沒有意義了。因此需要共同制定好主標(biāo)題副標(biāo)題長度限制，超過就直接打回重改。

出血設(shè)置

制定出血位的原因是某些尺寸的圖素可能出現(xiàn)在多個(gè)不同的入口，以及不同尺寸的手機(jī)屏幕可能會出現(xiàn)裁剪的現(xiàn)象。

視覺走查

不論是設(shè)計(jì)師也好，運(yùn)營同學(xué)也好，完成設(shè)計(jì)之后最好建立一個(gè)視覺自查表進(jìn)行對照，目的是盡量減少一些原則性錯誤，減少來回改稿的情況。

流程化閉環(huán)

為了更完美的提升整個(gè)流程效率，不僅需要升級中部流程，前后端的流程都需要進(jìn)行優(yōu)化。

首先是最好在需求的前端建立需求排期表進(jìn)行需求的篩選。

分門別類地將需求的詳細(xì)信息進(jìn)行可視化展示，對應(yīng)的需求文檔接入。這里不得不吹一波飛書文檔，太**好用了。

針對需求的后端即設(shè)計(jì)交付環(huán)節(jié)，最好是在設(shè)計(jì)稿導(dǎo)出的時(shí)候使用工具進(jìn)行壓縮，更小的體積意味著更快的加載速度，這對于提升產(chǎn)品的用戶體驗(yàn)是毋庸置疑的。這里推薦2個(gè)工具：

1.imageOptim

2.Picdiet https://www.picdiet.com/zh-cn (個(gè)人推薦JPG使用這個(gè)網(wǎng)站，壓縮的質(zhì)量最高)

總結(jié)

最后，如果實(shí)在人力不足的情況下，就把項(xiàng)目外包出去吧，畢竟占用UI設(shè)計(jì)師太多時(shí)間產(chǎn)出如果沒什么價(jià)值的話，其實(shí)roi也是很低的，設(shè)計(jì)師的人力成本也是錢！

“能用錢解決的問題，就用錢解決！”—— 魯迅

如果運(yùn)營經(jīng)常提出很多無理的需求，比如量很大，沒有什么依據(jù)都是拍腦袋想的，那可以考慮把項(xiàng)目外包出去，一旦外包出去，花的就是真金白銀，讓運(yùn)營也知道，這是設(shè)計(jì)師嘔心瀝血畫的，市場的價(jià)格就擺在那，整天搞些有的沒的是否真的能對項(xiàng)目帶來價(jià)值。

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請掃碼ben_lanlan，報(bào)下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.

免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(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ù)

本文做設(shè)計(jì)探討交流分享，不涉及商業(yè)，如有不足多多指教。 其中的優(yōu)秀案例、插圖部分來自站酷、花瓣和百度（詳情請查看原鏈接）僅供參考學(xué)習(xí)。 

 本文從“視覺專題設(shè)計(jì)簡述”也就是視覺專題設(shè)計(jì)的基礎(chǔ)理論、“專題設(shè)計(jì)思維養(yǎng)成”就是總結(jié)一些常用的設(shè)計(jì)前期思維方向如何找到和“案例參考”三個(gè)部分構(gòu)成。

首先是視覺專題設(shè)計(jì)簡述：  

大家有知道”視覺傳達(dá)藝術(shù)設(shè)計(jì)“專業(yè)吧，這個(gè)作為大學(xué)藝術(shù)設(shè)計(jì)專業(yè)中的一種（Visual Communication Design）是為傳播特定事物通過可視形式的主動行為。大部分或者部分依賴視覺，并且以標(biāo)識、排版、繪畫、平面設(shè)計(jì)、插畫、色彩及電子設(shè)備等二度空間的影像表現(xiàn)?？傊褪轻槍ρ劬梢钥吹降木邆涿缹W(xué)影響的設(shè)計(jì)符號，稱之為“視覺傳達(dá)”。 

視覺設(shè)計(jì)的領(lǐng)域很廣，總的大致分為7種，所以印象中視覺傳達(dá)專業(yè)的同學(xué)會的都挺多?。?！哈哈哈 

字體設(shè)計(jì)、標(biāo)志設(shè)計(jì)、 插圖設(shè)計(jì) ，這三種就是字面意思，大家也常接觸就不做文字說明。 

而下面這幾種，我用括號內(nèi)的文字做區(qū)分說明。

編排設(shè)計(jì)（文字、圖像、圖形、廣告招貼、書籍等編排設(shè)計(jì)） 

廣告設(shè)計(jì)（主題、創(chuàng)意、語言文字、形象、襯托等要素組合進(jìn)行平面藝術(shù)創(chuàng)意的一種設(shè)計(jì)） 

包裝設(shè)計(jì)（綜合運(yùn)用自然科學(xué)和美學(xué)知識，為在商品流通進(jìn)行的包裝造型、結(jié)構(gòu)、裝潢設(shè)計(jì)） 

展示設(shè)計(jì)（主體為商品，在既定的時(shí)間和空間范圍內(nèi)，對展示空間的創(chuàng)作過程）

當(dāng)視覺設(shè)計(jì)前面加兩個(gè)字，“視覺專題設(shè)計(jì)”，這個(gè)就是將視覺設(shè)計(jì)加了限制條件，是針對產(chǎn)品某個(gè)主題活動，以特定風(fēng)格傳遞產(chǎn)品想要表達(dá)的信息，為提高產(chǎn)品轉(zhuǎn)化率，達(dá)到流量、曝光、口碑收益的運(yùn)營設(shè)計(jì)。 

如果說需求方讓你只是做一個(gè)視覺設(shè)計(jì)，那么他們的需求就是為了能夠準(zhǔn)確傳達(dá)信息，有些童鞋做設(shè)計(jì)過于自嗨，沉浸自己的設(shè)計(jì)風(fēng)格中，沒有g(shù)et到需求方一個(gè)簡簡單單的想法，他們只是想要傳達(dá)信息，所以給出合適的信息展示就能完成，而設(shè)計(jì)圖片的美感只是錦上添花，你說他們的審美不過關(guān)，也能否先反思一下自己的設(shè)計(jì)圖是否能讓別人不思考就看懂。如果他們要求是一個(gè)專題設(shè)計(jì)，這是為品牌服務(wù)，最后落腳點(diǎn)是品牌，那他們需要的就不僅僅是個(gè)美感、信息傳遞、突出符合產(chǎn)品自身的調(diào)性，以及帶來流量的設(shè)計(jì)才是他們想要的目標(biāo)。

 因此想要做好一個(gè)視覺專題，不妨倒推一下整個(gè)專題設(shè)計(jì)的目標(biāo)： 

1. 流量增長（當(dāng)今最具價(jià)值證明，數(shù)據(jù)說話） 

2. 曝光增加（好的壞的，只要有，就有熱度，就有話題，區(qū)別同類的“臉盲”） 

3. 口碑更好（毫無疑問對品牌屬于積極正面的影響） 

4. 帶來收益（前三條都是為這條準(zhǔn)備，收益才是王）

 所以當(dāng)我們產(chǎn)出一個(gè)設(shè)計(jì)任務(wù)時(shí)，可以從以下4個(gè)不同層次的設(shè)計(jì)把控點(diǎn)來，反思調(diào)整自己的作品：  

首先，基礎(chǔ)層級是傳遞出準(zhǔn)確的信息，也就是這個(gè)信息是能被人識別讀懂（如果一個(gè)視覺專題設(shè)計(jì)產(chǎn)出除了設(shè)計(jì)師本人能看懂，其余人不明所以，那么只能說明這個(gè)設(shè)計(jì)夠“藝術(shù)”不夠“過關(guān)”）； 

其次，高一點(diǎn)的層級就是除了能準(zhǔn)確傳遞正確的信息以外還能包含一定的信息量，說明這個(gè)設(shè)計(jì)傳達(dá)出不止是一點(diǎn)有效信息； 

再來就是“視覺效果來源于匹配程度”，意思是看完這個(gè)設(shè)計(jì)我能夠聯(lián)想或者關(guān)聯(lián)到一些和他相關(guān)的信息事物，證明此設(shè)計(jì)傳達(dá)出了準(zhǔn)確有效的信息還能讓所有信息，規(guī)律的結(jié)合，成為觀看者聯(lián)想起過往瀏覽過事物與之匹配的事物； 

最高一層就是視覺與信息的唯一匹配，這也就是我以后看到這個(gè)設(shè)計(jì)就只會想起某個(gè)特定品牌， （例：看到少了一塊的蘋果圖片，一定會想到“喬布斯的蘋果公司、他的手機(jī)等”；看到一定會想到“騰訊公司的QQ企鵝”）

市場固定資源有限，想要瓜分到一口蛋糕， 現(xiàn)在每個(gè)企業(yè)都需要一定的專題設(shè)計(jì)來提升自己品牌的影響力，借機(jī)造勢，作為企業(yè)形象與美譽(yù)度的提升突破口，結(jié)合各種銷售玩法達(dá)到目標(biāo)。

 企業(yè)發(fā)展的不同階段對專題設(shè)計(jì)的要求也是不同，起初需要一個(gè)視覺符號來代表，讓大眾記住公司，這也是初期階段受美學(xué)影響，各個(gè)公司和企業(yè)都想要注冊商標(biāo)；隨著時(shí)間變遷企業(yè)的發(fā)展和轉(zhuǎn)型需要，誕生了一批品牌符號，也就是我們常說的IP形象、文創(chuàng)、動漫、虛擬智能人工等等，這些是受營銷思維主導(dǎo)催生的視覺設(shè)計(jì)產(chǎn)業(yè)鏈；最后能扛住時(shí)間檢驗(yàn)，并且讓自己的企業(yè)視覺設(shè)計(jì)做到極致，成為為社會文化審美的標(biāo)桿，推動風(fēng)格潮流的風(fēng)向，就成為了一種特定的文化符號，這是所有企業(yè)向往的方向，也是最難成就的頂端。當(dāng)我們能在制作自己的專題設(shè)計(jì)時(shí)，包含企業(yè)所想，那么你一定是個(gè)格局大家！

接下來是講述思維養(yǎng)成的一些方法：拆解需求——了解清楚現(xiàn)在的事實(shí)、目前商業(yè)需求的背景，收集通常這樣的需求在市場上的視覺風(fēng)格，分析定量現(xiàn)狀和定型現(xiàn)狀，從而推導(dǎo)出商業(yè)假設(shè)，得出用戶體驗(yàn)?zāi)繕?biāo)，反復(fù)推敲找出設(shè)計(jì)發(fā)力點(diǎn)。    

定量屬性是指以數(shù)量形式存在著的屬性，并因此可以對其進(jìn)行測量。測量的結(jié)果用一個(gè)具體的量（稱為單位）和一個(gè)數(shù)的乘積來表示。以物理量為例，距離、質(zhì)量、時(shí)間等都是定量屬性。

定性是指通過非量化的手段來探究事物的本質(zhì)。其概念與定量相對應(yīng)。

定性的手段可以包括觀測、實(shí)驗(yàn)和分析等，以此來考察研究對象是否具有這種或那種屬性或特征以及它們之間是否有關(guān)系。

定性研究是與定量研究相對的概念，也稱質(zhì)化研究，是社會科學(xué)領(lǐng)域的一種基本研究范式，也是科學(xué)研究的重要步驟和方法之一。

如果說定量研究解決“是什么”的問題，那么定性研究解決的就是“為什么”的問題。

 專題設(shè)計(jì)一般分為三類：活動、信息、組合；確定好自己的設(shè)計(jì)類型，

活動類專題設(shè)計(jì)——時(shí)效性強(qiáng)整體活動時(shí)間短、活動類主體利益針對人群、設(shè)計(jì)調(diào)性喜慶，通常大紅色，

為了達(dá)到想要的商業(yè)回饋，爭取利益點(diǎn)，主要信息簡單明了； 

信息類專題設(shè)計(jì)——活動周期可循環(huán)、活動類主體利益是產(chǎn)品、設(shè)計(jì)調(diào)性多數(shù)貼合品牌性質(zhì)，為了

穩(wěn)固原有商業(yè)形象、讓品質(zhì)再次提升，拉近與用戶的距離，多數(shù)采用品牌的ip或者文藝的插畫來凸顯溫馨； 

舉例為“京東618”和“face u”、“支付寶 花唄”、“飛豬旅行”各有特色 

信息組合類的專題設(shè)計(jì)——活動周期可長可短，也沒有特定的時(shí)效性，既包含活動類的特點(diǎn)，也包含信息類的特點(diǎn)。它的定量現(xiàn)狀和定性現(xiàn)狀都可用不同場景區(qū)分。從舉例就可看出， 

“阿里巴巴云棲大會”、“成都國際設(shè)計(jì)論壇”、“臺北燈光節(jié)”、“海信發(fā)布會” 主視覺海報(bào)——

 思維方式2是分析構(gòu)思： 

團(tuán)隊(duì)的小伙伴一起頭腦風(fēng)暴，發(fā)散思維寫出與主題相關(guān)的，盡可能的多寫，然后再根據(jù)意向分類，提取出自己關(guān)鍵詞匯，結(jié)合詞匯在腦海產(chǎn)生的視覺元素，整合篩選定好方向

 方向定好后，我們就要選取如何通過創(chuàng)意與表現(xiàn)，來實(shí)現(xiàn)專題設(shè)計(jì)讓人記住。 

常見的創(chuàng)意方法，通過流行的表現(xiàn)風(fēng)格做視覺呈現(xiàn)，如三維立體、手繪插畫、賽博朋克等；

通過獨(dú)特風(fēng)格、操作難度高、技術(shù)含量大的表現(xiàn)手法做視覺呈現(xiàn)，如手工塑造、超寫實(shí)還原、概念模擬等； 

通過具有情感化設(shè)計(jì)的圖文做視覺呈現(xiàn)，圖文具有強(qiáng)有力共性（例如“杜蕾斯文案”、“江小白酒情懷”堪稱文案絕絕子······）通過動畫實(shí)現(xiàn)等等···· 

而表現(xiàn)從淺至深就是，引導(dǎo)——刺激——價(jià)值 

?

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請掃碼藍(lán)小助，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

文章來源：優(yōu)設(shè) 作者：YiVi_eleven

分享此文一切功德，皆悉回向給文章原作者及眾讀者.

免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(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ù)

首先，我們怎么去理解在作品集版面中的“精致度”。我覺得可以將其轉(zhuǎn)化為“質(zhì)感”，“細(xì)節(jié)”，“細(xì)膩”這樣的詞匯。其實(shí)“精致度”不足這個(gè)問題大部分同學(xué)也是能有所感知的，只是不知道哪里出了問題，也就無從下手。當(dāng)然還有一小部分同學(xué)，可能并不覺得自己有什么問題，也無法體會修改前后的差別，這樣的同學(xué)，我建議你平時(shí)應(yīng)該多看一些優(yōu)秀的設(shè)計(jì)作品，多沉淀一下，這樣的方式對你幫助更大。

很多同學(xué)經(jīng)常把“精致度”理解為形式感不夠，或者是不夠酷炫，這么理解是不準(zhǔn)確的。這就好像一個(gè)產(chǎn)品，它的精致和它的外觀設(shè)計(jì)并沒有什么直接聯(lián)系，而是更多的取決于這個(gè)產(chǎn)品的做工和材質(zhì)。做工體現(xiàn)在接縫的處理，邊角的打磨等等，而材質(zhì)決定了其質(zhì)感的好壞。那么同理，版面的“精致度”實(shí)際上和你的設(shè)計(jì)感也是沒有直接聯(lián)系。那么從哪些方面體現(xiàn)版面中的“精致度”呢？我結(jié)合自己的經(jīng)驗(yàn)總結(jié)了以下幾個(gè)方面：

1.舒適的間距。一個(gè)合適的，讓人舒適的間距特別重要。無論是文字與的，或者說認(rèn)為不重要的事情。混亂的，不統(tǒng)一的，不舒適的間距會讓版面變的排布變的無章，這就好像一個(gè)產(chǎn)品各個(gè)部件的拼接接縫大小不一，會導(dǎo)致“精致度”下降。

2.大小比例。版面中所有元素的互相之間，以及相對于整個(gè)版面的大小比例問題。這個(gè)也是非常重要的一個(gè)體現(xiàn)“精致度”的地方。所有內(nèi)容都過于傻大粗，無疑會讓版面看起來非常粗糙。

3.層次感。層次感實(shí)際上是一個(gè)非常好的提升質(zhì)感從而體現(xiàn)出“精致感”的手段。缺乏層次感的版面會顯得非常的寡淡，以及在內(nèi)容較多時(shí)可能會在視覺上造成較亂的感覺。那么如何提升層次感，主要是靠對比的強(qiáng)弱。比如：深與淺，粗與細(xì)，大與小，疏與密等等。

4.字體。選擇一個(gè)精致好看的字體，對版面的精致度有一定的提升，不過還是要注意，字體的與版面之間的大小比例要注意。

5.配圖。配圖的質(zhì)量也一定程度上影響了版面的精致度。無論是你自己做的圖，比如分析圖，效果圖等，還是你網(wǎng)上找的圖，如參考圖等，都很大程度上決定了你這一頁的精致度。

通過以上幾點(diǎn)的提升，我相信你的版面“精致度”一定會有較為顯著的提升，而版面效果也會看上去更為高級。不過這里還是要再次提醒，精致度和設(shè)計(jì)感是兩回事兒，如果只有精致度，而設(shè)計(jì)感較差，那也是不行的。希望本期的內(nèi)容對你的版面有所幫助。

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請掃碼藍(lán)小助，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(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ù)

生活在地球上的我們，每時(shí)每刻其實(shí)都在感受著重力的存在。除了物理層面的影響，重力是否會改變我們對于視覺畫面的認(rèn)知呢？又或者說，物理學(xué)中經(jīng)常聽到的重力概念，和設(shè)計(jì)中的構(gòu)圖、排版又存在著怎樣的關(guān)聯(lián)呢？

我們或許能夠從格式塔學(xué)派對認(rèn)知心理學(xué)的研究里，尋找到一些蛛絲馬跡。

人們的大腦總是會去腦補(bǔ)眼前看到的事物。就像我們看到的這三個(gè)被遮擋住的圓形圖案，位于中心的倒三角雖然沒有實(shí)際出現(xiàn)，但我們確實(shí)認(rèn)為它是存在的對吧。

視覺本身是很容易被周圍環(huán)境影響的，就像我們現(xiàn)在看到的這個(gè)畫面。如果忽略掉空間和透視的話，你還會覺得右側(cè)的豎線更高嗎？

而實(shí)際上的情況是，左邊的豎線高度要遠(yuǎn)遠(yuǎn)高于右邊的豎線高度。

再看這個(gè)例子，兩側(cè)位于中央的白色球形，它們之間，誰看起來更大，誰又看起來更??？也許有的朋友會說左邊更大，這個(gè)答案是沒錯的，但它也僅僅是看起來更大而已。

如果我們在畫面中拉出兩條輔助線，我們就會發(fā)現(xiàn)，原本右邊看起來更小的圓球，要比左邊的圓球更大。

通過剛剛的幾個(gè)小測試，相信大家已經(jīng)對于用眼睛的判斷能力有了一些認(rèn)識了，是不是有一種眼見不一定為實(shí)的感覺？視覺重力原則，其實(shí)就是建立在這樣的認(rèn)知基礎(chǔ)之上的。我們大腦所認(rèn)為的重心或平衡感，和真實(shí)的情況，往往并不相同。

在做版式設(shè)計(jì)的時(shí)候，我們的構(gòu)圖越接近重心的平穩(wěn)狀態(tài)，就越會激發(fā)和諧的美感。因?yàn)橹亓υ谧匀唤缰惺窃倨匠２贿^的現(xiàn)象了，生活在這樣環(huán)境中的我們，自然也會有這種審美上的傾向了。

我們來看這個(gè)例子，這張紙最穩(wěn)定的位置在哪里呢？答案是它的正中心。

我們把信息添加在頁面的中心位置，現(xiàn)在它看起來更平穩(wěn)了嗎？然而并沒有，可問題出在哪？一定是我們沒有把文字?jǐn)[正吧？上方的區(qū)域（a），看起來要比下方的區(qū)域（b）面積更大一些，真的是這樣么？

可實(shí)際上，文字確實(shí)是在頁面的正中心位置上了，這同樣我們的眼睛在作怪。

所以為了抵消視覺上的這種墜落感，我們需要將文字略微向上移動，這樣我們看這段文字才是真正居中的。

正向

我們再舉個(gè)例子，這是一個(gè)數(shù)字 8，我們來仔細(xì)觀察一下它的造型，頂部與底部的負(fù)空間看起來是一樣大的對嗎？

垂直翻轉(zhuǎn)

而事實(shí)上并不是這樣的，通過將它倒置，我們就會更明顯的看出來，其實(shí)為了抵消人眼的錯覺，我們在做字的時(shí)候，需要將上面做的更小，底部做的更大一些。

這是兩個(gè)完全等大的黑色圓形，但它在視覺上其實(shí)并不是平衡的，人們的眼睛會覺得右邊更輕，這雖然沒有頂部和底部那么明顯，但也確實(shí)存在。那么解決的方法就是將左邊的圓形略微縮小一些，現(xiàn)在這個(gè)頁面看起來平衡多了。我們總是會下意識的認(rèn)為左側(cè)要更重要些。

? 畫作：The Creation of Adam

看這幅畫，很明顯左側(cè)的內(nèi)容要比右側(cè)更少，可如果我們將它鏡像翻轉(zhuǎn)過來，它原版的平衡感就會被打破了。人們更多會認(rèn)為左邊看起來更重了。

同樣的，在我們的漢字設(shè)計(jì)中，也會應(yīng)用這種做法，比如林字的兩個(gè)木字旁，就并不是左右等大的，因?yàn)檫@樣在視覺上會顯得不平衡。所以需要將左側(cè)的偏旁削弱，才會在視覺上看起來更加和諧。

具有左右結(jié)構(gòu)的漢字，基本上都遵循了這個(gè)原則。形成了左收右放的構(gòu)成樣式。

漢字“田”的中心十字筆畫，為了看起來是居中的感覺，實(shí)際上也特地微調(diào)了文字的重心部分。利用輔助線，我們會更容易察覺到這其中的變化。可以看到，橫筆部分，向上移動了很多。豎筆部分也相應(yīng)向左做了位置上的調(diào)整。

人們常說，細(xì)節(jié)決定成敗。也正是這些不起眼的細(xì)節(jié)，拉開了專業(yè)平面設(shè)計(jì)和業(yè)余設(shè)計(jì)師之間的距離。相信看到這里的小伙伴們，應(yīng)該已經(jīng)領(lǐng)略到了視覺重力原則在設(shè)計(jì)中的重要地位了。那么光知道有這么一回事兒可不行，我們更應(yīng)該去了解它的特點(diǎn)，以及嘗試著去掌握它。

我們看到的所有圖像，無論抽象的還是具象的，其實(shí)都是具有重量感的。那么都有哪些因素會影響到視覺重力的大小呢？找到視覺重心之后，我們又要怎樣去利用它們？接下來我們就一起去尋找相應(yīng)的答案。

色彩對視覺重量有影響嗎？我們看畫面中的這兩個(gè)圖形，是不是很明顯感覺到右邊更重呢？黃色的色相本身的視覺明度就要比藍(lán)色更淺，所以我們會感覺到右邊更重。

為了抵消顏色對視覺重量的影響，我們需要降低藍(lán)色的面積，這樣才能讓兩個(gè)圖形看起來是平衡的。

那么換成具象的物體呢？道理其實(shí)也是一樣的。我們依然可以把它們看成是純粹的色彩。經(jīng)過這一步分析，我們是不是發(fā)現(xiàn)了左側(cè)紅色的蘋果，顯然會更深和更重呢？

所以，為了保持左右的平衡感，我們也需要把紅色相應(yīng)的縮小一些。

我們看這兩個(gè)圖形，它們誰更重？左側(cè)的八邊形，它的頁面邊緣更復(fù)雜，角度變化也更多，所以承載了更多的信息量，相比正方形更簡潔的造型來說，左側(cè)會更重。

那么換成大小相同的秤砣和棉花呢？誰更重？幾乎沒懸念了，棉花完敗。當(dāng)具象的物體出現(xiàn)時(shí)，結(jié)合以往的視覺經(jīng)驗(yàn)后，誰更重誰更輕也就很顯而易見了。

對齊也需要考慮到視覺重力嗎？如果你也有這種疑問的話，接著往下看。這是兩個(gè)馬克杯，它們雖然造型類似，但是色彩卻不同。很顯然藍(lán)色的版本會更重，而在位置上更靠近左邊，也就顯得更重了。

所以，為了抵消這種重量上的輕微不平穩(wěn)，我們可以把顏色更淺的橙色放到左側(cè)的位置上。這樣雖然色彩上橙色更輕，可由于它的位置更重要，也就不會給人不平穩(wěn)的感覺了。

那么構(gòu)圖基本確定之后，我們?yōu)檫@兩個(gè)杯子搭配上一段文案信息。這樣兩個(gè)商品的展示也就做完了。你發(fā)現(xiàn)這兩個(gè)組合出現(xiàn)什么問題了嗎？當(dāng)文字信息加入到頁面之后，是不是覺得哪里不對呢？

電腦是看不懂圖像的，所以用到對齊命令時(shí)，它們會圍繞著像素的邊緣去做對齊?？蓡栴}在于，并不是所有圖片的視覺重心都剛好在方框的中間位置。

所以我們要去修改的地方，也正是這個(gè)視覺重心的對齊位置?，F(xiàn)在再看這兩個(gè)組合，是不是感覺和諧了很多。

當(dāng)西文和漢字相互組合時(shí)，需不需要考慮到視覺重心的對齊呢？我們看，如果僅僅是依據(jù)邊緣進(jìn)行對齊的話，就會讓西文部分看上去很小。而正確的做法是需要我們忽略掉一些文字邊緣的。

分別找到兩組文字的視覺大小。只有這樣，才能讓兩組文字在視覺面積上達(dá)到相同的重量。當(dāng)然，文字字重部分也是需要做出相應(yīng)匹配。我們看，經(jīng)過調(diào)整后，中西文的搭配明顯要更加平穩(wěn)了。

但也是有例外的，比如這個(gè)例子，明明是按照之前的調(diào)整方式，僅僅是更換了文字的內(nèi)容。為什么它看上去依然沒有對齊呢？這里的問題其實(shí)出現(xiàn)在西文部分，有些單詞組合，字母并沒有占據(jù)下伸部的空間。所以在整體上，就會顯得有高低的錯落感。

這種情況，當(dāng)然就需要重新去匹配了。解決方法依然是對齊文字之間的視覺重心部分。所以，方法并不是死記硬背的。我們需要根據(jù)不同的情況去做出有針對性的調(diào)整。

接下來我們來做一個(gè)包裝的案例。它是一個(gè)螃蟹口味的海鮮調(diào)味料。首先，我們選擇這個(gè)手繪的螃蟹作為這個(gè)畫面中的視覺焦點(diǎn)，把它放在版面的中心位置。經(jīng)過前面的學(xué)習(xí)，我們知道了，選擇對齊元素時(shí)，我們要忽略掉那些細(xì)枝末節(jié)的部分，才能找到真正的視覺中心位置。

找到了視覺重心后，我們把它安排到頁面真正的中央部位。頂部和底部的空間，我們就繼續(xù)調(diào)整其他的信息。首先從層級上來說，在頁面頂部我們需要一個(gè)相對第二大面積的文字組合。

而其余的元素，圍繞著底部的負(fù)空間去排列就可以了，到這里這個(gè)包裝也就做完了。

無論是版式設(shè)計(jì)，還是繪畫攝影，構(gòu)圖從來都是一個(gè)講究的事情。想要做一版在視覺上平穩(wěn)的版面，最簡單的辦法，就是把主體固定在頁面的中心位置。可是這種對稱的設(shè)計(jì)，由于太過完美，也多少會給人一種單調(diào)和乏味的印象。那么有沒有一種既讓頁面保持平衡，又能在結(jié)構(gòu)上做出變化的設(shè)計(jì)方法呢？這就引出了我們接下來的內(nèi)容了。

這個(gè)案例，屬于網(wǎng)頁中會出現(xiàn)的廣告頁面。首先，如果我想要讓版面達(dá)到平衡狀態(tài)，就需要把主體的重心安排在頁面的中央位置。

但是，為了讓頁面中加入更多信息，我們也不得不讓主體向頁面的一端靠攏，從而預(yù)留出足夠的空間。

可這樣就導(dǎo)致了頁面的不平衡，左側(cè)的文字重量并不能平衡整個(gè)版面。

其實(shí)，解決的辦法也很簡單，我們可以試著將主體略微移向頁面的中心部分。這樣一來，就實(shí)現(xiàn)了一種動態(tài)的平衡狀態(tài)。

這背后的知識其實(shí)很簡單，就是最基本的杠桿原理。如果天平兩端并不平衡，那就讓更重那個(gè)的靠近中心，更輕的遠(yuǎn)離中心。這樣也就恢復(fù)到平衡狀態(tài)了。

這同樣是一個(gè)網(wǎng)頁中會出現(xiàn)的廣告頁面。我們看，它都出現(xiàn)了哪些問題。版面中所有的元素都集中到了頂部，這就導(dǎo)致了頁面底部重量過輕，頂部重量過重的極端對比。也就是我們俗稱的頭重腳輕。那么經(jīng)過調(diào)整之后問題依然存在。過多的空白，會讓人們感覺這個(gè)版面作品沒有完成。所有的重量都集中到了版面的左側(cè)，這依然是一個(gè)極端的構(gòu)圖。

正確的做法應(yīng)該是怎樣的呢？我們可以將重量最大的元素安排在中心位置。并且讓其他元素以對稱的樣式排布。

當(dāng)然，你也可以將信息放大，和原本的圖像進(jìn)行一個(gè)疊壓組合，形成一個(gè)更重更大的整體。

又或者，采用頂部圖像，底部文字的做法，讓頁面中的重量分配均等。

反過來也是一樣的，頂部安排文字，底部安排圖像。

再或者，我們可以將信息安排在頁面的左側(cè)，形成左字右圖的配置。這樣的構(gòu)成，有助于人們第一眼發(fā)現(xiàn)你想傳達(dá)的信息。

而反過來呢？圖像就成為了更重要的那個(gè)。人們會先看到圖，然后緊接著去閱讀相應(yīng)的文字信息。

到這里，我們分別從細(xì)節(jié)的刻畫，再到元素的重心對齊；又從視覺重心的動態(tài)調(diào)整，一直講解到了宏觀頁面的構(gòu)建思路。我們可以看到，視覺重力原則幾乎滲透了整個(gè)設(shè)計(jì)流程。很多時(shí)候我們其實(shí)并不缺乏理論知識的武裝，可一到自己實(shí)際動手，就馬上繳槍投降了。矛盾點(diǎn)還是出在對理論知識點(diǎn)靈活運(yùn)用上，接下來我就帶著大家再做幾個(gè)案例。

打算做一套大米的包裝設(shè)計(jì)。產(chǎn)品的名字就叫高山巖米。它長什么樣子呢，就像我們現(xiàn)在看到的這樣，類似葡萄干一樣，和我們平時(shí)見到的大米顏色是有一些區(qū)別的，據(jù)說營養(yǎng)價(jià)值很高，也被譽(yù)為米中黃金。

我想利用圖形的切割來表現(xiàn)這個(gè)巖米的部分。同時(shí)，在輔助一個(gè)篆書結(jié)構(gòu)的山字，以這樣的圖形來體現(xiàn)這個(gè)主題內(nèi)容。并且，我也希望這個(gè)大米的部分是鏤空的，能夠透過它看到真實(shí)的米。

主視覺的刻畫差不多后，接下來我把它放到包裝上，并且將其他信息也一并加入到版面里。不過這樣一來，信息和主視覺相互疊壓，對于內(nèi)容來說可能會有些相互干擾了。所以我們來試著編排一下。到這里，好像出現(xiàn)了我們前面提到過的問題了，那就是，整個(gè)布局顯得頭重腳輕了。

接下來再試著調(diào)整一下?，F(xiàn)在我們把底部和頂部的空間都占據(jù)了，同時(shí)也預(yù)留出了三分之一的留白，這該不會有什么問題了吧。相信看到這里的小伙伴應(yīng)該都能看出問題了，那就是這樣的配置確實(shí)有些左重右輕了。留白可以有，但絕對不是這樣做的。

除了我們之前提到的上圖下字，或者是左圖右字之外。我們當(dāng)然也可以綜合的應(yīng)用它們。我們現(xiàn)在這個(gè)構(gòu)成，其實(shí)就是一種全包圍的結(jié)構(gòu)。

又或者，將一部分內(nèi)容放在底部，而主要去刻畫上方的文本樣式。這就形成了類似半包圍的結(jié)構(gòu)。

如果說之前的版本是上下樣式的半包圍構(gòu)成的話。那么接下來的這個(gè)構(gòu)圖，就是融合了重心動態(tài)布局的左右樣式半包圍構(gòu)成了。

當(dāng)我們不知道怎樣去安排版式構(gòu)成時(shí)，視覺重力原則就成為了一個(gè)很好的參考依據(jù)。

我們再做一版活動海報(bào)。畫面中出現(xiàn)的各種電器，都是經(jīng)過退底處理的。這樣的處理，能夠讓它們毫無違和感的出現(xiàn)在同一個(gè)頁面中。

在頁面的部分，我加入了這個(gè)活動的具體內(nèi)容。展覽的主題叫《模塊世界展》，是著名設(shè)計(jì)師迪特拉姆斯的個(gè)人展覽。

拿到這樣的內(nèi)容時(shí)，最保險(xiǎn)的做法就是讓頂部的圖片成為一個(gè)更大的組合。上圖下字，很平穩(wěn)，也很保守。

我們可以看到，圖片部分，我盡量將它們還原成了現(xiàn)實(shí)中它們本來的比例關(guān)系。

或許，我們也可以再換一種思路，相對的更突破一些。將圖片通過顏色劃分成組。我們能夠看到，其中有全黑的，也有彩色的，更有白色的。

除了像剛剛的堆積到角落，我們也可以把圖片組合規(guī)劃成對角線的樣式，在這樣的形式下，版面構(gòu)圖依然是平衡的。

我們當(dāng)然也能讓圖片組合劃分成一個(gè)更大的組合，以及一個(gè)更小的組合。

又或者，打亂圖片的順序，完全依據(jù)視覺重心去匹配其中的位置關(guān)系。

最終，我決定從展覽的主題中尋找突破口，以“錯位”的手法去呼應(yīng)“模塊化”這個(gè)概念。不僅僅是文字部分的錯位和拆解，圖片部分也通過硬邊的投影，形成了一種嵌套于版面中的視覺印象。

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請掃碼藍(lán)小助，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

文章來源：優(yōu)設(shè)   作者：研習(xí)社

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(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ù)

今天我要和大家介紹的這位設(shè)計(jì)師，他在業(yè)內(nèi)被譽(yù)為是“信息可視化設(shè)計(jì)”領(lǐng)域的天花板。一提到信息可視化這么高大上的詞，相信大家都多少有些了解，在日益復(fù)雜的信息交流活動中，將信息圖表化已經(jīng)是一名設(shè)計(jì)所必須掌握的技能之一了。

舉些常見的例子，比如在公共場合中，我們看到的交通標(biāo)志，以及用來顯示地理位置的地圖、將時(shí)間具象化的時(shí)刻表等等，這些數(shù)據(jù)都以某種圖形化的形式呈現(xiàn)在我們周圍。

而信息可視化領(lǐng)域也不僅僅是將簡單的數(shù)據(jù)繪制成圖表那么簡單，比如要弄清楚社會中隱藏著的各種問題，從而促進(jìn)新觀點(diǎn)的提出和對問題解決的思考。這種并不以信息為主導(dǎo)，而是著重于根據(jù)創(chuàng)建者的主題來選擇要傳達(dá)的信息，并尋求接收者的主動解釋。

而我們今天要介紹的這位設(shè)計(jì)大神就是這個(gè)領(lǐng)域的專家

△ 中野豪雄 TAKEO NAKANO 圖形設(shè)計(jì)師

1977 年出生于東京都。武藏野美術(shù)大學(xué)畢業(yè)，師從著名設(shè)計(jì)師勝井三雄。2005 年設(shè)立中野設(shè)計(jì)事務(wù)所。以信息的構(gòu)造化和上下文的可視化為主題，在各種領(lǐng)域探索圖形設(shè)計(jì)的可能性。日本 typographic 年鑒大獎賽，同最佳作品，造書裝幀比賽經(jīng)濟(jì)產(chǎn)業(yè)大臣獎等獲獎。入選世界海報(bào)三年展和拉哈蒂國際海報(bào)雙年展等。作為邀請作家參加了國際泰晤士報(bào)雙年展“首爾 2011”。文藝博物館永久收藏。武藏野美術(shù)大學(xué)、多摩美術(shù)大學(xué)教授。

咱們先來看看中野老師平時(shí)的作品都長什么樣吧！

是不是很厲害！但說實(shí)話，這種信息的密度，工作量絕對是巨大的！而在一些訪談中，中野老師也明確指出，自己更傾向于采用更宏觀的視角去做設(shè)計(jì)，因?yàn)檫@樣不僅能夠達(dá)到傳達(dá)目標(biāo)，同時(shí)也由于對比的存在，進(jìn)而產(chǎn)生嶄新的視角。

圖中我們現(xiàn)在看到的信息可視化海報(bào)，是 graphic trial 2015 的一次展覽。老師一共設(shè)計(jì)了五張 B1 大小的凸版印刷海報(bào)。內(nèi)容是關(guān)于地震的四年時(shí)間里，哪些話題被人們報(bào)道直到事件完結(jié)，然后回歸到日常生活中。以及在大數(shù)據(jù)為主的信息社會中，思考有關(guān)制作印刷物的意義。

人們在地震發(fā)生時(shí)，所接受到的信息，就像圖中展示的這樣，是從喧囂到日?；耐埔坪脱葑?，老師會考慮到，促進(jìn)這個(gè)過程的因素和推動力是否能夠被可視化。從當(dāng)代語言推動社會發(fā)展的角度去考察，想象著是否能將這個(gè)語言本身地圖話。從而建立起一個(gè)提供人們思考的平臺，這也是平面設(shè)計(jì)能否引發(fā)輿論爭議的關(guān)鍵。

首先我們從信息收集的角度來向大家講解，這張圖是國立情報(bào)研究所的北本先生制作的數(shù)據(jù)圖，搜索關(guān)鍵詞是“受災(zāi)地”。圖中折線展示的是，受災(zāi)四年間，相關(guān)詞被搜索的高峰和頻率。

接下來我們來看這張語言地圖是如何被延展出來的，常規(guī)情況下，我們形容時(shí)間的話，當(dāng)然會使用線性的橫向時(shí)間軸。而中野老師的解決辦法，是將時(shí)間軸以環(huán)形的方式呈現(xiàn)，并且將起點(diǎn)與終點(diǎn)之間的差異可視化。

五張海報(bào)，分別從受災(zāi)后第一個(gè)月、半年后、一年后、兩年后以及四年后展開。呈現(xiàn)出由遠(yuǎn)到近的視角變化，第一張海報(bào)中，展示的是受災(zāi)后 31 天內(nèi)的變化，逐漸到最后一樣，受災(zāi)后 1460 天時(shí)，人們對于這個(gè)事件的關(guān)注轉(zhuǎn)變。

老師從北本先生那里得到的數(shù)據(jù)，大概可以劃分成四個(gè)種類，分別是時(shí)間、主題的力度、語言關(guān)鍵詞頻繁出現(xiàn)的次數(shù)以及與東日本大地震的關(guān)聯(lián)度。時(shí)間就是剛剛提到的，以環(huán)形角度的方式呈現(xiàn)。話題的力度越高，就會離中心越近，反之就越遠(yuǎn)。頻率則是按照關(guān)鍵詞出現(xiàn)的數(shù)量，以圓的大小來呈現(xiàn)。另外也通過顏色來區(qū)分與地震話題相關(guān)的詞語。

△ 一個(gè)月，六個(gè)月，一年，兩年，四年

最終就呈現(xiàn)出了這樣的畫面，首先這個(gè)項(xiàng)目是單人項(xiàng)目，所以合成這樣圖的工作量是非常巨大的，過程當(dāng)中老師也請到了一些研究者對這個(gè)項(xiàng)目進(jìn)行一些幫助。整個(gè)海報(bào)的重量據(jù)說非常重，拿起來大約有二十四千克。

如果使用常規(guī)的四色印刷的話，也就需要利用青品黃黑去合成不同的顏色。不過這樣最終的效果并不理想。

于是老師選擇了專色印制，也就是每一種顏色都單獨(dú)去印制一版。單獨(dú)印制一張海報(bào)，就需要反復(fù)印刷 16 版。

其中的黑色，也就是全部 16 版疊壓到一塊的效果，可以說是黑中之黑了。當(dāng)然這個(gè)黑色也是有所比喻的，也就是龐大的信息是無法單獨(dú)存在的，當(dāng)所有信息混在一起，才能比對出彼此的聯(lián)系。

第一張圖展示的是災(zāi)害發(fā)生時(shí)的第一個(gè)月，畫面中展示了很多的圓圈，大部分都發(fā)生在外圓，也就是說當(dāng)時(shí)各種各樣的搜索關(guān)鍵詞，與災(zāi)害相關(guān)聯(lián)，被搜索的頻率非常高。在色彩的區(qū)分中，我們也能感受到相當(dāng)強(qiáng)大的熱度。

這是兩年后的情況，也就是說圓的一半就是一年，左半邊就是第二年，可以很直觀的看到，前半年使用的暖色是比較多的，當(dāng)來到了后半年時(shí)，話題熱度逐漸冷卻的樣子。

來到第四年的時(shí)候，也就是圓的四分之一是一年。右半邊展示的是過去來年的樣子，而左半邊就是又過了兩年之后的樣子。整個(gè)圖標(biāo)展示的是起點(diǎn)“311”大地震動開始的日期，直到截止四年后的 3 月 11 日。

可以看到暖色的部分逐漸變得零星起來。為什么會有這樣比較有規(guī)律的分布呢，那是因?yàn)榕霈F(xiàn)的位置都是所謂的紀(jì)念日，也就是人們會想起那次事件的日期。

比如其中煙花這個(gè)詞，就是從災(zāi)難過后才開始頻繁出現(xiàn)的，它代表了人們對于災(zāi)難的一種寄托，人們期盼著生活能夠回歸正軌。

這樣的可視化設(shè)計(jì)，意義在于人們能夠通過它，俯瞰全局，通過使用宏觀的視野來連接新的視角，讓人們意識到它們沒有注意到的觀點(diǎn)。各個(gè)詞語，會根據(jù)時(shí)間軸的變化與聯(lián)動，起到喚醒記憶的作用。通過這個(gè)設(shè)計(jì)作品投影人們過去的經(jīng)歷。

它是從整體到部分之間的一種信息差異。就圖的整體視角來看，它表示了“人們遺忘的節(jié)奏”，進(jìn)而對遺忘進(jìn)行批判。另外從圖的部分視角出發(fā)，它表示了“記憶的意外發(fā)現(xiàn)”包含了對回憶的期待。

看到這是不是覺得中野老師很厲害呢。那么接下來，咱們再來看看他的成長經(jīng)歷

成為一名設(shè)計(jì)師的契機(jī)有很多，比如父母是設(shè)計(jì)師，或者是有看過一部激動人心的電影海報(bào)，想要成為一名從業(yè)人員?？芍幸袄蠋熯x擇設(shè)計(jì)這個(gè)專業(yè)時(shí)卻完全不是這樣的。

他選擇的了一種極度理性的方法，逐一排除自己不喜歡的東西。

但這種做法本身就很難，最終中野猶豫著要不要選擇美術(shù)專業(yè)。始終沒有鼓足勇氣的他，還是向附近的預(yù)備校老師請教了這個(gè)事情。

聽了中野的情況后，老師的評價(jià)是，他覺得中野很適合平面設(shè)計(jì)這個(gè)專業(yè)，還問他要不要試試呢？

因此在報(bào)考志愿里，中野寫下了武藏野美術(shù)大學(xué)和多摩美術(shù)大學(xué)。如果按照主角光環(huán)的劇本，這個(gè)時(shí)候，中野老師應(yīng)該就已經(jīng)平步青云，從此走上人生巔峰了。

然而現(xiàn)實(shí)卻是，在第一次考試中，他卻落榜了。作為“差生”的他，周圍都是什么樣的人呢？插畫、攝影甚至編程，這樣的擁有特殊技能的人幾乎占據(jù)了大多數(shù)。在這樣的環(huán)境里，中野老師當(dāng)時(shí)卻并沒有什么特別的特長，對于不善于表達(dá)的他，在當(dāng)時(shí)感到很無奈。

那時(shí)的他一直在問自己。我的特長是什么？我的興趣點(diǎn)是什么？有次散步的機(jī)會，他終于得到了靈感。那就是雖然自己沒辦法做出特別厲害的作品，但踏踏實(shí)實(shí)的繪制圖形卻是可行的。

當(dāng)意識到了這一點(diǎn)之后，于是在一次研究宋體（明朝體）的過程中，就產(chǎn)生了做一本書去記錄這段悠久歷史的想法。他想通過探索歷史的過程，去尋找屬于自己的興趣點(diǎn)。

當(dāng)從宏觀角度看待一段歷史的進(jìn)程，通過推演，人們總能或多或少看到未來的一些可能性。通過研究書籍的過去，會發(fā)現(xiàn)最初的書籍形態(tài)起源與泥板，也就是說，從人類發(fā)展初期就存在了書的概念。

就是這樣一步步的研究，信息的宏觀樣貌，如果從宏觀的視角來看待的話，會發(fā)現(xiàn)人們通常能夠了解到的信息其實(shí)并不多，當(dāng)從更高的維度看到相同的事件時(shí)，是能夠展現(xiàn)出事物本質(zhì)的。所以在之后做視覺圖表作品時(shí)，中野就開始有意識的展現(xiàn)從整體到局部之間的相互對照。

我們接下來一起看看中野老師還有哪些精彩的作品吧！

以信息結(jié)構(gòu)和文章脈絡(luò)的可視化設(shè)計(jì)為主題，探索各個(gè)領(lǐng)域中平面設(shè)計(jì)的可能性。

△ 這是中野老師從 2012 年到 2013 年期間，為建筑雜志設(shè)計(jì)的封面，因?yàn)槭窃驴栽趦赡陼r(shí)間里，一共做了 24 本。

雜志的內(nèi)容主要和災(zāi)害相關(guān)，比如第一版，是關(guān)于日本東北地區(qū)的一些內(nèi)容、第二本是關(guān)于海嘯的內(nèi)容，除此之外，還有關(guān)于建筑產(chǎn)業(yè)、能源、以及關(guān)于福島災(zāi)難重建等問題。

每本雜志都有各自的特征，數(shù)據(jù)來源主要由政府以及大學(xué)中的一些數(shù)據(jù)研究者們提供。當(dāng)接收到這些信息之后，中野老師需要甄別哪些內(nèi)容是需要保留的，哪些是需要刪減的。在這個(gè)過程中，不斷的思考”怎樣才能將這些數(shù)據(jù)清晰的傳達(dá)給讀者”這類問題。

這個(gè)展覽是 2018 的時(shí)候，中野老師在印刷博物館策劃的一個(gè)天文學(xué)與印刷的展覽 。主要展覽的是 15 世紀(jì)到 18 世紀(jì)的書籍和印刷物。希望能夠以全新的視角，向大家展現(xiàn)天文學(xué)與印刷之間的關(guān)系。畫面中左上角的同心圓，是哥白尼提出的太陽中心說，從此人們開始以全新的視野觀察這個(gè)世界。

這是這個(gè)展覽的宣傳單頁，博物館的宣傳單頁通常都是 A4 尺寸的，最初老師設(shè)計(jì)了八張相同的傳單頁面。

隨后最終通過局部特寫的方式，構(gòu)建出了八種不同的傳單樣式。如果全部收集完全，可以拼接成完成了一個(gè)大畫面。

從天文學(xué)和印刷術(shù)之間的關(guān)系開始發(fā)展聯(lián)想，結(jié)合了天文學(xué)，哲學(xué)、數(shù)學(xué)等等一些學(xué)科，統(tǒng)一展現(xiàn)出了宇宙的這個(gè)概念。老師分別從三個(gè)角度思考這個(gè)問題，分別是“秩序”“整合”“規(guī)格”。

如果把文字去掉，我們會看到這樣一張插圖，我們來分析一下為什么需要做成這個(gè)樣子。

這里的橫軸代表著時(shí)間，豎軸代表著規(guī)模，畫面頂部展現(xiàn)的是關(guān)于宇宙的圖像，而下方主要以人的視角，展現(xiàn)了地球的圖像。學(xué)術(shù)本身是建立在各種各樣的理論之上，前人建立起的理論，可能會被后來者推翻重建，逐步形成了我們今天的天文學(xué)。

這個(gè)展覽中會展示各種各樣的宇宙學(xué)理論體系，通過各種各樣的宇宙論，去展現(xiàn)這個(gè)世界的演變。讓人們隨著時(shí)間的進(jìn)程，在各種學(xué)術(shù)體系中了解了文明的變遷，通過圖像讓觀賞者提前在腦海中呈現(xiàn)出視覺化的內(nèi)容。也就是說，我們從看到這個(gè)宣傳畫面的那一刻起，這個(gè)展覽的內(nèi)容就已經(jīng)開始了。

這個(gè)展會的名字叫《改變世界的信息》，畫面長度有 12 米左右，這個(gè)畫面是展會的入口處。從數(shù)據(jù)我們可以看到，受到貧困和災(zāi)難的人群，占據(jù)著百分之七十的人群。

中野老師針對這一點(diǎn)，將世界各個(gè)地區(qū)以及不同的國家，把其受災(zāi)的程度和數(shù)據(jù)都集中到了一塊。分別是水資源、糧食、能源、醫(yī)療、住房、交通、識字率、通訊等問題。一共有一百多個(gè)國家。

通過這個(gè)圖，我們會發(fā)現(xiàn)這其中每一個(gè)問題都是相互牽制，相互影響的。比如說水的問題就和所有的內(nèi)容都有關(guān)系。整個(gè)圖標(biāo)并非是想要解決某些問題，而是希望人們在看到它們時(shí)，能夠從中發(fā)現(xiàn)到一些問題。

通過人們的議論，去碰撞出全新的思考。由此可以知道，圖表設(shè)計(jì)其實(shí)是對社會非常有幫助的設(shè)計(jì)領(lǐng)域。

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請掃碼藍(lán)小助，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

文章來源：花瓣   作者：研習(xí)社

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(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ù)

但是，究竟如何才能結(jié)合網(wǎng)頁/產(chǎn)品特色和用戶的真實(shí)需求， 將頁面視覺內(nèi)容層級化， 從而提供更加優(yōu)質(zhì)的用戶體驗(yàn)，實(shí)現(xiàn)與用戶的互動， 最終促成產(chǎn)品購買呢？下面小編就結(jié)合最新且具有極佳視覺層次感的網(wǎng)頁設(shè)計(jì)實(shí)例分析和介紹視覺內(nèi)容組織技巧，以及在原型化這些網(wǎng)頁設(shè)計(jì)的過程中（結(jié)合小編最愛的一款又快又簡單的原型工具M(jìn)ockplus）需要注意的原型設(shè)計(jì)技巧：

1.利用界面元素尺寸大小建立層級結(jié)構(gòu)

界面元素（例如文字，圖片或形狀等）尺寸越大，越突出，越容易吸引用戶的注意。所以，在具體的網(wǎng)頁界面設(shè)計(jì)中，設(shè)計(jì)師可以通過有梯度的尺寸變化，創(chuàng)建頁面信息的層級關(guān)系。當(dāng)然內(nèi)容重要性上，也應(yīng)該是與尺寸大小成正比的（即越大越重要）。

大圖模式

如圖，利用文字的尺寸大小，體現(xiàn)網(wǎng)頁信息的層級。

注意：尺寸大小也要控制在用戶能夠接受的范圍內(nèi)

太大，能夠展示的內(nèi)容有限。太小，易讀性差，也會比較繁雜。

原型設(shè)計(jì)技巧：

在利用Mockplus (一款具有豐富組件庫和圖標(biāo)庫的原型工具)創(chuàng)建網(wǎng)頁原型時(shí)，絕大部分的組件都是可以簡單通過寬高屬性或拖拉邊框兩種方式調(diào)整其尺寸，輕松創(chuàng)建直觀的層次結(jié)構(gòu)。

大圖模式

如圖，Mockplus允許用戶簡單通過寬高屬性或拖拉邊框的方式調(diào)整組件尺寸大小。

2.利用界面元素明暗，陰影以及透明度的不同，體現(xiàn)簡單層級

如白底黑字般，同類元素，同一色彩，不同的明暗，陰影以及透明度，也可體現(xiàn)簡單的層級關(guān)系。當(dāng)然，在沒有過多顏色的參與下，不同文字，圖片等多種的頁面元素結(jié)合透明度，陰影以及明暗，也可使整款設(shè)計(jì)極具簡約風(fēng)和層次感。（點(diǎn)擊鏈接更多的簡約風(fēng)網(wǎng)頁設(shè)計(jì)技巧）

大圖模式

如圖，文字明暗，結(jié)合尺寸變化，讓頁面層級更加清晰簡約：

原型設(shè)計(jì)技巧：

而在這一方面，小編發(fā)現(xiàn)Mockplus提供了專門透明度屬性，可以根據(jù)層級設(shè)計(jì)需求，修改屬性數(shù)值進(jìn)行設(shè)置。

如若，需要添加元素陰影，也可輕松通過組件的重疊實(shí)現(xiàn)。

大圖模式

如圖，“圖片”與“形狀”組件的組合，實(shí)現(xiàn)陰影的添加。

3.利用色彩，劃分頁面層級

色彩，作為設(shè)計(jì)師最常使用的視覺層次工具，也為他們創(chuàng)建極富層級感的網(wǎng)頁設(shè)計(jì)發(fā)揮著舉足輕重的作用。而具體的設(shè)計(jì)技巧，大家可以參考以下幾點(diǎn)：

首先，色彩明亮的頁面元素更容易從相對柔和的元素中脫穎而出。如圖：

大圖模式

如圖，明亮的紅色和黃色更易從相對較柔和的粉色背景中脫穎而出。

而且，某些色彩，尤其是某些主題配色方案的選擇，對于確定網(wǎng)頁的整體基調(diào)，吸引用戶注意，作用也非常明顯。例如，藍(lán)色，一般代表平靜祥和，適合一些日常事物管理類軟件選擇。而紅色，則代表熱情喜氣，適合一些節(jié)日相關(guān)購物促銷類軟件選擇。

大圖模式

如圖，利用紅色突出網(wǎng)頁促銷信息。

其次，色彩飽和度的梯度變化，也可體現(xiàn)直觀而豐富的層次結(jié)構(gòu)。

同一色彩，飽和度的梯度變化，也可幫助展現(xiàn)網(wǎng)站元素的層次結(jié)構(gòu)。如圖：

大圖模式

最后，色彩模塊，對于體現(xiàn)界面元素的邏輯關(guān)系，作用也是顯而易見

存在同一邏輯關(guān)系的各個(gè)頁面元素就近放置在同一色彩模塊，可以讓頁面組織結(jié)構(gòu)更加清晰，易于用戶快速查看相關(guān)內(nèi)容。

大圖模式

如圖，利用色彩模塊，更直觀地劃分功能區(qū)。

原型設(shè)計(jì)技巧：

而這一方面，Mockplus提供了非常強(qiáng)大的色彩選擇器，設(shè)計(jì)師們可以簡單點(diǎn)擊實(shí)現(xiàn)色彩的選擇和添加。其色彩收藏功能，也為以后復(fù)用和保持整款設(shè)計(jì)配色的一致性提供了可能。

當(dāng)然，結(jié)合“形狀”組件，為頁面添加豐富的功能色塊，以及添加“鼠標(biāo)懸停時(shí)”或“點(diǎn)擊時(shí)”的簡單色彩交互狀態(tài)，也不是難事。

大圖模式

如圖，添加色塊劃分界面功能結(jié)構(gòu)。

4.利用頁面布局，展現(xiàn)網(wǎng)頁層級結(jié)構(gòu)

頁面布局也是設(shè)計(jì)師們常用的視覺工具之一。一方面，同一網(wǎng)站，內(nèi)部各個(gè)頁面可以根據(jù)軟件或產(chǎn)品展示內(nèi)容需求，采用多樣的布局模式，增加頁面的多變性和可讀性。另一方面，也可直接在不同頁面采用重復(fù)的頁面布局，方便幫助用戶形成一定的閱讀習(xí)慣，快速有效的查詢需要的信息。

而具體單個(gè)頁面的布局模式，大家可以嘗試以下的方式實(shí)現(xiàn)：

*利用網(wǎng)格劃分不同頁面模塊

網(wǎng)格是公認(rèn)的劃分頁面功能模塊的工具之一。而它在組織界面視覺內(nèi)容方面，作用也不可小視。加之，結(jié)合各個(gè)網(wǎng)格的色彩變化，也能使整個(gè)頁面更加炫酷直觀。如下圖：

大圖模式

*利用位置不同體現(xiàn)邏輯關(guān)系

同一邏輯關(guān)系（比如同類，從屬，因果等）或相近/相關(guān)的元素放在同一或并列的網(wǎng)頁位置或模塊內(nèi)，更易于用戶瀏覽所需頁面信息。

當(dāng)然，每個(gè)邏輯關(guān)系內(nèi)，結(jié)合大小標(biāo)題和列表進(jìn)行展示，層級關(guān)系會更加深入清晰。

*利用點(diǎn)線

網(wǎng)頁設(shè)計(jì)中，設(shè)計(jì)師不僅可以直接使用點(diǎn)線標(biāo)出需要強(qiáng)調(diào)的內(nèi)容，還可以利用點(diǎn)線劃分頁面板塊和布局。

大圖模式

如圖，通過位置的不同體現(xiàn)內(nèi)容之間的邏輯關(guān)系。同時(shí)，利用線條劃分頁面結(jié)構(gòu)和布局。

*利用對齊方式的不同

文字，圖片以及相關(guān)元素的對齊方式，也是體驗(yàn)不同層級結(jié)構(gòu)的重要工具。

總之，頁面布局也可幫助設(shè)計(jì)師們創(chuàng)建更具美感和層次感的網(wǎng)頁設(shè)計(jì)。

原型設(shè)計(jì)技巧：

在使用Mockplus時(shí)，設(shè)計(jì)師可簡單使用“快速格子+自動填充”的功能組合，實(shí)現(xiàn)界面網(wǎng)格的輕松添加。而且，在具體的設(shè)計(jì)過程中，對齊方式，標(biāo)尺以及參考線等工具的使用，也可使網(wǎng)頁布局設(shè)計(jì)更加簡便快捷。

大圖模式

如圖，利用Mockplus的快速格子和自動填充功能制作網(wǎng)頁網(wǎng)格，劃分界面功能結(jié)構(gòu)。

5.利用留白和間距，突出界面視覺內(nèi)容

留白的巧妙運(yùn)用，能夠非常有效地突出頁面信息。而頁面內(nèi)部元素之間，保持適當(dāng)?shù)拈g距，讓彼此之間的相互聯(lián)系而不“擁擠雜亂”，也是吸引用戶注意的不錯策略。如圖：

大圖模式

6.利用對比，凸顯網(wǎng)頁層級結(jié)構(gòu)關(guān)系

以上所提及的各種視覺組織工具，例如尺寸，色彩，明暗，間距等等，同類或不同類之間的鮮明對比，也可以讓頁面視覺上更加美觀而豐富，同時(shí)體現(xiàn)元素之間的結(jié)構(gòu)層次關(guān)系。

大圖模式

如圖，利用色彩的強(qiáng)烈對比，突出頁面層級。

此外，頁面元素的相互疊加，清晰度，以及細(xì)節(jié)展示程度的對比，也能有效地凸顯網(wǎng)頁內(nèi)容的重要性層級。

大圖模式

如圖，靠前的圖片和文字應(yīng)該更加重要，清晰，細(xì)節(jié)也應(yīng)更豐富，從而方便用戶識別讀取，避免層次混亂。

7.采用不同的界面風(fēng)格，打造獨(dú)特的網(wǎng)頁視覺層級

當(dāng)然，并不是說設(shè)計(jì)師就必須通過以上的設(shè)計(jì)工具展示網(wǎng)頁重要性層級結(jié)構(gòu)。實(shí)際上，結(jié)合設(shè)計(jì)師特有創(chuàng)意，獨(dú)特紋理（texture），圖形或圖像元素等，打造出具有設(shè)計(jì)師獨(dú)特風(fēng)格的視覺層級，也會是不錯的嘗試。如下圖：

大圖模式

總之，不管是否使用以上的設(shè)計(jì)工具，結(jié)合設(shè)計(jì)師創(chuàng)意，打造獨(dú)具一格的視覺層級風(fēng)格，都是不錯的設(shè)計(jì)理念。

原型設(shè)計(jì)技巧：

而在這一點(diǎn)上，Mockplus提供了很多優(yōu)質(zhì)功能，幫助設(shè)計(jì)師隨心設(shè)計(jì)，并簡單快捷的原型化，測試和迭代這些天馬行空的創(chuàng)意。

比如，其團(tuán)隊(duì)協(xié)作和團(tuán)隊(duì)管理功能，方便設(shè)計(jì)師更加高效地完成設(shè)計(jì)。其8種演示和分享方式，例如導(dǎo)出圖片，HTML以及演示包等等，為設(shè)計(jì)師根據(jù)切實(shí)需要，選擇適當(dāng)?shù)姆绞綔y試和分享相關(guān)設(shè)計(jì)提供了便利。

此外，其組件樣式庫，也為保存和分享需要的組件樣式并隨時(shí)復(fù)用提供了可能。

8.分析用戶需求和網(wǎng)頁瀏覽模式，優(yōu)化頁面內(nèi)容和位置

在進(jìn)行網(wǎng)頁界面層級結(jié)構(gòu)化的過程中，并不是毫無章法，盲目的隨意添加或突出某個(gè)部分，而是需要分析用戶行為，根據(jù)用戶需求等級進(jìn)行相應(yīng)結(jié)構(gòu)層次的劃分。否則，再怎么賦有層次感，用戶也會因?yàn)檎也坏叫枰臇|西，莞爾離開。

此外，除了根據(jù)用需求決定哪些內(nèi)容需要放在最緊要，最突出的位置，以吸引用戶。同時(shí)還需要根據(jù)用戶瀏覽網(wǎng)頁時(shí)的閱讀模式，分析重要內(nèi)容的頁面位置。

根據(jù)美國著名網(wǎng)站設(shè)計(jì)工程師Nielsen Norman Group研究表示，用戶總是在網(wǎng)頁瀏覽中慣用“F”或“Z”型閱讀模式，即用戶常常是從左到右，開頭結(jié)尾詳細(xì)閱讀，而中間部分則根據(jù)網(wǎng)頁或文章大小標(biāo)題結(jié)構(gòu)，選擇性閱讀的模式。如下圖：

大圖模式

那么，網(wǎng)頁設(shè)計(jì)中，設(shè)計(jì)師就需要注意頁面首尾內(nèi)容的趣味性和實(shí)用性，以及中間主體部分注意大小標(biāo)題簡潔明了，建立清晰的框架層次結(jié)構(gòu)。

總之，無論是用戶行為畫像，還是用戶瀏覽模式分析，最終都是希望能夠根據(jù)用戶需求，更加合理的安排和分布頁面內(nèi)容，直觀清晰，易識別。

9.其他設(shè)計(jì)工具

而其它視覺設(shè)計(jì)工具，例如界面文本方面，文本字體，排版，對齊方式等等，也可突出頁面的層級關(guān)系。

原型設(shè)計(jì)技巧：

如若設(shè)計(jì)師希望通過網(wǎng)頁文本的尺寸，字體，顏色，排版以及對齊方式等實(shí)現(xiàn)框架結(jié)構(gòu)的構(gòu)建時(shí)，Mockplus的“單行文字”和“多行文字”組件就可以輕松幫助實(shí)現(xiàn)。而且，適當(dāng)?shù)慕Y(jié)合一定的交互設(shè)計(jì)，也可使整款設(shè)計(jì)更具吸引力。

結(jié)語：

當(dāng)然，層次結(jié)構(gòu)化不僅能讓網(wǎng)頁更加直觀清晰，賞心悅目。而且，具有一定局限性的Android 或iOS app，例如頁面尺寸的限制，設(shè)備屏幕的限制，響應(yīng)與否的限制等等，更需要清晰的層次結(jié)構(gòu)，讓頁面擺脫混亂繁雜，吸引更多用戶點(diǎn)擊使用。而這方面，也同樣適用以上所有設(shè)計(jì)技巧。

總之， 無論如何， 及時(shí)地將各種設(shè)計(jì)想法，通過一款實(shí)用且強(qiáng)大的原型工具（比如以上介紹到的Mockplus）, 轉(zhuǎn)化成直觀可視的原型，更進(jìn)一步的測試和迭代，才是創(chuàng)建真正美觀實(shí)用，深受用戶喜愛的web/app的必經(jīng)之道。

總之，希望以上介紹的相關(guān)層次結(jié)構(gòu)設(shè)計(jì)技巧和原型設(shè)計(jì)技巧能對你有所啟發(fā)。

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請掃碼藍(lán)小助，報(bào)下信息，藍(lán)小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

                                                            

 

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

 

藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(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ù)