Подробный рассказ, примеры на гифках и исходники.
Привет! Меня зовут Павел, я делаю маски в инстаграм и решил для TJ сделать туториал по созданию простой маски.
На днях TJ написал о том, что создание масок для «Историй» в Инстаграме стало доступно для всех желающих. Сейчас я расскажу, как сделать простую маску всего за 15 минут.
Для начала нам понадобится программа Spark AR. Она есть для macOS и Windows, скачать можно тут. После установки запускаем Spark AR и авторизуемся через аккаунт в Фейсбуке. После этого у вас появится приветственное окно.
В правом нижнем углу нажимаем «Create project».
Мы попали в интерфейс Spark AR, пока ещё непонятный и страшный. Для начала добавим трекер лица. Нажимаем «Add Object» и в открывшемся окне два раза щёлкаем на «Face Tracker».
Теперь у нас есть трекер лица, с помощью которого наши элементы будут изменять своё местоположение при движении.
Теперь нам нужно добавить изображение, которое будет отображаться перед глазами. Для этого опять же нажимаем на «Add Object» и в открывшемся окне два раза щёлкаем на «Rectangle».
У нас в Сцене (Scene) под «Face Tracker» должны появиться «canvas0» и «rectangle0». Нажимаем на «canvas0» и перетаскиваем в «Face Tracker», чтобы «canvas0» стал подгруппой.
Чтобы «canvas0» следил за лицом, нужно в правом блоке, в «Mode», выставить «World space».
Отлично, теперь полотно двигается вместе с лицом. Теперь нам нужно сделать маску. Скачиваем «faceFeminine.jpg» отсюда и открываем этот файл в Adobe Photoshop или Adobe Illustrator.
Делаем прямоугольник, который закроет глаза, и что-нибудь придумаем в нём. Я сделал плашку «No signal».
Наша маска почти готова! Теперь выключаем слой с лицом и экспортируем маску на рабочий стол в PNG. Закидываем наш файл в текстуры.
Далее объясню коротко, так как вы уже немного знаете интерфейс Spark AR. В левой панели кликаем на «rectangle0». Далее в правой панели нажимаем на плючик рядом с «Materials».
У нас появился материал — теперь полотно залито белым цветом. Сейчас мы это исправим. В правой панели кликаем на «material0», в левой панели в «Texture» выбираем наш файл.
Теперь на полотне отображается наша текстура, но она слишком маленькая. Чтобы это исправить, в левой панели кликаем на «rectangle0», а в правой панели в «Size» изменяем размер. В нашем случае я поставил 420x420.
Мы в шаге от успеха! Осталось только поправить положение маски.
Для этого ставим видео на паузу, что делается в левом верхнем углу окна. После этого нажимаем на «canvas0» и редактируем высоту нашего полотна.
Подсказка: зелёная стрелочка перемещает полотно вверх/вниз, красное — вправо/влево, синее — вперёд/назад.
Наша маска готова! Теперь скачайте Spark AR Player на телефон, подсоедините его в компьютеру и отправьте маску на телефон для теста.
Всё отлично! мы протестировали маску, и если всё нас устраивает, то сохраняем её. В верхнем меню нажимаем «File». Проверяем, что маска не превышает максимальный размер, и нажимаем «Export». Сохраняем маску в любом месте.
Далее мы переходим в Spark AR Hub. В правом верхнем углу нажимаем на кнопку «Загрузка эффекта» и следуем инструкции. Там всё легко и объясняется.
Спасибо, что прочитали этот туториал. В него было вложено много сил: если хотите, чтобы я рассказал, как сделать более сложные и крутые маски, то подписывайтесь на мой инстаграм. У меня там скоро будут новые крутые масочки.
Вопросы писать можете здесь в комментариях или мне в директ.
Маску зелёного слоника сделать бы))0)
Там всё легко) Можно и её сделать
Ничо не понял.
Давай с простого начнём: сколько к ВВП страны добавляет создание такой маски?
Если человек после этого заинтересуется 3D-софтом или анимацией, то потом может начать изучать эти области сам и в итоге уйти в графику для кино и рекламы, например. Так что потенциал увеличения ВВП имеется
А зачем для такой простой маски столько действий? На самом деле всё куда проще:
1. Создаёшь объект FaceTracker — он сразу отслеживает лицо;
2. Создаёшь объект Plane — он будет самой «маской»;
3. Делаешь Plane зависимым от FaceTracker перетаскиванием;
4. Создаёшь материал для объекта Plane;
5. Добавляешь свою картинку No Signal в текстуры.
6. Да, это всё.
Это подробный туториал для тех, кто вообще ни разу не запускал Спарк Эйар. Я когда захотел сделать в первый раз маску, я наткнулся на такой же "туториал" как у тебя. Поверь, нихера не понятно.
На телефоне тестить необязательно — с этим слишком много гемора (нужно скачать приложение на андроид, включить режим разработчика, подключить телефон к компу по USB и ещё разрешить режим отладки по USB). На macOS можно просто врубить режим симуляции по веб-камере: и сразу в реальном времени смотреть, как на тебе сидит. Включается этой кнопкой:
Если что, тут за 3 минуты можно подглядеть, как сделать нечто посложнее
https://sparkar.facebook.com/ar-studio/learn/documentation/tutorials/quick-start-guide/
подскажите пожалуйста, если маска расплылась на все лицо. Как исправить. спасибо
Мне помогите
доброе утро
https://tjournal.ru/internet/111500-maski-dlya-instagrama-novyy-instrument-samovyrazheniya-teper-ih-mozhet-sdelat-lyuboy-no-eto-ne-tak-to-prosto
не читай
@
комментируй
эй урод че статью не читаешь и комментируешь
Комментарий недоступен
Доброе! Статья же не месяц назад была опубликована) Я только сейчас собрался и сделать туториал.
Я может уже старый, но может кто-нибудь объяснить, что это за маски и нахуя они нужны?
Сложный вопрос на который нету ответа.
Это загадка человечества
Ну воспитывать ребенка и учиться сложно, как и работать, легче нахуй в телефон зависнуть и смареть чужие жизни
Если этот видос сделан для этого комментария, то респект.
Комментарий недоступен
Вдохновляйтесь уже готовыми масками) Это как веб-дизайнеры вдохновляются на Беханс)
ПОМОГИИИТЕЕЕЕ )
В общем сделала маску, на превью с телефона вся картинка размазана, но с компа все видно. Что это может быть?
Если еще актуально, то надо слева щелкнуть на нужную текстуру
Справа появится окошко и в нем поставить "флажок" No compression
Хехе, картинка Рамзана
Я могу только такую маску посоветовать, в принципе очень похожа на ту что вы хотите
https://www.instagram.com/a/r/?effect_id=2507810826117010
Комментарий недоступен
Не, могу и телегу указать)
Можно тег инстаграм и отписаться или забанить его
Можешь пожалуйста подсказать в чем проблема? И с твоей маской такое и когда свою загружаю в текстуры...
когда загружаю свою текстуру пишет это
Хз. Но судя по ошибке, что-то с папками))
Не добавляются текстуры в Spark. И вообще никакой файл, постоянная ошибка.. Почему так?...((
Ольга получилось решить проблему?
Как делают макияж, звездочки, реснички?
не получается загрузить текстуру в программу, выдает ошибку
Попробуй убрать кириллицу из пути к файлу.
Удалось решить проблему?
подскажите как в конце закрепить результат, т.е. я хочу добавить текст на лоб или там под глаз ,только не понимаю как его там сохранить.Заранее спасибо
Светлана, вы имеете ввиду что текст не движется за лицом?
Блин, реально столько пришлось перерыть, чтобы найти простую инфу - работает только под Win 10. Что за ересь
Добрый день. А в чем проблема может быть, при предпросмотре все ок (видна четко надпись) а потом одобряют, а в инсте все размыто, вместо текста каша мутная?
Добрый! Отправьте в телеге мне скрин и фотку
Здравствуйте) Пыталась сделать маску-текст под глазами,проверяю уже на телефоне,а она расплывчатая...Не пойму что делаю не так. Можете подсказать?
Здравствуйте! Сделала маску-текст под глаза, начала проверять через телефон и она показывается расплывчато... Не пойму почему... Можете подсказать?
как уменьшить размер маски?она слишком большая
у меня не потдерживается ( у меня Windovs( я наверное не правильно написала))
Подскажите пожалуйста, куда нажать что бы ужать файл при экспорте? (превышает вес)
как решить вопрос, если Spark не может импортировать эффект png из фотошопа.
СПАСИБО! НАУЧИЛСЯ ЧТО-ТО ДЕЛАТЬ В СПАРК.
Добрый день! Сделала маску, на IOS запускается, на Андроиде почему-то нет. По ходу не могу подобрать правильные параметры в текстурах( Можете помочь?
Напишите мне в телеграм, пожалуйста https://t.me/theskor
Здравствуйте. Подскажите, сделала маску рандомайзер, с цитатами великих людей. Стала загружать, а мне отказ пришёл, якобы избыточный текст содержится в предварительном видео. Что делать не знаю. У многих в инстаграме маски на подобе моей.
Лена, напишите мне в телеграм, пожалуйста https://t.me/theskor
Прога только для 10 винды?? А есть что-то на 8?
Онли 10 винда
здравствуйте! подскажите, как решить проблему с тем, что маска с текстом не проходит одобрение? знаю, что по правилам его использовать нельзя. но в инстаграме масса таких масок, и они прекрасно работают)
Здравствуйте, а что делать, если высвечивается такое?Может, кто то уже сталкивался с таким.
Текстура не хочет принимать не какие фото
Подскажите пожалуйста как требовать зубы,например хочу сделать их золотыми как у travis Scott как это сделать?
Я новичок
Почему никто не указывает, что программа работает только на win 10?! 😕
Разве только на 10 винде? Ну может тогда стоит поставить последнюю версию винды, т.е. 10?