サイト内の世界観を視覚を通して体験できるインタラクティブなwebサイト
ユーザーがWebサイト内の世界を体験できるインタラクティブな架空の映画館のwebサイト
近年webサイトのアニメーションや演出の幅が広がり、様々なものが生まれている。演出の幅が広がることでユーザーの動きが反映させたりサイトとスマホを連動させたり、３DCGや記事を拡張する機能など様々な表現ができるようになった
さらにアニメーションについて研究することでより効果的に情報を伝たり、より複雑な情報をわかりやすく伝えたりする方法を研究したいと考えたから
映画館というモチーフを使ってwebサイトのアニメーションを多用したインタラクティブなサイトを作り、新しい表現方法によってユーザーにwebサイトを通した体験から得られる情報を増やしつつ、新しい表現方法を見つけてさらに没入感のあるWebサイトを提供するため
映画館には様々なコンセプトの映画がありアニメーションとの相性もよく、作品の世界観に引き込みやすく没入感を提供しやすい
架空の映画館という特殊な設定のwebサイト内で、ユーザーにアニメーションを通して体験と情報を提供する
Windows11
iPadPro
Figma
HTML
CSS
Javascript
プロジェクトの期間｜2024.04.12 - 2024.12.20
現状調査の時点でインタラクティブという言葉やJavaScriptの知らなかったアニメーション、GitHubのAIを使った機能を知ることが出来てよりWebに関する知識を深めることが出来た
Webサイトに載せる映画の選定や謎解きを考える作業が難航しており遅れ気味なので、今後相談したり先行事例をさらに詳しく調べて遅れを取り戻したい
テーマ決めのための調査
技術に関する情報収集
映画のポスターの制作
映画の選定
サイトマップ・ワイヤーフレームの作成
webサイトのコーディング
中間発表準備
最終発表準備
修正・手直し
https://ac-bu.info/happening/
https://dozo-gift.com/
https://uniam.jp/
カラーパレット
Figmaインタラクションの作成
