20年IT培訓經驗
累計20000人高薪就業

學全網優化 100%推薦工作

400-0431-885

學全網優化 畢業100%安置工作
世紀首頁 > 全網營銷 > UI設計 > 長春UI培訓_感恩字體設計教程

長春UI培訓_感恩字體設計教程

  • 發布時間:2018-03-19
  • 文章作者:長春全網優化培訓
  • 文章來源:長春UI設計學校

  想要做一個出色的UI設計師,字體設計一定是非常重要的一個部分,今天長春UI設計學校小編就和大家說說如何做好字體設計。

為什么要學習字體設計

  字體設計在近年來還是比較熱的,應用的范圍及場景也是很廣的,平面、品牌且不說,就說我們廣大的UI設計師用到的地方就會很多,像很多APP的應用icon很多就是品牌名稱的字體設計去完成的,易識別易傳播同時可以承載一定的品牌文化。

  

字體設計

 

  又或者運營banner里的標題字。

  

運營banner里的標題字

 

  又比如UI頁面導航欄的字體設計。

  

UI頁面導航欄的字體設計

 

  這樣粗略算算,其實字體設計在我們UI領域這塊應用的頻率和場景還是很多的,所以大家對字體設計這一塊還是可以去做個了解和學習的。

本例字體設計的常規步驟

  第一步:分析并把握字體性格。第二步:確定好字體結構,這一步很重要。第三部:根據字形字義設計合適的筆畫修飾。第四部:根據畫面整體調整及豐富細節。

  但不管你怎么去設計及變化最重要的一點是識別性,每個字在視覺上的重量、大小、負空間的大小都需要去保持一致,但有的時候要根據實際情況去進行取舍。

  字體的性格

  字體的性格比如楷體、宋體、黑體、卡通體。手寫體等都會有不同的性格。

  

字體的性格

 

  字體的結構

  漢字種類頗多,字體的筆畫也有多有少,最少僅僅只有有一筆,最多的則會有三十多筆,而筆劃之間又存在大小、高低、長短、疏密的關系,同時按照空間結構又有上、中、下、左、中、右之分。

  

字體的結構

 

  筆畫的設計

  基本是在通用字形即字體結構基本成型無誤后,通過給筆畫增加符合字體本身的字義及性格的細節及修飾使字體變得豐富飽滿富有設計感。針對字體中點、橫、豎、撇、捺、勾、折、挑去進行設計及修飾。

  

筆畫的設計

 

  但一組字中如果橫的筆畫用了某種形式,那么其他的橫的筆畫都需要去保持這種形式,要保證特征的一致性,當然也有特殊情況,但絕大多數情況下都要把一致性放在首要的位置。

  

字體設計

 

  字體整體的調整

  整體的調整,就需要整體去看字體的效果,有可能某個字單看上去沒有問題,但組合到一起就看出一些問題,這個時候就需要以視覺為主去主觀的調整它,讓他看起來更加自然美觀,也可根據字形字義去做一些其他的修飾及效果使其更加的豐富飽滿。

  

Image title

 

  這次的分享理論上的東西就不說太多了,理論太多了的話,一些剛接觸字體設計的同學反而不好去理解,我們先去動手做,在實踐中檢驗問題。

  STEP 1

  選擇鋼筆工具勾勒筆畫,用鋼筆工具開始勾畫筆畫,筆畫走勢按照字體本身來,選擇描邊,粗細改為20,這個大家根據自己本身做的大小來調整,不是固定的數值。

  有些部分我們要做一些筆畫的變形,比如下面的心,如果我們按字庫本身的筆畫來就會顯的比較擠或者比較散,所有我們稍稍做些改變,筆畫的相連及省略在很多字體設計上都可以應用,注意字的重心,要往上一些,兩字重心要保持一致,繼續勾畫,有些地方較空,要用筆畫去補充,兩字的下半部分都是心字,如果這樣的話,會顯的字比較呆板,可把恩的下面的心對稱下,看下會不會影響識別,這個是前提,如果可以識別,那我們繼續往下。

  

