超簡単どこでもフォトスポット化　WebARでインスタ映えスポットを5分でつくってみた

## 1.ショッピングセンターの空き区画は死活問題
### 1-1.空き区画問題
当社は、テナント数が10～30店ほどの小型ショッピングセンターを多く運営しています。
昨今の経済状況の影響もあり、テナントの入れ替えも多く、どうしてもテナントが入らず、空き区画が発生することに頭を抱えています。
空き区画では賃料収入が入らないことも問題ですが、それ以上に問題なのが集客です。

ショッピングセンターに来たらシャッター商店街みたいってガッカリしますよね。
### 1-2.空き区画のインスタ映えへの道のりは険しい
何か良い案はと探し、シャッターアートにたどり着きました。

https://www.yomiuri.co.jp/local/fukuoka/news/20210720-OYTNT50070/

インスタ人気いいですね。
ハロウィーンやクリスマス時期に設置するフォトスポットも、ファミリーや女性に人気です。
壁一面アートになっていたらインスタ映えすること間違いなし。
なんですが、実際こういう取り組みは既にしているのです。
しかし、非常にハードルが高いのが実情。

* 臭いや汚れの関係でペンキなどの塗装は不可。
* 次のテナントが入ることを考えてすぐ撤去できるもの。
* 業者に頼むと料金が高い。

壁に直接描けないので、ポスターなど貼って剥がすせるものが必須になるんですが、
デザインから設置を業者にお願いすると1か所十数万円かかります。
しかも1度剥がしたら再利用不可と考えると、費用対効果的にかなり厳しいのです。

### 1-3.ARはショッピングセンターを救う(かもしれない)
空き区画ばかりの状況を想像するたびに
『ネットでも買い物できるし、時代はメタバース。わざわざショッピングセンターに行く必要ってある？』
という現実に突き付けられることがしばしばあります。
そんな時、会社からの帰り道、普段あまり人の多くない通りにスマホを覗く人々の群れがいました。
Pokémon GOのレアポケモンが出るようです。
これだ。
AR(拡張現実)ならわざわざ家から出る理由が作れる。
ショッピングセンターにARがあったら絶対楽しい！
というわけで作っていきます。

## 2.超簡単にWebARをつくる
### 2-1.palanARを使ってみました。
今回利用するのはノーコードで簡単にWebARを作成できるサービス「palanAR(パラナル)」です。

palanAR

https://palanar.com/

※WebARとはWebブラウザ上でAR(拡張現実)を体験できる技術です。
専用のアプリがなくてもで、スマホやタブレットをかざすだけで手軽にAR体験ができます。

出来たものがこちら
![C0A0BAEC-B8BD-4D78-A92C-6FB25CE5A88C.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668122/591845e8-d724-d2b5-7140-a99f9576d823.gif)



すごい！本当に超簡単に作れます。

↓こちらのQRをスマホで読み取って
![QR.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668122/381719d7-8930-9f27-dbec-9fb4e1a60fdd.png)
↓こちらの画像を読み込むと実際にできますよ。お試しください。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668122/8ebbfecc-b3eb-c535-cc82-e9710e68e860.jpeg" width="400">

### 2-2.制作過程
今回は特定の画像を認識すると表示されるARを制作しました。

アカウント作成/ログイン
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668122/551c7e2b-a1f5-8ba2-e10e-a03689460fee.png)

AR新規作成
![8C7771DF-1CCD-4136-9460-441EF8A0F6F2.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668122/28a3b7a6-ca50-6d5d-854c-840deb40a07e.jpeg)


画像認識を選択
![AB8554F7-671E-43EF-9AB1-29EEF61D1315.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668122/0071a615-3b71-4575-0675-480f9d17e308.jpeg)
プロジェクト名/URL設定
![ADE01C9C-8190-4DC7-A711-EAF1B183C7C6.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668122/6fc9710d-9ae5-f931-d10b-03e1ea0d4510.jpeg)

