如何運用理科知識讓設(shè)計師的圖片大受歡迎?

0 評論 8606 瀏覽 0 收藏 12 分鐘

編者按:理科生也能玩設(shè)計!今天@北京華創(chuàng)精益?另辟蹊徑,從科學(xué)的角度來分析如何吸引受眾的視線,有哪些技巧可以運用。

zzs201503111

4條有關(guān)視覺科學(xué)的經(jīng)驗

我們喜歡將各種話題歸結(jié)為一些根本原因,來說明為什么有些事有效(或者無效),這些深入的挖掘經(jīng)常將我們帶入心理學(xué)和科學(xué)范疇。我發(fā)現(xiàn)對于視覺內(nèi)容也是如此。在許多心理學(xué)和科學(xué)中,都解釋了視覺內(nèi)容為何如此強大、如何創(chuàng)建漂亮的圖片,總結(jié)了四點:

1. 為了本能反應(yīng)而設(shè)計視覺內(nèi)容

你是否曾經(jīng)愛上過一款設(shè)計,但是卻解釋不清為何喜歡?

這些本能的反應(yīng)是我們能夠與視覺內(nèi)容所產(chǎn)生的最強連接。在我們的大腦中,有一個負責(zé)生存本能和戰(zhàn)術(shù)評估(應(yīng)戰(zhàn)或者逃跑)的區(qū)域,當(dāng)我們感知一種本能 反應(yīng)時,這個區(qū)域就會給我們發(fā)出響應(yīng)。這種響應(yīng)是一種潛意識,當(dāng)我們受到諸如食物、居所、或者生殖等刺激時,中樞神經(jīng)系統(tǒng)就會作出應(yīng)激反應(yīng)。如果我們不能 解釋為什么我們會愛上一款漂亮的設(shè)計,是因為我們的意識還沒有追趕上我們的潛意識。

讓本能反應(yīng)與視覺內(nèi)容有效結(jié)合,訣竅是要明白你的圖片或視頻要喚起什么感受。如果你能夠引發(fā)生存類的響應(yīng)(例如,通過展示一個家或者一塊場地,來暗示安全),你就能夠發(fā)掘出本能反應(yīng)。

下面這張照片,就得到了本能反應(yīng),也許是因為鑰匙和平靜的顏色帶來了安全感。

zzs201503112

2. 三分法

三分法是一種構(gòu)圖法,能使得圖片上的元素構(gòu)成令人愉悅,同時能夠與我們的眼睛掃描圖片的方式保持一致。攝影師也知道三分法;這是攝影的基礎(chǔ)知識。

三分法的用法,是將圖片橫向縱向等分成3×3的格子。簡單的說,就是在圖片上畫一個井字棋棋盤。

zzs201503113

井字棋棋盤產(chǎn)生了線與線的交叉,根據(jù)三分法,這些交叉點是眼睛最常看的地方。這里,設(shè)計經(jīng)驗是將關(guān)鍵元素放在交叉點上。不要將一個元素放在正中間。

3. 黃金比例

黃金比例是指短的線段與長的線段長度之比等于長的線段與兩個線段長度之和。暈吧?看一看Vanseo Design的這篇一幅圖解釋會容易一些,如下:

zzs201503114

這個比例可以是一副圖片的寬高、或者是一個博客頁面的主內(nèi)容和邊欄的寬度。(甚至有些便捷的工具來計算網(wǎng)頁版式的黃金比例)

對于圖片而言,這個比率創(chuàng)造了黃金矩形,當(dāng)你把它分解成越來越小的黃金矩形時,就形成一條螺線,這條螺線經(jīng)常在自然界、建筑和藝術(shù)作品中出現(xiàn)。

zzs201503115

要想得到你要創(chuàng)建的圖片的黃金比例,你可以對長和寬進行一些代數(shù)計算。例如,如果你知道圖片的長度是400像素,你就可以用400乘以1.618,得到寬度是647像素。

要想檢驗?zāi)愕膱D片是否“黃金”,你可以用寬除以高。根據(jù)你除的方式不同,黃金比值可能是1.618或者0.618。

4. 斐波那契數(shù)列

斐波那契數(shù)列是一系列的數(shù),符合后項等于前兩項之和。下面是這個數(shù)列的開頭部分:

0,1,1,2,3,5,8,13,21,34,55,89,144 …

這些數(shù)字一般出現(xiàn)在經(jīng)典創(chuàng)作中和自然界中。這些數(shù)與黃金比例如出一轍。用斐波那契數(shù)列中的任何一項除以前項,所得到的結(jié)果近似等于黃金比數(shù)1.618——黃金比例的基礎(chǔ)。

下面的網(wǎng)格展示了黃金矩形同斐波那契數(shù)列數(shù)值之間的結(jié)合。

zzs201503116

9種主要的視覺內(nèi)容類型

