Looper генерирует паттерны. С помощью Looper я делаю фоны. Паттерн генерируется многократным дублированием заготовки с изменениями от копии к копии. Заготовкой может любая фигура или их комбинация.



Гляньте короткое видео, как работает с плагин.

Looper — это плагин для Sketch. Если у вас нет платной версии, не расстраивайтесь — Sketch доступен бесплатно 30-дней без ограничения функционала. А вот Looper бесплатный совсем:

Установка

Скачайте плагин и откройте установочный файл. Sketch всё сделает сам. Создайте новый проект, в меню Plugins появится Looper. Сочетание клавиш CMD + L запускает плагин. Если вы в XVIII веке, то запускать можно из панели.

Инструменты

Сделаем заготовку. Создайте новый Artboard, добавьте фон. Я установлю градиент с цветами #5581F1 — #1153FC:



Нажмите кнопку O и нарисуйте небольшой круг. Для пользователей XVIII века доступна кнопка на панели. Если вы из XXI — приучайтесь к быстрым клавишам. Уберите заливку и установите белый цвет обводки. Изменим форму: кликните два раза на фигуру, чтобы перейти в режим редактирования. Изменения формы сделают результат эффектнее. Моя заготовка выглядит так:



Вызываем c помощью CMD + L плагин. Уже запомнили комбинацию? Откроется окно с настройками для генерации паттерна:



Рассмотрим параметры:

• Duplication count отвечает за количество дублированных элементов. Хороший результат в диапазоне 10-30 штук.
• Scale увеличивает размер последних элементов. Скейлить можно по X и Y или по каждой оси отдельно. Задать скейл можно в пикселях или процентах.
• Move двигает объекты вертикально, горизонтально, диагонально и рандомно. Расстояние задается в пикселях.
• Form a grid создает сетку. Задаются отступы и лейаут для элементов. Этот инструмент я использую редко.
• Rotate задавайте вручную. Авто-режим работает странно. Если у вас Move по направлению — используйте линейный режим. Если хотите симметрию от центра — используйте синусоидальный.
• Крутой инструмент Update opacity — изменяет прозрачность. Я выставляю линейную от 0 до 100 для создания объема. Иногда может пригодится случайный режим.

Настройка

Работа с Looper заключается в комбинировании настроек. Нарисуем объект без заливки, с обводкой и без острых углов. Я использую овал, каждый раз изменяя форму:



Выделяем заготовку и вызываем панель управления Looper. Для Duplication count установим 25 шт. Scale по двум осям с увеличением в 5px. Для Move — горизонтальный режим и смещение 10 пикселей. Чтобы добавить жизни, установим линейный Rotate с углом 7 (диапазон от 1 до 359). Для объема уставлю прозрачность от 0 до 100.

Панель будет выглядеть так:


Все изменения сразу отображаются на Artboard. Чтобы увидеть промежуточный результат, окно настроек придется двигать. Примените настройки:



Для заготовки можно использовать градиент. Добавим его, используя предыдущую схему:



Looper работает с любыми объектами. Можно использовать несколько фигур:



Чем сложнее форма, тем больше нужно времени на настройку. Избегайте скоплений копий и фарша цветов. Если результат выглядит не очень, упростите заготовку.

Больше примеров можно найти на странице проекта.

Для ищущих

Если удобнее смотреть видео, я записал туториал на YouTube:

Осторожно

В качестве послесловия предостерегаю — работа с Looper не творчество. Looper из заготовки делает паттерн, а паттерны нравятся из-за систематизации и узнаваемости. Художественного в этом мало.