超碰av在线|无码精品一区二区三区在线|伊人色色日韩一级片内射视频群批_欧美丰满少妇人妻HD高清在线_亚洲一区二区中文_亚洲无码动漫专区

騰訊設(shè)計(jì)師:送你10個(gè)提高文字設(shè)計(jì)感的方法!

2019-5-31    資深UI設(shè)計(jì)者

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

我們在設(shè)計(jì)中除了接觸到圖形,還需要了解文字的設(shè)計(jì)。特別的文字設(shè)計(jì)或者排版可以使整體的畫面效果更加有氛圍,甚至超過圖形表達(dá)的感受,更加直觀地表達(dá)出內(nèi)容的主旨。

文字的設(shè)計(jì)方式有很多種,例如通過字體變形,結(jié)構(gòu)重組等方式來讓文字變得更加特別,但往往會(huì)讓我們耗費(fèi)比較多的時(shí)間。

因此我一直在思考有沒有一些既簡單又的設(shè)計(jì)方式來提高文字的設(shè)計(jì)感。在瀏覽國外的一些設(shè)計(jì)網(wǎng)站的過程中,做了一下文字設(shè)計(jì)形式方面的收集,并整理出十種我認(rèn)為具有代表性的文字設(shè)計(jì)形式。另外還參考這些設(shè)計(jì)方式,使用中文字體進(jìn)行了一些嘗試。

拉伸的文字

拉伸的處理手法,讓文字更具有張力,整體氛圍更具標(biāo)題感和圖形化,但依然保留著文字該有的識別度。常見于純文字排版的海報(bào),既滿足閱讀需要,同時(shí)具有設(shè)計(jì)感。

拉伸與文字本身的字形、字體有著很大程度的關(guān)聯(lián),并不是所有的文字都適合拉伸,例如下面的案例。

1. 不同字體對比

從方案嘗試中看出,左邊字體在進(jìn)行拉伸之后,文字本身的結(jié)構(gòu)會(huì)遭到破壞,而右邊的效果可以較為接受。因此在設(shè)計(jì)的過程中盡量選擇可適用于拉伸的字體,另外在拉伸的過程中需要對細(xì)節(jié)重新處理,使字體保留原有字體的細(xì)節(jié)美感。

2. 不同字形的對比

從下面案例中對比,O 在進(jìn)行上下拉伸的時(shí)候效果比較好,而左右拉伸的時(shí)候會(huì)失去字體本身的美感,而 Y 在上下左右拉伸后整體視覺效果都相對平衡。

3. 細(xì)節(jié)處理對比

優(yōu)化字體線條的細(xì)節(jié)可以使得整體文字更加規(guī)整、方正(右邊)。而未進(jìn)行細(xì)節(jié)的設(shè)計(jì)則會(huì)顯得筆畫參差不齊(左邊)。

4. 傳統(tǒng)與現(xiàn)代對比

傳統(tǒng)的字體拉伸后(如下圖中間的字體),字體本身的韻味就失去了,因此不建議對一些較為傳統(tǒng)的字體進(jìn)行拉伸設(shè)計(jì)。

5. 設(shè)計(jì)嘗試

中文字的筆畫比較多樣性,因此在細(xì)節(jié)的設(shè)計(jì)上比英文來得更加復(fù)雜,在處理「撇、捺、點(diǎn)、折、彎、勾」時(shí)需要保持原本的筆畫結(jié)構(gòu)性。

6. 拓展案例

結(jié)合實(shí)際要表達(dá)的內(nèi)容,使用拉伸的設(shè)計(jì)手法,例如結(jié)合物體,疊加顏色或者交錯(cuò)拉伸等。

虛實(shí)結(jié)合文字

虛實(shí)結(jié)合即為線面/陰陽的設(shè)計(jì)手法,通過虛實(shí)的處理,可以突出一組或一段文字中的重點(diǎn)信息。在一些強(qiáng)調(diào)主次的設(shè)計(jì)中,可以嘗試這種方式來做區(qū)分,線面結(jié)合的處理手法讓原有都是面的字體多了一些透氣感和空間感。