說到視覺內(nèi)容,我們具體是指什么?我有時也說不清楚??傊?,每個視覺內(nèi)容策略都會有一個對應(yīng)的最終產(chǎn)品。這里列出了一些營銷人員創(chuàng)建視覺內(nèi)容最常用的方式。

捕捉眼球并且有創(chuàng)意的照片——ThinkStock照片或者Instagram圖片

視頻——嵌入到文章中或者直接通過社交媒體分享的YouTube、Vimeo或者Wistia視頻。

截屏——對產(chǎn)品或使用流程有用的圖片。

信息圖表——可視化信息,即可內(nèi)容冗長信息豐富,也可小巧玲瓏信息精練。

數(shù)據(jù)可視化——獨立的圖表和圖形。

漫畫——相應(yīng)的連環(huán)畫或卡通形象

大頭貼模板——流行的大頭貼模板可以進行定制化以適應(yīng)你的帖子或更新的上下文

視覺筆記——隨意設(shè)計的想法布局,通常文字為主

額外圖像——對內(nèi)容進行補充說明的圖片,例如,上一節(jié)中隊黃金比例和斐波那契數(shù)列的圖片。

幾個技巧讓你的圖片受歡迎

在為Buffer博客制作視覺內(nèi)容的過程中,我依靠了大量的小技巧。當(dāng)要進行設(shè)計的時候,掌握一些技巧是非常有用的。我在這里分享一些我喜歡的技巧。

zzs201503117

用格子進行設(shè)計

三分法強調(diào)了格子在進行照片構(gòu)圖時的重要性。格子在創(chuàng)建圖片時,也可以發(fā)揮巨大作用,進而使得照片看上去很棒。從這個意義上說,你可以試試將許多圖片放在格子中,從而創(chuàng)建一張拼貼畫,或者將一幅照片加一個邊框。格子技術(shù)讓你的圖片有序且專業(yè)。

zzs201503118

提示:在有圖片的格子上添加文本更加簡單。將文本置于實線邊框上層時,會變得非常突出。

選擇一款合適的濾鏡,并使風(fēng)格保持一致

為什么要把濾鏡當(dāng)作隨手使用的工具?當(dāng)你從各種來源獲取圖片用在你的博客上的時候,為圖片使用相同的濾鏡,會使這些照片看上去會更加連貫。使用相同的的濾鏡甚至能讓你的文章在社交網(wǎng)絡(luò)中的辨識度更高,當(dāng)時光軸充滿了視覺元素的時候,這點尤其重要。

看一下下面的兩張圖,一張是使用濾鏡之前的,另一張是使用濾鏡之后的:

之前:

zzs2015031110

之后:

zzs201503119

設(shè)置一個調(diào)色板,并確定你的品牌使用的字體

如果你的商標(biāo)沒有調(diào)色板或者兩三種首選的字體,那現(xiàn)在應(yīng)該去做這件事了??紤]一下你選擇的色彩和字體如何塑造你的品牌。需要始終注意色彩的心理暗示 作用:色彩會使我們產(chǎn)生不同的感覺。這幅源自PowerText的圖片展示了不同的色彩(和不同的logo)會帶給我們怎樣的感覺。

zzs2015031111

提示:當(dāng)你使用色彩進行設(shè)計時,請牢記語義共鳴原則。也就是說,如果可能,使用的顏色應(yīng)當(dāng)與你要表達的主題相匹配。在信息圖表中,這意味著需要用一個紅色的條來顯示Google+的數(shù)據(jù),用淺藍色的來顯示Twitter的數(shù)據(jù)。

使用醒目的商業(yè)圖片

在為博客尋找圖片的過程中,我們收集了大量的免費商業(yè)圖片網(wǎng)站。很難確定怎樣才能做出好照片。當(dāng)我們在Buffer上搜索時,我們傾向于運用抽象思 維:如果我們正在寫一篇有關(guān)Facebook粉絲的文章,我們可能會嘗試搜索“l(fā)ines”或“queues”,而不是搜索Facebook的圖標(biāo)。當(dāng)選 擇正確的圖片時,你會牢牢記住從心理學(xué)和視覺科學(xué)學(xué)到的哪些經(jīng)驗:為了直覺反應(yīng)而搜索,使用明艷的色彩,運用三分法和黃金比例。

提示:社交媒體代理商Laundry Service發(fā)現(xiàn),Instagram的照片能制作出比商業(yè)圖片更有效果的廣告圖片。也許下次市場活動你值得一試。

創(chuàng)建有用、幽默的信息圖表

來自The Best American Infographics的Gareth Cook在哈佛商業(yè)評論博客發(fā)表的文章中,提到了使信息圖表取得成功最關(guān)鍵的一些領(lǐng)域。Cook認為,關(guān)鍵是將大量的信息提煉成易讀、直觀的布局形式。

 

原文來自:優(yōu)設(shè)

作者:@北京華創(chuàng)精益

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發(fā)揮!