LOGO排版,你還在瞎整么?

2022-9-16    seo達(dá)人


圖片

這個(gè)LOGO大家覺得怎么樣,很簡單吧!是不是有手就行?然后用你們經(jīng)常用的排版排一下看看:

圖片

200塊錢,不能再多了…我們?cè)倏匆幌略髡叩呐虐妫?

圖片

怎么說?2000塊錢怕是拿不下來這個(gè)LOGO吧?所以無論你的LOGO做的是簡單還是復(fù)雜,一個(gè)合適的排版都會(huì)為你的LOGO增加成倍的價(jià)值!

OK,廢話不多說,讓我們開始吧~~!

 

圖片

 

 

圖片

所謂謀定而后動(dòng),知止而有得。我們?cè)谧鯨OGO的時(shí)候,通常會(huì)先根據(jù)不同的行業(yè)和命題選擇相對(duì)合適的構(gòu)成方式來表現(xiàn)。

比如企業(yè)類的一般會(huì)用字母類、幾何重復(fù)、中英文這種簡約大氣的構(gòu)成方式,你用一個(gè)擬人化卡通標(biāo)志提交過去,客戶肯定會(huì)讓你滾犢子,而像餐飲、文娛這類命題就可以選擇更為親民,感染力更強(qiáng)的表現(xiàn)形式。

圖片

同樣的,LOGO的排版在選擇上也應(yīng)遵循行業(yè)和圖形本身所體現(xiàn)的氣質(zhì)來進(jìn)行選擇。我們這里分三個(gè)點(diǎn)來看一下。

 

圖片

LOGO中的文字編排,通常都是為了更好的對(duì)品牌進(jìn)行信息傳遞及整體美觀性而服務(wù)的,所以我們?cè)谧煮w的選擇上要考慮適不適合這個(gè)LOGO所體現(xiàn)的調(diào)性。

圖片

我們拿小米的LOGO來舉個(gè)例子,雖然200w的經(jīng)費(fèi)主要體現(xiàn)在LOGO里,但是在字體的設(shè)計(jì)上也是遵循了LOGO里MI的調(diào)性來匹配的,非常幾何化同時(shí)加入了小圓角。

而當(dāng)我們將字體換成一個(gè)文化氣質(zhì)更加濃厚的襯線體時(shí),你會(huì)發(fā)現(xiàn)這是啥玩意,200w瞬間變成20w。

圖片

那我們?cè)贀Q一個(gè)偏幾何一點(diǎn),所謂“設(shè)計(jì)感更強(qiáng)”的字體,得,連20w都沒有了…

圖片

英文如此,中文同樣如此,比如下方的山島小食府案例,圖形LOGO本身是非常具有文化氣質(zhì)的,而如果你選擇幾何化或者常規(guī)的黑體,則也是完全不匹配的。

圖片

上面的案例都是關(guān)于調(diào)性匹配的,還有一個(gè)點(diǎn)是圖形與文字的灰度匹配。

如果圖形是比較厚重粗一點(diǎn)的時(shí)候,如果你的字體選擇的很細(xì),也是非常不和諧的,有生活閱歷的朋友應(yīng)該都知道尺寸合適的重要性…(如下圖)

圖片

那到底該如何知道到底咋樣才算不粗、不細(xì)呢,這個(gè)東西其實(shí)沒有一個(gè)評(píng)判標(biāo)準(zhǔn),一般情況下會(huì)遵循以下規(guī)律:

如果你是面構(gòu)成的稍微厚重一點(diǎn)的圖形,則字體的粗度在Medium-bold左右差不多,可以拿字庫比對(duì)一下;如果你是線構(gòu)成的字體,則字體的粗度差不多比你的線的描邊粗度粗一丟丟即可。

圖片

 

圖片

大多數(shù)情況下,我們都是要給LOGO搭配標(biāo)準(zhǔn)中文和英文的。根據(jù)字體的特征點(diǎn),我們大致可以將常用中英文字體分為以下幾類:

圖片

圖片

圖片

我們?cè)谶M(jìn)行字體搭配的時(shí)候,一般情況也是遵循這個(gè)規(guī)律來進(jìn)行搭配即可。

比如黑體配非襯線體、宋體配襯線體、圓體配圓體等,需要注意的是當(dāng)中文以書法體為主的時(shí)候,英文通常都不會(huì)再選擇手寫的英文字體了,會(huì)比較混亂,一般會(huì)搭配同樣具有文化氣質(zhì)的襯線體作為裝飾。

圖片

