MainTitle
SubTitle ・・・・・・・・・・・・・・・・
メインビジュアル、あるいは
プロジェクトの最新の状態を視覚的に掲載
- 興梠 媛愛
- Keywords:Web, 感情, CSS, JavaScript
概要
これは何?
背景と目的
コンセプト
成果物の仕様
制作ツール
- MacBook Pro
- Adobe XD
- Visual Studio Code
プロジェクトの期間
2024.04.09 -
まとめ
調査
現状調査
先行事例
技法・技術情報
プロジェクト管理
スケジュール
ToDo
進捗記録
2024.04.16
調査
- 動きのあるサイト5選
- 喜と楽の違い
- 怒の表し方
- 怒を感じさせるよりも取り除くページにしたいが、その他の喜・哀・楽は感じさせるページにしたい(クリックした際に怒のみ目的が異なってしまう)
- 哀の表し方
- 寂しさ・悲しみを連想するようなイメージ
- 詩的な感じ
- マイナスの方にも取れるが静かで落ち着けるような雰囲気にしたい
- 窓ガラス越しに雨を降らせる
企画部分メモ
- 概要
- 背景・目的
- 感情を全面に出して表現できる人は少なく、制御したり偽ったりして生きている人の方が多いと感じる
- 閲覧することで感情を共有したり、今ある感情を落ち着かせたりすることのできるWebサイトにする
- ストレスなどのマイナスの感情が多い世の中で、プラスの感情を動かすようなWebサイトにする
- コンセプト
- 喜怒哀楽をベースとして、見ることで感情が刺激されるWebサイト
- 色や動きで感情変化を表す
2024.04.09
調査
キーワード
- Web 動きのあるサイトデザイン 見せるサイトと魅せるサイト
- Webサイトには、情報を正確に早く伝えるためのデザインと、見る人の感情を動かすようなデザインが存在している
- 感情を刺激するデザイン
- 喜びや楽しみ、安らぎなどプラスの感情
- 不安や恐怖などのマイナスの感情
- 参考サイト
- 名古屋造形短大卒展
・背景の人の動きや時間の流れがのどかさ、楽しさを刺激する
・アニメーションがあるためローディングが長い
- TBS
・スクロールによって場所が変わり、楽しさを刺激する
・アニメーションがあるためローディングが長い
- Panasonic
・マップ上の数字にカーソルを合わせると追加情報が出る
・アニメーションがあるためローディングが長い
- 卒業制作 Peep
・部屋の様子が時間の流れによって変化する
・カーソルの色が変わる部分をクリックすると状況が変化する
・ゆっくりする時間を体感できる
- 卒業制作 Normotion Graphics
・ドラッグ&ドロップで映像を動かすパズルのようになっている
・実際に動かすという行動によって楽しさを刺激できる
- 情報デザイン研究I 黒い金魚
・スライドすることによって進む物語
・場面ごとに背景のアニメーションが変化する
- 待ち時間を安らぎにするローディングのデザイン
- 待ち時間を少なくするためのデザインまたは、待ち時間が苦にならないようなアニメーション
- 参考サイト
- AIを使用したデザイン
- Adobe IllustratorやPhotoshop に搭載されているAIの機能を使用
- 何か仮想の目的をもとに雰囲気の異なるものをどれくらい生成できるのか
- 言葉での理解が難しい単語の表現