インスタエフェクトを自作しよう!

Pocket

 

インスタグラムのストーリー機能の一つであるエフェクト、皆さんはどれくらい使っていますか?

エフェクトはパソコンとスマホがあれば意外と簡単に作ることができます。

この記事の目指すところは「エフェクトがちゃんと作動すること」です。

詳しい仕組みやプログラムの根拠は省きますのでご了承ください(私もわかりません)。

 

そもそもエフェクトとは

エフェクトとはストーリーの動画や画像を可愛く加工することができる機能です。

動画に色味を加えたり、メイク機能や輪郭補正ができるものもあります。

 

 

 

使用するソフト・アプリのダウンロード方法

今回使用するのは全て無料のソフトです。

 

 

【Spark AR Studio】

はじめにパソコンに「Spark AR Studio」をダウンロードします。こちらはエフェクトを作成するソフトです。

※Facebook社が提供するツールなのでFacebookのアカウントが必要になります。

Spark AR Studio

↑ここからダウンロード

 

続いてスマホにアプリをダウンロードします。

 

 

【Spark AR Player】

こちらはスマホでエフェクトの動作を確認するアプリです。

Spark AR Player

↑このページ下部からアプリをダウンロード

 

 

 

一番簡単なエフェクトの作り方

 

早速1つ作っていきます。一番単純な画像・文字を入れるエフェクトを作ります。

使いたい画像は透過画像(使いたいところを残して背景を切り取ったもの)としてパソコンに保存しておいてください。

 

①パソコンでSpark AR Studio を開き「New Project」→「Blank Project」を開く

 

②左メニュー中段「Add Object」→「Rectangle」を選択し「Insert」

 

③右メニューの「Material」を+で追加

④左メニュー「Material0」を選択→右メニュー「Texture」の「Choose File」から好きな画像を取り込む

◎取り込みたい素材の数だけ②〜④を繰り返す(二回目以降は④で「New Material」を選択)

⑤可愛い

 

 

次の文字の追加の仕方です

①「Add Object」から「2D Text」を追加します

②右メニューからテキストやフォント、位置を設定

③可愛い

 

画像・文字のエフェクトはこれで完成です。

これにアニメーションをつけたりタップで画像を変更することもできます。

その他【盛る】アレンジ

●美肌加工

肌の表面を滑らかにするエフェクトです。

 

①「Add Object」から「Face Tracker」を選択

②①を右クリックして「Add」→「Face Mesh」

③「Material」を追加して左メニューで選択→右メニュー「Shader」で「Retouching」を選択

④「Skin Smoothing」で調節

◎反応させたい人数分繰り返す

 

 

※「Face Mesh」→「Tracked Face」の数字は他と被らないように

※Materialは同一のものでOK

 

●デカ目加工

これは公式サイトで公開しているツールをダウンロードして使います。

Face Distortion and Retouching

「Download it to follow along」からダウンロードしてください。

 

①AR Studioの左メニュー下部「Add Asset」で先ほどダウンロードした「Face Distortion and Retouching」の「Unfinished」→「Object」→「Face Distortion Pack」を開く

②「Face Mesh」を追加して右メニュー「Deformation」から「Face Detortion Pack」を選択

③加工したいパーツをバーで調節する

 

 

●メイク加工

こちらはテンプレートを使います。

①はじめの画面で「All Templates」から「Makeup」を開く

②左メニュー「Makeup」→右メニューでメイクの色を変更・調節する

 

用語解説】

「Opacity」→不透明度

「Refrectivity」→反射率

「Lightness」→明るさ

「Sturation」→彩度

 

 

●他のメイクがしたい場合

Facemeshの土台をダウンロードしてお絵描きアプリでメイクを描き込み、顔に反映させる方法があります。

Face Mesh

こちらのページの「Download the Face Reference Assets here」からダウンロードします。

保存したファイルの「Face Assets」→「Texture」→「faceMeshTrackers.png」の素材を使ってメイクを作ります。

今回私はスマホのアプリ「ibisPaint」を使って作りました。

 

①画像を取り込む

 

②メイクを描き込む

※①のレイヤーとは分ける

 

①のレイヤーを非表示にして右下から「透過PNG保存」で保存

 

Spark AR Studioに戻ります

 

①「Add Object」から「Face Mesh」を追加

②「Material」を追加して左メニューから「Material」を選択し右メニュー「Shader Type」を「Blended」に変更

③「Texture」の「Choose File」で先ほどの画像を開く

④「Opacity」で不透明度を調節する

 

 

これの応用で頬にキャラクターを載せたりもできます!

最後にアプリで動作確認

①スマホで「Spark AR Player」を開く

②パソコンで左下のボタンから自分のスマホを選んで「Send」

 

③顔に反応するか、画像の位置が正しいか確認する

可愛い!!!

 

④動画を撮っておく(後で使います)

審査を受けて投稿

運営から審査を受けます。

 

①左下「Upload and Export」→右下「Upload」

②ブラウザでSpark AR Hubが開かれる

 

 

 

◎エフェクトの名前

◎Facebook・Instagramとの連携

◎カテゴリの選択

◎サンプル動画の選択

◎アイコンの設定

◎エフェクトの説明

 

 

を入力して「申請」を押したらあとは審査を待ちます。

審査は長くて1週間かかるそうです。

私が作った時は3時間ほどですぐ使えるようになったのでまちまちみたいです。

審査を通ると連携したインスタアカウントにエフェクトが表示されます。

エフェクトの公開・非公開やその他の設定はSpark AR Hubで変更が可能です。

これで使えるようになりました。

最後に

 

いかがだったでしょうか?

手順が多く面倒に思えるかもしれませんが1つ1つの操作は単純で、

ソフトが工夫されているので誰でも簡単に作ることができます。

テンプレートがいくつか用意されているため、初めのうちはそれらを使って素材を入れ替えるだけのエフェクトを作ってみるのも良いかもしれません。

段々と慣れてきてソフトの使い方の幅が広がると、より発展した機能のエフェクトを作ることもできます!

自分だけのオリジナルエフェクトを作って映えに映えたインスタを楽しみましょう〜

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です