Как сделать маску в инстаграме

Пошаговая инструкция: как создать свои маски для Insta-Stories.

Автор статьи: Алена Гейзер — дизайнер с опытом работы 15 лет, выпускница БВШД.
В своем блоге я пишу о дизайне, как для Instagram так и в общем. Делаю арт видео и иллюстрации.

После первых статей о масках Рианны и Уилла Смита я, как очень любопытный человек, начала искать способы приобщиться к этой технологии. На одном из англоязычных ресурсов я нашла упоминание AR среды фейсбука — SparkAR. https://www.sparkar.com/ar-studio/ Именно в этой программе создаются маски.

SparkAR позволяет добавлять:

● Спрайтовую анимацию (преобразованный gif)

● Эффекты камеры и света

● Реакцию на действия — например открылся рот и пошел снег

● Трекеры головы, рук и плоскости и еще много чего интересного.

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

Дисклеймер.
Статья была написана и опубликовано больше года назад.
С тех пор многое изменилось и появился более полный и подробный гайд по созданию масок в Instagram.

Spark AR работает в связке смартфона и компьютера, но на Windows и Android телефонах работает некорректно. Связка iPhone и Apple компьютеров предпочтительнее. Для смартфона надо так же установить приложение Spark — https://itunes.apple.com/ru/app/spark-ar-player/id1231451896?mt=8

Схема создания маски выглядит так:

1. Добавляете в SparkAR трекеры лица и нужные объекты
2. Соединяете смартфон и компьютер через usb
3. Нажимаете кнопку “Mirror” в программе на компьютере.

После этих манипуляций ваша маска будет доступна для тестирования на телефоне. Тестировать маску обязательно, так как многие косяки видно только в живую. К тому же, если маска работает плохо, она может не пройти модерацию Facebook. Еще один повод провалить модерацию — добавить в маску логотип или текст. Несколько моих масок были отклонены именно по этой причине.

Самую простую маску можно сделать всего несколькими манипуляциями с помощью создания текстуры в режиме Face Paint. В этом режиме отдельный рисунок так накладывается на ваше лицо, что выглядит как боди арт. Таким способом можно создавать макияж, татуировки, усы и тд.

Вот тут можете найти уроки по созданию масок, начиная от самого простого и первого и дальше.

Для создания более сложных масок вам могут потребоваться 3d объекты. Некоторые из них можно импортировать из встроенной AR библиотеки.

Все подробности создания масок я описывать не буду, они гораздо лучше рассказаны на сайте Spark https://www.sparkar.com/ar-studio/learn

Когда ваша маска готова, вы можете загрузить ее в Facebook. Для загрузки в Instagram вам потребуется статус бета тестера, о нем я расскажу чуть позже.

Загрузка маски происходит в специальном разделе Facebook https://www.facebook.com/fbcameraeffects/manage/

Вам необходимо:

● Экспортировать маску из программы

● Создать иконку превью 480х480px

● Придумать описание эффекта и схему его работы

● Загрузить превью работы маски. Видео превью можно сделать из приложения Spark на телефоне.

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

Загружать маски в Instagram могут только авторизованные партнеры и бета тестеры.

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

После присвоении статуса бета тестера, в том же интерфейсе на Facebook появится возможность загрузки в Instagram. Схема загрузки и требования практически не отличаются от выше описанных. Разница только в оформлении аватарки эффекта. Она должна быть выполнена по специальному шаблону.

После модерации маска появится в сториз у вас и всех ваших подписчиков автоматически.

Что дает создание собственных масок?

Каждый раз, когда пользователи будут использовать вашу маску, в углу сториз будет гореть ваше имя со ссылкой на аккаунт. Другие зрители смогут перейти на ваш аккаунт по клику на ваше имя. Каждый сториз с вашей маской станет для вас рекламным упоминанием.

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

Примерить вашу маску сможет каждый пользователь Instagram. После одного использования маска сохранится в списке всех масок истории.

