雷火平台-中国知名电竞赛事平台

聯(lián)系我們 face+ 關(guān)于 服務(wù) 案例
首頁 案例 服務(wù) 關(guān)于 face+

卡通UI設(shè)計步驟詳解,手把手教你做好設(shè)計

Time: 2020-01-14


近年來卡通UI的市場行情是非常不錯,越來越多的人也開始把目光轉(zhuǎn)向了卡通UI的設(shè)計,但是對于很多新手來說卻不知道要如何下手,下面我們跟隨小編一起來了解一下卡通UI設(shè)計的相關(guān)資料吧。


卡通UI設(shè)計步驟


步驟一、設(shè)計構(gòu)思

  再復(fù)雜的UI設(shè)計作品也要從簡單的開始,拿起你的鉛筆,畫出你想要的卡通造型。無論是做什么設(shè)計,肯定不可能空穴來風(fēng),憑空想像,特別是對自己不太熟悉的東西,所以千萬別忘了找參考素材哦!


  步驟二、草圖繪制

  新建AI文件把圖片置入到文件當(dāng)中。一定要點擊嵌入,規(guī)整的圖形思維,然后用鋼筆工具照著草圖描邊細化,注意描邊粗細的把握,大形體之間的描邊要粗,小形體之間的描邊要細一些,具體情況可自行斟酌,最后一點,對齊描邊選項一定是居外描邊、居外描邊、居外描邊,重要的事情說三遍!


1.jpg

(圖片來自網(wǎng)絡(luò))


  步驟三、初稿設(shè)計

  最重要的一步:輪廓勾勒。其實用的是 UI 繪制 icon 手法和思維。所以在輪廓勾勒的時候要注意:一定要用布爾運算!

  也就是說,凡是涉及到出線部分,一定是用各種圓疊加切割的,而不是用鉛筆工具勾勒 。鋼筆工具勾或放也可以,但這不是小魔女的插畫風(fēng)格~個人比較喜歡的是規(guī)整的圓,整齊的方。

  以稍微復(fù)雜一些的身體為例,它其實是由很多的圓形、橢圓形疊加而成的。最后一行的不規(guī)則形狀,其實是1/4圓。初稿設(shè)計的時候直充的顏色都只是大致的顏色,有一些回寫的色卡,一般都是先用這些顏色 ,之后再根據(jù)整個畫面重新去做調(diào)整。


  步驟四、上固有色

  這一步相對很簡單就是把白色填充改成不同的固有色就好,如果是為了印刷需要,那么CMYK的色值注意取5進制的整數(shù),對了還有鞋部的細節(jié),勾選虛線,加細節(jié)效果~


2.jpg

(圖片來自網(wǎng)絡(luò))


  步驟五、增加明暗

  雖然是矢量卡通形象,但是如果能加好明暗關(guān)系也能讓畫面更加豐富,如何加明暗呢?依胳膊這個局部為例子。

  第一步當(dāng)然是先要把暗部畫出來,超出胳膊部分的圖形可以隨意一些,反正一會兒也是要剪去的!

  第二步,把原有的胳膊CTRL+C復(fù)制,然后CTRL+C原位復(fù)制粘貼。

  第三步,同時選中胳膊和陰影部分選擇路徑查找器當(dāng)中的交集功能,打工搞成!

  如果我們之前的描邊對齊方式不是居外描邊而是居中就會有最后一圖的錯誤情況!所以切記!


  步驟六、大功告成

  造型已經(jīng)做好了,在加點文字和背景吧!大功告成!


3.png

(圖片來自網(wǎng)絡(luò))


  其實卡通UI設(shè)計在UI設(shè)計行業(yè)中還算是一種相對比較簡單的設(shè)計,所以大家如果有興趣的話可以選擇去嘗試一下,看看自己能否獨立完成設(shè)計哦!


合作咨詢

上海(總部)

上海市浦東新區(qū)郭守敬路498號22號樓
021-61057328
service@faceui.com

辦公地址地圖

北京

北京市東城區(qū)后永康17號A座
010-64015620
service@faceui.com

辦公地址地圖

成都

四川省成都市錦江區(qū)東大街牛王廟段100號
028-62790929
service@faceui.com

辦公地址地圖
首頁 | 案例 | 服務(wù) | 關(guān)于 | face+ | 智見

Copyright ? 2009-2022 FaceUI design. All rights reserved


滬ICP備13044459號-5

上海辦公地點地圖
北京辦公地點地圖
深圳辦公地點地圖
在微信中搜索faceui
或保存二維碼在微信中打開