奥会津只見 イラスト美術館 只見町にある3つの駅（只見駅、会津蒲生駅、会津塩沢駅）周辺を題材に、絵はがきを使った WebAR の制作を進めています。
このシリーズでは、その制作過程を2週間に1回のペースで記録していきます。制作の中で行った 3D モデリングや Web の学習内容もまとめていきます。
なお、学習内容はあくまで制作中のメモに近いもので、技術解説を目的とした記事ではありません。
気長にお楽しみください。
今回のテーマ
第0回となる今回は、実制作の内容に入る前に、何を作ろうとしているのかを整理します。
なぜこの企画をやるのか
まず、自分自身が WebAR に興味があることです。
そして、只見町を題材にした WebAR を作り、只見のイラストの絵はがきを手にした方に、これまでとは少し違う楽しみ方をしてもらえたらと思ったことです。
WebARについて（palanARを使った試み）
WebAR とは、スマートフォンのカメラなどを使って、現実の風景や物の上にデジタルな演出を重ねて表示する仕組みです。
Web 周りの実装が難しそうだと感じたため、まずは 他の題材で、palanARを使ってみました。palanAR というサービスを使うと、比較的簡単にWebARができます。
その時に試した WebAR は、床や机などの平らな場所を認識して表示するものでしたが、今回は 「絵はがきを目印にするAR」 を使います。
スマートフォンのカメラで絵はがきを写すと、そのイラストを目印にして、画面の中に 3D モデルや演出が重なって表示されます。
WebAR 上の物体をタップすると、その場所やモチーフの解説ページに飛べるようにして、気になったところから自然に見てもらえる形にする予定です。
今回、対象を3つの駅周辺にしたのは、palanAR の無料プランで同時にできる WebAR が3つまでだった、という理由です。
将来的には、Web周りの実装も自前でしたいので、その学習も並行して進めていきます。
モチーフ構成の例（現時点の想定）
ここでは、現時点で考えているモチーフ構成を、駅ごとに整理しています。
※ 自作の犬キャラクター「シロ」は、すべてのWebARに共通して登場する予定です。
会津蒲生駅周辺
使用する絵はがき
蒲生岳の麓にカタクリが群生し、
登山客が小さく描かれている
「蒲生岳かたくり公園」
3Dで作りたいもの
- 蒲生岳
- 只見線車両
- 蒲生駅と線路
- カタクリの花
- 蒲生花輪踊りの花輪
只見駅周辺
使用する絵はがき
只見駅を走る只見線に、
人々やかかしが手を振っている
「只見線にみんなで手を振ろう条例」
3Dで作りたいもの
- 只見駅
- 要害山
- 滝神社や三石神社
- ひめさゆり
- 只見線車両
- 手を振るかかし
会津塩沢駅周辺
使用する絵はがき
河井継之助のイラスト
「河井継之助」
3Dで作りたいもの
- 河井継之助のイラスト
- 河井継之助記念館
- 河井継之助のお墓
- 会津塩沢駅
- 滝湖・十島
- 只見線車両
参考イメージ（これまでに試してみたもの）
これまでに制作していたWebAR や 3D モデリング、簡単なアニメーションの例です。参考イメージとして代表例を載せておきます。
WebAR（仕組みの確認）
palanAR で行われていたコンテストに応募するために制作したWebARです。
床や机などの平らな場所をスマートフォンのカメラで写すと、その場所を目印にして、画面の中にデジタルの物体が表示される仕組みの AR です（平面認識）。
スマートフォンでWebARを表示し、画面上のアイテムをタップすると、外部の解説サイトへ移動する、という流れを試しました。
ミニ雪像製造工場 の動画
実際にスマートフォンで操作したときの画面を、動画で載せています。
動画では、画面下に表示されているボタンをタップしながら操作しています。
①スノードームのアイコンをタップすると、スノードームが持ち上がり、
②作業開始ボタン を押すと、ミニ雪像製造工場が稼働し始めます。
さらに、
③「ミニ雪像の作り方」サイトへ のボタンをタップすると、このWebARの解説ページへ移動する流れになっています。
ミニ雪像の世界へようこそ。のサイト
WebAR 上の水色のボタン（「ミニ雪像の作り方」サイトへ）をタップすると表示される解説用の Web サイトです。
※応募者に提供される有料コンテンツのサービスを使用したため、現在WebARの動作確認はできません。
モデリング・アニメーション（基礎練習）
今回の蒲生駅周辺のアイテムのモデリングを進める中で、3D空間上に不要なデータが大量に出たり、思うように形を作れなかったりすることが続きました。
そこで一度立ち止まり、チュートリアルを使って基礎から確認することにしました。
モデリング
それまでは、やりたいことをサイトなどで索引しながらモデリングをしていたため、操作の基礎ができていない事を痛感しました。そこで、「ミニチュア作りで楽しくはじめる 10日でBlender 4入門」を購入し、完成まで仕上げました。
チュートリアルを見ながら完成させたモデリング
参考にしたチュートリアル本
ミニチュア作りで楽しくはじめる 10日でBlender 4入門
アニメーション
チュートリアルを参考にパックマンを動かしました。モデリングツールであるBlender内でもアニメーションが制作出来ます。
チュートリアルを見ながら進めたアニメーション
参考にしたチュートリアル動画
最初に見てよかった！blenderアニメーション基本のキ【用語や作り方をゼロから解説】
次回の記事について
下記の内容を予定しています。
- モデリングに取り掛かっている会津蒲生駅周辺のアイテムの紹介
- Web周りの学習について進捗
おわりに
このシリーズは、
- 途中の試行錯誤を残すこと
- 完璧を求めて作業を滞らせない
を目的にしています。
この記事は
「絵はがき × WebAR 制作ログ」シリーズの第0回です。
第1回以降は、進捗に応じて内容を分けて書いていきます。
