本期帶來的是2.5D插畫的小教程教程,2.5D插畫設計風格,已經越來越多的出現我們的UI設計中,H5動畫、APP閃屏 、廣告banner、ICON等等,那我們來看看2.5D到底是什么樣的風格。
好了,看到這里,不知道有木有小心動,畫之前還是來了解一下, 2.5D插畫風格特點。
2.5D插畫風格特點
透視:和傳統美術中的近大遠小的透視原理不同,2.5D的透視是同一方向的兩條線是平行、永不相交的;常見的2.5D圖形,以透視的正方形為例,其底邊與視平線的夾角是30度。
色彩:色彩特點是明快、色彩豐富
想畫好2.5D插畫也不難,學好我這個方法,加上勤動手就可以~好了,閑話不多說!
本次教程最終效果圖:
為了方便教程,設計稿略過了草圖,為了方便大家學習,在Illustrator 中做好了設計圖,現在只要二維畫面轉2.5D即可,設計稿如下:
使用工具和方法
使用工具:Illustrator
方法:繪制2.5網格做參考線配合使用 效果- 3D - 凸出和斜角
畫之前了,我們需要打開Illustrator,做兩個設置,在Illustrator里,將 - 視圖菜單欄里,勾選 - 智能參考線,確保關閉- 對齊點 ,如下圖:
設置完,接下來就要繪制2.5D的網格參考線了,步驟如下:
Step1:通過鋼筆工具,在繪制好的網格上,勾出游戲機的基礎型,勾勒形狀要對準參考線,將游戲機身基本型繪制出,并上色。
Step2:繪制屏幕,打開 -效果 -3D -凸出和斜角,角度分別是:45°、-35°、30°,勾選預覽,如下:
Step3:繪制游戲方向鍵,角度設置同上個步驟,勾選凸出厚度8pt,接下來,在菜單欄選擇:對象-擴展外觀,右鍵取消編組,得到相應的形狀,需要對相應形狀進行聯集合并,由于生成3D后,形狀顏色會變暗,所以需要重新上色,效果如圖:
Step4:剩余的部件,可依次使用該方法調整,給出按鍵必要的厚度,調整顏色,組合起來:
游戲機組合完效果:
Step5: 文字部分依舊使用相同方法,,角度分別是:45°、-35°、30°,給出凸出厚度,調整顏色:
Step6:完善其他的裝飾物,組合畫面:
最后加上一些陰影關系,讓畫面更立體,加上一些后期文字,就大工告成啦!
當然最后效果圖,還是以最終畫面的呈現效果來適當修改優化的,最后呈現:
本期小教程就到這里了,希望大家喜歡。