2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

プリズン・ブレイク シーズン5 第9話(最終話)『瞳の奥』のあのシーンを再現するべくWebアプリ『Open the gate with Michael!』を制作した。

Last updated at Posted at 2022-11-20

前書き

「プリズン・ブレイク」

皆さんの中にも作品を愛し、マイケル・スコフィールドを愛した方もいるだろう。
例に漏れず私もその一人だ。
プリズン・ブレイクは、ウォーキングデッドほどではないが、5シーズン90エピソードで構成されており、一通り見るには一度深呼吸をし、覚悟を決めなければ最後まで見切ることができないような長編ドラマである。

私はそれを、5周した。
5回、1からプリズン・ブレイクを見たのだ。
周りからは、「他の作品も色々見ろ」と言われたが、5回も見ることができるほど価値のある作品なのである。

今回制作したシーンだが、90エピソードある90話目の一部にあたる。
プリズン・ブレイクについて詳しく知りたい方や気になる方は、もちろんご自身の目で一度見ていただくことを推奨するが、Wikipedeiaも参考いただけたらと思う。

主人公のマイケルが、とある悪の組織に我が息子を奪われてしまう。
息子がいる部屋は顔認証でゲートが開く仕組みになっており、その組織の幹部であるポセイドンと名乗る者ののみが入室することができる場所であった。

マイケルの手の甲には既に、息子を救うべくポセイドンの顔をモチーフとしたタトゥーが描かれており、それを顔の前にかざすことによって顔認証のスキャニングに成功し、扉が開くのだ。

私は初めてそのシーンを見たとき、鳥肌が立つなんて簡単な言葉では片づけることができないほど、なんて素晴らしく、圧倒的なのだろうと感嘆した。

手の甲にタトゥーを掘る予定はまだないが、手の甲を顔の前にかざしたときに扉を開くといったシーンを再現することはできるため、今回制作にあたった。

制作に至った背景

現在Webアプリケーションの制作を学んでおり、その中でブラウザ上で機械学習を利用できるml5というものを知った。
そこで、ml5に関わるものについて現状Qiita上にどんな記事があるのだろうと調べてみたところ、こんな記事を見かけた。

素晴らしい。
自分が好きなものを全力で作られている。

私も何か似たようなものを作りたい、そう考えたときに思いついたものが、今回のプリズン・ブレイクのシーンである。

制作したアプリケーション

まずはご覧いただきたい。

手の甲を顔の前にかざすと、扉が開く音が鳴る、という仕様だ。
(はじめはスキャニング成功、のような音源を流したかったのだが、ちょうど良いものが見つからず断念した。)

image.png

動作は下記を参考いただきたい。

  • Succeeded:両手の甲を顔の前にかざした場合
  • Failed:何もしていない、また片手のみをかざした場合

スクリーンショット_20221120_211350.png

使用したもの

  • ml5.js
  • CodePen
  • Teachable Machine
  • netlify

使用してみた感想

上手く作動したときはとても嬉しく男心をくすぐった。
私はこれから息子を救うのだ、そのためにこのタトゥーを事前に用意していたのだ、、。
実に素晴らしい。
前述したが、今のところタトゥーを掘る予定はないため、体験することができただけでも楽しかった。

後書き

今回は機械学習を活用したWebアプリケーションを制作したが、実に容易に実装することができた。
機械学習に係る部分で躓くことはなく、スムーズに進めることができた(それ以外の部分はてんでダメだったが)。
また、Teachable Machineの使用するモデル作成も作業自体は非常に簡単だったため、プログラミング初心者には有難い内容であった。

夢の一つを叶えることができたため、それではこれから第6周目に突入でもしようかと思う。

2
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?