「たらむび -インタラクティブ映画のススメ-」
“観る”だけじゃない、新しい映画の形「インタラクティブ映画」の魅力を紹介するwebサイト、webコンテンツ
メインビジュアル、あるいは
プロジェクトの最新の状態を視覚的に掲載
- Nao Kukita
- Keywords：インタラクティブ映画, 映画の新たな楽しみ方, webサイト
- https://www.example.com
概要
これは何？
「インタラクティブ映画」という新たな映画の楽しみ方を、より多くの人に周知してもらうためのwebサイト、webコンテンツ
背景と目的
2025年2月、日本初のインタラクティブ映画が公開されました。実際に劇場で鑑賞したところ、観客自身が物語に介入できるという新しい体験に大きな感動を覚えました。
現代のエンターテインメントは、イマーシブシアターやVRコンテンツなど、体験者が深く没入できることを重視する傾向が強まっています。インタラクティブ映画は、こうした流れの中で、これからの時代を代表する新たなエンターテインメントの形になると感じています。
そこで、インタラクティブ映画の魅力をより多くの人に知ってもらい、その可能性を広げるために、情報を発信するウェブサイトを制作することにしました。
本サイトでは、インタラクティブ映画の仕組みや魅力、体験レポートなどを紹介し、より多くの人にその世界への興味と関心を持ってもらうことを目指します。
コンセプト
成果物の仕様
webサイト、web上で遊べるノベルゲーム
メンバー
制作ツール
illustrator、HTML、CSS、Twine
プロジェクトの期間
2025.04.08 - 2025.07.01 webサイト部分の完成
2025.08.01 - 2025.12. ゲームの実装、最終完成
まとめ
調査
現状調査
- インタラクティブ映画に関する調査
- インタラクティブとは、利用者がパソコンやスマートフォン、タブレット端末等の情報通信機器を利用する際、対話を行うように操作を進めていく形態を指す。加えて、情報の送り手と受け取り手が、相互にコミュニケーションを図れる状態にあることを、インタラクティブと呼ぶ。インタラクティブ(Interactive)とは、「相互の」「双方向の」を意味する英単語である。
- インタラクティブシネマ(インタラクティブ映画)
インタラクティブシネマとは、映画のようなシナリオと映像演出を持ちながら、プレーヤーが自らストーリーを進行させてゆくことのできるマルチメディアコンテンツのことである。映画とコンピューターゲームの中間的存在であるといえる。映画のように映像やストーリー性の高いコンテンツに対して、こちらから働きかけることができるという感覚を得ることができる。
- 2025年2月21日、日本初のインタラクティブ映画『ヒプノシスマイク -Division Rap Battle-』が劇場で公開された。4月16日には興行収入12億を突破した。（映画業界では、興行収入10億円がヒットの基準と言われている）
ニュースサイトやテレビ番組でも取り上げられており、関心が集まっていると感じている。
先行事例
- インタラクティブ映画の紹介サイト
- 既存のサイトでは、インタラクティブ映画に注目、特集したサイトは見つけられなかった。特定のインタラクティブ映画のレビューや記事などは見つかる。
- web上で遊べるインタラクティブな体験・ゲーム
- NEAL.FUN web上でさまざまなゲームが遊べるサイト。
いくつかゲームが遊べるが、その中でも世界中の人が参加できる投票ゲーム lets settle this と、トロッコ問題をモチーフにした自分で選択していくゲーム absurd trolley problemsは、インタラクティブ映画の楽しみ方に近いと感じた。・ユーザーが自分で選択肢を選ぶ点、投票率を見ることができる点など…
- NEAL.FUN web上でさまざまなゲームが遊べるサイト。
技法・技術情報
プロジェクト管理
スケジュール
- 工程表(OneDrive)
- 5/20,5/27 1Q審査
- webサイトのデザインカンプ、掲載する情報の完成
- プレゼン資料
- 7/1,7/8 1Q審査
- webサイト部分の完成
- webサイト部分の完成
ToDo
進捗記録
2025.05.13
プロトタイプの作成
- プロトタイプ(figma)
- 指摘していただいたこと、気をつけること
- 余白や行間を、サイトのコンセプトに合ったものにする
- サイト内の画像や情報の引用元は確かにしておく
- スマホで見ることを想定 小さい画面のため、情報の連続性や視認性を意識
サイトのロゴ
- 最終案
- コンセプトとしては「気軽に触れてほしい」「敷居を低くしたい」
- ゆるく、可愛らしい とっつきやすいイメージ
次回までにやること
- ロゴ、シンボルの完成
- プロトタイプのブラッシュアップ
2025.04.29
ワイヤーフレームの作成
- 指摘していただいたこと
- PC向けの配置になっているため、スマホ基準にする
- 画像は正方形〜縦長に
- スマホの一画面を一コマと考える
- PC向けの配置になっているため、スマホ基準にする
サイトタイトルの決定、背景と目的・コンセプトの整理、記載
- サイトタイトル「インタラクティブ映画のススメ」
- 「インタラクティブ映画」というワードを入れ、分かりやすいように
- 「⚪︎⚪︎のススメ」という定番のフレーズで親しみやすく
2025.04.22
「Twine」「Github」を使用したブラウザゲームの調査
- webデザインの授業にて、HTMLやGithubを活用した。気軽に体験してもらう・メインのサイトから誘導しやすいようにweb上で完結する簡易的なブラウザノベルゲームを作成。
- Twineの調査
webサイトの構成
- サイトに載せたい情報、実装したい要素の整理
- インタラクティブ映画とは何か
- インタラクティブ映画の歴史
- 日本初のインタラクティブ映画「ヒプノシスマイク」の紹介
- 実際に自分が映画を見た感想のレポート
- 現実世界とのリンク 記念日や「聖地」
- 「インタラクティブ映画風」の体験を提供
- TwineとHTMLを使用した、web上で遊べるノベルゲームの実装
- インタラクティブ映画用のアプリで見られる情報(選択肢を選んだ割合、他の観客との一致率など)を表示
- サイトマップの作成
- 各ページのタイトルは検討中のため、一旦内容をそのまま表記
- 各ページのタイトルは検討中のため、一旦内容をそのまま表記
制作スケジュールの設定。工程表の作成。
- 作業量を鑑み、前期〜後期を通しての制作に決定。
- 前期でwebサイトの作成、記事の準備
- 夏休み・後期を使ってゲーム部分の作成、実装
2025.04.15
どんな形でまとめるかを検討
- webサイト
- 日本初のインタラクティブ映画『ヒプノシスマイク -Division Rap Battle-』を中心に、インタラクティブ映画の歴史や魅力を紹介し、新たな映画コンテンツの楽しみ方を知ってもらう。
- 先行調査：既存のサイトでは、インタラクティブ映画に注目したサイトは見つけられなかった。特定のインタラクティブ映画のレビューや記事などは見つかる。
- web上で「インタラクティブ」な体験を提供
- クリックで選択肢を選びストーリーが進んでいくサイトで体験してもらう？ ゲームブックに近いかも
- ストーリーなどはChat GPTを活用
インタラクティブ映画に関する調査
- インタラクティブとは、利用者がパソコンやスマートフォン、タブレット端末等の情報通信機器を利用する際、対話を行うように操作を進めていく形態を指す。加えて、情報の送り手と受け取り手が、相互にコミュニケーションを図れる状態にあることを、インタラクティブと呼ぶ。インタラクティブ(Interactive)とは、「相互の」「双方向の」を意味する英単語である。
- インタラクティブシネマ(インタラクティブ映画)
インタラクティブシネマとは、映画のようなシナリオと映像演出を持ちながら、プレーヤーが自らストーリーを進行させてゆくことのできるマルチメディアコンテンツのことである。映画とコンピューターゲームの中間的存在であるといえる。映画のように映像やストーリー性の高いコンテンツに対して、こちらから働きかけることができるという感覚を得ることができる。
「一方通行ではなく、相互に影響を与える」
- インタラクティブ作品の歴史
- 『I’m Your Man』 1992年12月18日公開
- 『Late Shift』 2016年3月9日公開
- 『ブラック・ミラー：バンダースナッチ』 2018年12月28日公開
- 『Traces of Responsibility』 2024年公開
- 『ヒプノシスマイク –Division Rap Battle-』 2025.2.21公開
2025.04.08
研究テーマ案
- 「インタラクティブ映画」をもっと広めたい
- 「観る」から「関わる」になった、新しい映画の楽しみ方を知ってほしい。
- 都市伝説・オカルトを通して情報伝達方法の面白さを知ってほしい
- 口伝から本、写真、新聞、ラジオ、テレビ、ネットなど、都市伝説は情報伝達の歴史、変遷を象徴するものだと思う。都市伝説を通じて情報伝達の歴史の面白さを感じてほしい。
- 「カカポ」という生き物のことを広めたい
- 世界で最も絶滅の危機に瀕している鳥の一種の「カカポ（フクロウオウム）」について知ってもらいたい。
- 世界で最も絶滅の危機に瀕している鳥の一種の「カカポ（フクロウオウム）」について知ってもらいたい。
raf.jpeg
waiya2.png
waiy.jpg
waiya.png
