音とアニメーションの同期による没入型web体験
聴覚と視覚の連動が生む感覚的な心地よさの探究
メインビジュアル、あるいは
プロジェクトの最新の状態を視覚的に掲載
- Fukui Suzu
- Keywords：sound, Audio Visualizer, Immersive Websites
- オーディオビジュアライザーの試作
概要
これは何？
没入空間を体験できるWebサイト
背景と目的
- 普段、映像視聴やアプリ操作の中で、音とアニメーションが連動することで生まれる心地よさや安心感を感じる場面がある。このような聴覚と視覚の連動は、体験に一体感をもたらし、ユーザーに安心感や心地よさを与える要因の一つであると考えられる。
- 本研究では、音とアニメーションの連動によって生まれる感覚的な心地よさが、人々の没入感や自律神経にどのような影響を与えるかを探ることを目的とする。また、その効果を体験的に示すため、音とアニメーションを組み合わせたWeb上の没入空間を制作し、ユーザーが日常の中で一時的に心をリセットできるような環境を構築する。
コンセプト
聴覚と視覚の連動を用いた感覚的な没入体験
成果物の仕様
webサイト
制作ツール
HTML,CSS,JavaScript
GarageBand
プロジェクトの期間
2025.09.15-
まとめ
調査
現状調査
先行事例
技法・技術情報
プロジェクト管理
スケジュール
ガントチャート
ToDo
- テーマ案設定
- webサイト参考調査
- サイトマップ作成
- ワイヤーフレーム作成
- webサイト試作作成
- 音作り参考調査
- 音作り試作
- 映像参考調査
- 映像技法調査
- 映像試作
- web内コンテンツの最終作成
- コンテンツ取り込み
進捗記録
2025.10.06
取り組み
- webサイト試作
- 人々への影響をもたらすアンビエントミュージックの調査
- 音の可視化における波形・図形アニメーションの調査
webサイト
サウンド参考
アニメーション参考
2025.09.29
取り組み
- ToDo・スケジュール作成
- サイトマップ・ワイヤーフレーム作成
スケジュール
ガントチャート
サイトマップ
ワイヤーフレーム
#image(): File not found: "image.png" at page "福井涼/情報デザイン研究II"
2025.09.22
取り組み
- テーマ案整理
- 研究目的・コンセプトの設定
- スケジュール作成
- 現状調査
- 技法・技術調査
テーマ案整理
- 環境音と映像の組み合わせ
- 自律神経を整えるwebサイト
- web上で作る没入空間
テーマ案
音とアニメーションによって感覚的UXを実現するWebサイト制作
背景・目的
- 普段、映像視聴やアプリ操作の中で、音とアニメーションが連動することで生まれる心地よさや安心感を感じる場面がある。このような聴覚と視覚の連動は、違和感のない自然な体験を生み、使用者の感情を安定させる要素として作用していると考えられる。
- 本研究では、音とアニメーションの連動によって生まれる感覚的な心地よさが、人々の没入感や集中力の向上にどのような影響を与えるかを探ることを目的とする。さらに、その効果を体験的に示すため、音とアニメーションを組み合わせたWeb上の没入空間を制作し、ユーザーが空間的な気持ちの切り替えを体験できる環境を構築する。
コンセプト
音と動きで、感覚的な没入を生むWeb体験
現状調査
先行事例
技法・技術情報
2025.09.15
取り組み
キーワード
- 音楽、楽器、環境音、光・照明、心理学、絵本、比較、個性、素材、博物館
- 教育、都市、再利用
- 映像、サウンド、web、UI/UX
テーマ案候補
- 音色の違いによる心理的効果
- サウンドアートと映像表現がもたらす心理的効果
- 絵本と音の関係性
調査
事例