自由に作成を選択
他に名刺にARを表示したり、動画を表示させたりもできるテンプレートも用意されています。
![081AD645-5CAF-498D-B1E0-F8D955B7388F.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668122/abe092da-0682-8fa8-3f4e-00011969d05d.jpeg)
今回は社内に沢山貼ってあったポスターをマーカーにしました。
![18EFF607-B215-4C42-A551-1DE9B5ED2D30.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668122/70bf81df-af78-1fa1-fb00-92b3df43280f.jpeg)
この画面で３Dモデル、エフェクトの設置、プロパティで３Dモデルの配置の調整などを行います。
今回は6月なので雨に濡れないショッピングセンター内に雨を降らせてみました。
![536A433A-5BCE-4DFD-A998-452075339486.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668122/ffb466ed-e702-77ff-f45a-5bd1bcb734d9.jpeg)

保存した後にAR体験を押して完成です。
![P9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668122/f3c172f1-eb41-5321-a162-22495c86bab1.png)





### 2-3.制作中の難関
超簡単に作れると言いつつも、３Dモデルの扱いに慣れていないのでここが1番苦戦しました。

https://twitter.com/am003004/status/1538363352208273409?s=20&t=L-cTkfm_gs6CYdKEbJanDw

大きさや縦横の配置、奥行きの配置などは作りたいものによって変わってきます。
今回はフォトスポットとして利用したかったので、被写体とカメラとマーカーの位置関係によって、調整が必要でした。
完成したものは、狭い本社内で調整をかけていたので、被写体とカメラの距離が1メートル(バストショット)くらいでしたが、実際にショッピングセンターでとなった場合、被写体とカメラの位置が2～3メートル(全身が入る)くらい離れることを想定しての調整が必要となります。



## 3.実際にインスタ映えを体験してもらう
### 3-1.試してもらった人の感想
せっかく作ったのでQRコードをいろんな人に渡して使ってもらいました。

#### まずは制作中、お試し撮影のために手伝ってもらった自部署の人たち
私「ちょっとそこ立っててください」
Mさん「何ですか？何されるんですか！？」
私「映え写真を撮ります」パシャ
Kさん「何それ！私もやりたい！」
調整のための撮影でしたが周りの人も興味津々で集まってきたので、
QRコードを渡したら、自分のスマホで撮影会が始まりました。
ARすごい。

#### 営業の20代女性
実際にショッピングセンターでの販促企画を担当している方に試してもらい、簡単に作れることを伝えたところ
Bさん「めっちゃいいですね。すごく楽しい。イベントのフォトスポットで活躍しそう」
Sさん「無料で試せるのが良いですね。フォトスポットって値段が高いので、これならパソコンとコピー機があればすぐ作れるし、
営業担当から色々アイディア出そうです。」

#### ショッピングセンター勤務のパートさん
LINEにてQRコードを送付して試してもらいました。
Wさん「早速撮ってみました。イイ感じです！無料で作れるのすごい」

### 3-2.大人も喜ぶ出来栄え
今回はすべて無料テンプレート内での作成だったので、「子供だまし！」と言われることを覚悟して試してもらいましたが、みなさんとても良い表情で写真を撮ってくれています。
出来た写真を見せてもらうとポーズも取って楽しそう。
これは本当に実装できちゃうのでは！？
### 3-3.提案書を作りました。
提案書を作って営業に共有をしました。

総務部に掲示許可をもらって本社の廊下にQRも貼ってみました。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2668122/13819f4b-f38e-4704-29dc-5b9518a55d22.png" width="400">


## 4.手作りも変わっていく
提案書を今回お話を聞いてくれた営業のふたりにメールしましたのでうまくいけば、全国水平展開されるかもしれません。
今回、ARを作りながら、私がショッピングセンター勤務をしていた5年前を思い出していました。
その頃は、参加費無料の手作りイベント企画を毎月何本も考えていました。
楽天で縁日セットを仕入れてヨーヨーすくいをやってみたり、百円ショップで材料を購入して、工作イベントをしてみたり、という些細なイベントです。
費用は一人当たり100円以下に抑えつつも子供たちに喜んでもらえるよう色々工夫をしていました。
ツールは異なりますが、WebARも企画の考え方は全く一緒です。
テクノロジーを怖い難しいと思わず、こんな風に取り入れていけるのはとっても楽しいなと思いました。

こんな気持ちが社内で伝われば良いのですが。