Статистику по загруженным маскам для Facebook посмотреть нельзя. Для масок загруженных в Instagram после одобрения появляется пункт “Результативность” в котором можно посмотреть число раз, когда эффект показывался на экране. В том числе когда пользователь пробовал эффект в камере, а также когда эффект показывался в истории.

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

За первый день использования маски ее попробовали — 40 330 человек

Подписалось на меня + 15-20 человек

Статистика взаимодействий с аккаунтом + 300

Фактический эффект масок пока не такой волшебный, как я ожидала. Но я верю, что в долгосрочной перспективе этот инструмент принесет свои плоды.

Лучший блог про Instagram в социальных сетях. Подписался на свежие статьи?

Как сделать свою маску в Instagram? (часть 1)

В последнее время маски в сториз Instagram и Facebook становятся все популярней. Хотите начать создавать свои?
Я подробно расскажу вам как это сделать !

Долгое время я с капелькой зависти смотрела на других разработчиков, их маски и быстро растущие растущие аккаунты. Я тоже хотела создавать! В моей голове было просто тысяча и одна идея новых масок!
Но все упиралось в одно ” НО” . Маски можно было создавать только на Mac OS.
Но этим летом к великой радости, таких же пользователей как я, Spark наконец открыл возможность и для владельцев Винды!
Так что теперь маски могут создавать все!

Итак, пошаговая инструкция!

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

Сделать это можно по этой ссылке для бета-тестеров,
или по этой ссылке для альфа-тестеров (только для win 10, но многие функции не работают)

Так как заявок подается сейчас о-о-о-очень много, ее принятие может иногда затянуться . Некоторые тестеры говорят, что ждали всего пару дней, другие говорят о нескольких месяцах.
Иногда заявки отклоняют (но можно подать заново).
(Главное, чтобы ваши аккаунты в Instagram и facebook были связаны.)

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

И у вас появится свой “кабинет” для загрузки масок на фейсбук и инстаграм: https://www.facebook.com/sparkarhub/

Увы, без этого кабинета, вы не сможете загружать маски, от своего лица, чтобы ваши подписчики ими пользовались. (или загружать купленные у других разработчиков маски, созданные на заказ специально для вас).
Но во время этого ожидания у вас будет достаточно времени, чтобы разобраться в самой программе, и создать свои первые маски (об этом я рассказываю в этой статье )

2. Скачиваем программу для создания масок Spark AR
Переходим по этой ссылке и скачиваем программу для своей операционной системы

А так же не забываем, загрузить эту программу на свой телефон (по соответствующей ссылке ниже) . С помощью него вы сможете тестировать вашу маску на себе, перед тем как “выкатывать” ее для остальных пользователей.

С помощью Spark AR вы можете создавать различные эффекты, добавляя в маску 3д-объекты, надписи, ретушь, световые эффекты, анимацию, реакцию на действия пользователя и т.д.

Вот так выглядит оболочка программы Spark AR:

На первый взгляд, кажется – сам черт ногу сломит! Но ее создатели (и сам facebook) предусмотрели бесплатное обучение основам создания масок .

По этой и этой ссылке вы найдете огромное количество пошаговых уроков, объясняющих принцип работы Spark. Часть из них видео-уроки, часть пошаговые инструкции. Всё расписано достаточно подробно и если уделить должное количество времени, вы 100% разберетесь. По крайней мере, в простых эффектах – точно 🙂
Кстати, все материалы на английском языке.
(Те кто с языком не очень дружен, могут поступить как я, читать статьи с яндекс.браузера со встроенным переводчиком страниц).
А так же, есть уже достаточно много видео с созданием масок на ютюб.

Вот так выглядит в Spark одна из моих масок “Баба Яга”, от которой просто в восторге дети :)))

После того как вам одобрят заявку бета-разработчика и вы создадите свою первую маску (например такую) , вам нужно загрузить ее в свой кабинет на фейсбуке.

Как это сделать читайте в следующей статье .

