palanARをフル活用して究極のWebAR名刺を作ろう!

1. palanARとは?

「palanAR(パラナル)」は本メディアを運営する株式会社palanが提供する、誰でも簡単にWebARを作成できるオンラインツールです。
AR名刺や商品プロモーションなど様々なシーンで使われるWebAR作成を行うことができます。作成できるARの種類は執筆時点で8種類。


操作が簡単なので、Web制作やAR作成の知識がなくても簡単に作ることが可能。

2019年のサービス開始以来既に1,500社以上、6,000以上のARを作成いただいています。

サービスURL: https://palanar.com

2.AR名刺を作ろう!〜構想編〜

今回はAR名刺を作成したいので、「ARマーカーあり」を使用する想定です。

作成するARのイメージは下記のような感じです。

  • QRコードを読み込むと作成者の顔とプロフィールが出現し、おしゃれなBGMが鳴り響きます。
  • また、同時にメールアドレスと電話番号のアイコンも表示されており、アイコンのタッチでメールを出す、または電話をかけることができます。
  • さらに画面をタッチすると、趣味や好きなものが表示されます。

こんな名刺があれば、相手には強烈なインパクトと共に覚えてもらえることでしょう。

3.AR名刺を作ろう!〜素材準備編〜

さて、上記のようなARを作るにはさまざまな素材が必要です。列挙すると…

  • 作成者の顔(画像またはCG)
  • プロフィール(画像)
  • メールアドレスと電話番号のアイコン(画像)
  • 趣味/好きなもの(画像)
  • BGM(mp3)

なかなか数が多いですね…!

今回はさまざまなフリー素材を組み合わせて作っていきたいと思います。(実際に素材を利用する際は、商業利用が可能かなどの利用規約にご注意ください!)

では早速準備していきましょう!

作成者の顔(画像またはCG)

今回はインパクトを出すために、3Dモデルを使用したいと思います。

使用するサービスはReady Player Meです。写真を一枚アップロードするだけでそれっぽいCGを作成してくれるサービスです。

「Enter hub」からメールアドレスを登録すると、アバターの作成画面に入ります。

画面に従って作成していくと…

なかなか存在感のあるキャラクターができました。

こちらをPCにダウンロードしましょう。画面右下のウインドウのマーク(赤枠部分)をクリックし、「Download Avatar as .glb file」をクリックするとモデルがダウンロードできます。

プロフィールなどの画像

次に、画像を作成していきます。こちらは「いらすとや」などのサービスを使っても良いですし、ペイントソフトやパワーポイントで作成しても良いでしょう。

ネットで検索すると色々な画像作成サービスがありますので、そちらを使用しても良いかもしれません。

さらに工夫して、動画やgifで動くようにしてもインパクトのあるものになります。

BGM

社歌やテーマソングがある会社にお勤めでしたら、社歌のデータを使用するのも良いでしょう。
本メディアを運営しているpalanには、残念ながら(?)社歌がないためフリー素材を活用します。

今回はこちらのフリーBGMサイトを利用させていただきました。

https://dova-s.jp/

4.AR名刺を作ろう!〜palanARで設定する編〜

さて、素材が揃ったところでいよいよpalanARで設定していきます。

基本設定

今回はARマーカーありを選択しましょう。また、プロジェクト名・URLは任意のものを使用します。
「AR配置のレイアウト」は名刺を選択します。(別のものを選んでも名詞としての作成は可能です。)

レイアウトの選択が済むと、女性と「よろしくお願いします!」の画像が出現します。

女性の画像を削除し、「Ready player me」からダウンロードした自分のモデルに差し替えます。

他にも、プロフィール画像もアップロードしましょう。

※電話やメールは別に設定するため、ここではアップロードしません。

 

タッチアクション

次に、タッチした際に情報が切り替わるようにしましょう。

最初に表示されていてほしい画像を選択し、画面右の「タッチアクション」から、「ARコンテンツの切り替え」を選択します。

次に、切り替え先の画像をアップロードし位置を調整してから、同じようにARコンテンツの切り替えを選択します。(場合によっては画像が重なるような見た目になります。)

コンテンツの入れ替えに番号が振られているのを確認してください。

 

これで表示設定は完了です!(保存を忘れずに!)

 

電話番号・メールを設定する

画面の左上にある、体験画面UI編集をクリックしましょう。

ここでは、常に画面手前に表示されるUIを設定できます。

まずは画像をアップロードし、位置と大きさを調節しましょう。
その後、タッチアクションから「電話発信」を選択、番号を入力していきます。

これで、画像をタッチすると携帯のコール画面に移動することができます。

メールも同じように、「メーラーの起動」を選択して設定します。

ちなみに、真ん中のボタンはシャッターボタンです。不要なら削除できますし、残しておいても良いでしょう。

シャッターを切るときにUIの画像を表示したままにしたい場合は、右上の「タイプ」を変更しましょう。

これで設定は終了です。保存を忘れずに!

BGM設定

次にBGMを設定します。画面左上の「プロジェクト設定」をクリックしましょう。下にスクロールしていくと、「BGM設定」の項目があります。ここに音源をアップロードします。

また、このままではBGMは再生されません。モーダルの使用が必須となります。

そこで一度前の画面に戻ります。「保存」を押すと、トップ画面に戻りますので、再び「AR編集」を押しましょう。

画面左上より今度は「モーダル編集」を押します。

モーダルの表示設定を「表示する」に変更し、文章を任意に変更します。

 以上で設定は終了です!(保存を忘れずに!)
お疲れ様でした!

5.完成!

AR体験ボタンを押すと、必要なマーカーとQRコードをダウンロードすることができます。(マーカーは「プロジェクト設定」より変更可能です。)

こちらを名刺に印刷すれば準備完了です!
注意事項としては、マーカーは大きい方が認識の精度がよくなります。なるべく大きく印刷するようにしましょう。
完成したのがこちら!(動画の音声は消してあります。)

他にもさまざまなARが作成できるpalanAR、ぜひご利用ください!