這幾種搭配的形式都是LOGO排版里比較基礎(chǔ)、常規(guī)且不容易犯錯(cuò)的安全范圍,肯定也有黑體+襯線體這種不同搭配的形式存在,但是作為一個(gè)小白,還是先老老實(shí)實(shí)的按照常規(guī)操作來進(jìn)行搭配!先保證不犯錯(cuò),再玩花活…

 

圖片

我們先看一些案例來找一找規(guī)律。

圖片

可以看到上面這些偏大型企業(yè)類一點(diǎn)的行業(yè),一般選擇的排版都比較簡約,往往單個(gè)字母或者簡單中英文搭配即可,不會(huì)有過多的輔助元素出現(xiàn),我們?cè)倏匆恍?

圖片

而上面這些LOGO,都有或多或少的輔助線或輔助文字元素來進(jìn)行裝飾,因?yàn)榕c大型企業(yè)注重品牌傳播識(shí)別度不同,也有很多LOGO是需要一些裝飾來提升整體的美感和氣質(zhì)。

我們用兩個(gè)案例來實(shí)操一下看看。

圖片

左邊的LOGO是比較精致簡約的幾何化LOGO,所以我們用簡單的英文搭配就會(huì)非常高級(jí);而右邊的LOGO,我們加入一些裝飾文字和裝飾線來排版。

圖片

我們違背這個(gè)規(guī)律,用相反的方式來做一下,可以看到所體現(xiàn)的氣質(zhì)完全不一樣了,左邊的LOGO變得復(fù)雜,而右邊的LOGO則變得單調(diào)。

圖片

 

 

圖片

說是危險(xiǎn)區(qū)域,其實(shí)也可以算是新手禁忌區(qū)域,也就是絕不應(yīng)該犯的一些排版問題!當(dāng)然了,市面上肯定有一些LOGO是超脫區(qū)域之外的,所以給自己留了個(gè)臺(tái)階,哈哈哈,下面我們來看一下都有哪些需要注意的細(xì)節(jié)?

首先我們先將LOGO劃分群組,可以分為圖形部分、文字部分、裝飾文字(宣傳語等)、裝飾圖形部分。其中裝飾部分都是可有可無的(根據(jù)前面所講的選擇性添加)。

圖片

 

圖片

絕大多數(shù)情況下!文字與圖形之間的間距要保持一個(gè)合理的空間,不能太大,也不能太小,就像愛情一樣,太遠(yuǎn)了不行,容易淡,太膩了也不行,容易煩。

圖片

 

圖片

我們要知道文字、裝飾文字它們是一個(gè)組別的物件,所以在編排時(shí)也要將他們編排在一起,他們之間的間距不能超過與圖形之間的間距。

圖片

 

圖片

無論是居中對(duì)齊,還是左對(duì)齊右對(duì)齊,最好都要貫徹到底,因?yàn)?strong>如果不對(duì)齊,就會(huì)產(chǎn)生額外的負(fù)空間,導(dǎo)致整體不美觀,不穩(wěn)定。

圖片

 

圖片

什么叫階梯狀呢?就是從圖形到文字按照從長到短,或者從短到長的順序進(jìn)行排列,學(xué)過排版或者對(duì)排版有一定了解的同學(xué)應(yīng)該都知道,這種排法往往不具備設(shè)計(jì)感和無法滿足視覺上的審美,如下圖:

圖片

其實(shí)就和我們的人生是一樣的,我們不會(huì)一直幸運(yùn)的向上,這樣生活沒有挑戰(zhàn),而且也不會(huì)一直向下,會(huì)徹底廢掉,有起有落,有長處有短處,才是最有意義的人生!

通常我們都會(huì)選擇長短長、或者短長短這種有錯(cuò)落感的排布方式。

圖片

 

圖片

裝飾文字,一般是指我們放置的品牌slogan或是一些不那么重要的小文字。既然不那么重要,我們就不能對(duì)他過度的進(jìn)行設(shè)計(jì)和強(qiáng)調(diào),這里一般會(huì)出現(xiàn)兩種錯(cuò)誤:

圖片

圖片

一般情況下,裝飾文字都是文字組內(nèi)最小的字號(hào),如果是因?yàn)椴环糯蠖鴮?dǎo)致排列邏輯出了問題,則可以增加字間距來解決;且裝飾文字由于占地面積較小,所以一般會(huì)選擇閱讀性較好的普通黑體或宋體等,過多的設(shè)計(jì)感反而影響了主次關(guān)系。

 

圖片

