當前位置:
首頁 > 天下 > 一鍵解鎖時下流行的2.5D商業插畫

一鍵解鎖時下流行的2.5D商業插畫

大家好,我是沉迷4399小遊戲不能自拔的韓彆扭。作為模擬人生,大富翁以及4399經營類小遊戲的忠實粉絲,我今天將用我的滑鼠為手殘不會畫畫的小夥伴們實現用滑鼠就能原創出來的2.5D插畫的美好願望。

知識重點:等距網格以及3D效果的使用

操作工具:滑鼠 |Adobe illustrator

操作難度:我的教程能有什麼難度?

工作室最年輕的00後弟弟清空(沒錯,才19歲)看完這張圖,覺得用C4D建成模簡直so easy,所以花了一天時間把它做了出來,不愧是全工作室最快的男人。(波哥發出一聲長嘆,年紀輕輕就這麼快,可如何是好!)

(此處應有掌聲)

2.5D,是介於2D和3D之間的一種視角。說起2.5D大家最熟悉的肯定就是《紀念碑谷》。紀念碑谷利用了等距透視的局限性產生的矛盾空間,大大增強了其趣味性。

* 圖片來自網路

除了紀念碑谷,還有大富翁,部落衝突等都屬於2.5D的範疇。

* 圖片來自網路

2.5D除了用在遊戲設計上,近兩年也被廣泛用于海報,網頁,H5頁面,運營活動等等。

* 圖片來自網路

當然,除了商業上的應用,2.5D還能呈現一種趣味性的表達。

滑動查看更多圖片

* 圖片來自網路

鑒於我從小就瘋狂熱愛4399小遊戲經營做飯類遊戲,所以為了滿足一己私慾,我擅自把這次教程的主題定為「彆扭美食廣場」。

作為美食廣場的老闆,我經營著咖啡館,披薩店,蛋糕店,壽司店,糖果店,冰淇淋店,雜貨鋪等等(彷彿達到了人生的頂峰!想想就有點小興奮)。

2.5D插畫常用的製作方式有兩種。一種是ai自帶的3D工具,另外一種是網格製作法。兩種都有各自的優缺點。

3D工具

3D工具作為ai自帶的效果,使用起來十分的方便,用平面圖就可以直接搞定,比如,你畫一個正方形,一鍵就可以變成正方體。

同樣你也能使用其它形狀做出帶體積的物體。但是這個方法也有他的局限性,對一些非常規的形態,如三稜錐,不規則的柱體,都不能很好的實現。

網格製作

網格作為參考線,相當於要一筆一筆的去勾畫,但是這種方式比較不局限你的思維,同時也能製作出非常規的形態,比如茶杯,紙杯蛋糕,冰淇淋等等。網格不同於3D工具的一鍵操作,也需要自己去製作網格。

首先打開AI軟體,新建一個文件尺寸,尺寸大小自定。然後選擇工具欄中的直線工具,按住SHIFT鍵,畫出一條垂直的線條。

然後打開【效果】菜單,有一個【扭曲和變換】,點擊【變換】,水平設置間距為10,數量設置為50。這邊的間距和數量可以根據自己的需求調整。

接下來選擇【對象】—【擴展】,將我們的線條擴展外觀。

選中剛才做好的直線,【滑鼠右鍵】-【旋轉】,輸入60度,點擊複製。

用快捷鍵【CTRL D】,就將剛才的圖再複製一個並且旋轉60度。並適當放大。這樣就做出了三組線條圖,我們的網格參考線也就完成了。

以冰淇淋店為例。

基礎模型製作

底盤的繪製:用形狀工具畫一個圓角矩形,點擊圓角矩形,使用【效果】-【3d工具】。【位置】選擇【等角上方】,【凸出厚度】選擇29pt,【表面】選擇塑料效果底紋。

接下來,我們把地盤轉化為線稿,頂部可以直接選擇白底,描邊,描邊粗細先統一定在0.5mm。

冰淇淋店的繪製:可以發現,冰淇淋的建築主要是由四個長方體組成的。所以這裡也同樣可以使用上面的步驟進行製作。

我們得到幾個長方體之後就可以像玩樂高一樣隨意組合啦。

細節製作

我們給這個建築製作一些窗戶,門和細節。

這個時候我們的網格參考線就可以用上了。將網格置於底層,透明度可以適當降低,然後鎖定。

在建築的牆面沿著網格製作窗戶和樓梯。

TIPS:只需要勾出看的到的部分就可以。例如門的位置有一部分是被遮擋的,那就不需要勾出來。

小道具及雨篷的製作

路障的製作:我們可以百度搜索一下路障一般都長什麼樣。可以看到,路障的底座就是一個正方體,可以用3D工具做出來。那麼頂部是一個接近於圓錐的結構,也就是底部是一個圓,上面是一個三角形的結構。

TIPS:帶透視的圓可以通過3D工具直接做出來,凸出厚度選擇0就可以。

雨蓬的製作:

冰淇淋店使用了兩種方式的雨篷,第一種可以使用3D工具製作出來。

首先畫一個四分之一圓,然後使用3D工具做出其中一塊雨篷,然後複製拼湊就可以啦。

另外一種雨篷因為沒有厚度,且角度傾斜,就需要使用網格墊底勾出來。只需要橫線部分對齊網格就可以啦。製作完之後,我們就可以把兩個雨篷都拼到建築上,原則就是放在屋檐上和窗戶上。

冰淇淋招牌製作

冰淇淋甜筒也是一樣,我們要先百度一下甜筒到底長啥樣。再開始分析它的結構。正常的甜筒就是一個上下大小不一的圓柱加上一個球。

畫完甜筒之後,把甜筒放在建築上,為了使這個冰淇淋不那麼生硬的放在屋頂上,我們可以適當做一些融化感的線條上去,再加上一些糖霜的裝飾。

TIPS:所有完成之後,調整整體描邊的粗細,基本原則以由外向內遞減原則。當然也可以在繪製過程中去調整

確定一個描邊色,以及1-2個主色,為冰淇淋店進行上色。

TIPS:顏色不要太多,要在同一個色系內。

為了豐富細節,我們可以將玻璃窗戶的質感繪製出來。

在窗戶上加一面白色,透明度調低至58%,再在上面繪製兩條高光,透明度調低至72%。

那麼,冰淇淋店就完成了,其他的店鋪也是一樣的方法去製作哦。其實建築大多可以用幾何去拼湊,就像玩樂高一樣。雖然貧窮限制了我買樂高,但是沒有限制我畫畫的快樂。

那麼今天的教程就到這裡結束了,是不是很容易呀,大家也和我一起來做自己的小建築吧。

-------------------------

往期精華文章導讀:

雜誌風!好看到沒朋友!

發布了!一款免費字型檔的誕生!

搞定聖誕設計,看這一篇就夠了!

-END-

越努力,越幸運。

這裡是龐門正道。

喜歡這篇文章嗎?立刻分享出去讓更多人知道吧!


請您繼續閱讀更多來自 龐門正道 的精彩文章:

英文如何設計成LOGO?
美女,你開個美妝直播咋樣?