架空アニマルカフェ
「mofu mofu」
ジャンル： LP
web公開中
ワイヤーフレーム
装飾フェーズ
【作品概要】
- 実装フェーズ（WEB公開）：
- 実際の公開サイトを見る
- ターゲット ：
- メイン層/20代〜30代の働く女性（都心部在勤・在住）
- ライフスタイル：
- 仕事が忙しく、日常的にストレスを感じている。自宅ではペットを飼えない環境（マンション規約や多忙）にあり、手軽に「非日常の癒やし」を求めている。
【課題と解決策】
- 課題 （解決すべき問題点）
- 情報の不透明さ：滞在時間と料金の関係がパッと見でわかりにくい。
- 安心感の欠如：初心者が「どう接すればいいか❔」という具体的なイメージ持てない。
- 競合との差別化：数あるアニマルカフェの中で、なぜ「mofu mofu」なのかという独自の魅力伝わっていない。
解決策（デザインの意図）
- 心理的ハードルを払拭する料金設計
- 【意図】 複雑なオプションを排除し、中央に「一律料金」を配置。
【実装】 金額を最大化し、補足情報を独立させることで、追加費用の不安を解消。
視覚的に「これ以上かからない安心感」を強調しました。 - 「ハリネズミ推し」による情緒的アプローチ
- 【意図】 FVにハリネズミのアップを採用し、「モフモフしたい」と感じる瞬間を直感的に訴求。
一瞬でユーザーを惹きつけます。
【理由】 Q&A形式で接し方を丁寧に解説することで、「動物に優しく接したい」というユーザーの良心に寄り添い、
来店への不安を「期待感」へと変換しました。 - 遊び心」を宿したタイポグラフィによる情緒演出
- 【意図】 あえて完璧な整列を崩し、価格表記やテキスト配置にリズム（遊び）を付与。
【理由】 無機質な予約システム感を払拭するため。「動物たちの自由な雰囲気」と「スタッフの温かさ」を視覚的に
表現し、ユーザーの心理的距離を縮める親しみやすさを追求しました。
使用ツール
写真加工：Affinity Photo/レイアウト：Figma
コーディング：Visual Studio Code/WEB公開：GitHub Pages
カラーパレット
ベース：薄緑（＃a3c9a8）とパステルイエロー（＃fffde6）
アクセント：テラコッタオレンジ（＃d35400）
タイポグラフィ
日本語：しっぽり明朝
アルファベット：CormorantGaramond
