トップページをスクロールすると現れる学校紹介の項目が各学校ごとに色分けされてうまく写真を組み合わせた表示になっているのが、サイト全体が鮮やかになる効果と、色分けによって閲覧しやすい効果を生んでいて気持ちよく閲覧できる構成となっています。各校ごとに下層ページが用意されていて3,4つのリンクボタンがそれぞれ配置されていることでページ遷移がスムーズになる仕組みとなっています。さらにスクロールしていくと様々なコンテンツが用意されていて、サムネイルリンク写真の表示があり、カーソルを合わせると画像上に説明が表示される効果も実装されて非常に見やすい効果的な表示が考えられています。
執筆者
カテゴリ
基本情報
学校・大学に関連するデザイン
-
「東京有明医療大学 OPEN CAMPUS」のホームページデザイン解説ホワイトをベースにネイビーをアクセントにしたサイトです。ファーストビューでは、東京有明医療大学に通う学生達の実習の様子が写っています。3本ラインのメニューボタンにて学習・研究、キャンパスライフなどを案内しています。トップページの中央に、東京...
-
「北海道大学 人間知×脳×AI研究教育センター」のホームページデザイン解説グレーをベースにグリーンをアクセントにしたサイトです。ファーストビューでは、北海道大学 人間知×脳×AI研究教育センターのロゴマークが表示されています。トップページの左サイドに、ニュースやイベントなどのメニューが出ています。トップページの中...
-
「MUSABI WEB OPEN CAMPUS 2020」のホームページデザイン解説ポップなイメージの図形や装飾がサイト全体に散りばめられていて、全体の雰囲気を作り上げる要素になっています。上部にはナビゲーションメニューが固定表示されていて見やすく、スムーズな閲覧が可能な設計です。メニューは色分けされていて、サイト内の要素...
サービスサイトに関連するデザイン
-
「buddies」のホームページデザイン解説ホワイト×ブラックをメインカラーに、スタイリッシュなイメージで構成されたサイトになっていて、その中にキーカラーとして鮮やかなパステルグリーンが用いられていることで、目に止まりやすく統一感のあるデザインにまとめられています。「About bu...
-
「Viens-là」のホームページデザイン解説ファーストビューでは円形のオブジェクトが画面上を浮遊しているような表現が展開されていて、ポップで可愛らしい演出になっています。円形のオブジェクトはカーソルの動きに反応した様々なモーションが加えられていて、スクロールした先では画像領域に変化し...
-
「TWKS」のホームページデザイン解説素早いテンポで切り替わるムービーがファーストビュー上に大きな領域で展開されており、インパクトのある演出になっています。スクロールしていくと大きくテキストが表示されて背景色も徐々に切り替わり、ファーストビューから大きな変化があって面白い表現が...
カラフルを使ったデザイン
- 「TWKS」のホームページデザイン解説
素早いテンポで切り替わるムービーがファーストビュー上に大きな領域で展開されており、インパクトのある演出になっています。スクロールしていくと大きくテキストが表示されて背景色も徐々に切り替わり、ファーストビューから大きな変化があって面白い表現が...
-
「SOLES GAUFRETTE」のホームページデザイン解説画面右半分にスライドショーで切り替わる画像領域を設置して、左側に大きくテキストを表示したファーストビューが、目を引く演出になっています。画像が切り替わると同時にテキストも切り替わり、画面全体に大きな動きがあることで興味を抱かせる効果となって...
-
「MUTEK」のホームページデザイン解説ファーストビューでムービーが展開され、サイトを開くとまず目に飛び込んでくることでインパクトのある演出になっています。下部に進むと、大きくテキストが表示されてスクロールと連動した動きが見られる表示が展開されています。テキストはリンクになってい...
優しい・柔らかいなホームページのデザイン
-
「TEPRA PRO “MARK”」のホームページデザイン解説全画面表示の画像がサイトを開くと現れて、インパクトのある演出になっています。画像はスライドショーで切り替わる仕組みになっていて、商品の特徴やラインナップが紹介されています。一目で内容が理解できる演出で、しっかりとユーザ視点が考えられています...
-
「わかば保育園」のホームページデザイン解説ファーストビュー画像領域に大きく表示された画像が、スライドショーで切り替わる際に特徴的なモーションが加えられていることで目を引き、サイトの導入として効果的な役割となっています。スクロールしてファーストビューより下部に進むと画面上部にナビゲー...
-
「ChungiYoo」のホームページデザイン解説全体を通してナチュラルで可愛らしい雰囲気が演出されており、ファーストビューでは大きくおしゃれな書体の文字が表示されています。文字にはイラストも組み込まれていて目を引く構成になっています。中央上部にはドロアーで隠されたナビゲーションが設置され...