裝飾圖形的存在,一般是為了彌補(bǔ)空間和強(qiáng)調(diào)某些品牌的調(diào)性,類似于補(bǔ)丁的作用,所以它也不應(yīng)該太大太復(fù)雜,往往以LOGO中某個(gè)小元素演變而來,或者以印章的形式存在。

圖片

而很多同學(xué)為了裝飾而裝飾,直接將LOGO拿過來作為輔助圖形擺放…這完全就是畫龍點(diǎn)龍、畫蛇添蛇的做法- -!

圖片

還有一點(diǎn)是關(guān)于參考線的粗細(xì)問題,很多同學(xué)拿捏不準(zhǔn),一般情況下,參考線的粗細(xì),會(huì)比你所以文字組中最細(xì)的筆畫再略粗一點(diǎn)點(diǎn)即可,大家平時(shí)一定要多觀察優(yōu)秀LOGO的處理方式,多洗洗眼睛??!

圖片

 

 

圖片

這里指的就是我們常說的標(biāo)準(zhǔn)字體的設(shè)計(jì),因?yàn)榭蛻舢吘够ㄥX了嘛,往往都希望得到一個(gè)專屬于自己品牌的字體,而不是常見的字庫字,所以一般會(huì)字體設(shè)計(jì)的同學(xué)做LOGO都比較容易做的出彩一些,關(guān)于標(biāo)準(zhǔn)字的設(shè)計(jì),前些時(shí)間猴子哥哥已經(jīng)寫了一篇詳細(xì)的教程,大家可以翻回去學(xué)習(xí)一下。



可以看到,兩組的LOGO都很棒,強(qiáng)哥的二火如果單看LOGO的話妥妥是首頁級(jí)別的,但是就差在了字體設(shè)計(jì)和圖文編排上面,所以無論你的LOGO做的有多出彩,字體設(shè)計(jì)也是必不可少的環(huán)節(jié)!

而字體設(shè)計(jì)就太深?yuàn)W了,不可能用很短的篇幅來進(jìn)行概括的,這里主要為不會(huì)字體設(shè)計(jì)的同學(xué)提供一種快速提升標(biāo)準(zhǔn)字設(shè)計(jì)感的思路及方法!

 

圖片

因?yàn)長OGO中的標(biāo)準(zhǔn)字更多的還是起到識(shí)別性閱讀性的作用,不需要很復(fù)雜的設(shè)計(jì),所以我們可以將某些筆畫進(jìn)行斷開,再不影響識(shí)別性的同時(shí)來提升設(shè)計(jì)感。

圖片

你看,簡簡單單,也就20秒的功夫,字體的設(shè)計(jì)感立馬提升了一個(gè)檔次,你說這需要字體設(shè)計(jì)基礎(chǔ)嗎?不需要吧,完全是用字庫改的…中文同樣如此!

圖片

斷筆的時(shí)候需要注意,選擇同樣的筆畫進(jìn)行斷開,而不要這里斷一下,那里斷一下,很混亂無章法,且數(shù)量不要太多,會(huì)容易碎,適當(dāng)來幾下就可以了。

 

圖片

省略某些不影響識(shí)別的筆畫,也是常用的一種設(shè)計(jì)方式。

比如字母A,因?yàn)樗赜械娜切谓Y(jié)構(gòu),我們將內(nèi)部的橫線直接省略掉,也是可以識(shí)別出字母A的。

圖片

再比如字母E,也可以簡化成三條直線,不過這個(gè)變化幅度就比較大了,一般情況下只能當(dāng)做唯一一個(gè)變形使用。

圖片

還有小寫字母g,將右下角的連接處斷開,也是具備一個(gè)基本的識(shí)別性的。

圖片

像中文里的草字頭,將中間連接的地方省略,也完全OK。

其他的類型就太多了,不一一展示了,有興趣的同學(xué)可以自己去嘗試一下,記住任何變化的前提都是保證最基本的識(shí)別性就好。

圖片

 

圖片

還有一種操作是結(jié)構(gòu)替換,這種通常都是將某個(gè)字母的負(fù)空間部分替換成和本行業(yè)相關(guān)的一個(gè)小元素,切記替換的元素不能太復(fù)雜,越簡單越好。

最常見的就是字母O,因?yàn)槠鋬?nèi)部的空間較大,像咖啡品牌可以在內(nèi)部填充一個(gè)簡約的咖啡豆的形態(tài)。

圖片

再比如字母i的上面的點(diǎn),也是一個(gè)替換的不錯(cuò)方向。

圖片

圖片

 

 

圖片

基本的排版知識(shí)已經(jīng)講完了,下面來介紹一些常見的組合形式,這里主要分為了六個(gè)方向:

1. 橫排;

2. 豎排;

3. 左右排;

4. 斜排(特殊角度);

5. 環(huán)繞排(徽章式);

6. 嵌入排。

 

圖片

橫排是最基礎(chǔ)常見的排版形式,通常會(huì)將文字組排在LOGO的右側(cè),也有的時(shí)候會(huì)排在左邊,根據(jù)LOGO的特征來決定,此類排版基本適用于任何行業(yè)的LOGO。

 

圖片

豎排和橫排一樣,也是最基礎(chǔ)的排版形式,通常都是可以互相相互轉(zhuǎn)換的,同時(shí)因?yàn)樯舷路降目臻g較大,會(huì)比橫排有更多創(chuàng)作的可能性。

 

圖片

左右排的形式相較上面的橫豎排不是很常見,它比較適合于偏向?qū)ΨQ形式LOGO,從而保持左右平衡,左右排的好處就是可以自行發(fā)揮的空間較大,可以作為橫豎排的一個(gè)拓展來進(jìn)行嘗試。

 

圖片

斜排或者說特殊角度的排版,往往存在于一些偏藝術(shù)化、或者抽象化的LOGO中,它可以打破常規(guī)的排版方式,給人更耳目一新的感覺。當(dāng)你的LOGO重心不是很穩(wěn)定的時(shí)候,可以采用這種方式來填補(bǔ)不足的空間,達(dá)到整體平衡。

 

圖片

環(huán)繞式/徽章式的排版,一般常見在偏卡通或者偏藝術(shù)一些的LOGO中,它極大地增強(qiáng)了LOGO整體的趣味性,同時(shí)為我們?cè)鎏硪恍┹o助文字和圖形增加了想象的空間。一般餐飲行業(yè)以ip形象為主的LOGO都會(huì)增加一個(gè)環(huán)繞式排版的方向。

 

圖片

嵌入式的排版這個(gè)主要取決了LOGO本身的形態(tài),如果LOGO中有很大的空間,則可以嘗試將文字組放入其內(nèi),這種方式一般更多的是卡通向的LOGO,比如球隊(duì)隊(duì)標(biāo)等,或者LOGO本身不是很復(fù)雜的情況下,可以將文字放里面填補(bǔ)空間(類似文字構(gòu)成的一種)。

圖片

 

 

圖片

好了朋友們,前面了解了LOGO排版中需要注意的一些事項(xiàng),叨逼叨了那么多,下面我們分別用不同行業(yè)的LOGO實(shí)操一下看看排版的可能性。

 

圖片

圖片

圖片

圖片

圖片

圖片

圖片

圖片

圖片

圖片

像這種企業(yè)類的LOGO,一般采用基礎(chǔ)的上下左右排即可,現(xiàn)實(shí)項(xiàng)目中,可以根據(jù)實(shí)際應(yīng)用場(chǎng)景的尺寸,來制定不同的組合形式。

 

圖片

圖片

像這類的命題我們可以增加一些裝飾英文和圖案來提升整個(gè)LOGO的調(diào)性,一些和前面重復(fù)的排版這里就不做演示了,我們嘗試一下其他更多的可能。

圖片

圖片

圖片

圖片

圖片

圖片

圖片

好啦好啦朋友們,就到這里了,LOGO排版的樣式真的是太多了,沒辦法全部展示出來,但是無論怎么排,都離不開前面講的需要注意的點(diǎn),最后再來復(fù)習(xí)一遍。

 

 

總結(jié):

1. 抓準(zhǔn)品牌的調(diào)性,選擇適合品牌的排版方式;

2. 注意排版中常犯的細(xì)節(jié)錯(cuò)誤,如間距、編組、對(duì)齊、錯(cuò)落等;

3. 選擇合適的字體進(jìn)行搭配,適當(dāng)設(shè)計(jì),克制設(shè)計(jì);

4. 通過不同的組合方式進(jìn)行嘗試,商業(yè)稿一般比較克制,根據(jù)實(shí)際應(yīng)用的方向來進(jìn)行編排,自己練習(xí)的時(shí)候,則可以嘗試變化不同的排版方式,讓你的logo更出彩。

OK,那么今天的教程到這里也就結(jié)束了,照例,是很感謝今晚的相伴,如果你對(duì)本篇教程很滿意,請(qǐng)三連支持一下!朋友們!giao辭!


作者:告白天

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》LOGO排版,你還在瞎整么?

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


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


藍(lán)藍(lán)設(shè)計(jì)www.bouu.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ù)UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司


分享本文至:

日歷

鏈接

個(gè)人資料

存檔