見出し画像

【レポート】はじめてのAR空間の作り方!2Dだけで広がった新しい世界

AR/VRという言葉を聞く機会が増えてきました。
街中でも「AR/VRイベント」が開催され、より私たちの生活と身近になった様に感じます。

クリエイターの“つくる”を応援する支援サイト「CREPOS(クリポス)」では、ARやVRの制作をサポートする活動を行っています。

しかし、イラストを制作しているクリエイターからすると、まるで生きているかの様に動くイラストを見ると「自分のイラストもあんな風に動かせたら楽しそうだなぁ」と思うものの、

☑︎ プログラミングの知識ないし難しそう…
☑︎ 2Dイラストしか書けないし、私にはむり…
☑︎ ARとかVRが流行っているし、興味はあるけどよく分からない…

など、興味はあるものの難しそうで食わず嫌いになってしまうのが正直なところです。

今回の記事では、プログラミング経験のないイラストレーターのあやさんに、はじめてAR空間を制作体験いただきレポート記事としてまとめました!
はじめての制作を終えて、

・ARとは?VRとの違い
初心者でも簡単にAR空間が作れる「STYLY Studio」
実際にAR空間を初心者が作ってみたレポート
はじめての作品とその感想

をご紹介します。
「ARに興味はあるけど、スキルがなくてちょっと怖い」と思われているクリエイターさんの、ご参考にしていただければうれしいです。
それでは、どうぞ!

・・・

AR空間とは?どうやって作るの?

AR空間イメージ

ARとは?

ARとはAugmented Reality(アグメンティッド・リアリティ)の略で、現実を仮想的に拡張する技術のことを指します。
例えば、スマホで部屋を写した時、現実にはその場にいないアイドルだったり、動物などを実現しているように見せる技術です。

AR空間はどのようにして作るの?

アプリ開発からプログラミングをして作る場合もありますが、最近ではプログラミングの知識がなくとも簡単に作れるAR作成ツールがあるので、初心者でもAR空間を作ることができます。

ARとVRの違いは何?

VRとはVirtual Reality(バーチャルリアリティー)=仮想現実のことを指します。
ARでは現実の世界を主体として、その場に空間を追加しますが、VRはヘッドセットとヘッドフォンなどで現実を遮断して、仮想の世界を楽しみます。

初心者でも大丈夫!ノンコードでAR空間が作れるSTYLY Studio

STYLY Studio

STYLY Studioのご紹介

プログラミング知識がない初心者でも、ARコンテンツを作成できる無料ツールが「STYLY Studio」です。
Adobeソフトの様に、多少の癖はありますが、わかりやすいチュートリアルがあるので、基本知識を簡単に覚えれば誰でもウェブ上で操作することができます。

初心者でも簡単!STYLY Studioでできること

「STYLY Studio」では、

☑︎ VR/ARコンテンツの制作、公開
☑︎ オブジェクトの修正・変更

ができます。
コンテンツ制作時に使えるギミックの紹介や、他のアーティストの作品一覧もあるため、自身のコンテンツ制作の前にイメージを広げることもできます。

AR/VR制作を応援する「CREPOS XRサポートプログラム」では、「STYLY Studio」をはじめとする制作ツールの使い方などをより深く学べるVR/ARアーティストを目指すためのオンライン講座「NEW VIEW SCHOOL ONLINE」を特別価格で提供中です!

ここからは、イラストレーターあやさんにはじめてのAR空間制作をレポートしていただきます!

・・・

2DイラストレーターがはじめてのAR空間を作ってみた!

まずはチュートリアルで小手調べ

STYLY Studio

初心者の私は右も左もわからず、自力でAR空間を作るのは無理があると判断したので、まずは「STYLY Studio」になれるためチュートリアルで動かし方を学びました。

☑︎ ツール自体をどうやって動かすのか
☑︎ 何ができるのか

をゲーム感覚で学ぶことができます。
簡単なAR空間の概念もこのチュートリアルで理解できるので、ARコンテンツ作り初心者であれば、まずはチュートリアルから始めるのがおすすめです!

チュートリアルにはステップがあり、全てのステップをクリアする頃には、初心者ながらツールの使い方は理解できました!

ツールを使うこと自体は難しくないのですが、今まで制作してきた2Dとは
平面立体という概念の違いがあるので、そこが少し苦戦した点です。
Illustratorなど2Dのツールでは、イラストAの横にイラストBを配置しようと思ったら、ただ横に入れればいいのですが、AR空間では、横というだけではなく、奥行きだったり上下の空間もあるので、見え方を考えながら配置するのがなれるまで少し大変かもれません。

とはいえ、ツールの使い方自体はとても簡単で直感的に操作できるので、チュートリアルは1時間もかからずクリアできました!
新しいことに挑戦するのは、最初は不安で億劫だけど、初めてしまうとワクワクして楽しめちゃうので不思議ですね。

2D、GIF動画コンテンツの制作

コンテンツイメージ

チュートリアルでおおよそのツールの動かし方と、空間の作り方が理解できたら早速、自身のコンテンツ作りに取り掛かります!
私は3Dのイラストが作れないので、今回は2DイラストとGIF動画を組み合わせた作品を作ることにしました。
とはいえ、せっかくのAR空間なので、その特徴を生かして、顔パネルの用にリアルの世界も入れられる構成にしてみることに!
お正月が近かったので、モチーフは2023年の干支であるウサギにしました。

2DやGIF動画のコンテンツは、AR空間用に特別な事をする必要はなく、いつも通りの制作でOKです!

ただ、作ってみて解ったのは、全体の構図を考えたイラストを用意しておいた方が良いという事です。

