前言
你會(huì)花多少時(shí)間去為你的設(shè)計(jì)制作獨(dú)特和有創(chuàng)意的插圖?可能比你想象的要多很多。
Loopers可以讓你在設(shè)計(jì)原創(chuàng)插圖時(shí)減少繪圖時(shí)間。這個(gè)新的sketch插件允許你通過(guò)復(fù)制,移動(dòng),多次旋轉(zhuǎn)對(duì)象,制作獨(dú)特的形狀和圖案,生成有趣的插圖。
今天,我會(huì)展示怎樣在沒(méi)有繪圖基礎(chǔ)的情況下,用20s或者更少的時(shí)間,為你的app,banners,backgrounds制作精美的插圖。
為什么使用Looper?
我一直在研究使用不同的插件和應(yīng)用來(lái)幫助我設(shè)計(jì)原創(chuàng)插圖,我發(fā)現(xiàn)Looper最好用是因?yàn)樗茏屛以趲酌腌妱?chuàng)建復(fù)雜的和不同類型圖形,比如規(guī)則和不規(guī)則的圖案,背景,甚至商標(biāo)。

教程
1.Looper常規(guī)流程和提示
我們先從一個(gè)簡(jiǎn)單的形狀開(kāi)始使用looper,使用快捷鍵“CMD+L”或者通過(guò)頂部插件菜單“PLUGIN?>?LOOPER?>?LOOP”打開(kāi)“l(fā)oop”,你可以在圖層或組上使用looper。
如果你需要?jiǎng)?chuàng)建復(fù)雜或者大型的圖案,可能會(huì)花費(fèi)較長(zhǎng)的時(shí)間來(lái)進(jìn)行渲染。另外,可以使用鍵盤上下鍵來(lái)調(diào)整dupliaction,?scale等屬性的數(shù)值,同時(shí)按住shift鍵向上或向下,屬性值會(huì)以10為單位增加或減少。

2.抽象圖形

理解looper是如何工作的最好方法是創(chuàng)建完全抽象的圖形,使用鋼筆工具任意畫一個(gè)你喜歡的形狀,然后打開(kāi)loop(cmd+L),隨意設(shè)置一下屬性值。


你還可以用相同的方式,創(chuàng)建一張背景,給圖層增加一些漸變會(huì)出現(xiàn)一些很酷的效果。



3.簡(jiǎn)單圖案

Looper不僅可以生成抽象形狀,也是創(chuàng)建簡(jiǎn)單,創(chuàng)意或不規(guī)則圖案的理想選擇。在上面的實(shí)例子,我使用單個(gè)矩形來(lái)生成整個(gè)圖案。要構(gòu)建均勻分布的圖案,請(qǐng)使用Looper中的“Form?a?Grid”功能。我通過(guò)旋轉(zhuǎn)和不透明度變化任意排列圖案,10秒內(nèi)就形成了一個(gè)神奇的效果:



4.裝飾物

你還可以用Looper創(chuàng)造出完美比列的裝飾品。畫一條垂直或水平線,并在旁邊添加一些元素。我用一條線和一個(gè)圓創(chuàng)建了一個(gè)簡(jiǎn)單的例子。下面看看我通過(guò)更改副本數(shù)量創(chuàng)建了幾個(gè)不同的裝飾品。盡可能從最低的數(shù)字開(kāi)始來(lái)調(diào)整number?of?copies,逐一增加,保持這個(gè)好習(xí)慣,這樣你才能看到你的圖案是如何變化的。

注意我如何使用默認(rèn)的旋轉(zhuǎn)功能,并從兩個(gè)副本開(kāi)始。


5.3D效果

通過(guò)調(diào)整Sketch圖層樣式,還可以創(chuàng)建令人印象深刻的3D效果。制作3D圖形的關(guān)鍵是將一些漸變和陰影添加到起始形狀,并在“Move”功能中復(fù)制此形狀。旋轉(zhuǎn)和縮放在這里也有幫助:


6.粒子球

你可以通過(guò)復(fù)制單個(gè)點(diǎn)來(lái)構(gòu)建什么?首先,可以創(chuàng)建一個(gè)由粒子組成的球體。使用任意比例和不透明度生成大量點(diǎn)后,只需要在sktech中使用圓形進(jìn)行蒙版即可:


7.波浪效果
我們可以用一條直線做什么?通過(guò)將線沿著一個(gè)軸線移動(dòng)幾個(gè)像素并輕微的旋轉(zhuǎn),可以創(chuàng)建一個(gè)很酷的波形,如下例所示:



8.Tron?1982?–?Construction?Grids

(這個(gè)沒(méi)太理解,應(yīng)該是透視圖形之類的)通過(guò)復(fù)制兩個(gè)簡(jiǎn)單的形狀?:?一條線和一個(gè)矩形?,可以構(gòu)建透視網(wǎng)格:

你需要做的是在這些形狀上使用Looper兩次。首先,按比例增加百分比復(fù)制矩形。選中“update?opacity”,可以從0開(kāi)始增加“不透明度”功能中所有實(shí)例的不透明度。在第二步中,在默認(rèn)設(shè)置下復(fù)制帶有旋轉(zhuǎn)的線。



你可以使用透視網(wǎng)格創(chuàng)建其他3D插圖,如下例所示:


9.其他實(shí)例-Sydney
Looper給出無(wú)限的可能性來(lái)生成非常復(fù)雜的圖形。下面,我制作了三個(gè)可以帶給你靈感的實(shí)例,每個(gè)都有一個(gè)起始的形狀和制作它們所需的設(shè)置,方便你臨摹它們,或者在它們的基礎(chǔ)上制作屬于你的圖形。



10.Almost?Death?Star



11.Deep?Sea


作者信息:Wojciech Dobry
原文鏈接:https://www.toptal.com/designers/sketch/amazing-illustrations-with-sketch-and-looper