虛實(shí)處理的方法需要考慮本身字體的粗細(xì),過分纖細(xì)的字體效果可能并不明顯。

1. 嘗試對比

從對比中,發(fā)現(xiàn)粗體相比于細(xì)體來得更加直接更容易出效果,對比明確。

2. 中文字體的嘗試

從嘗試中來看,與上面中的結(jié)論較為一致,較細(xì)的字體使用虛實(shí)結(jié)合效果并不理想。對于書法體的應(yīng)用,更多需要考慮字體的收邊效果是否工整,收邊過碎,會(huì)影響在描邊之后的細(xì)節(jié)美感。

3. 設(shè)計(jì)嘗試

遞進(jìn)漸變的文字

通過遞增或者遞減的設(shè)計(jì)手法,讓原本簡單重復(fù)的文字元素,變得更加具有層次感和節(jié)奏感,讓文字的生命力變得更加豐富多樣。

在設(shè)計(jì)的過程中需要提前規(guī)范好各個(gè)字體之間的差異關(guān)系及變化的效果過程。按照一定的數(shù)值倍數(shù)差異比進(jìn)行變化。

1. 不同方式的嘗試對比

在嘗試的時(shí)候發(fā)現(xiàn),粗細(xì)變化的模式可能更多會(huì)依賴于字體本身的模式。

2. 中文字體的嘗試

中文在使用遞進(jìn)漸變的方式中需要考慮整體文字的結(jié)構(gòu)感和塊狀感,由于字形較為復(fù)雜,整體視覺效果會(huì)過于零碎。

擴(kuò)展變化的文字

與遞進(jìn)漸變接近但卻又有差別的文字設(shè)計(jì)形式。擴(kuò)展變化的文字具有張力的同時(shí)有一定的速度感和發(fā)射性,就像向四周展開的波紋效果,具有延續(xù)性。

按文字的行高或者字寬作為基礎(chǔ)值,按一定的比例,對文字進(jìn)行破形切割處理,上下左右進(jìn)行擴(kuò)展發(fā)散。

1. 比例值示意效果

2. 中文字體的嘗試

外觀的完整度還算可以,但由于中文本身自有的特性(筆畫較為豐富多樣),因此在擴(kuò)展層次的數(shù)量上需要進(jìn)行一定的控制,不宜過多,以短語或標(biāo)題使用較好,避免過于形式而導(dǎo)致文字識別性降低。

3. 設(shè)計(jì)嘗試

底紋的文字

文字作為紋理出現(xiàn)在畫面中,區(qū)別于圖形化的紋理。既有圖形感,同時(shí)可以輔助傳達(dá)一定的信息和態(tài)度。

在字體的選擇上盡量適用字形較為簡潔的字體,避免影響前景內(nèi)容的展示。設(shè)計(jì)上可以結(jié)合其他的設(shè)計(jì)形式,例如虛實(shí)結(jié)合/拉伸變形/擴(kuò)展變化等方式,提升畫面的豐富程度。

1. 中文字體的嘗試

常規(guī)的中文字體,整體效果還算不錯(cuò)。但結(jié)合中國書法字作為底紋,可以讓整體的設(shè)計(jì)更具有不同于英文的設(shè)計(jì)感,整體效果更具有力量感,因此建議在設(shè)計(jì)中文底紋的時(shí)候可以大膽嘗試中文書法字。

穿透的文字

通過疊加的方式,讓原本簡單的文字和背景產(chǎn)生了融合。既提升了背景的層次感,又讓文字變得具有設(shè)計(jì)感。

粗細(xì)的字體會(huì)產(chǎn)生不一樣的視覺感受,較細(xì)的字體會(huì)產(chǎn)生若隱若現(xiàn)的視覺效果,文字的識別性會(huì)稍弱,較粗的字體識別度基本上沒有太大問題,因此在設(shè)計(jì)的過程中可以結(jié)合實(shí)際的情況選擇不同粗細(xì)的文字。