UPD/ инстаграм выпустил обновление. Теперь регистрироваться на бета-тестера не нужно. просто заходите в свой кабинет и загружаете маски)

Чтобы не пропустить выход новых публикаций, подписывайтесь на мой канал 🙂

Как создать маску в инстаграм самому?

Создать простую маску в инстаграм можно достаточно легко. Но есть и более сложные маски с 3d анимацией, на создание которых уйдет масса времени.

Для начала, я советую создать простенькую маску чтобы пройти модерацию в фейсбук. После того как модерация маски будет пройдена, необходимо будет подать заявку в инстаграм на получение доступа к публикации масок.

Приложение для создания масок в Instagram

Для создания масок в инстаграме используют приложение Spark AR Studio. Скачать его можно на официальном сайте. В него можно добавлять:

1. 2d обьекты, размещая их в плоскостях привязанных к поверхности лица
2. 3d обьекты, привязывая их к лицу либо рукам
3. Маски для лица, которые покроют лицо. Ушки или обьемные элементы с помощью этого метода сделать не получится.

Помимо добавления обьектов в Spark AR Studio можно добавлять анимации и реакции на действия человека.

Процесс создания маски на лицо в Instagram

Сперва необходимо скачать сетку лица из примеров в документации. Вы можете скачать его ниже:

На сетке красным обозначены точки, за которыми наблюдает программа. Это границы области маски. То есть мы можем рисовать на всем лице, не заходя за пределы обозначенные красными точками.

Алгоритм рисования маски

1. Открываем фотошоп
2. Вставляем в нижний слой сетку с красными точками
3. Рисуем маску на слое выше
4. Убираем нижний слой и сохраняем готовую маску

Наложение маски на лицо

• Открываем Spark AR Studio
• Нажимаем Add Object
• Выбираем Face Tracker
• Щелкаем правой кнопкой мыши по появившемуся в дереве обьекту faceTracker0
• Выбираем Face Mesh
• Должно получиться так:

• Выделяем обьект Face Mesh
• Нажимаем в правой панели на плюсик в Materials
• В левой панели Assets появится новый материал – выделяем его
• В правой панели выбираем в Texture файл маски

Публикация и тестирование масок для инстаграм

После наложения маски, ее необходимо проверить:

1. Подключаем телефон по проводу к компьютеру
2. Скачиваем на телефоне программу AR Player
3. Запускаем AR Player на телефоне
4. На компьютере в программе Spark AR Studio в нижнем левом меню нажимаем на верхнюю иконку Send To Device.

После успешного тестирования экспортируем проект на фейсбук с помощью кнопки “Export”.

Как сделать маску в инстаграм в 3D?

Можно воспользоваться встроенной в Spark AR Studio библиотекой 3D объектов. Для того чтобы открыть эту библиотеку нужно воспользоваться левым нижним меню.

Если вам нужен свой обьект то вам понадобится дополнительная программа для редактирования 3D обьектов. Самая удобная на мой взгляд – это Blender. На официальном сайте есть подробная инструкция как создавать 3D объекты для масок.

Для добавления 3D обьекта привзяанного к лицу необходимо:

• Создаем Face Tracker по инструкции выше
• Привязываем к нему 3D object

Как загрузить маску в инстаграм?

Для загрузки маски в инстаграм вам потребуется привязать аккаунт фейсбука к инстаграму. Если у вас уже связаны аккаунты, то переходим по ссылке https://www.facebook.com/sparkarhub/ . Справа сверху кликаем на синюю кнопку “Загрузить эффект” и следуем инструкциям.

Как видите – создать маску для инстаграм достаточно просто. Если у вас будут вопросы – обращайтесь!

Источники:

https://dnative.ru/poshagovaya-instruktsiya-kak-sozdat-svoi-maski-dlya-insta-stories/
https://zen.yandex.ru/media/id/5bbb497424792200aa7765dc/5d356f3435c8d800adc8e3bf
https://mazurinv.ru/instagram-mask-create/