Image title

 

  STEP 2

  通用字形做完我們復制一份,開始第二部調整,因為感恩,是去表達感情,是一種美好委婉的態度,所以我們字體可以選用圓潤一點的筆畫,我們選擇直接選擇工具然后選一下兩條線段的交點會有一個小白點,按住拖動就會有圓弧效果,也可雙擊出現輸入數值的彈框,可以輸入固定的數值,把所有的筆畫圓潤處理,相同筆畫部分數值盡量保持一致,也有特殊情況特殊處理,整體也要調整好,看著舒服美觀即可。

  

Image title

 

  STEP 3

  這一步主要是給筆畫增加符合字體本身的字義及性格的細節及修飾使字體變得豐富飽滿更有設計感。

  感恩從字義給我的感受是委婉美好的,所以在筆畫上圓潤,同時還要有些修長的筆畫來結合,所有我們對筆畫去進行設計。

  大家可以看視頻里我的操作,先選擇鋼筆工具,刪掉右下角端點的一個點,這樣修長的感覺大致出來了,然后通過鋼筆工具去具體調整,讓弧線更加流暢自然。

  

Image title

 

  STEP 4

  整體的筆畫基本上保持橫細豎粗,整體效果出來后字體有些方方正正,不太踏實,感恩應該是種比較踏實誠懇的感覺,所以將字體整體壓一下,這樣字體會變得更加穩定踏實。

  

Image title

 

  STEP 5

  最后一部就是添加一些字效及豐富一些小細節了,這里有個知識點就是動作功能的使用,在窗口里找到并打開動作面板,把兩字分別合并路徑,因為我們做的立體效果是對稱的。

  點擊感字,Ctrl+c,然后ctrl+f,這樣就是復制了一層在原圖上,底下還有一層,我們可以把最上方的圖層鎖住,利用底下的圖層去做立體效果,大家具體可看視頻操作。

  點擊動作面板的三角形創建新動作,然后我們開始錄制我們的動作,我們按著alt鍵,然后按一下向左的方向鍵和向下的方向鍵,其實這就是向左和向下復制的操作,然后我們點擊動作面板結束動作的按鈕結束錄制。

  

Image title

 

  選中剛剛復制在最上方的字,同時選擇我們剛剛錄好的動作,不斷點擊動作面板上的三角形按鈕,大概得到想要厚度即可,把所有復制的層合并路徑然后轉換為描邊,這樣大致的效果就出來了,恩字也是同理。

  

Image title

 

  STEP 6

  這一步需要進行一些細節的調整,選擇平滑工具,快速調整錨點,有些錨點需要去手動調整下,最后加上一些裝飾英文和圖案,這個大家可以根據畫面自由發揮。

  

Image title

 

  注意

  大家在拿到一個字體設計的需求的時候,第一步不是立馬去做,而是去考慮這個字本身的字意及他需要去應用的場景,他需要展示怎樣的性格,剛硬的,可愛的,溫柔的,搞笑的等等。第二部就需要去做字體基本的結構筆畫設計,也就是通用字形的設計,這一步比較重要,因為他是字體的骨骼,如果骨架沒搭好,后面給他再好的容顏(筆畫修飾)也不會有特別好的效果。第三步結合字體字意及性格做筆畫修飾及整體的調整。第四部就是去整體的調整或者加一些字效讓整體體看上去更豐富。

  后記

  第一次分享,不足之處還望小伙伴們多多包含,有一些建議或意見可以直接留言或告訴我,也希望大家能多多鼓勵,讓我有動力繼續分享,感恩感謝,我們下回再見!

  大家做的過程中有問題可以隨時私我,我看到了會第一時間回復~

上一篇:長春網頁設計學校_網頁設計過程中你要注意的12個問題
下一篇:長春UI設計能自學嗎?

美工設計干貨分享:幾種常見的字

美工設計干貨分享:幾種常見的字

長春網頁設計學校_網頁設計過程

長春網頁設計學校_網頁設計過程

長春UI設計學校_2018年春夏流行色

長春UI設計學校_2018年春夏流行色

怎么為你的產品選擇最合適的顏色

怎么為你的產品選擇最合適的顏色



色五月色开心色婷婷色丁香_色狠狠色婷婷丁香五月_国产婷婷综合在线视频