ウソ穴 Ver 6 の作り方

## はじめに

個人開発`ウソ穴`の作り方を紹介します。

## ウソ穴とは

`ウソ穴`は、ライブ映像 or 動画とARを組み合わせて、壁に穴が空いた錯覚を作り出します。Webサイトなので、ユーザーはアプリのインストール無くウソ穴を使用できます。

## ウソ穴 Ver 6

今回は、Android端末でも動作実績のある Ver 6 を紹介します。

## デモ映像

ウソ穴 Ver 6 Type B で顔に穴を開けてみました。

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">見た目の涼を演出しようと、顔に穴をあけたのですが、『涼しい』って感じにならなかった。シースルーより貫通の方が涼しく見えると思ったのですが、、<a href="https://twitter.com/hashtag/%E3%82%A6%E3%82%BD%E7%A9%B4?src=hash&amp;ref_src=twsrc%5Etfw">#ウソ穴</a> <a href="https://twitter.com/hashtag/AR?src=hash&amp;ref_src=twsrc%5Etfw">#AR</a> <a href="https://twitter.com/hashtag/protoout?src=hash&amp;ref_src=twsrc%5Etfw">#protoout</a> <a href="https://twitter.com/hashtag/%E3%81%AA%E3%82%93%E3%81%8B%E9%81%95%E3%81%86?src=hash&amp;ref_src=twsrc%5Etfw">#なんか違う</a> <a href="https://t.co/jCjkVYfN1a">pic.twitter.com/jCjkVYfN1a</a></p>&mdash; j4amountain (@zsipparu) <a href="https://twitter.com/zsipparu/status/1299591228057481220?ref_src=twsrc%5Etfw">August 29, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


ウソ穴 Ver 6 Type A で壁に穴を開け、外のベランダの様子を見ました。

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">今日も危険な暑さなので、ウソ穴で窓を開けずに外が見えるようにしました。 <a href="https://twitter.com/hashtag/%E3%82%A6%E3%82%BD%E7%A9%B4?src=hash&amp;ref_src=twsrc%5Etfw">#ウソ穴</a> <a href="https://twitter.com/hashtag/AR?src=hash&amp;ref_src=twsrc%5Etfw">#AR</a> <a href="https://twitter.com/hashtag/protoout?src=hash&amp;ref_src=twsrc%5Etfw">#protoout</a> <a href="https://t.co/5NZXFrkk5a">pic.twitter.com/5NZXFrkk5a</a></p>&mdash; j4amountain (@zsipparu) <a href="https://twitter.com/zsipparu/status/1299914324794769408?ref_src=twsrc%5Etfw">August 30, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


## ウソ穴 Ver 6 Type A,B,C タイプ別の特徴

ウソ穴 Ver 6 は、TypeA,B,C の3種類あります。

- **ウソ穴 Type A / GStreamer**
    - ライブ配信と組み合わせたウソ穴
    - ライブ配信はGStreamerを使用
    - 映像遅延 : ライブ配信の遅延に依存
- **ウソ穴 Type B / 時雨堂 sora**
    - ライブ配信と組み合わせたウソ穴
    - ライブ配信は[`時雨堂`](https://shiguredo.jp/)さんの [`sora`](https://sora-labo.shiguredo.jp/) を使用
    - 映像遅延 : ほぼゼロ
- **ウソ穴 Type C / MP4動画**
    - 動画と組み合わせたウソ穴
    - 映像遅延 : 動画ファイル読み込みの時間が必要

## 構成図

それぞれの構成図を紹介します。

**ウソ穴 Ver 6 Type A / GStreamer**

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/274270/9b69d26c-7587-3327-8c1c-bd1dc454a43b.png)

**ウソ穴 Ver 6 Type B / 時雨堂 sora**

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/274270/77509bd8-2c08-c54b-f094-edaf36749190.png)



**ウソ穴 Ver 6 Type C / MP4動画**

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/274270/057589e5-aecc-9b19-1542-8ae2eeda7e8f.png)


## ソース

ソースは、githubに置きました。

- [ウソ穴 Ver 6 Type A / GStreamer](https://github.com/zgw426/usoana-public/tree/master/usoana6TypeA-GStreamer)
- [ウソ穴 Ver 6 Type B / 時雨堂 sora](https://github.com/zgw426/usoana-public/tree/master/usoana6TypeB-shiguredo-sora)
- [ウソ穴 Ver 6 Type C / MP4動画](https://github.com/zgw426/usoana-public/tree/master/usoana6TypeC-movie)


## 作り方

作り方は、ウソ穴 Ver 5 と同じです。それぞれのリンクは以下です。

### ウソ穴 Ver 6 Type A / GStreamer

作り方 -> [ウソ穴 Ver 5 Type A / GStreamer](https://qiita.com/zgw426/items/39fd3973ab8ce0a7e69c)

### ウソ穴 Ver 6 Type B / 時雨堂 sora

作り方 -> [ウソ穴 Ver 5 Type B / 時雨堂 Sora](https://qiita.com/zgw426/items/4a1f9ef19ab41a67c9b3)


### ウソ穴 Ver 6 Type C / MP4動画

作り方 -> [ウソ穴 Ver 5 Type C / MP4動画](https://qiita.com/zgw426/items/0116d7f4331dcf0ac29d)

![line.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/274270/03cd7412-7ae4-4322-caee-958edf573b5f.png)

ウソ穴の開発はつづく