Rusbase
Как создать маску в инстаграме: подробная инструкция
3 февраля 2020
Пользователи Instagram могут не только применять готовые фильтры, но и создавать собственные виртуальные эффекты с дополненной реальностью, в виде необычных цветов, форм, надписей и так далее. Эти маски можно накладывать на Instagram Stories, например, чтобы привлечь новых подписчиков и сделать аккаунт более запоминающимся. Как создать собственную маску в инстаграме и выделиться?
Как быстро сделать маску в Instagram
В течение многих лет фильтры Instagram создавались только самой платформой или несколькими студиями, имеющими доступ к Spark AR Studio — специальному инструменту Facebook. Это изменилось 13 августа 2019 года, когда закрылась бета-версия Spark AR, и программное обеспечение стало доступно всем, кто хочет создавать свои собственные маски. Прежде чем мы перейдём к процессу создания — несколько интересных фактов:
Делать маски не так сложно, как кажется на первый взгляд. Создание фильтра может быть нелегким, но всё зависит от идеи пользователя. Если вы хотите сделать что-то простое, можно быстро и без особых усилий создать множество 2D-эффектов в Spark AR.
Опыт не обязателен, но облегчает жизнь. Если вы уже знакомы с программами графического редактирования, такими как Cinema 3D или тот же Adobe Photoshop, вам будет проще ориентироваться в Spark AR. Если это ваше первое знакомство с подобным инструментом, изучите возможности платформы и не бойтесь экспериментировать.
Spark AR уже сделал большую часть работы за вас. Когда Facebook открыл Spark AR для публики, он запустил и сообщество создателей, чтобы помогать его членам делать маски, информировать и вдохновлять их. Есть также богатая платформа контента, материалов и учебных пособий, которая очень поможет новичкам.
Делать маски не так сложно, как кажется на первый взгляд. Создание фильтра может быть нелегким, но всё зависит от идеи пользователя. Если вы хотите сделать что-то простое, можно быстро и без особых усилий создать множество 2D-эффектов в Spark AR.
Опыт не обязателен, но облегчает жизнь. Если вы уже знакомы с программами графического редактирования, такими как Cinema 3D или тот же Adobe Photoshop, вам будет проще ориентироваться в Spark AR. Если это ваше первое знакомство с подобным инструментом, изучите возможности платформы и не бойтесь экспериментировать.
Spark AR уже сделал большую часть работы за вас. Когда Facebook открыл Spark AR для публики, он запустил и сообщество создателей, чтобы помогать его членам делать маски, информировать и вдохновлять их. Есть также богатая платформа контента, материалов и учебных пособий, которая очень поможет новичкам.
Первое, что вы увидите после загрузки Spark AR — это меню с предустановленными проектами, такими как анимированная маска для лица в виде кролика, полоса света и плавающие частицы. Это даст вам хорошее представление о том, как работают основные типы фильтров.
Если не боитесь экспериментировать и хотите попробовать анимировать трехмерные объекты, есть целая библиотека предустановленных элементов, которые можно вставить в свои фильтры, включая всевозможные черепа, покеболы и аниме-персонажей.
Если у вас нет никакого опыта в создании анимации, попробуйте поработать с минималистичными эффектами, создав простую 2D-маску. Вы можете комбинировать 2D-элементы, использовать их по отдельности или даже умножать в рамках одного проекта, чтобы добавить более богатый эффект.
Итак, как быстро сделать маску в Instagram?
Урок № 1. Области (тьмы) творения
1. Начните с загрузки Spark AR Studio. Это бесплатная программа, простая в установке и доступная для Windows и MacOS. После установки вы можете работать с различными пресетами (сохранённые наборы настроек для обработки фото) или запустить собственный проект с нуля.
2. Spark AR откроется в рабочем пространстве, которое разделено на четыре области. В левом верхнем углу находится панель «Scene» (Сцена), которая покажет базовую структуру объектов в вашем фильтре. По умолчанию вы увидите «ambientLight0» и «directionalLight0», которые являются элементами освещения.
2. Spark AR откроется в рабочем пространстве, которое разделено на четыре области. В левом верхнем углу находится панель «Scene» (Сцена), которая покажет базовую структуру объектов в вашем фильтре. По умолчанию вы увидите «ambientLight0» и «directionalLight0», которые являются элементами освещения.
3. Ниже панели «Scene» находится панель «Assets» («Активы»), которая будет содержать все «Materials» («Материалы»), описывающие объекты на панели «Scene». Материалы в Spark — это различные текстуры, картинки или просто цвета, которые можно присвоить объектам.
Этот маленький прямоугольник — ваше устройство, а линии, соединяющие его с изображением, показывают радиус действия вашей камеры.
4. Пространство посередине — это окно просмотра. Это ваше основное рабочее пространство, предлагающее две перспективы проекта. Более крупный квадрат в центре показывает все объекты в вашем фильтре в пределах диапазона камеры вашего устройства. Это поможет создавать эффекты в пространстве камеры (которые движутся вместе с камерой) или в окружающем пространстве (которые остаются на месте независимо от того, куда движется камера).
Вы можете выбрать конкретное устройство, для которого хотите создать маску, или проверить, как она выглядит на разных экранах и устройствах.
5. В правом верхнем углу окна просмотра есть еще одна программа просмотра под названием «Simulator» («Симулятор»), которая показывает, как ваша маска будет выглядеть в итоге. По умолчанию вы увидите свою работу так, как она отображается на iPhone 8, но устройство можно изменить в настройках. Опции охватывают ряд устройств iOS (включая iPad) и смартфоны Android (включая некоторые версии Samsung Galaxy, Google Pixel и Google Nexus).
6. Наконец, в правой части вашего рабочего пространства есть панель «Inspector», которая покажет свойства элементов «Scene» и позволит редактировать цвет, текстуру, положение, угол поворота и другие детали.
7. Spark AR включает в себя несколько тестовых фигур, чтобы вы могли примерить свои фильтры. Вы сможете увидеть, как они выглядят на людях разных полов, рас и национальностей, на чистом холсте или на себе. Можете поэкспериментировать с опциями, щелкнув значок камеры слева от панели «Scene» и выбрав лицо, которое хотите использовать, во всплывающем меню. Если у вас есть желание примерить спецэффект на себе, выберите Facetime HD Camera в том же меню (название может отличаться в зависимости от того, на каком устройстве вы работаете) — так вы создадите маску для своего лица.
8. У вас есть возможность в любой момент проверить работу в приложении Instagram. Просто нажмите кнопку «Test On Device» («Протестировать на устройстве») слева от панели «Assets» и выберите «Send To App» («Отправить в приложение»). Если вам нужна дополнительная помощь, ознакомьтесь с интерфейсом Spark AR.
7. Spark AR включает в себя несколько тестовых фигур, чтобы вы могли примерить свои фильтры. Вы сможете увидеть, как они выглядят на людях разных полов, рас и национальностей, на чистом холсте или на себе. Можете поэкспериментировать с опциями, щелкнув значок камеры слева от панели «Scene» и выбрав лицо, которое хотите использовать, во всплывающем меню. Если у вас есть желание примерить спецэффект на себе, выберите Facetime HD Camera в том же меню (название может отличаться в зависимости от того, на каком устройстве вы работаете) — так вы создадите маску для своего лица.
8. У вас есть возможность в любой момент проверить работу в приложении Instagram. Просто нажмите кнопку «Test On Device» («Протестировать на устройстве») слева от панели «Assets» и выберите «Send To App» («Отправить в приложение»). Если вам нужна дополнительная помощь, ознакомьтесь с интерфейсом Spark AR.
Урок № 2. Телепортируйтесь куда угодно, меняя фон
Замена фона технически называется «Segmentation» («Сегментация») и является базовым эффектом, который предлагает массу возможностей. Как это работает?
1. Выберите изображение для фона. Вы можете использовать подходящую фотографию или создать что-то новое, играя с цветами и эффектами в Photoshop или любой другой программе для редактирования изображений.
2. Добавьте два прямоугольника. Один будет фоном (как зеленый экран), а другой — отображать ваше лицо, стирая фон реального мира. Перейдите в нижний правый угол панели «Scene», нажмите «Add Object» («Добавить объект»), прокрутите всплывающее меню и выберите «Rectangle» («Прямоугольник»). Сделайте это дважды.
3. По умолчанию ваши прямоугольники будут отображаться как «Rectangle0» и «Rectangle1». Эти непонятные названия можно изменить. Например, «Rectangle0» на «Фон» и «Rectangle1» на «Передний план». Так будет проще ориентироваться. Для этого дважды щелкните по имени, и появится поле. Убедитесь, что оба прямоугольника вложены в canvas0. Это нужно для того, чтобы они стали «потомками» этого элемента и подвергались любым изменениям, которые вы вносите в их «родителя».
1. Выберите изображение для фона. Вы можете использовать подходящую фотографию или создать что-то новое, играя с цветами и эффектами в Photoshop или любой другой программе для редактирования изображений.
2. Добавьте два прямоугольника. Один будет фоном (как зеленый экран), а другой — отображать ваше лицо, стирая фон реального мира. Перейдите в нижний правый угол панели «Scene», нажмите «Add Object» («Добавить объект»), прокрутите всплывающее меню и выберите «Rectangle» («Прямоугольник»). Сделайте это дважды.
3. По умолчанию ваши прямоугольники будут отображаться как «Rectangle0» и «Rectangle1». Эти непонятные названия можно изменить. Например, «Rectangle0» на «Фон» и «Rectangle1» на «Передний план». Так будет проще ориентироваться. Для этого дважды щелкните по имени, и появится поле. Убедитесь, что оба прямоугольника вложены в canvas0. Это нужно для того, чтобы они стали «потомками» этого элемента и подвергались любым изменениям, которые вы вносите в их «родителя».
На этом этапе мы стремимся расширить оба прямоугольника, чтобы охватить весь фильтр.
4. Установите размеры прямоугольников. Выберите прямоугольник фона (ранее известный как «Rectangle0»), и вы увидите его свойства на панели справа. Нажмите на поля рядом с надписью «Size» («Размер»), чтобы изменить ширину («Fill width») и высоту («Fill height») заполнения и растянуть прямоугольники на весь экран устройства. Сделайте это и для второго прямоугольника. Ваш видовой экран будет полностью покрыт прямоугольниками, которые будут отображаться в виде клетчатого рисунка под названием «Альфа». Это означает, что они прозрачны, но они все еще там.
5. Разделите слои. По умолчанию любой объект, который вы добавляете, присоединяется к слою, в котором вы последний раз работали. Если вам это не нужно, переместите его на другой слой. Чтобы эффект сегментации сработал, вам понадобятся прямоугольники в разных слоях. Так фон «отрисуется» после переднего плана. Для этого и нужен прямоугольник фона на панели «Scene». На панели «Inspector» справа щелкните поле «Layer» («Слой») и выберите «Create New Layer» («Создать новый слой»). При желании вы можете переименовать слои, выбрав вкладку «Layers» в правом верхнем углу панели «Scene» и дважды щелкнув на имя каждого слоя по очереди.
6. Создайте новые материалы. Время придать этим прозрачным прямоугольникам твердую, видимую форму. Для этого и нужна функция «Materials». Вы можете назначить каждому прямоугольнику свой собственный материал: выберите их поочерёдно на панели «Scene», а затем на панели «Inspector» справа щелкните значок «плюс» рядом с «Materials» и нажмите «Create New Material». На панели «Assets» в результате должно появиться два материала (под каждый прямоугольник)
Материалы также можно переименовать. Выбрав материалы, вы увидите множество новых параметров на панели «Inspector». Можете изменить цвет, текстуру, прозрачность, смешение и так далее. Если хотите поэкспериментировать с вашими фильтрами, меняйте эти параметры и смотрите, что получается.
7. Создайте текстуру сегментации. Это превратит любое видео, снятое вашей камерой, в текстуру, а это означает, что оно отделит вас (или того, на кого вы указываете) от фона. На панели «Scene» нажмите «Camera», а на панели «Inspector» щелкните знак «плюс» рядом с «Segmentation». На панели «Assets» появится новый ресурс, который по умолчанию называется personSegmentationMaskTexture0.
8. Добавьте «извлечение текстуры» на передний план материала. Сначала нажмите «Camera» на панели «Scene», а на панели «Inspector» щелкните знак «плюс» рядом с «Texture Extraction» («Извлечение текстуры»). На панели «Assets» появится другой ресурс с именем «cameraTexture0».
Чтобы использовать его в качестве новой текстуры, нажмите на материал переднего плана на панели «Assets». На панели «Inspector» измените «Shader Type» («Тип шейдера») на «Flat» («Плоский»), что придаст этому материалу свойства плоского 2D-элемента.
В «Diffuse» (второй элемент на панели «Inspector») найдите «Texture» и выберите cameraTexture0 в раскрывающемся меню. Внизу установите флажок рядом с «Alpha», в поле «Texture» откройте раскрывающееся меню и выберите personSegmentationMaskTexture0.
9. Измените фон. Может показаться, что ничего не произошло, но вы почти у цели, так как установили основу для своего фильтра. Нажмите на материал для фона и на панели «Inspector» в разделе «Diffuse» измените цвет на то, что контрастирует с объектом в камере. Это поможет вам отрегулировать края сегментации путем изменения размера маски и мягкости края. Эти параметры вы найдете на панели «Inspector», когда дважды щелкнете personSegmentationMaskTexture0.
Выберите материал для фона и в разделе «Diffuse» сбросьте цвет на белый. Ниже, рядом с «Texture», нажмите «Choose File From Computer» («Выбрать файл с компьютера») и загрузите изображение, которое собираетесь использовать в качестве фона. Имейте в виду, что файлы фотографий могут быть слишком тяжёлыми для Instagram или Facebook, поэтому делайте их настолько «легкими», насколько это возможно.
Посмотрите, например, этот видеоурок: вы узнаете, как использовать сегментацию и текстуру камеры для создания эффекта, который отделяет кого-то от фона. Меняйте фоны, как хотите.
5. Разделите слои. По умолчанию любой объект, который вы добавляете, присоединяется к слою, в котором вы последний раз работали. Если вам это не нужно, переместите его на другой слой. Чтобы эффект сегментации сработал, вам понадобятся прямоугольники в разных слоях. Так фон «отрисуется» после переднего плана. Для этого и нужен прямоугольник фона на панели «Scene». На панели «Inspector» справа щелкните поле «Layer» («Слой») и выберите «Create New Layer» («Создать новый слой»). При желании вы можете переименовать слои, выбрав вкладку «Layers» в правом верхнем углу панели «Scene» и дважды щелкнув на имя каждого слоя по очереди.
6. Создайте новые материалы. Время придать этим прозрачным прямоугольникам твердую, видимую форму. Для этого и нужна функция «Materials». Вы можете назначить каждому прямоугольнику свой собственный материал: выберите их поочерёдно на панели «Scene», а затем на панели «Inspector» справа щелкните значок «плюс» рядом с «Materials» и нажмите «Create New Material». На панели «Assets» в результате должно появиться два материала (под каждый прямоугольник)
Материалы также можно переименовать. Выбрав материалы, вы увидите множество новых параметров на панели «Inspector». Можете изменить цвет, текстуру, прозрачность, смешение и так далее. Если хотите поэкспериментировать с вашими фильтрами, меняйте эти параметры и смотрите, что получается.
7. Создайте текстуру сегментации. Это превратит любое видео, снятое вашей камерой, в текстуру, а это означает, что оно отделит вас (или того, на кого вы указываете) от фона. На панели «Scene» нажмите «Camera», а на панели «Inspector» щелкните знак «плюс» рядом с «Segmentation». На панели «Assets» появится новый ресурс, который по умолчанию называется personSegmentationMaskTexture0.
8. Добавьте «извлечение текстуры» на передний план материала. Сначала нажмите «Camera» на панели «Scene», а на панели «Inspector» щелкните знак «плюс» рядом с «Texture Extraction» («Извлечение текстуры»). На панели «Assets» появится другой ресурс с именем «cameraTexture0».
Чтобы использовать его в качестве новой текстуры, нажмите на материал переднего плана на панели «Assets». На панели «Inspector» измените «Shader Type» («Тип шейдера») на «Flat» («Плоский»), что придаст этому материалу свойства плоского 2D-элемента.
В «Diffuse» (второй элемент на панели «Inspector») найдите «Texture» и выберите cameraTexture0 в раскрывающемся меню. Внизу установите флажок рядом с «Alpha», в поле «Texture» откройте раскрывающееся меню и выберите personSegmentationMaskTexture0.
9. Измените фон. Может показаться, что ничего не произошло, но вы почти у цели, так как установили основу для своего фильтра. Нажмите на материал для фона и на панели «Inspector» в разделе «Diffuse» измените цвет на то, что контрастирует с объектом в камере. Это поможет вам отрегулировать края сегментации путем изменения размера маски и мягкости края. Эти параметры вы найдете на панели «Inspector», когда дважды щелкнете personSegmentationMaskTexture0.
Выберите материал для фона и в разделе «Diffuse» сбросьте цвет на белый. Ниже, рядом с «Texture», нажмите «Choose File From Computer» («Выбрать файл с компьютера») и загрузите изображение, которое собираетесь использовать в качестве фона. Имейте в виду, что файлы фотографий могут быть слишком тяжёлыми для Instagram или Facebook, поэтому делайте их настолько «легкими», насколько это возможно.
Посмотрите, например, этот видеоурок: вы узнаете, как использовать сегментацию и текстуру камеры для создания эффекта, который отделяет кого-то от фона. Меняйте фоны, как хотите.
Бонус: добавьте немного блеска — эффект плавающей частицы.
Это обычная функция в фильтрах Instagram, она легко настраивается и хорошо выглядит.
1) Сначала на панели «Scene» нажмите «Add Object» и прокрутите весь путь до конца списка, чтобы выбрать «Particle System» (Система частиц). Вы заметите новый элемент в области просмотра, испускающий альфа-квадраты. Это ваш излучатель, а альфа-квадраты — это частицы.
2) Когда вы создадите свой «emitter» (излучатель), он появится на панели «Scene» под прямоугольником переднего плана. Это означает, что по умолчанию он будет подвергаться воздействию элемента «Focal Distance» (второй под камерой). Если вы хотите создать эффект «World» (летающие блестящие частицы), нажмите на имя эмиттера (по умолчанию «emitter0»), перетащите его вниз и поместите под «Microphone». Это сделает излучатель независимым объектом.
3) Вы заметите три стрелки, выходящие из излучателя в области просмотра. Они представляют оси X (красная), Y (зеленая) и Z (синяя), и вы можете перетаскивать их вокруг, чтобы изменить положение излучателя. Кроме того, когда вы нажмёте на название эмиттера, найдете список всех возможных настраиваемых параметров.
1) Сначала на панели «Scene» нажмите «Add Object» и прокрутите весь путь до конца списка, чтобы выбрать «Particle System» (Система частиц). Вы заметите новый элемент в области просмотра, испускающий альфа-квадраты. Это ваш излучатель, а альфа-квадраты — это частицы.
2) Когда вы создадите свой «emitter» (излучатель), он появится на панели «Scene» под прямоугольником переднего плана. Это означает, что по умолчанию он будет подвергаться воздействию элемента «Focal Distance» (второй под камерой). Если вы хотите создать эффект «World» (летающие блестящие частицы), нажмите на имя эмиттера (по умолчанию «emitter0»), перетащите его вниз и поместите под «Microphone». Это сделает излучатель независимым объектом.
3) Вы заметите три стрелки, выходящие из излучателя в области просмотра. Они представляют оси X (красная), Y (зеленая) и Z (синяя), и вы можете перетаскивать их вокруг, чтобы изменить положение излучателя. Кроме того, когда вы нажмёте на название эмиттера, найдете список всех возможных настраиваемых параметров.
4) Положение, масштаб и вращение имеют поля X, Y и Z, которые помогут вам перемещать излучатель относительно того, как расположена камера (положение, position), как далеко в каждом направлении будут идти частицы (масштаб, scale) и под каким углом (вращение, rotation). Меняйте значения этих полей (положительные и отрицательные числа), чтобы создать нужный эффект.
Эмиттер
Вы можете выбрать, какой тип эмиттера будете использовать. Если у вас фиксированный фон — он не будет двигаться, если вы переместите камеру. Кольцевой излучатель («Ring») будет распылять частицы в сферическом радиусе. Это создаст эффект, который заставит некоторые частицы появляться ближе, а другие — дальше от камеры.
Настройка частиц
«Birthrate» (коэффициент рождаемости) определяет количество частиц, которые испускает излучатель. Чем больше частиц вы хотите, тем выше будет это число. «Speed» («Скорость»), «Scale» («Масштаб») и «Lifespan» («Продолжительность жизни») говорят сами за себя — первая определяет, как быстро движутся ваши частицы; второй — насколько велики ваши частицы; и третья — как долго ваша частица прослужит, пока не исчезнет.
Сила
Это как гравитация. Если вы поиграете со значениями оси Y, то заметите, что ваши частицы будут казаться легче или тяжелее. Чем ниже значение, тем тяжелее частицы.
5) Пришло время добавить материал. Выбрав излучатель на панели «Scene», перейдите на панель «Inspector», прокрутите вниз, нажмите знак «плюс» рядом с «Materials» и выберите «Create New Material». Новый элемент появится на панели «Assets». Дважды щелкните по нему и переименуйте в «Particle_material».
Вы заметите, что ваши частицы изменились, например, поменяли цвет (если это так, не волнуйтесь). Выберите «Particle_material» на панели «Assets», а затем на панели «Inspector» щелкните раскрывающийся список «Shader Type» и укажите «Flat». Все это работает, если вы используете эффект 2D-частиц, но если вы планируете делать что-то с 3D-эффектом, вместо этого выбирайте «Physically-Based». Далее, в разделе «Shader Properties» («Свойства шейдера»), рядом с «Texture», нажмите «Choose File From Computer». Откроется окно проводника, и вы сможете загрузить любой файл, который вам нравится.
Какое бы изображение вы ни использовали для своих частиц, оно должно иметь прозрачный фон. В большинстве случаев вы можете найти эти типы файлов в формате PNG с помощью простого поиска картинок Google. Если у вас есть частица с собственной текстурой, можете отрегулировать излучатель, например, сделать частицы больше (от 0,01 до 0,05).
Вы заметите, что ваши частицы изменились, например, поменяли цвет (если это так, не волнуйтесь). Выберите «Particle_material» на панели «Assets», а затем на панели «Inspector» щелкните раскрывающийся список «Shader Type» и укажите «Flat». Все это работает, если вы используете эффект 2D-частиц, но если вы планируете делать что-то с 3D-эффектом, вместо этого выбирайте «Physically-Based». Далее, в разделе «Shader Properties» («Свойства шейдера»), рядом с «Texture», нажмите «Choose File From Computer». Откроется окно проводника, и вы сможете загрузить любой файл, который вам нравится.
Какое бы изображение вы ни использовали для своих частиц, оно должно иметь прозрачный фон. В большинстве случаев вы можете найти эти типы файлов в формате PNG с помощью простого поиска картинок Google. Если у вас есть частица с собственной текстурой, можете отрегулировать излучатель, например, сделать частицы больше (от 0,01 до 0,05).
Поздравляем! Вы сделали свою первую маску в Instagram. Что теперь?
Поделитесь своей новой маской. Для этого необходимо загрузить ее на Spark AR Hub, где она будет проверена службой поддержки Instagram. Как только они увидят вашу маску и определят, что она соответствует рекомендациям сообщества платформы, ваше творение будет доступно в галерее Instagram, в вашем профиле и ссылках для обмена. Процесс занимает около пяти рабочих дней.
Начните с нажатия кнопки «Upload» («Загрузить») слева от панели «Assets» (это стрелка вверх). Оказавшись там, выберете «Export File» и сохраните ваш проект в файле arexport, который вам нужно будет загрузить в центр Spark AR. Программа автоматически направит вас туда после завершения экспорта.
Поделитесь своей новой маской. Для этого необходимо загрузить ее на Spark AR Hub, где она будет проверена службой поддержки Instagram. Как только они увидят вашу маску и определят, что она соответствует рекомендациям сообщества платформы, ваше творение будет доступно в галерее Instagram, в вашем профиле и ссылках для обмена. Процесс занимает около пяти рабочих дней.
Начните с нажатия кнопки «Upload» («Загрузить») слева от панели «Assets» (это стрелка вверх). Оказавшись там, выберете «Export File» и сохраните ваш проект в файле arexport, который вам нужно будет загрузить в центр Spark AR. Программа автоматически направит вас туда после завершения экспорта.
Урок № 3. Как сделать лицо попроще
С помощью Spark AR вы можете сделать с лицом всё что угодно. Для этого в программе предусмотрены такие инструменты:
Использование текстуры для создания эффекта макияжа и добавление ретуши
Использование различных искажений, чтобы изменить форму лица (сжать, растянуть…)
Добавление 3D-объектов — заячьи ушки, усы и так далее
Использование редактора патчей для точного позиционирования объектов на лице
Использование контроллера воспроизведения анимации
Добавление интерактивности
Использование экспоненциального сглаживания — для регулировки движения
Хотите добавить венок в волосы или дракона на скулы?
Источник: Rusability
Что для этого нужно? Создайте эффект отслеживания лица «Face tracker». Поиск лиц в кадре и определение их точных координат — это одна из самых важных функций для создания масок.
К счастью, программа всё делает на автомате. Вам нужно:
1. Добавить функцию отслеживания движений. В левой панели в блоке «Scene» активировать функцию «Add Object». Найти в меню пункт «Face tracker» и нажать «Insert». Вы увидите, как появятся оси координат в центре лица. Теперь программа отслеживает все движения человека в кадре.
2. Отобразить маску на лице. Чтобы маска отобразилась на лице, в панели «Scene» кликните правой кнопкой на объект faceTracker0 и выберите пункт «Add», а потом — «Face Mesh». В результате программа выделит лицо в кадре и сделает из него шахматную доску-маску. На этом этапе вы можете растянуть маску, потянув за стрелки осей, а также изменить некоторые параметры на панели «Inspector» (например, убрать галочку с параметра «Eyes» или «Mouth», чтобы маска полностью покрыла глаза или рот соответственно).
1. Добавить функцию отслеживания движений. В левой панели в блоке «Scene» активировать функцию «Add Object». Найти в меню пункт «Face tracker» и нажать «Insert». Вы увидите, как появятся оси координат в центре лица. Теперь программа отслеживает все движения человека в кадре.
2. Отобразить маску на лице. Чтобы маска отобразилась на лице, в панели «Scene» кликните правой кнопкой на объект faceTracker0 и выберите пункт «Add», а потом — «Face Mesh». В результате программа выделит лицо в кадре и сделает из него шахматную доску-маску. На этом этапе вы можете растянуть маску, потянув за стрелки осей, а также изменить некоторые параметры на панели «Inspector» (например, убрать галочку с параметра «Eyes» или «Mouth», чтобы маска полностью покрыла глаза или рот соответственно).
Вы можете посмотреть, как это выглядит, нажав в Spark AR на «Test on Device» и «Send» напротив Facebook Camera или Instagram Camera. Когда маска загрузится на сервер, придет уведомление, и вы увидите себя в «шахматной реальности» в соответствующем приложении. Но вы же не остановитесь на достигнутом?
3. Выбрать материал. Перейдите на опцию faceMesh0 в блоке «Scene». На панели «Inspector» есть пункт «Materials», о котором мы рассказали во втором уроке. Выберите пункт «Create New Material», чтобы на панели «Assets» появился material0. Нажмите на него и пробуйте менять настройки на панели «Inspector». Например, поменяйте «Color» («Цвет»).
В этом рабочем пространстве вы увидите и другие возможности — различные текстуры (то есть изображения, которыми покрывают объекты), 3D-модели и скрипты. Параметров очень много, так что имеет смысл опробовать их самому. Например, опция «Shader Type» («Тип шейдера») влияет на то, как будет выглядеть маска. По умолчанию установлен параметр «Standard», который подходит для реалистичной симуляции 3D-эффекта. Можно выбрать «Blended» («Смешанный») — для смешивания текстур и цветов, «Flat» («Ровный») (тогда объект не будет реагировать на освещение), «Retouching» («Ретушь») — для ретуширования лица, «Face Paint» («Рисунок на лице») — для рисования на коже.
4. Поменять текстуру. Вы можете загрузить любое изображение, нажав на «Choose File From Computer» рядом с «Texture» в тех же настройках. Изображение автоматически растянется на всю маску. Главное — чтобы оно хорошо смотрелось с выбранным вами типом шейдера. Вы уже знаете, как проверить это в приложении.
5. Опубликовать вашу маску. Для этого вернитесь к последнему абзацу второго урока.
Подробно про «Сетку для лица» (Face mesh), использование шаблонов — шляпки, галстуки, очки; сценарии анимации и интерактивности.
3. Выбрать материал. Перейдите на опцию faceMesh0 в блоке «Scene». На панели «Inspector» есть пункт «Materials», о котором мы рассказали во втором уроке. Выберите пункт «Create New Material», чтобы на панели «Assets» появился material0. Нажмите на него и пробуйте менять настройки на панели «Inspector». Например, поменяйте «Color» («Цвет»).
В этом рабочем пространстве вы увидите и другие возможности — различные текстуры (то есть изображения, которыми покрывают объекты), 3D-модели и скрипты. Параметров очень много, так что имеет смысл опробовать их самому. Например, опция «Shader Type» («Тип шейдера») влияет на то, как будет выглядеть маска. По умолчанию установлен параметр «Standard», который подходит для реалистичной симуляции 3D-эффекта. Можно выбрать «Blended» («Смешанный») — для смешивания текстур и цветов, «Flat» («Ровный») (тогда объект не будет реагировать на освещение), «Retouching» («Ретушь») — для ретуширования лица, «Face Paint» («Рисунок на лице») — для рисования на коже.
4. Поменять текстуру. Вы можете загрузить любое изображение, нажав на «Choose File From Computer» рядом с «Texture» в тех же настройках. Изображение автоматически растянется на всю маску. Главное — чтобы оно хорошо смотрелось с выбранным вами типом шейдера. Вы уже знаете, как проверить это в приложении.
5. Опубликовать вашу маску. Для этого вернитесь к последнему абзацу второго урока.
Подробно про «Сетку для лица» (Face mesh), использование шаблонов — шляпки, галстуки, очки; сценарии анимации и интерактивности.
Приложения для создания масок на телефон
— бесплатные для iPhone
— бесплатные для iPhone
MSQRD — бесплатные анимированные маски для селфи-видео. Сильными сторонами приложения является качественная реализация, отсутствие рекламы и внутриигровых покупок. Сейчас в MSQRD всего около 15 масок. Но скромное количество контента компенсируется хорошей оптимизацией: каждая из масок идеально ложится на черты лица и вполне сносно повторяет ваши движения.
Разработчики (Yauheni Neuhen) заявляют, что продукт находится на этапе бета-тестирования, так что в скором времени появится новый контент.
Photo Lab — лаборатория фотоэффектов и фотоприколов. Приложение содержит более 800 фотошаблонов для создания веселых фотоколлажей и монтажей, красивых и стильных фотоэффектов, фотомонтажей с заменой лица и так далее. Фото не надо подставлять в шаблон вручную: вы просто выбираете нужный эффект, монтаж или рамку, добавляете фотографию из галереи (или же делаете новую с помощью камеры телефона) — и фотоэффект готов.
YouCam Perfect — фоторедактор, бьюти-камера для фотообработки. В YouCam Perfect есть фильтры, эффекты, коллажи, шрифты, стикеры и многое другое. Инструменты приложения позволяют менять фон, удалять ненужные объекты на фотографии, добавлять стикеры разных форм и цветов и так далее.
Cartoon Face — приложение для создания анимации лица и видео из фото. Поможет сделать забавную анимированную карикатуру, создать имитацию реалистичных эмоций на лице, пародийный портрет или шарж, применить мультяшный фильтр. В приложении простой и удобный интерфейс.
LOL-видео — изменяет лицо и голос. Приложение позволяет мгновенно создавать смешные видео: приделать себе огромную голову или выпучить глаза, добавить молнию или подводные эффекты, изменить свой голос на рычание гориллы или писк бурундука, добавить музыку и так далее.
Разработчики (Yauheni Neuhen) заявляют, что продукт находится на этапе бета-тестирования, так что в скором времени появится новый контент.
Photo Lab — лаборатория фотоэффектов и фотоприколов. Приложение содержит более 800 фотошаблонов для создания веселых фотоколлажей и монтажей, красивых и стильных фотоэффектов, фотомонтажей с заменой лица и так далее. Фото не надо подставлять в шаблон вручную: вы просто выбираете нужный эффект, монтаж или рамку, добавляете фотографию из галереи (или же делаете новую с помощью камеры телефона) — и фотоэффект готов.
YouCam Perfect — фоторедактор, бьюти-камера для фотообработки. В YouCam Perfect есть фильтры, эффекты, коллажи, шрифты, стикеры и многое другое. Инструменты приложения позволяют менять фон, удалять ненужные объекты на фотографии, добавлять стикеры разных форм и цветов и так далее.
Cartoon Face — приложение для создания анимации лица и видео из фото. Поможет сделать забавную анимированную карикатуру, создать имитацию реалистичных эмоций на лице, пародийный портрет или шарж, применить мультяшный фильтр. В приложении простой и удобный интерфейс.
LOL-видео — изменяет лицо и голос. Приложение позволяет мгновенно создавать смешные видео: приделать себе огромную голову или выпучить глаза, добавить молнию или подводные эффекты, изменить свой голос на рычание гориллы или писк бурундука, добавить музыку и так далее.
— бесплатные для Android
MomentCam — карикатуры и стикеры. Приложение может превратить селфи в забавную карикатуру. Перерисовывается именно лицо, которое потом можно совместить с различными картинками, попутно сменив причёску или увеличив нос. Есть возможность сделать из такого аватара гифку, выражающую различные эмоции.
B612 — достаточно мощный фоторедактор с массой возможностей. На выбор доступны десятки фильтров с настройкой интенсивности, инструменты автоматической подтяжки лица и сотни забавных масок. Многие из них активируются лишь при открытии рта.
Bestie — камера автопортретов. Bestie предложит более 100 фильтров, часть из которых можно подгружать в приложение лишь при необходимости. Причём скачиваются они пачками, достаточно выбрать тематику. Ручных настроек изображений здесь практически нет, а вот масок и AR-эффектов предостаточно.
B612 — достаточно мощный фоторедактор с массой возможностей. На выбор доступны десятки фильтров с настройкой интенсивности, инструменты автоматической подтяжки лица и сотни забавных масок. Многие из них активируются лишь при открытии рта.
Bestie — камера автопортретов. Bestie предложит более 100 фильтров, часть из которых можно подгружать в приложение лишь при необходимости. Причём скачиваются они пачками, достаточно выбрать тематику. Ручных настроек изображений здесь практически нет, а вот масок и AR-эффектов предостаточно.
Сервисы и программы для масок на компьютер
О сервисе Spark AR, с помощью которого можно создавать маски на компьютере, мы подробно рассказали выше. Это универсальный инструмент с огромными возможностями для создания масок.
Также стоит упомянуть о такой бесплатной программе, как Blender (для Windows, Mac и Linux). Blender — больше, чем просто редактор видео. Это полноценная и бесплатная студия 3D-анимации. Студия предлагает множество инструментов, например, переходы, настройка скорости, фильтры, слои и другие. В Blender вы найдете 32 слота для добавления видео, аудио, изображений и эффектов, благодаря чему сможете создавать очень сложные видео, которые можно использовать в коммерческих целях.
HitFilm Express — бесплатный редактор видео с полным 2D и 3D-композитингом, 410+ эффектов и пресетов, неограниченными треками и переходами. Инструмент предлагает бесплатные видеоуроки и проекты, понятные инструкции для быстрого освоения всех опций. Доступен для Windows и Mac.
Crello — бесплатный онлайн-редактор видео, изображений и анимации. С его помощью можно создавать в том числе и маски. Даёт доступ к более чем 25 000 шаблонов для всех самых популярных социальных сетей, блогов и маркетинговых форматов. Можно делать интересные изображения, видеоролики и анимацию для любых рекламных целей.
Также стоит упомянуть о такой бесплатной программе, как Blender (для Windows, Mac и Linux). Blender — больше, чем просто редактор видео. Это полноценная и бесплатная студия 3D-анимации. Студия предлагает множество инструментов, например, переходы, настройка скорости, фильтры, слои и другие. В Blender вы найдете 32 слота для добавления видео, аудио, изображений и эффектов, благодаря чему сможете создавать очень сложные видео, которые можно использовать в коммерческих целях.
HitFilm Express — бесплатный редактор видео с полным 2D и 3D-композитингом, 410+ эффектов и пресетов, неограниченными треками и переходами. Инструмент предлагает бесплатные видеоуроки и проекты, понятные инструкции для быстрого освоения всех опций. Доступен для Windows и Mac.
Crello — бесплатный онлайн-редактор видео, изображений и анимации. С его помощью можно создавать в том числе и маски. Даёт доступ к более чем 25 000 шаблонов для всех самых популярных социальных сетей, блогов и маркетинговых форматов. Можно делать интересные изображения, видеоролики и анимацию для любых рекламных целей.
Самые популярные маски в Инстаграм
Самые востребованные маски в инстаграм — с дополненной реальностью. AR-стикеры можно прикреплять к конкретному участку видео. 3D-наклейки двигаются, растут или уменьшаются по мере перемещения объектов, к которым их прицепили.
Популярны, например, космические маски от @johwska и @wardyworks, смешные маски от @lukehurd, необычные дизайнерские маски от @exitsimulation, маски-рандомайзеры от @kevinsttorm, сюрреалистические маски @frenetikvoid.
Маска — это не только залог забавных и необычных сторис, но и ненавязчивый инструмент пиара, способ поднятия важных общественных проблем. При использовании маски в левом верхнем углу рядом с её названием появляется ссылка на аккаунт создателя. То есть сторис любого человека с вашей маской станет рекламой вашего аккаунта.
Этим воспользовался в сентябре 2019 года журнал Glamour, презентовав праздничную маску в честь своего 15-летия и получив упоминания в топовых СМИ. Сейчас в аккаунте журнала коллекция масок.
Популярны, например, космические маски от @johwska и @wardyworks, смешные маски от @lukehurd, необычные дизайнерские маски от @exitsimulation, маски-рандомайзеры от @kevinsttorm, сюрреалистические маски @frenetikvoid.
Маска — это не только залог забавных и необычных сторис, но и ненавязчивый инструмент пиара, способ поднятия важных общественных проблем. При использовании маски в левом верхнем углу рядом с её названием появляется ссылка на аккаунт создателя. То есть сторис любого человека с вашей маской станет рекламой вашего аккаунта.
Этим воспользовался в сентябре 2019 года журнал Glamour, презентовав праздничную маску в честь своего 15-летия и получив упоминания в топовых СМИ. Сейчас в аккаунте журнала коллекция масок.
Компания Crello запустила серию эко-инициатив для тех, кто заботится о будущем Земли. Их первым продуктом стала Instagram-маска FaceofEarth. Это фановый инструмент с важным посылом: каждый, кто активирует маску в своем профиле, тем самым заявляет миру, что экологические проблемы ему не безразличны. Разработчики хотели, чтобы их AR-фильтр не просто менял лицо «потому что это стильно/модно/молодежно», а делал это со смыслом. В концепции FaceofEarth лицо человека при повороте головы меняется с «выжженой земли» на «цветущий оазис». То есть авторы визуализировали последствия влияния человека на планету.
Сторонники создания закона о домашнем насилии запустили флешмоб «Янехотелаумирать» и сделали специальные маски для историй в инстаграме.
Источник: In-Scale
Разработчиков масок можно найти в сообществе Spark AR на Facebook (38+ тыс.) или в Instagram-аккаунте Spark Creators (42+ тыс.).
P.S. В 2020 году еще можно успеть снять сливки с модного направления создания масок, но в сториз уже набирают обороты AR-игры. Еще чуть-чуть, и их персонажи выйдут за границы смартфона и проникнут в реальный мир. Но это уже совсем другая история.
P.S. В 2020 году еще можно успеть снять сливки с модного направления создания масок, но в сториз уже набирают обороты AR-игры. Еще чуть-чуть, и их персонажи выйдут за границы смартфона и проникнут в реальный мир. Но это уже совсем другая история.
Материалы по теме:
«За четыре маски я получил 500 000 рублей». Как я бросил школу и стал делать маски в Instagram
Как использовать Stories для бизнеса: учитесь у крупных брендов
Как увеличить аудиторию и узнаваемость бренда с помощью прямых эфиров в Instagram
5 мифов о работе с Instagram, которые мешают вам добиться успеха
«За четыре маски я получил 500 000 рублей». Как я бросил школу и стал делать маски в Instagram
Как использовать Stories для бизнеса: учитесь у крупных брендов
Как увеличить аудиторию и узнаваемость бренда с помощью прямых эфиров в Instagram
5 мифов о работе с Instagram, которые мешают вам добиться успеха
Татьяна Петрущенкова