spark ar hub что это
AR-креаторы: зарождение новой профессии
В августе этого года на свет появилась новая профессия. А все потому, что Facebook вывел из бета версии Spark AR — платформу для создания масок для Instagram и Facebook. Так получилось, что я оказался в водовороте процесса становления этой профессии и сам стал AR-креатором. В статье расскажу о ценах на маски и самых ярких историях успеха креаторов.
Не буду брать в расчет, что все это движение зародилось в недрах Snapchat, но именно фейсбук сделает эту технологию массовой.
Предыстория создания Spark AR
Spark AR появился на свет благодаря белорусской команде MSQRD, которые несколько лет назад нашумели своим приложением. В то время их купил Facebook. Уже внутри корпорации команда работала над тем, чтобы встроить свою технологию в продукты FB. Итогом этой работы стала сама платформа Spark AR.
Слышали про людей, которые на масках в инстаграм подняли по несколько миллионов подписчиков за несколько месяцев? Поезд этого тренда уже разгоняется. И сейчас есть шанс в него запрыгнуть 2D и 3D дизайнерам, JavaScript программистам, иллюстраторам и всем тем, кто связан с цифровым искусством. Все эти люди в рамках платформы объединены одним термином — AR creators. Какие требования и знания необходимы, чтобы стать им?
Я буду транслировать только свой опыт и попытаюсь внести ясность в происходящее сейчас явление.
Что такое Spark AR?
sparkar.facebook.com/ar-studio
Это платформа, позволяющая любому без особых знаний и умений сделать свою маску. Именно так Spark AR стали преподносить наперебой многие видеоблогеры после ее выхода из беты. Но без какого-либо опыта в digital-индустрии вы сможете сделать максимум маску-тату:
«Времена банальных масок уходят. Теперь в AR индустрии получают охват уникальные и креативные идеи. И именно здесь нужны навыки опытных дизайнеров»
Автор — Omega.C
Зачем нужны маски?
Ответ прост — это новый и еще не попсовый маркетинговый инструмент, который позволяет увеличить число подписчиков, а для брендов лояльность и вовлеченность аудитории (для самих креаторов к тому же бесплатный).
Вы можете годами собирать свою аудиторию, постить качественный контент, делать коллаборации, но не достичь цифры и 10 тыс. подписчиков. Креаторы за 1 месяц достигают цифр в 50-100 тыс. А самые удачливые собирают миллионы.
Вы знаете какие-то другие бесплатные и столь эффективные способы продвижения?
Самые яркие примеры в России:
ya.molli
3,2 млн. подписчиков
До использования масок — 200 тыс.
Я взял у Молли комментарий:
Я, как правило, создаю только фильтры и у меня сейчас показов более 35 млрд. В последнее время все больше и больше людей подписываются на мои маски. Я делаю фильтры на основе чего-то узнаваемого. Например, я создала фильтр, имитирующий пленку 8 мм.Они принесли много иностранной аудитории и позволили выйти на международный рынок в плане сотрудничества.
dvoshansky
4,5 млн. подписчиков
До использования масок — меньше 1000
У продвижения через маски есть минус, про который я вас должен предупредить. Аудитория может получиться сильно размазанной по миру, на вас могут неожиданно много подписаться жителей Индонезии или Бразилии, которую трудно монетизировать из России. Вы просто должны понимать этот риск.
Навыки для создания маски
Сейчас есть следующее деление масок по типу: 2D, 3D и игры.
2D маски
Для создания самой простой 2D-маски необходимо владеть базовыми навыками фотошопа. Все, что нужно — нарисовать текстуру и загрузить ее в mesh лица в спарке. Уроков по созданию таких масок уже предостаточно.
Но маска может быть и динамичной, а это территория motion-дизайнеров:
Средняя стоимость:
$200-300
3D маски
Если для вас такие термины, как пивот, карта нормалей и UV-развертка не кажутся чем-то неизведанным, то вам открывается новый уровень и пространство для творчества расширяется до бесконечности.
habrastorage.org/webt/ri/pl/1l/ripl1ls3fu58ee0_kqacsahacxw.gif
Здесь применяется LUT фильтр для инвертирования цветов и 3д челюсть, которая трекается к лицу
Овладеть 3D моделированием быстро маловероятно, поэтому здесь комфортно будут себя чувствовать все те, кто сносно владеет 3D софтом.
В спарк невозможно импортировать 3д анимацию на основе изменения меша объекта, но можно использовать риггинг и таким образом создавать персонажную анимацию или любое другое движение на основе костей. Движение костей можно запрограммировать внутри спарка. А это открывает большой простор для творчества для профессионалов.
Есть 6 типов текстур: Flat, Standart, Phisically-Based, Face Paint, Blended, Retouching.
Больше всего возможностей дают Standart и Phisically-Based. У них есть текстурные карты: Normal map, Specular, Emission Map, Alpha. У Phisically-Based еще и Environment map.
Retouching позволяет только сгладить кожу лица. По сути она применяет Blur к коже лица. Сила настраивается.
Пример моих 3д масок:
Автор — Siberian_creator
Автор — Siberian_creator
Это вотчина JavaScript разработчиков. Именно этот язык программирования применяется в Spark AR. В целом простейшую анимацию можно сделать и без особых знаний — в спарке используются принципы визуального программирования и вооружившись уроками из сети и вспомнив математику, можно собрать простую анимацию.
В инстаграм можно создавать игры на базе мимики и движения лица человека.
Персонаж прыгает в момент моргания глазами
Можно создавать анимацию привязанную к плоскости используя plane tracker. Сейчас работает только в Facebook.
С объектами и анимацией можно взаимодействовать стандартными жестами телефона: тап, долгий тап, свайп.
Необходимые навыки:
Знания JavaScript
Модерация масок
Последнее, что хотелось бы обсудить, это модерацию. С каждым месяцем гайки закручиваются. Т. к. Facebook не маленький стартап, то это накладывает ограничения в плане размещения на ее площадке разных масок.
Совсем недавно можно было выкладывать маски с деформированным лицом (например, с большими глазами), сейчас такое не пройдет.
По своему опыту могу сказать, что самая частая причина, по которой не утверждают маски — это статичный текст. Такую маску я пытался утвердить 2 месяца, меняя разные параметры, и доказывая модератору, что статичный текст тут — это ключевой визуальный элемент. Но, похоже, эта маска никогда не увидит свет:
Сроки модерации масок — 7 рабочих дней, но иногда затягивается на 10 и больше. Будьте к этому готовы.
Я создал телеграмм группу для публикации заказов и обсуждения вопросов, связанных с разработкой масок.
Спасибо за внимание.
Буду рад если вы расскажете о своем опыте работы в Spark AR в комментариях.
Присоединяйтесь к конкурсу Cyberware Challenge
Создавайте эффекты дополненной реальности, вдохновляясь футуристической видеоигрой Cyberpunk 2077, и получите шанс выиграть призы на общую сумму более 700 000 долларов США.
Создавайте эффекты дополненной реальности, вдохновляясь футуристической видеоигрой Cyberpunk 2077, и получите шанс выиграть призы на общую сумму более 700 000 долларов США.
Воплощайте идеи в жизнь!
Создавайте продукты дополненной реальности и делитесь ими с миллиардами пользователей Facebook.
Мощное ПО для работы с дополненной реальностью
В Spark AR Studio есть все необходимые функции и возможности: от простых шаблонов и библиотек объектов до расширенной настройки и управления.
Создание дополненной реальности при любом уровне подготовки
Инструменты для создания эффектов смогут освоить как начинающие 2D-художники и разработчики на языке JavaScript, так и опытные создатели 3D-моделей и дизайнеры визуальных эффектов. Для работы со Spark AR Studio не требуется опыт в программировании.
Овладейте секретами цифрового искусства
Ознакомьтесь с рекомендациями по созданию эффектов дополненной реальности, пошаговыми руководствами и видеоуроками.
Spark ar hub что это
Публикация эффектов
Содержание
Содержание
Чтобы опубликовать эффект, его нужно загрузить в Spark AR Hub и выполнить некоторые действия.
Процесс публикации состоит из следующих этапов:
Выбор названия для эффекта
Название показывается рядом с эффектом в месте его размещения. Названия эффектов, опубликованных одним владельцем, не должны дублироваться.
Выбор платформы, владельца и издателя
Эти параметры определяют, где публикуется эффект, а также какой аккаунт им владеет и управляет.
Опубликовав эффект одновременно на Facebook и в Instagram, вы сможете просматривать статистику по его результативности сразу на двух платформах. При этом процесс проверки придется пройти всего один раз.
Выбор категорий и ключевых слов
Для эффекта также нужно выбрать категории. С их помощью люди могут быстрее находить нужные эффекты.
Чтобы ваш эффект охватил нужную аудиторию, в процессе отправки вы можете добавить к нему ключевые слова.
Добавление демонстрационного видео и значка
Чтобы опубликовать эффект, вам понадобятся следующие объекты:
Демонстрационное видео показывает людям, чего ожидать от вашего эффекта. Также его можно использовать в процессе проверки. В Instagram демонстрационные видео показываются в галерее эффектов.
На снимке экрана ниже вы видите, как значок и демонстрационное видео выглядят в Instagram.
Дата публикации
Вы можете выбрать дату, в которую эффект будет опубликован (после того, как успешно пройдет проверку). Это не повлияет на срок его рассмотрения.
Если вы опубликовали эффект с таргетингом по местоположению до 29 октября 2020 года, заданное вами местоположение будет по-прежнему ограничивать его обнаружение. Если вы обновите эффект после 29 октября, таргетинг по местоположению больше не будет поддерживаться.
Отправка и проверка (до 5 дней)
Когда ваш эффект будет принят, вы получите уведомление на Facebook и в Spark AR Hub. После этого эффект появится на всех указанных вами платформах.
Прежде, чем люди смогут использовать ваш эффект, мы проверим его на соответствие следующим нормам:
Чтобы повысить вероятность того, что ваш эффект примут, следуйте нашим рекомендациям.
Как создать маску в Instagram
После того как Instagram открыл доступ к созданию масок всем пользователям, сделать их может любой — и даже специальных технических знаний не потребуется. Совместно с дизайнером GeekBrains Германом Шаловым мы дадим базовую инструкцию, как сделать маску в инстаграме самому.
Скачайте программу Spark AR Studio
Spark AR Studio — это AR-среда Facebook. В ней создают маски на основе нужной текстуры, подготовленной в Photoshop или любом графическом редакторе, который работает с альфа-каналами (прозрачностью). Чтобы создать маску в инстаграме самому, необходима программа Spark AR Studio, которая есть в версиях для компьютера (macOS, Windows) и смартфона (iOS, Android). Рекомендуем скачать обе версии — на смартфоне удобно сразу же тестировать результат
.
Соедините Spark AR на десктопе и смартфоне
Запустите Spark AR Studio. Вас встретит набор предустановленных эффектов и масок — на их примере можно посмотреть некоторые принципы работы. Но изменять пресеты нужно аккуратно: обычно это рушит установленные зависимости объектов, и маска может заработать неверно.
Программа похожа на Photoshop и другие проекты Adobe, поэтому ориентироваться в ней несложно. По центру — окно Viewport, рабочая область, где будет отображаться маска и все манипуляции с ней.
В правом верхнем углу расположено окно Simulator — здесь вы увидите, как маска будет выглядеть на смартфоне. По умолчанию установлена одна модель девайса, но ее можно менять, чтобы посмотреть на маску в разных вариантах.
Чтобы протестировать маску перед загрузкой в Instagram, нужно подключиться к Spark AR Hub — это творческая среда от Facebook для авторов масок. Для этого создайте публичную ссылку для тестирования или соедините Spark AR с подключенным к компьютеру смартфоном:
Создайте трекер лица в Photoshop или загрузите готовый
Маска состоит из трех компонентов: FaceTracker, текстура и материал (эффект, который вы хотите увидеть в маске). Текстуру можно подготовить самому или скачать заранее. Если у вас нет Photoshop или не хочется возиться с этим — скачайте готовую текстуру и пропустите этот шаг.
Если готовы подготовить ее сами, переместитесь в Photoshop или Figma. Дальше порядок действий такой:
Как создать свою маску в Инстаграме
Снова переместитесь в Spark AR и создайте проект: нажмите Create project. Затем загрузите в программу текстуру — перетащите ее в Assets в нижний правый угол, и текстура автоматически отобразится в разделе Texture.
Далее перейдите в рабочее пространство для создания маски — Insert → Scene. Вы будете работать с функциями FaceTracker и FaceMesh. Первая отслеживает движение лица и мимику, вторая — 3D-объект, который синхронизируется с трекером и содержит ваши текстуры с эффектами.
Нажмите Scene → FaceTracker → Insert, затем Scene → FaceMesh → Insert. Эта связка, именно в такой последовательности, поможет привязать маску к мимике и движениям лица. Следите, чтобы трекер был вложен в последовательность папок: device / camera / focal distance. FaceMesh должен быть внутри device / camera / focal distance / facetracker.
Дальше создаем материал для маски. В окне Assets кликните +add asset в правом нижнем углу, затем нажмите Material. Выберите тип нанесения (Shader Type) — например, Retouching сглаживает кожу, а Flat не отражает свет и удобен для рисунков на лице. В большинстве случаев подходит Face paint: он учитывает рельеф и форму лица и органично наносит на него рисунок.
Свяжите FaceTracker с материалом: в правом меню кликните Material, затем Texture и выберите текстуру. Рисунок появится на модели в рабочей области. Маска почти готова.
К маске можно добавить анимацию. Перейдите во вкладку View → Patch editor. Протестируем такой сценарий: маска появляется вместе с улыбкой человека. Что нужно для этого сделать:
В итоге создается созависимая цепочка эффектов, благодаря которой отобразятся три эффекта, когда человек улыбнется.
Для начала вам хватит дефолтных материалов, которые предлагают в программе. А когда наловчитесь работать со Spark AR, сможете создать авторскую маску.
Протестируйте маску
Нажмите кнопку Test on device, о которой мы говорили в первом пункте инструкции, и подождите, пока программа передаст данные на смартфон. Когда появится маска, протестируйте ее в разных положениях лица: улыбнитесь, покрутите головой влево-вправо, вверх-вниз. Проверьте маску при разном освещении и фонах: если вы делали ретуширование лица, оцените, как эффект работает при недостаточном свете.
Если маска слетает при движении, внесите изменения и протестируйте еще раз. Затем переходите к экспорту.
Экспортируйте маску
Здесь все просто: в левом нижнем углу экрана найдите кнопку Export и выберите папку, в которую нужно сохранить маску. Если маска весит больше, чем нужно (допускается 10 Мб, но желательно 2 Мб и меньше), программа предупредит об этом перед экспортом. Обратите внимание, что в Instagram нужно выгрузить именно этот файл, а не файл проекта.
Как добавить маску в Инстаграм
Заключительный шаг: перейдите в Spark AR Hub и загрузите маску, следуя инструкции. Кроме самой маски, нужна еще иконка для нее — требования к иконке есть на сайте Spark AR.
Если хотите официально выложить маску в Facebook или Instagram, нужно записать демо-видео. В ролике расскажите или покажите, как работает эффект, и уложитесь в 15 секунд. Видео должно быть качественным — оно будет отображаться чем-то вроде обложки раздела с масками в вашем аккаунте.
Дождитесь, пока модераторы проверят маску. После этого она появится во вкладке «Галерея эффектов» в окне записи stories в Instagram.
Пока ждете проверку, маской легко делиться с кем угодно через ссылку. Ее можно открыть 200 раз, после чего придется создать новую ссылку. Там же, в AR Hub, можно на 60 минут закрепить маску в вашем инстаграм-аккаунте.
Как сделать маску в Инстаграме? Совсем несложно! — успех во многом зависит от того, какую текстуру для маски вы предварительно подготовили. На факультете графического дизайна GeekUniversity вы научитесь создавать не только качественные текстуры для масок, но и множество других вещей — от простейших иллюстраций до масштабных фирменных стилей. Присоединяйтесь!
AR-маски, популярные сейчас в Instagram, на самом деле появились намного раньше. В 2015 году их увидели пользователи приложения MSQRD, позже они пришли в Snapchat. За пару лет маски стали использоваться гораздо шире, чем просто для развлечения: маски активно используются в рекламе, блогеры с их помощью продвигают аккаунты. Также маски могут привлечь внимание к интересным проектам и социальным проблемам.
После того как Instagram открыл доступ к созданию масок всем пользователям, сделать их может любой — и даже специальных технических знаний не потребуется. Совместно с дизайнером GeekBrains Германом Шаловым мы дадим базовую инструкцию, как сделать маску в инстаграме самому.
Скачайте программу Spark AR Studio
Spark AR Studio — это AR-среда Facebook. В ней создают маски на основе нужной текстуры, подготовленной в Photoshop или любом графическом редакторе, который работает с альфа-каналами (прозрачностью). Чтобы создать маску в инстаграме самому, необходима программа Spark AR Studio, которая есть в версиях для компьютера (macOS, Windows) и смартфона (iOS, Android). Рекомендуем скачать обе версии — на смартфоне удобно сразу же тестировать результат
.
Соедините Spark AR на десктопе и смартфоне
Запустите Spark AR Studio. Вас встретит набор предустановленных эффектов и масок — на их примере можно посмотреть некоторые принципы работы. Но изменять пресеты нужно аккуратно: обычно это рушит установленные зависимости объектов, и маска может заработать неверно.
Программа похожа на Photoshop и другие проекты Adobe, поэтому ориентироваться в ней несложно. По центру — окно Viewport, рабочая область, где будет отображаться маска и все манипуляции с ней.
В правом верхнем углу расположено окно Simulator — здесь вы увидите, как маска будет выглядеть на смартфоне. По умолчанию установлена одна модель девайса, но ее можно менять, чтобы посмотреть на маску в разных вариантах.
Чтобы протестировать маску перед загрузкой в Instagram, нужно подключиться к Spark AR Hub — это творческая среда от Facebook для авторов масок. Для этого создайте публичную ссылку для тестирования или соедините Spark AR с подключенным к компьютеру смартфоном:
Создайте трекер лица в Photoshop или загрузите готовый
Маска состоит из трех компонентов: FaceTracker, текстура и материал (эффект, который вы хотите увидеть в маске). Текстуру можно подготовить самому или скачать заранее. Если у вас нет Photoshop или не хочется возиться с этим — скачайте готовую текстуру и пропустите этот шаг.
Если готовы подготовить ее сами, переместитесь в Photoshop или Figma. Дальше порядок действий такой:
Как создать свою маску в Инстаграме
Снова переместитесь в Spark AR и создайте проект: нажмите Create project. Затем загрузите в программу текстуру — перетащите ее в Assets в нижний правый угол, и текстура автоматически отобразится в разделе Texture.
Далее перейдите в рабочее пространство для создания маски — Insert → Scene. Вы будете работать с функциями FaceTracker и FaceMesh. Первая отслеживает движение лица и мимику, вторая — 3D-объект, который синхронизируется с трекером и содержит ваши текстуры с эффектами.
Нажмите Scene → FaceTracker → Insert, затем Scene → FaceMesh → Insert. Эта связка, именно в такой последовательности, поможет привязать маску к мимике и движениям лица. Следите, чтобы трекер был вложен в последовательность папок: device / camera / focal distance. FaceMesh должен быть внутри device / camera / focal distance / facetracker.
Дальше создаем материал для маски. В окне Assets кликните +add asset в правом нижнем углу, затем нажмите Material. Выберите тип нанесения (Shader Type) — например, Retouching сглаживает кожу, а Flat не отражает свет и удобен для рисунков на лице. В большинстве случаев подходит Face paint: он учитывает рельеф и форму лица и органично наносит на него рисунок.
Свяжите FaceTracker с материалом: в правом меню кликните Material, затем Texture и выберите текстуру. Рисунок появится на модели в рабочей области. Маска почти готова.
К маске можно добавить анимацию. Перейдите во вкладку View → Patch editor. Протестируем такой сценарий: маска появляется вместе с улыбкой человека. Что нужно для этого сделать:
В итоге создается созависимая цепочка эффектов, благодаря которой отобразятся три эффекта, когда человек улыбнется.
Для начала вам хватит дефолтных материалов, которые предлагают в программе. А когда наловчитесь работать со Spark AR, сможете создать авторскую маску.
Протестируйте маску
Нажмите кнопку Test on device, о которой мы говорили в первом пункте инструкции, и подождите, пока программа передаст данные на смартфон. Когда появится маска, протестируйте ее в разных положениях лица: улыбнитесь, покрутите головой влево-вправо, вверх-вниз. Проверьте маску при разном освещении и фонах: если вы делали ретуширование лица, оцените, как эффект работает при недостаточном свете.
Если маска слетает при движении, внесите изменения и протестируйте еще раз. Затем переходите к экспорту.
Экспортируйте маску
Здесь все просто: в левом нижнем углу экрана найдите кнопку Export и выберите папку, в которую нужно сохранить маску. Если маска весит больше, чем нужно (допускается 10 Мб, но желательно 2 Мб и меньше), программа предупредит об этом перед экспортом. Обратите внимание, что в Instagram нужно выгрузить именно этот файл, а не файл проекта.
Как добавить маску в Инстаграм
Заключительный шаг: перейдите в Spark AR Hub и загрузите маску, следуя инструкции. Кроме самой маски, нужна еще иконка для нее — требования к иконке есть на сайте Spark AR.
Если хотите официально выложить маску в Facebook или Instagram, нужно записать демо-видео. В ролике расскажите или покажите, как работает эффект, и уложитесь в 15 секунд. Видео должно быть качественным — оно будет отображаться чем-то вроде обложки раздела с масками в вашем аккаунте.
Дождитесь, пока модераторы проверят маску. После этого она появится во вкладке «Галерея эффектов» в окне записи stories в Instagram.
Пока ждете проверку, маской легко делиться с кем угодно через ссылку. Ее можно открыть 200 раз, после чего придется создать новую ссылку. Там же, в AR Hub, можно на 60 минут закрепить маску в вашем инстаграм-аккаунте.
Как сделать маску в Инстаграме? Совсем несложно! — успех во многом зависит от того, какую текстуру для маски вы предварительно подготовили. На факультете графического дизайна GeekUniversity вы научитесь создавать не только качественные текстуры для масок, но и множество других вещей — от простейших иллюстраций до масштабных фирменных стилей. Присоединяйтесь!