「オムロン ヘルスケア」のホームページデザイン解説

画面を対角線上に横切るボールペンのスライドショーは、ブラウザの比率を変えるとペンの角度が変わり、常に画面を斜めに横切る仕掛けが施されています。トップページ、下層の製品詳細ページとも同じビジュアルが使われ、画面右下のペンのアイコンをクリックし...

鳩サブレで知られているお菓子メーカーのサイトで、サイトにアクセスすると画面いっぱいに大きく表示される鳩のイラストと、画面幅いっぱいに表示された鳩サブレやサブレの缶が流れていくアニメーションがインパクトを与えます。商品パッケージと同じイエロー...

サイトにアクセスすると画面いっぱいに焼酎を楽しむ男女のムービーが流れ、左上に重ねたロゴと左下のシアーをかけたキャッチコピーが合わさってポスターのようなイメージを感じさせます。画面をスクロールするとコンテンツがフェードインする効果は左右に泡の...

画面中央に大きく表示された店舗ロゴの背景にスライドショーが表示され、明度を落とした写真を次々に映し出して重厚感と迫力を感じさせるファーストビューです。ブラックの引き締まった画面にホワイトの太いフォントが映え、ゴールドの中華風のあしらいがアク...

ファーストビューではまず鮮やかな赤みのかかったオレンジが画面いっぱいに広がり、画面右からクッキーの写真がスライドで流れてきて目を惹きつけます。オレンジのバックにホワイトのロゴとフォントという、シンプルながらコントラストがつけられた色使いです...

イエローのベタの上にスカイブルーで手書き風のロゴが表示され、画面が切り替わるとシンプルなラインで描かれたイラストが表示されるファーストビューです。イラストにはパーツごとにアニメーションが加えられ、「見て」「泊まって」「食べて」「遊んで」と重...

画面上部と左サイドに余白を持たせてナビゲーションメニューを配置し、全体にムービーを配置した上に大きく店舗ロゴを重ねた、シンプルながらも迫力のあるファーストビューです。色使いはモノトーンのシンプルなものですが、マウスの動きに追従する円形のカー...

トップページには映像をフルスクリーンで背景に使用し、藍染めの工房の作業風景を美しく表現しています。また、画面の左上には常にロゴマークが配置され、サイト全体での統一感を出しています。清潔感あるホワイトのバックに色鮮やかな写真の数々を配置した後...

トップページに表示されたスライドショーは、引き出しを開ける両手のイラストが鉛筆書き風の素朴なタッチで描かれ、引き出しの中にスライドショーがはめ込まれています。引き出しの横にはクリップでつるされたカード風のサムネイルが表示され、サムネイルをク...

サイトを開くと画面中央に鮮やかな料理の写真がスライドショーで表示され、背後に敷いたスミ色のベタと、サイドメニューの毛筆風のロゴ周辺に大きくとった余白で、凛としたイメージと高級感を演出しています。背景はホワイトと淡いベージュのみ、テキストもス...

メインビジュアルの料理の写真を左右に、メニューを中央に配置したファーストビューです。メニューのエリアは商品パッケージにも使われているテクスチャを薄く敷き、小さな唐辛子のアイコンを店舗ロゴやコンテンツのタイトルに添えることで、商品のピリッと辛...

画面いっぱいに表示されたスライドショーでは店舗周辺の地域の風景と、一面に塗られたクリームやまぶされる砂糖のアップで、豊かな自然の中で育てられた製品の魅力をたっぷりと引き出しています。縦書きの明朝体のタイトルやナビゲーションメニューで和のイメ...