【ELLE編】参考サイトのご紹介 Vol.06

• Web Create
• 2020.09.04

こんにちは！
夏自体は嫌いですが、夏の夕暮れとか夏祭りの帰り道とか友達とやる手持ち花火とかは切なくて好きなWebディレクターのもっちです(=ﾟωﾟ)ﾉ
あのノスタルジーな感じ、すごく良いですよね！

今年は夏祭りも花火も自粛でしょうからね（江頭2:50さんのYouTubeチャンネルで花火は観ましたが）、最近のもっぱらの楽しみはお風呂上がりのチョコミントアイスです。
何を隠そう私チョコミン党所属でして、チョコミントは歯磨き粉じゃありませんからね！！

さて、今回の参考サイト紹介記事は少し趣向を変えまして、皆さんご存知ELLEのサイトから気になる特集ページをまとめてご紹介させていただきます！
トレンドを取り入れたスタイリッシュなページが数多くありますので、是非ご覧ください！

CATCH ME IF YOU CAN

URL：https://sp.elle.co.jp/fashion/giorgio_armani/2007/

俳優・柄本 佑さんを起用したGiorgio Armaniの特集ページです。
新イットバッグ“ジョルジオ アルマーニ ラ プリマ”を手に、パパラッチ達から逃げるストーリー仕立てのページ構成となっています。
シーン毎にフューチャーするバッグの情報を入れつつ、そのバッグを手にした動画やスライドショーが設定されております。

動画や画像はわざと画質を落としてフィルム時代のような加工が施されていて、テーマに沿った作りがなされています。
このページは動画や画像などを多く使用していますが、アクセス速度やページ閲覧時のもっさり感がなく、ストレスなくページを閲覧することができる理想的なページだと思います。

FREEDOM DISCO!

URL：https://sp.elle.co.jp/beauty/shiseido/1905/

スクロールしていくことで展開していくコスメの特集ページです。
コスメの色に合わせて背景色やフォントカラーを変化させていき、コスメのイメージを強調させています。
コスメのページだけではなく、アパレルのLOOKBOOKなどにも転用可能な汎用性の効く構成だと思います。

Louis Vuitton New Store Open

URL：https://sp.elle.co.jp/fashion/louis-vuitton/2002/
URL：https://sp.elle.co.jp/fashion/louis-vuitton/2001/
URL：https://sp.elle.co.jp/fashion/louis-vuitton/1912/

広瀬すずさんがアンバサダーを務めるLouis Vuittonの特集ページです。
STORY1〜3と分割して作成されており、それぞれSTORY1はNEW ITEM紹介、STORY2は広瀬すずさんのアンバサダー就任記事、STORY3は大阪に新店舗オープンの記事とそれぞれ内容が異なります。

どのページもMVに大胆に敷かれた動画が目を引き、その上にSVGによるテキストアニメーションが統一して実装されています。あと広瀬すずさんが可愛いです。
特にSTORY1のアイテム紹介ページはLOOKBOOKなどに参考したいページです。
あと広瀬すずさんが可愛いです。

CHLOE Sensual EYES

URL：https://sp.elle.co.jp/fashion/chloe/1912/

こちらは珍しい横にスクロールしていくページです。
いつものようにスクロールしていくと絵巻のように横にスクロールしていくことが見ていてとても新鮮です。
ページ右下にはスクロールは右と分かるような表示もあり、とても親切な作りになっています。

背景で動画が全面に流れ続けているためか少し表示が重いですが、その分インパクトは絶大です。

まとめ

今回はELLEから公開された4つのページを紹介させていただきましたが、いかがでしょうか？
それぞれ特徴がありますが、動画やアニメーションを上手く使用して効果的に作り込まれておりました。

ELLEはデザイン性の高いページを数多く公開しているので、他にも色々ページを探してみてはいかがでしょうか？

今後も定期的に参考サイトをご紹介できたらと思いますので、また次回のブログでお会いしましょう(=ﾟωﾟ)ﾉ