1. 粗細(xì)對比嘗試

穿透的文字設(shè)計(jì),對于打造設(shè)計(jì)的大片感具有很突出的視覺效果。例如漫威的電影片頭設(shè)計(jì)。

2. 中文字體的嘗試

結(jié)合不同的語意使用不同的字體,再結(jié)合穿透的設(shè)計(jì)方式,使畫面具有中文的文藝感。

3. 拓展案例

結(jié)合實(shí)際的內(nèi)容設(shè)計(jì),穿透文字的玩法還可以拓展出更多不一樣的設(shè)計(jì),例如下面這些例子。

扭動(dòng)的文字

扭動(dòng)的設(shè)計(jì),讓文字具有曲線的動(dòng)態(tài)感,提升了文字的裝飾性。不同曲線的動(dòng)態(tài)變化,賦予文字不同的律動(dòng)感。變形的文字并未影響到文字該有的識別性和閱讀感,卻具有了設(shè)計(jì)感。

如下面的三個(gè)案例,曲率的差別,賦予文字不同的動(dòng)態(tài)規(guī)則,有不同的視覺感知,有時(shí)柔美,有時(shí)卻具有速度感。因此在設(shè)計(jì)的時(shí)候,可根據(jù)具體的內(nèi)容設(shè)計(jì)不同的扭動(dòng)趨勢。

1. 中文字體的嘗試

對比可見較細(xì)的字體使用扭動(dòng)的設(shè)計(jì),效果并不理想。由于中文筆畫的差異點(diǎn),經(jīng)過扭動(dòng)之后整體外形較為不規(guī)整,而粗體的效果則較為規(guī)整,動(dòng)態(tài)曲線趨勢也較為明顯。

2. 設(shè)計(jì)嘗試

扭動(dòng)+虛實(shí)+底紋的效果。

3. 拓展案例

更高級的設(shè)計(jì)手法是利用自然環(huán)境的介質(zhì)結(jié)合文字,起到扭曲的視覺效果。

立體層疊的文字

與擴(kuò)展變化有異曲同工之妙,文字通過一定的角度和位移間隔,由二維向三維的視覺效果進(jìn)行變化,讓文字更加多變化和有重量感、層次感。

立體層疊的設(shè)計(jì)對于字體本身具有一定的要求,較為纖細(xì)的字體出來的效果并不理想。

1. 不同的字體嘗試

從對比中看出,細(xì)體或較細(xì)的襯線字體,層疊后會(huì)出現(xiàn)銜接不上或視覺黑點(diǎn)的情況(如下面左圖和右圖)。因此設(shè)計(jì)時(shí)建議使用粗體,并且整體筆畫較為平均的字體(中間的圖)。

2. 中文字體的嘗試

雖然具有了層次感和空間感,但也會(huì)讓整體變得更加復(fù)雜,因此需要根據(jù)文字的多少情況進(jìn)行使用。

3. 拓展案例

立體層疊還不止單向的設(shè)計(jì),例如可以進(jìn)行軌跡變化,向外擴(kuò)展層疊,或是增加一些顏色漸變來豐富整體的設(shè)計(jì)。

顏色疊加的文字

文字通過錯(cuò)位,疊加,顏色變化,透明度變化,切割等方式的設(shè)計(jì)之后,具有故障的視覺偏差感受。整體視覺感知類似雙重曝光的照片,文字具有豐富的層次感。

顏色疊加的效果,對于顏色的選擇極為重要,兩個(gè)顏色交錯(cuò)之間的顏色可以為過渡色或者互補(bǔ)色。

細(xì)體的效果并不理想(如上圖左邊第一個(gè)),建議設(shè)計(jì)的過程中使用較粗的字體,另外在使用的過程中需要考慮文字的識別度(如右邊的效果),重疊之后文字的識別度或多或是會(huì)受到影響。

