まつげ・眉サロン（かわいい／シンプル）のWebデザイン見本

毎朝のメイクを少し楽にしたい20〜30代の女性。はじめてのまつげパーマ・眉の店を、スマホで探している人。かわいくて、こわくない。メニューと値段がすぐ分かる、すっきりしたページにする。


業種	美容・サロン
テイスト	かわいい／シンプル
色	赤・ピンク
アニメーション	あり（GSAP＋ScrollTrigger）
演出の型	A10 散らばったカードが画面の外周を囲み、中央にタイトル／E07 弧や円に沿って並ぶ文字（回るステッカーも）／B05 色付きカードがスクロールで上に積み重なる
架空の店	「lash & brow ririe（リリエ）」— スタッフ2人の、まつげと眉の小さなサロン

だれに向けたページか

毎朝のメイクを少し楽にしたい20〜30代の女性。はじめてのまつげパーマ・眉の店を、スマホで探している人。 かわいくて、こわくない。メニューと値段がすぐ分かる、すっきりしたページにする。

ピンクの面の上の文字は --c-ink（どれも 7 以上）。--c-red に白い文字は 4.2 で足りないので、ボタンは --c-accent-text の面にする。

メインビジュアル（演出① A10）：画面の外周を、写真のカードと色のカード（「lash」「brow」「♡」など）が少し傾いて囲む。中央に店名と「目もとから、きげんよく。」と予約ボタン。読み込み時、カードは中央から外周の定位置へ飛んでいく。スクロールすると、カードはさらに外へ散って道を空ける。スマホはカードを上と下の2段に寄せる
お店について（演出② E07）：見出しの上に、弧に沿って「lash & brow ririe ♡ since 20〇〇」の文字。スクロールに合わせて弧の上を文字が流れる
メニュー（演出③ B05）：まつげパーマ／まつげエクステ／眉スタイリング／セットの4枚のカード。それぞれ色が違い、スクロールすると上に積み重なっていく（CSS の sticky だけで動く。JSは下になったカードを少し小さく暗くするだけ）
はじめての方へ：3つのお約束
ご予約（E07）：予約ボタンの角に、円に沿って「RESERVE ♡ RESERVE ♡」が回るステッカー
アクセス・フッター

JSや GSAP が無いとき：カードは外周の定位置で止まる、弧の文字は止まる、メニューのカードは sticky で積み重なる（JSが無くても成り立つ）。全部読める
prefers-reduced-motion のときは、カードは定位置、ステッカーも止まる
弾む動きは読み込み時の1回だけ。回り続けるのはステッカーだけ
料金・スタッフ歴は見本の値（〇〇）。会員が本物に替える

まつげ（目を閉じたまぶたの接写）・道具・施術室・手鏡・花・眉の道具・ケア用品、の7枚。顔全体は写さない。