WebGallery

Webデザインの初心者がスマートフォン対応しているWebサイトを淡々と紹介していくサイトギャラリーです。

*

カラコンの色味を背景で表現したサイトがとにかくオシャレ!「PLAY / UP(プレイアップ)」

   

カラーコンタクト「PLAY / UP」のホームページです。

丸ドットで作られた背景がとても印象的なサイトです。
音楽のONとOFFを選択した後、音楽グループ「防弾少年団(BTS)」のコンセプトムービーが流れるようになっています。
ついつい目を追ってしまうような構成のPVは、とてもスタイリッシュで格好いいですねー!

 

カラコンの色味を背景で表現!


画像をクリックすると、拡大表示されます。
「ENTER」のボタンを押すと、カラーコンタクトの形と配色をしたドットのアニメーションが表示され、その上に大きく商品名が表示されています。
スクロールすると次々に切り替わるようになっていて、次にどんな色が出てくるのかワクワクしながら色を選べてとっても楽しいですね!
画面下にあるパネルのようなボタンを押すと他の商品名が表示されるようになっていて、分かりやすくなっています。

さらに、「LENS DETAIL」のボタンをクリックするとレンズのデザインや特徴・レンズの値段やモデルが着用した写真等がグリッドデザインで表示されています。
スクロールするとパララックス効果になっていてオシャレですねー!BTSのメンバーの写真も掲載されているのですが、その写真のみ黒メインになっていて際立つようになっています!

ただカラコンの写真を掲載するのではなく、背景に丸ドットで作られたアニメーションを使ってカラコンを表現することで一味違ったサイトになりますね!
きちんとモデルが着用した写真・カラコンのみの写真を掲載することで、ユーザーにカラコンの色味を伝えやすく工夫しているのも素敵です。

 - イベント系サイト, 丸を使ったデザイン, 動きで表現, 形で表現

  関連記事

フルスクリーン動画が迫力ある水族館は、サメやエイに触ることも出来る!?

大阪府大阪市にある世界最大級の水族館で、平成25年の3月14日に開設された「海遊 …

ファーストビューに動画を取り入れた神社・お寺のサイト5選

数年前から背景に動画を使用したデザインをよく目にするようになりました。 動画を効 …

シンプルだからこそ細かいところまで気配りされたデザインのサイトがおしゃれ!

2011年有志によって設立された「ててて協働組合」のホームページです。 ファース …

写真を使って島の魅力を伝える

2016年4月に「星野リゾート リゾナーレ西表島」からリオープンする「ホテル ニ …

思わず飲みたくなる!ビールのイベントサイト

2017年4月28日の金曜日から5月7日の日曜日までお台場の「シンボルプロムナー …

コントラストの強い配色で高級感のある雰囲気を演出したサイト

フランスのファッションデザイナー「pierre cardin」の日本公式サイトで …

アリのマークを用いて様々な仕掛けを作る

東京都にある株式会社「Alfanet(アルファネット)」のホームページです。 ま …

ロゴマークにマウスをホバーさせるとアニメーションになる仕組み

東京都台東区にあるランドセル工業会が運営している「ランドセルくらぶ」のホームペー …

2020年新卒採用サイトのトレンドをチェック!おしゃれなデザインをまとめてみました!

年始早々インフルエンザにかかってしまいました…皆様もお気をつけて… 久しぶりに高 …

アニメの世界観を大切にしたサイトがカッコよくておしゃれ!

2017年の10月に放送が開始されるアニメ「魔法使いの嫁」の公式ホームページです …