YOLUのLPサイト考察　＃2

こんばんは。
WEBデザイナーを目指し勉強中のみっさんです。
今日はYOLUのLPサイトの考察をしてみたいと思います。
昨日に引き続きシャンプーのサイトです。

YOLUの夜間美容メソッド｜【公式】YOLU［ヨル］ナイトケアビューティーブランド

【考察の目的】
美容系LPサイトのデザインに込められた意図を汲み取る

【印象】
・落ち着き、夜空、睡眠

【ブランド理解】
・どんな商品？
忙しい現代人のために夜間美容に特化したシャンプー。
寝ている間の短い夜の時間を、より深く濃密な美容タイムに変えることを目的としている。アロマティックフレグランスがリラックス効果をもたらし、睡眠中の摩擦を軽減することで潤いをチャージ。これにより、目覚めた瞬間に感動を与える、忙しい人の強い味方となる商品。


・文章から感じること
YOLUのホームページでは、「夜間美容」や「サポート」というキーワードが際立っている。これらの言葉から、YOLUが忙しい現代人に向けて、日中の疲れを癒しながら美容効果を高めるサポートを提供することを重視していることが読み取れる。特に、夜間の限られた時間を最大限に活用し、リラックスしながら効果的な美容ケアを行うというコンセプトが、YOLUの製品を通じてしっかりと伝わってくる。

・写真から感じること
YOLUのホームページには、「夜空」や「星座」など、夜を連想させる写真が多く使用されています。これにより、夜間美容に特化したブランドの理念が視覚的に効果的に伝わっています。サイト全体のデザインからも、YOLUが目指しているリラックスや癒しの時間を提供するというコンセプトが感じ取れます。

・社名の由来
YOLU』は夜間美容の発想から開発されたもの。 ブランド名は、夜と、ラテン語で月を意味するLUNAに由来する

【余白・レイアウト】
・機能面
YOLUのページでは、背景に夜空を使用することで、余白としての機能を持たせながら、ブランドのイメージを視覚的に伝える効果もある。さらに、夜空の背景が動きながら右回転することで、夜から朝への時間の移り変わりを視覚的に感じさせる意図も読み取れる。

・情緒面
余白をすべて夜空にすることで、視覚的に体と心をリラックスさせる効果がある。夜空の広がりが静けさや安心感を与え、サイト全体を通じて癒しの雰囲気が感じられるようになっている。

【色】
・機能面　
副交感神経を優位にする効果がある青色をメインに使用することで、リラックスや休息を連想させる効果がある。これにより、ユーザーがサイトを閲覧する際に自然と心が落ち着き、リラックスした状態で情報を受け取れるようになっている。

・情緒面
リラックスや安らぎを感じさせる色であり、情緒面では心を落ち着かせる効果がある。この色使いによって、ユーザーは視覚的に安心感を得られ、心地よくリラックスした状態でサイトを閲覧することができる。青色はまた、静寂や穏やかさを象徴し、夜のリラックスタイムというブランドのコンセプトを感覚的に強くサポートしている。


【フォント】
本文：Noto sans jp
見出し、あしらい：しっぽり明朝　
・機能面
しっぽり明朝


・情緒面
しっぽり明朝
上品な印象: 見ているだけでうっとりするような明朝体を目指して制作されたオールドスタイル明朝体フォントです。 エッジや角を丸く処理されているので、優しさを感じる「しっぽり」とした品格が高い印象
クラシック・上品、誠実・信頼感、和風なデザインなどによく合うフォント

【あしらい】
・枠が星と線で構成されている
ただの枠にせず細かいところにも星のモチーフが入っていてかわいい

・背景がグラデーションで朝の空になる
画面をスクロールするにつれて時間の流れを感じさせる面白い工夫でありながら構造を邪魔しないデザイン

・ハンバーガーメニューも斜めになっていて流れ星を連想させる。細かい遊び心が楽しい

これらの細部にまで気を配ったデザインが、ブランドの世界観を強化している


【アニメーション】
・オープニングアニメーションの線画が背景の夜空と相まって星座のように見える
・夜空の背景が動きながら右回転している

◼️デザインの引き出しメモ
◼️感想

細部にまで「夜」や「星」のモチーフが取り入れられており、隠れた遊び心が随所に散りばめられています。こうした小さな工夫が全体の構造を邪魔することなく、かわいらしくも機能的なデザインを作り出しています。私も、こうした細やかな遊び心を取り入れながら、全体をバランスよくまとめられるデザインを手がけられるWebデザイナーになりたいと思いました。これからもっと学び、楽しみながら成長していきたいです。