「株式会社カラフル」のホームページデザイン解説

カナダにあるモントリオール中央駅のサイトです。メインビジュアルは３枚並んだフラットなテイストのイラストで、それぞれが駅の周辺情報・ショップガイド・運行情報への入り口となっており、マウスオーバーするとキャプションが下からせりあがってくる仕組み...

ファーストビューでは画面のほとんどを覆うブラックのベタとその上にシンプルに書かれたキャッチコピーがまず目を引き、その下にわずかに見切れている動画に興味を引かれてスクロールをすると、視差効果で動画が現れる構成です。画面をスクロールするとブラッ...

ファーストビューでは画面全体をレッドのラインで囲んだ中央にサイトロゴが浮かび上がり、鮮やかな色がまず目に入ります。ベージュのテクスチャと柔らかい丸みを帯びたフォントが柔らかいイメージを与え、手書きのイラストや随所に盛り込まれたアニメーション...

画面中央に大きく配置された企業ロゴと、暗がりの中から浮かび上がるように配置された麺の写真の組み合わせで、画面全体にまず重厚感を与えています。ブラックに近いダークグレーの背景に、麺の色を思わせるベージュのテキストが映え、見出しのアクセントに添...

トップページは柔らかく明滅するオレンジのドットのアニメーションをバックに、グレーとオレンジのフォントで力強く書かれたメッセージと写真で構成されたスライドショーが目を引きます。グレーをベースに、オレンジをアクセントにした鮮やかな色使いですが、...

サイトにアクセスするとまずブラックの背景の上を画面いっぱいに拡大した企業ロゴが走り、画面が反転するとロゴの一部がグラデーションになって背景に固定され、その上にキャッチコピーが重なるファーストビューです。ゆっくりと色が変わるグラデーションのラ...

メインビジュアルは記事へのリンクを貼ったカルーセルとなっており、鮮やかなイエローのバックの上に、本の形にトリミングされた記事のサムネイルがまず目を引きます。淡いイエローをベースにネイビーをアクセントにしたカラフルな色使いですが、わずかに彩度...

画面の左右に固定されたビジュアルを大きく取り、中央の細いエリアのみがスクロールするレイアウトで、フィルムで撮ったような色使いの写真と、ざらざらとした質感のイラスト、縦書きの電話番号がレトロな雰囲気をまず感じさせます。イエローとネイビーをアク...

クラフト紙風にノイズを乗せたテクスチャの上に、ラフなタッチで描かれた顔文字のようなカラフルな笑顔のロゴが親しみやすさを感じさせるファーストビューです。コンテンツのバックはピンク、オレンジ、グリーンのポップな色が敷かれ、分解したロゴマークをサ...

画面いっぱいに広がるムービーと、丸みを帯びたゴシック体のキャッチコピーががころんと飛び出してくる、迫力がありつつもどこかほのぼのとしてしまうデザインが特徴です。鮮やかなネイビーをバックにホワイトのフォントのシンプルなデザインの上に写真をラン...

ファーストビューでは画面いっぱいにブルーのベタが表示された後画面が切り替わり、大学内の様子がスライドで紹介されます。ゴシック体のフォントのタイトルと大きめのフォントの本文が力強いイメージを感じさせるデザインです。ベタを殆ど使わないモノトーン...

サイトを開くと真っ白なテーブルの上にお皿が現れ、画面が切り替わると女性の体の写真とサプリメントのパッケージが左右それぞれに表示される演出で、女性の美容と健康に関連したサイトだということが一目でわかります。ホワイトの背景にグレーのテキストを乗...