![](http://habrastorage.org/getpro/habr/avatars/736/2f0/15e/7362f015e9a1387cddef7de2a4419781.jpg)
Looper - Plugin for Sketch
- Tutorial
Looper generates patterns . With Looper, I make backgrounds. The pattern is generated by repeated duplication of the workpiece with changes from copy to copy. Any piece or combination thereof can be a blank.
![](https://habrastorage.org/webt/ve/5m/qq/ve5mqqmtrovsqxnse53fs0wwdpw.png)
Take a look at the short video how it works with the plugin.
Looper is a plugin for Sketch . If you don’t have a paid version, do not worry - Sketch is available for free for 30 days without any functional limitations. Looper is completely free :
![](https://habrastorage.org/webt/lv/e_/d_/lve_d_t8uzo3pcepyz1l6uvhny4.jpeg)
Download the plugin and open the installation file. Sketch will do everything himself. Create a new project, Looper appears in the Plugins menu . The CMD + L keyboard shortcut launches the plugin. If you are in the XVIII century, then you can run from the panel.
Let's make a blank. Create a new Artboard , add a background. I will set the gradient with colors # 5581F1 - # 1153FC:
![](https://habrastorage.org/webt/fn/oa/a9/fnoaa9moyeasl129cg-nwux_iou.png)
Press the O button and draw a small circle. For users of the 18th century, a button on the panel is available. If you are from XXI - get used to keyboard shortcuts. Remove the fill and set the stroke color to white. Change the shape: double-click on the shape to enter edit mode. Shape changes will make the result more spectacular. My blank looks like this:
![](https://habrastorage.org/webt/rb/dv/_a/rbdv_awyzx2zlxg62jsxwcmvwqw.png)
We call the plugin using CMD + L. Already remember the combination? A window opens with the settings for generating the pattern:
![](https://habrastorage.org/webt/3t/bj/2l/3tbj2l6hza-ryzwdk-garqwrhnk.png)
Consider the parameters:
Working with Looper is a combination of settings. Draw an object without filling, with a stroke and without sharp corners. I use the oval, each time changing the shape:
![](https://habrastorage.org/webt/x4/i2/tm/x4i2tmnpct6t1hsipnclnpqfk_i.png)
Select the workpiece and call the Looper control panel. For Duplication count, install 25 pcs. Scale along two axes with a magnification of 5px. For Move - horizontal mode and an offset of 10 pixels. To add life, set a linear Rotate with an angle of 7 (range from 1 to 359). For volume I set the transparency from 0 to 100.
The panel will look like this:
![](https://habrastorage.org/webt/tj/el/8k/tjel8kvo_cswwfeakrvotiyoqno.png)
All changes are immediately displayed on the Artboard . To see the intermediate result, the settings window will have to be moved. Apply settings:
![](https://habrastorage.org/webt/uu/cz/zm/uuczzmk2uh1pzbkwlaekujtu9ck.png)
For the workpiece, you can use the gradient. Add it using the previous scheme:
![](https://habrastorage.org/webt/vy/hf/nd/vyhfndnjg46as1aj8ndxpjr6hem.png)
Looper works with any objects . You can use several shapes:
![](https://habrastorage.org/webt/3u/pp/eh/3uppehhxoy7wht4xzbwx0bpjfl4.png)
The more complex the form, the more time it takes to set up. Avoid clusters of spears and minced flowers . If the result does not look very, simplify the workpiece.
More examples can be found on the project page .
If it’s more convenient to watch the video, I recorded a tutorial on YouTube:
As an afterword, I warn you - working with Looper is not creativity . Looper makes a pattern from the blank, and likes the patterns because of systematization and recognition. There is little artistic in this.
![](https://habrastorage.org/webt/ve/5m/qq/ve5mqqmtrovsqxnse53fs0wwdpw.png)
Take a look at the short video how it works with the plugin.
Looper is a plugin for Sketch . If you don’t have a paid version, do not worry - Sketch is available for free for 30 days without any functional limitations. Looper is completely free :
![](https://habrastorage.org/webt/lv/e_/d_/lve_d_t8uzo3pcepyz1l6uvhny4.jpeg)
Installation
Download the plugin and open the installation file. Sketch will do everything himself. Create a new project, Looper appears in the Plugins menu . The CMD + L keyboard shortcut launches the plugin. If you are in the XVIII century, then you can run from the panel.
Instruments
Let's make a blank. Create a new Artboard , add a background. I will set the gradient with colors # 5581F1 - # 1153FC:
![](https://habrastorage.org/webt/fn/oa/a9/fnoaa9moyeasl129cg-nwux_iou.png)
Press the O button and draw a small circle. For users of the 18th century, a button on the panel is available. If you are from XXI - get used to keyboard shortcuts. Remove the fill and set the stroke color to white. Change the shape: double-click on the shape to enter edit mode. Shape changes will make the result more spectacular. My blank looks like this:
![](https://habrastorage.org/webt/rb/dv/_a/rbdv_awyzx2zlxg62jsxwcmvwqw.png)
We call the plugin using CMD + L. Already remember the combination? A window opens with the settings for generating the pattern:
![](https://habrastorage.org/webt/3t/bj/2l/3tbj2l6hza-ryzwdk-garqwrhnk.png)
Consider the parameters:
- Duplication count is responsible for the number of duplicated elements. A good result in the range of 10-30 pieces.
- Scale increases the size of the last elements. You can stick together on X and Y or on each axis separately. You can set the scale in pixels or percent.
- Move moves objects vertically, horizontally, diagonally and randomly. The distance is specified in pixels.
- Form a grid creates a grid. Indentation and layout for elements are set. I rarely use this tool.
- Rotate set manually. Auto mode works weird. If you have Move in the direction - use linear mode. If you want symmetry from the center, use a sinusoidal one.
- Cool tool Update opacity - changes transparency. I set the linear from 0 to 100 to create volume. Sometimes random mode may come in handy.
Customization
Working with Looper is a combination of settings. Draw an object without filling, with a stroke and without sharp corners. I use the oval, each time changing the shape:
![](https://habrastorage.org/webt/x4/i2/tm/x4i2tmnpct6t1hsipnclnpqfk_i.png)
Select the workpiece and call the Looper control panel. For Duplication count, install 25 pcs. Scale along two axes with a magnification of 5px. For Move - horizontal mode and an offset of 10 pixels. To add life, set a linear Rotate with an angle of 7 (range from 1 to 359). For volume I set the transparency from 0 to 100.
The panel will look like this:
![](https://habrastorage.org/webt/tj/el/8k/tjel8kvo_cswwfeakrvotiyoqno.png)
All changes are immediately displayed on the Artboard . To see the intermediate result, the settings window will have to be moved. Apply settings:
![](https://habrastorage.org/webt/uu/cz/zm/uuczzmk2uh1pzbkwlaekujtu9ck.png)
For the workpiece, you can use the gradient. Add it using the previous scheme:
![](https://habrastorage.org/webt/vy/hf/nd/vyhfndnjg46as1aj8ndxpjr6hem.png)
Looper works with any objects . You can use several shapes:
![](https://habrastorage.org/webt/3u/pp/eh/3uppehhxoy7wht4xzbwx0bpjfl4.png)
The more complex the form, the more time it takes to set up. Avoid clusters of spears and minced flowers . If the result does not look very, simplify the workpiece.
More examples can be found on the project page .
For seekers
If it’s more convenient to watch the video, I recorded a tutorial on YouTube:
Caution
As an afterword, I warn you - working with Looper is not creativity . Looper makes a pattern from the blank, and likes the patterns because of systematization and recognition. There is little artistic in this.