お部屋の空気をもっと快適にしませんか?

飛び出す『ARクリスマスカード』を手作り!しかもとっても簡単!

雑記
この記事は約7分で読めます。

本記事では、AR(拡張現実)を使った飛び出すクリスマスカードの作り方について解説します!とても簡単なのでみなさんぜひ挑戦してみてくださいね!

ARクリスマスカードとは?

紙で飛び出すクリスマスカードを作ろうとしたんです。こういうやつです。

でもなんか、普通じゃつまらないなと思って考えていました。そこで思いついたのが『ARで飛び出すクリスマスカード』です。

アカペン
アカペン

なんか技術的で面白そうだしね。

早速ですが、できたのがこれです!

雪の結晶と光が描かれているだけのカードから、
サンタが飛び出したー!!
アカペン
アカペン

思いついてから作業時間1.5時間としてはなかなかの出来!

ARクリスマスカードの作り方

それでは早速作り方の説明に移りたいと思います。

今回、ARを簡単に使用することができるサービスを提供している『サイバネットシステム株式会社』のcybARnetを利用しました(無償チャンネルは2つまで)。

また、今回画像作成には特殊なソフトは使用せずパワーポイントのみを使用しました。

ARを使用するための準備

まずは、cybARnetのサイトからユーザーの新規登録を行います。

登録してログインすると、下記のような画面になります。

私の場合、既に1チャンネルを使用しているため、無償チャンネル作成可能数が1になっていますが、無償で2つまでチャンネルを作成することができます。これで、ARのチャンネルを作成する前段階までの準備ができました。

カード側の絵と飛び出す絵の準備

クリスマスカードの絵柄や構成はみなさんのアイデアによって様々だと思いますが、ここでは例として私が今回作成したもので説明します。当初作ろうとしていた、紙の飛び出すカードと同様、何もない所からサンタが出てくるようにしたいと考えました。

カード側の準備

カード側は、何もないと寂しいのでクリスマスをイメージさせる雪の結晶や光を表現しようと思いました。まず、今回のカードははがきサイズにしようと思うのでパワーポイントのデザインタブスライドのサイズから『はがき 100x148mm』を選択します。

そこに、挿入タブ、図形から四角を追加しスライド枠と同じ大きさにして背景色にしたい色で塗りつぶします

次に雪の結晶をフリー素材からダウンロードしてきて、背景の上に置きます。私は白色で使いたかったので、図の形式タブから色の変更で白を選択しました。さらに、図の形式タブ図の効果光彩のオプションから白を選択することで、雪の結晶から光が広がるような表現をしました。次に、図形から星4pt組み合わせて光を表現しました。星4ptには黄色の光彩を入れ、円にはぼかしを入れて重ねることによってぼやっとした光になりました。

この図を背景の四角形を含めて全て一つのグループにし、それを画像として保存します(ブロック上で右クリックすると出てきます。)この時注意しなければいけないのは、背景となる画像では透明度を扱えないためJPEG形式で保存してください(保存形式のプルダウンから選べます)。

また、サイバネットシステムからチャンネルを使用させて頂くにあたり、作成したチャンネルを呼び出すためにQRコードを用いています。ですので、カードにもそのチャンネルを呼び出すためのQRコードを載せたほうがチャンネルにアクセスしやすいのでQRコードのスペースを確保しておきましょう

カード側の作り方(右下にQRコードのスペースを確保)

飛び出す側の準備

はじめは、サンタだけにしようと思っていましたが、それだけだとちょっと寂しいので、クリスマスのポップも入れることにしました。フリー素材でサンタクロースとクリスマスのポップを探し、パワーポイントのスライドに挿入します。挿入した図のサイズと配置を調整し、グループ化してカード側と同じように図として保存します。なお、飛び出す側は透明度が扱えますのでPNG形式(デフォルト)で保存してください。※フリー素材を探す際にも背景が透明の絵を探すことによって、ARで表示させたときにより浮いているように見えます。これで、絵は完成です。

飛び出す側の作り方

飛び出すクリスマスカードのチャンネル作成

それでは、先ほど登録してログインしたcybARnetのウェブページからチャンネルを作成していきます。

まずは、新規チャンネルを作成をクリックします。新規チャンネルでは以下のようなコンテンツを選択できますが、今回は画像/インページ動画を利用しています。

画像/インページ動画を選択すると、次の画面に移動します。画面左下の+マークをクリックし、背景となる画像をアップロードしてください。アップロードには30秒程度かかるようです。

背景画像のアップロードが完了したら、次に右上のimageをクリックし、飛び出させたい画像をアップロードします。

飛び出させたい画像のアップロード直後は下の図のようになっていますが、これから赤枠内のPositionの数値を調整し、飛び出させたい絵をARで見せたい位置に調整します。

私の場合は、斜めに飛び出るようにしたかったので、最終的に次のような設定になりました。ここを調整する際は、みなさんの絵に合わせて左のプレビューを確認しながら調整を行ってください。

xyz
Translation080200
Rotation-4500
Scale0.40.40.4
Positionの設定(私の場合)

ここまで完了したら、画面右下のCreateをクリックして作業を完了させてください

すると、チャンネル情報の入力画面になりますが、特に意識せずコンテンツ名だけ入力すればよいと思います。ただし、公開にチェックを入れないとアプリで認識してくれませんのでご注意ください。さらにここでCreateをクリックすると次のQRコードが表示されます。このQRコードはアプリを通じてチャンネルを呼び出すためのものです。ですので、このQRコードを右クリックして画像をコピーし、背景の画像でQRコード用に開けておいたスペースに貼り付けてください

作成したチャンネルを実際に見てみよう!

作成したチャンネルを自身のスマートフォンで見るためにはARnexという専用アプリが必要となります。以下からアプリをダウンロードすることができます。

App Storeはこちらから

Download on the App Store

Google Playはこちらから

Google Play で手に入れよう

次に、先ほど作成した背景画像をカードになるように印刷しましょう

アプリを開いてスタートを押すと「ARnes対応のQR又は画像をかざしてください」と出ますので、印刷したカードのQRコードにかざすと、チャンネルを読み込むことができます。

そして背景画像全体が写り込むように動かすと、、、あら不思議、何もない背景からサンタとメリークリスマスの文字が飛び出しました!

説明はこれで以上となります。

まとめ

本記事では、クリスマスに向けて何か面白いものが作りたいという考えから、簡単にそして面白いクリスマスカードを思いついたので作り方をご紹介させていただきました。

今回は2D画像を使用しましたが、動画や3Dも読み込み可能ですので、みなさん是非色々なアイデアで作成していただけたらと思います。

もし、作成してみたよって方がいましたら是非コメント欄で作品を公開していただけたらとてもうれしいです。

アカペン
アカペン

なんか、わくわくするものがつくれた気がする。

コメント

タイトルとURLをコピーしました