私は、それぞれ単品でイラストとGIF動画を制作したので、実際に「STYLY Studio」にイラストなどを入れ込んだときに「なんだかバランスが悪い…」となり、イラストの修正や追加をしました。
最初から手書きなどでも、空間全体の構成を作っておけば2度手間にならずよかったなぁというのが、初めてのAR空間制作での反省です。

ARなので、3Dのイラストでないといけないのかなぁと思っていましたが、普段描いているイラストでも作れるのは安心でした。

─・─・─・─・─・─

GIF動画を入れれば、動きも出せる!

GIF動画

GIF動画とは、静止画をコマ割りして連続再生した「動く静止画像」です。Photoshopを使い作ることができます。
アニメーションを作れなくとも、静止画を組み合わせることで動くコンテンツを作れるので表現の幅が広がります。

「STYLY Studio」でもGIF動画を取り込むことができます。
2Dのイラストだけだと少し物足りない感じがしますが、2DでもGIF動画にすると動きが出て、一気に画面が華やぐのでおすすめです。

─・─・─・─・─・─

STYLY Studioに2Dイラストを配置

STYLY Studio

2DイラストとGIF動画が完成したので、実際に「STYLY Studio」にはめ込んでいきます。

チュートリアルでツールの使い方は予習済なので、自身の制作イラストのはめ込みは迷うことなくスルスルと制作できました。

「STYLY Studio」には、独自の3Dイラストも素材として提供されているので、足元だけリアルな草の3Dイラストを配置して、その中に自身の2Dイラストを入れるなど、アンバランス感を楽しむAR空間を作っても面白いかもしれませんね!

スマホでAR空間をチェック

STYLY Studio

「STYLY Studio」では、スマホでAR空間が見れるように自動でQRコードを発行してくれます。部屋の明るさや、物の有無でARが映り難かったりはするのですが、私の家でも無事、自分のAR空間を確認することができました!
自分の作った世界が目の前に広がっていると思うと感動です!

まずは、制作した2Dイラストをはめ込んでみて、実際にAR空間を自分のスマホでチェックしながらブラッシュアップしました。
実際にスマホで読み取ってみると、距離感や大きさが思っていたのと違う場合があるので、実物を実機でチェックできるのは便利ですし、他の方にはどういう風に見えるのかもわかるので安心でした。

公開設定で見た目を整える

STYLY Studio

作ったARコンテンツを公開する際に、

☑︎ 作品のタイトル
☑︎ 作品の説明
☑︎ 作品のキャプチャー画像

の設定をしました。
タイトルは英語のみなので、こだわらず、説明文をわかりやすいように心がけました。キャプチャー画像は、ARをそのままキャプチャーにすると少しわかりずらかったので、Illustratorでキャプチャー用の画像を制作しました。
こちらは2Dで問題ないので、普段のように簡単に制作できます。

さらに、「STYLY Studio」ではプロフィール画面の設定もできるので、

☑︎ アイコン画像
☑︎
プロフィール画面用のキャプチャー画像
☑︎
簡単な自己紹介
☑︎ リンクにCREPOSのプロフィールページ

の設定もしました。

─・─・─・─・─・─

STYLY StudioのマイページはCREPOSと連動できる!

CREPOS

CREPOSはSTYLY Studioのリンクを記入することができます。
CREPOSでファンになってくれた方が、STYLY Studioの作品を見てくれるように設定しておくのがおすすめです。

私の作品もCREPOSのポートフォリオからご覧いただけますのでよかったらAR作品を体験してみてください。

─・─・─・─・─・─

はじめてのAR空間完成!

はじめてのAR空間

── あやさん、素敵なAR作品をありがとうございました!
はじめてのAR空間を作ってみて、率直な感想を聞かせてください。

あや:全くAR空間制作の知識がない私に、人に見せられるような作品が作れるのかと不安でいっぱいでしたが、実際にSTYLY Studioを使ったAR空間作りは、わかりやすいチュートリアルもあり、基本動作はすぐに覚えられて、意外と簡単でした。
自分のイラストがいつもと違う表現で、スマホ越しに浮かんで表示されるので感動しました!

── 表現が変わると、また違った形で、キャラクターなどが活きますよね!
今回は、いつも制作されている2DイラストとGIF動画のみでAR空間を表現していただきましたがいかがでしたか?

あや:作っているうちに、
「3Dイラストにも挑戦してみたいかも…」
「ギミックを使って表現の幅を広げたい!」

などやりたいことが、どんどん湧いてきました!

── STYLY studioの特徴は、
☑︎ わかりやすいチュートリアルがあって基本動作は簡単に覚えられる
☑︎ 2Dイラストだけでも、工夫次第で楽しい作品が作れる
☑︎ 今後、勉強すればもっと広い表現方法ができる
ですね!

あや:そうです!
思っていたよりも気軽に楽しく制作することができたので、食わず嫌いで、挑戦しないのはもったいないです!
特に、プログラミング経験のないイラストレーターにとって、難しいアプリ開発を省き、ツールで簡単に作れるのはありがたい限りです。

── STYLY studioは無料で使えるので、今ある作品をAR空間化するだけでも一度チャレンジしてみるのがおすすめですね!

・・・


CREPOS XRサポートプログラム

XRクリエイターを目指すクリエイターのみなさまのために、有力な情報の発信やお仕事の機会の創出などの各種支援を行っています。ぜひご参加ください!

★ お仕事依頼受付中 ★

イラストデザインのご依頼なら
クリエイター10,000人登録のCREPOSへ!

キャラクターデザイン・イラスト・似顔絵・ロゴ・WEBデザイン
絵本・VR・ARコンテンツなど
豊富なコンテンツの制作実績がございます。

企画ご提案から見積りや相談を承っておりますので、
CREPOS運営事務局までお気軽にお問合せください。
crepos_operation@i-freek.co.jp

この記事が気に入ったらサポートをしてみませんか?