PROJECT INFO制作概要
- Type
- Web / HP
- Created date
- 2026.09
- Role
- 企画 / デザイン / コーディング
- Tool
- Figma / Claude Code / VS Code / WordPress
- Production Time
- 約25時間
CONCEPTコンセプト
音楽を選ぶように、
メイクを選ぶ。
「MUSIC」と「MUSE=インスピレーションを与える存在」を掛け合わせた、Z世代向けの架空コスメブランド「MUSEE」を企画。
コスメを単なる美容アイテムとして見せるのではなく、音楽・ビジュアル・メイクを通して、今日の自分の気分をつくる存在として表現している。
MAKE UP YOUR RHYTHM. 今日の私に、好きなリズムを。
SERVICEサービス設定
4つの気分から選ぶ、
メイクと音楽の体験。
それぞれに異なるビジュアル・コスメ・音楽を組み合わせ、自分に合ったメイクを直感的に選べるブランド体験を企画した。
CUTE CHILL ENERGY MIDNIGHT
TARGETターゲット
トレンドも、自分らしさも楽しみたい
10代後半〜20代女性
InstagramやTikTokを日常的に利用し、韓国コスメやK-POP、ファッションなどのトレンドに関心を持つ層。
商品の機能や価格だけでなく、パッケージやブランドの世界観、SNSで共有したくなるビジュアルにも価値を感じるユーザーを想定した。
PURPOSE目的
商品を見るだけではなく、
ブランドを“体験する”Webサイトへ。
新しいコスメブランドを知ったユーザーに、商品だけでなくMUSEEならではの世界観そのものに興味を持ってもらうことを目的とした。
HOMEでブランドの世界観を印象づけ、4つのMODEからその日の気分に合ったページへ誘導。サイトを巡ること自体がMUSEEのブランド体験になるよう設計した。
STRUCTUREサイト構成
気分を起点に、
4つの世界観へ広がるサイト設計
HOMEをブランド全体の入口とし、ABOUTでコンセプトを伝えたうえで、MOODSを起点にその日の気分から4つのMODEへ分岐する構成とした。
- CUTE MODE 恋 / 甘さ / ガーリー / ロマンティック
- CHILL MODE 静けさ / 透明感 / リラックス
- ENERGY MODE 夏 / POP / 遊び / ポジティブ
- MIDNIGHT MODE 夜 / ムード / 大人っぽさ
DESIGN TONEデザイントーン
Y2K × Korean Beauty × Music
韓国コスメのトレンド感に、プレイリストや音楽プレイヤーを思わせる要素を掛け合わせ、MUSEE独自のブランド世界観を表現した。
紫からピンクへつながるカラーリングと透明感のあるビジュアルをベースに、余白を活かしたレイアウトでコスメブランドらしい洗練された印象にまとめた。
COLORカラー
#4B3F73
BASE
深みのあるパープル。
#D85F8B
MAIN
華やかさと柔らかさを持つピンク。
TYPOGRAPHY使用フォント
Sorts Mill Goudy
英語見出しやブランドを印象づけるタイポグラフィに使用。クラシカルで繊細なセリフ体で上品さを持たせた。
Zen Kaku Gothic New
日本語本文や説明文に使用。すっきりとした現代的なゴシック体で、情報を読みやすく伝えられるよう設計した。
INTERACTIONインタラクション
見るだけではなく、
“聴いて楽しむ”Webサイトへ。
「音楽を選ぶように、メイクを選ぶ」というブランドコンセプトをWeb上でも体験できるよう、サイト内に音楽再生機能を実装。HOMEやMODEページに配置したPLAYボタンから楽曲を再生できる。
ビジュアルを見るだけではなく、音楽と一緒にそれぞれの世界観を楽しめる設計とし、スクロールに合わせたアニメーションやホバー表現でサイト全体にリズムを持たせている。
- PLAY
- SCROLL
- HOVER
- TRANSITION
PAGE PREVIEW完成画面