サイトを開くと現れる立体的なCGグラフィックに思わず目を奪われます。キャンパスの建物と動く人々を俯瞰で見ているような立体アニメーションで、カーソルの動きに合わせて回転する効果が加えられています。非常にインパクトのあるファーストビューとなっていてしばらく見入ってしまうような効果的なデザインです。さらにこのファーストビューは固定背景になっていて、スクロールしていくと徐々に日が落ちて夜になるという面白い演出も加えられています。ページには大学の卒業制作展の内容が記載されていて、そのテーマに合わせたグラフィックになっています。とにかく見ていて楽しい工夫が施されたサイトに仕上がっています。
執筆者
カテゴリ
基本情報
学校・大学に関連するデザイン
-
「東京有明医療大学 OPEN CAMPUS」のホームページデザイン解説ホワイトをベースにネイビーをアクセントにしたサイトです。ファーストビューでは、東京有明医療大学に通う学生達の実習の様子が写っています。3本ラインのメニューボタンにて学習・研究、キャンパスライフなどを案内しています。トップページの中央に、東京...
-
「北海道大学 人間知×脳×AI研究教育センター」のホームページデザイン解説グレーをベースにグリーンをアクセントにしたサイトです。ファーストビューでは、北海道大学 人間知×脳×AI研究教育センターのロゴマークが表示されています。トップページの左サイドに、ニュースやイベントなどのメニューが出ています。トップページの中...
-
「MUSABI WEB OPEN CAMPUS 2020」のホームページデザイン解説ポップなイメージの図形や装飾がサイト全体に散りばめられていて、全体の雰囲気を作り上げる要素になっています。上部にはナビゲーションメニューが固定表示されていて見やすく、スムーズな閲覧が可能な設計です。メニューは色分けされていて、サイト内の要素...
サービスサイトに関連するデザイン
-
「buddies」のホームページデザイン解説ホワイト×ブラックをメインカラーに、スタイリッシュなイメージで構成されたサイトになっていて、その中にキーカラーとして鮮やかなパステルグリーンが用いられていることで、目に止まりやすく統一感のあるデザインにまとめられています。「About bu...
-
「Viens-là」のホームページデザイン解説ファーストビューでは円形のオブジェクトが画面上を浮遊しているような表現が展開されていて、ポップで可愛らしい演出になっています。円形のオブジェクトはカーソルの動きに反応した様々なモーションが加えられていて、スクロールした先では画像領域に変化し...
-
「TWKS」のホームページデザイン解説素早いテンポで切り替わるムービーがファーストビュー上に大きな領域で展開されており、インパクトのある演出になっています。スクロールしていくと大きくテキストが表示されて背景色も徐々に切り替わり、ファーストビューから大きな変化があって面白い表現が...
グリーンを使ったデザイン
- 「北海道大学 人間知×脳×AI研究教育センター」のホームページデザイン解説
グレーをベースにグリーンをアクセントにしたサイトです。ファーストビューでは、北海道大学 人間知×脳×AI研究教育センターのロゴマークが表示されています。トップページの左サイドに、ニュースやイベントなどのメニューが出ています。トップページの中...
-
「CHEVALIER Valentin」のホームページデザイン解説深いグリーンをメインカラーとしてサイトが構成されていて、上品で落ち着きのあるイメージが作り上げられています。上部に設置されたナビゲーションメニューは下スクロールで画面外に隠れて、上スクロールですぐに表示される仕組みになっていてスムーズな閲覧...
-
「Pitta!」のホームページデザイン解説メインビジュアルに配置したサービスロゴは背景を明るくぼかすことで、ツヤ感のあるロゴデザインと相まってスポットライトが当たっているような効果を演出しています。また同様の効果はナビゲーションバーにも施されていて、メインビジュアルに配置したアイコ...
ナチュラル・清潔感なホームページのデザイン
-
「メイテック」のホームページデザイン解説サイズ違いの画像領域が横に並んだファーストビューがオリジナリティのあるデザインになっています。画像領域では2面同時に画像が切り替わる仕様になっていて、それぞれに別の画像が表示されることで目に止まりやすい構成になっています。上部に設置されたナ...
-
「FORCAS」のホームページデザイン解説ホワイトマスクがかかったムービーがファーストビューで展開されて、動きがあることで目を引く演出となっています。上部に設置されたナビゲーションメニューは、下スクロールで画面外に隠れ、上スクロールで瞬時に現れる仕組みで、スムーズな閲覧が可能な設計...
-
「WOTA」のホームページデザイン解説鮮やかなブルー系のグラデーションカラーを用いて、ぼんやりとした波のような表現が展開されたファーストビューが美しく、見入ってしまうような演出によってサイトの導入として効果的な役割となっています。スクロールした先で表示される写真にはスクロールと...