Найти в Дзене

Как создать маску рандомайзер в Инстаграм в 2022 году

Открываем Spark AR Studio
Открываем Spark AR Studio
Скачайте Spark AR Studio и начинайте создавать эффекты | Spark AR Studio

Выбираем "Sharing Experience" - этот тип фильтра для инстаграм и фейсбук платформы.

Вид программы
Вид программы

Нажимаем вверху "View > Show Patch Editor" - чтобы мы смогли построить логику маски.

Нажимаем правой кнопкой мыши на "Focal Distance > Add Object" и выбираем "FaceTracker", а в FaceTracker создаём 2 Plane
Нажимаем правой кнопкой мыши на "Focal Distance > Add Object" и выбираем "FaceTracker", а в FaceTracker создаём 2 Plane

FaceTracker - используется для привязки объектов к лицу.

Два Plane нам понадобятся для:
1 - для стартового вопроса;
2 - для рандома и ответа.
Вот что получилось, далее у каждого Plane нажимаем справа, где "Materials" кнопку +
Вот что получилось, далее у каждого Plane нажимаем справа, где "Materials" кнопку +
Теперь в "Assets" у нас 2 материала
Теперь в "Assets" у нас 2 материала
У каждого материала выбираем справа "Shader Type" = Flat, чтобы объект не зависел от источников света в сцене
У каждого материала выбираем справа "Shader Type" = Flat, чтобы объект не зависел от источников света в сцене

Примеры текстур по уроку вы можете скачать в нашем телеграм канале

Переносим стартовую текстуру "000.png" в проект и справа 3 раза выбираем "None" - отключаем компрессию.
Переносим стартовую текстуру "000.png" в проект и справа 3 раза выбираем "None" - отключаем компрессию.
Нажимаем + и выбираем "Animaton Sequence" - чтобы внести анимацию рандомайзера
Нажимаем + и выбираем "Animaton Sequence" - чтобы внести анимацию рандомайзера
Нажимаем выбрать файлы и выбираем все изображения рандома
Нажимаем выбрать файлы и выбираем все изображения рандома
В компрессии также ставим "None" 3 раза (в трёх списках)
В компрессии также ставим "None" 3 раза (в трёх списках)

Теперь назначаем каждому материалу текстуры

Для первого материала, он же принадлежит первому Plane выбираем стартовую текстуру, а для второго анимацию секвенцию
Для первого материала, он же принадлежит первому Plane выбираем стартовую текстуру, а для второго анимацию секвенцию

Теперь для удобства контроля размеров Plane и их расположений создадим нулевой объект - он сделает группировку Plane

-12
Обратите внимание на иерархию
Обратите внимание на иерархию
Меняем расположение и размер "Null Object"
Меняем расположение и размер "Null Object"

Далее остаётся настроить логику в патчах.
Перетягиваем "
Camera" - находится сверху слева, на патч редактор

Система патчей получается следующей
Система патчей получается следующей

Сейчас для теста подключаем "Screen Tap" и на демовидео нажимаем "Simulate Touch". Можем нажать на демовидео и увидим эффект рандомайзера.

Visible Plane выносится вот таким образом
Visible Plane выносится вот таким образом
Конкретный кадр анимации также выносится на патч редактор
Конкретный кадр анимации также выносится на патч редактор

По схеме:

Камера начинает съёмку > пульс (передача импульса) > Delay - это задержка в секундах, 1 секунда чтобы был виден вопрос в заснятой истории, а через 3 сек будет результат.

Switch - это переключатель, мы переключаем видимость Plane(ов), где "Not" - это отрицание, то есть наоборот.

Loop animation - цикличная анимация кадров, присоединено к патчу рандома, где первое значение должно стоять 0, а второе = количеству картинок в рандоме.

Round округляет значение до целого числа в меньшую сторону.

А для старта рандомайзеора при записи видео в Инстаграм, переподключаем вот так
А для старта рандомайзеора при записи видео в Инстаграм, переподключаем вот так

Готово) а в заключении:

Как добавить подсказку - видео на моём YouTube
Чат разработчиков по Spark AR - присоединяйся
Паблик ВК Spark AR - много полезностей

Заказать маску в Инстаграм