1. 中文字體的嘗試

由于中文字比英文復(fù)雜,因此使用中文字在設(shè)計(jì)的時(shí)候,可以尋找一些共筆的地方進(jìn)行重疊(如下圖左邊的設(shè)計(jì)),利用字體筆畫粗細(xì)一致的情況下,進(jìn)行了邊與邊的重疊。另外在設(shè)計(jì)的過程中建議加大字間距,這樣可以避免不同文字的重疊,產(chǎn)生過度復(fù)雜的效果,影響文字的識別性(如下圖最右邊的設(shè)計(jì))。

2. 拓展案例

在簡單的疊色之外,結(jié)合不同質(zhì)感和肌理,可以讓整個(gè)文字具有不一樣的視覺感受。

立體空間的文字

文字按照立方幾何結(jié)構(gòu)進(jìn)行排版,通過顏色差異,陰陽,線面等方式設(shè)計(jì)處理后形成空間感和立體感。相比于平面排列的文字更具有空間感和層次感,提升整體畫面的設(shè)計(jì)感。

1. 設(shè)計(jì)嘗試

使用空間錯(cuò)位結(jié)合虛實(shí)的設(shè)計(jì),讓簡單重復(fù)的文字變得具有空間感和立體感。

2. 拓展案例

除了常規(guī)的空間打造,甚至可以融入到場景中或者結(jié)合物體本身的設(shè)計(jì)。

以上設(shè)計(jì)風(fēng)格,常常會(huì)在一些運(yùn)動(dòng)品牌的設(shè)計(jì)中看到。例如,Nike 的設(shè)計(jì)中應(yīng)到的文字,也會(huì)結(jié)合這些方式,來豐富和提高整體的設(shè)計(jì)感。

火箭隊(duì)出場片頭的字體應(yīng)用,線形字體疊加漸變的效果,具有層次感又有未來感。

阿迪達(dá)斯的廣告:

Converse 的廣告:

Under Armour 的廣告:

除了一些品牌的設(shè)計(jì),音樂唱片的封面也有應(yīng)用到這些類型的設(shè)計(jì)手法。

我們除了在一些常規(guī)的媒介上會(huì)看到相關(guān)的文字設(shè)計(jì),在這兩年的耐克或阿迪達(dá)斯的鞋子設(shè)計(jì)中,也會(huì)加入文字元素的設(shè)計(jì),甚至球員會(huì)直接在鞋子上寫上文字。

文字設(shè)計(jì)的拓展疊加

文字的設(shè)計(jì)已經(jīng)成為一種新的設(shè)計(jì)趨勢,結(jié)合實(shí)際需要表達(dá)的想法,對于設(shè)計(jì)手法進(jìn)行活學(xué)活用是做出好設(shè)計(jì)的關(guān)鍵。當(dāng)然只有掌握了基礎(chǔ)手法才可能做到舉一反三的設(shè)計(jì)思考。在實(shí)際設(shè)計(jì)的過程中,我們往往不會(huì)是單獨(dú)使用某一種方式,而是對不同的設(shè)計(jì)手法進(jìn)行重組再設(shè)計(jì),或者使用 2~3 種方式疊加設(shè)計(jì)來打造整體的畫面效果。如下:

總結(jié)

在這十種基礎(chǔ)的文字設(shè)計(jì)中,通過結(jié)合發(fā)散可以迸發(fā)出遠(yuǎn)遠(yuǎn)不止于十種的創(chuàng)意設(shè)計(jì)。本次收集總結(jié)除了自身學(xué)習(xí)提高之外,希望可以起到拋磚引玉的作用,激發(fā)設(shè)計(jì)師對于文字的設(shè)計(jì)思考。

藍(lán)藍(lán)設(shè)計(jì)m.miumiuwan.com )是一家專注而深入的界面設(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è)人資料

存檔