台湾式リフレクソロジーLeaf様 ホームページ新規制作事例【美容・理容業｜福岡県外】

1. ホームページ新規制作の基本情報とプロジェクト概要

クライアント

台湾式リフレクソロジーサロン「Leaf」（愛知県一宮市）

業種

リラクゼーション・マッサージ業

ご依頼内容

ホームページ新規制作

制作期間・規模

2〜3ヶ月

担当スタッフ

ディレクター：池田
デザイナー：古田・迫田
コーダー：大久保

2. 制作をご依頼いただいた背景と目的

台湾式リフレクソロジーLeaf様は、一宮市で本格的な台湾式足つぼマッサージとボディケアを提供するリラクゼーションサロンです。専用の棒を使った本格的な施術や、経験豊富なスタッフによる高い技術力でリピーターが多く、口コミでも高い評価を得ているサロンです。

事業の成長と複数店舗展開に伴い、サロンの魅力や各店舗の情報を効果的に発信できるWebサイトの新規制作をご依頼いただきました。新規制作にあたり、以下のような要望・課題がありました。

• 本格的な施術内容とサロンの強みを分かりやすく伝えたい
• 各店舗の情報を整理して掲載したい
• 「痛いけど効果がある」という特徴を適切に表現したい
• 男女問わず気軽に来店できることをアピールしたい
• スマートフォンからの予約導線を強化したい
• サロンの清潔感や雰囲気を視覚的に伝えたい

3. 課題解決のための提案内容とデザインアプローチ

ユーザーが求める情報にスムーズにアクセスできる構造を設計しました。

情報設計

トップページの役割を明確化

• サロンのキャッチフレーズを印象的に配置
• 施術の特徴とサロンの強みを明確に提示
• 各店舗へのアクセス情報を分かりやすく掲載
• キャンペーン情報を目立つ位置に配置

店舗情報の整理

• 各店舗ごとのページを用意
• 店舗の特徴、スタッフ紹介、アクセス情報を掲載
• 予約リンク（ホットペッパービューティー）への導線を明確化

デザインコンセプト

本格派の技術力と親しみやすさの両立

台湾式の本格的な施術を提供しながら、気軽に通えるサロンであることを表現するため、以下の方針でデザインしました。

• 清潔感のあるビジュアル – サロンの実際の写真を使用し、空間の雰囲気を伝える
• 力強いキャッチコピー – 「世界で一番痛い」という特徴を印象的に表現
• 落ち着いたカラースキーム – リラクゼーションサロンらしい癒しの配色
• 視認性の高いレイアウト – 重要な情報が一目で分かる構成
• 店舗写真の効果的な活用 – 施術風景や店舗の雰囲気を視覚的に伝える

4. ホームページ新規制作の内容と成果

• 成果物：愛知県一宮市の台湾式リフレクソロジーサロン「Leaf」様のホームページ
• CMS：WordPress
• 全6ページ構成（TOP・各サロンページ・料金・お知らせ・プライバシーポリシー）

制作後の成果

制作後、以下のような成果が得られました。

• サイトからの問い合わせ増加 – 明確な予約導線により、LINE経由の予約を促進
• ブランド認知度の向上 – 本格的な施術内容が視覚的に伝わり、サロンの特徴が明確化
• 新規顧客の獲得 – 初めての方でも安心できる情報提供により、来店のハードルを下げる
• 各店舗への集客バランス改善 – 店舗ごとの情報を整理することで、各店舗への適切な誘導

5. 制作の流れ

1. ヒアリング・コンセプト設計
   まず初めに、Leaf様のサロンコンセプトや施術内容、強みについて丁寧にヒアリングを行いました。実際に各店舗を訪問し、店舗の雰囲気や施術の特徴を理解することを重視しました。ターゲットユーザーの明確化と必要機能の洗い出しを実施し、競合サロンのWebサイトも分析しながらプロジェクトの方向性を定めました。
2. サイト構成・ワイヤーフレーム設計
   次に、サイト全体の情報設計を行い、サイトマップと各ページの構成案を作成しました。複数店舗の情報をどのように整理するか、予約までの導線をどう設計するかを重点的に検討しました。ワイヤーフレームで構造を確認しながら、クライアント様と認識をすり合わせていきました。
3. デザイン制作
   情報設計が固まった後は、デザイン制作に入りました。トップページのデザインから着手し、「本格派」と「気軽さ」を両立させることを重視しました。店舗写真を効果的に配置し、サロンの雰囲気が伝わるビジュアル表現を追求しました。トップページの方向性が確定した後、下層ページへとデザインを展開し、レスポンシブデザインも含めて修正とブラッシュアップを重ねました。
4. コーディング・実装
   デザインの承認後、HTML、CSS、JavaScriptを用いたコーディング作業に移りました。レスポンシブ対応やスムーズなスクロール動作、予約ボタンの最適化、WordPressの実装など、デザインを忠実に再現しながら使いやすさも追求しました。
5. テスト・公開
   コーディング完了後は、複数のブラウザやデバイスでの表示・動作確認を行いました。特にスマートフォンでの閲覧体験を重視し、細部まで調整を実施しました。表示速度の最適化も行い、問題がないことを確認した上で公開作業を行いました。

6. クライアント様のご感想

「私たちのサロンは『痛いけど効く』という特徴があり、それをどう伝えるかが課題でした。制作チームの皆さんは、実際に店舗を訪れて施術の様子を見てくださり、私たちの想いを深く理解していただけました。完成したWebサイトは、本格的な技術力を持ちながらも、初めての方でも安心して来店できるような温かみのあるデザインで、まさに理想通りです。公開後、『サイトを見て興味を持った』というお客様が増え、新規のお客様にもサロンの魅力が伝わっていることを実感しています。」— Leaf ご担当者様

7. 使用技術・ツール・対応環境一覧

CMS

WordPress

デザインツール

Adobe XD、Illustrator、Photoshop

対応デバイス

スマートフォン、タブレット、PC

特別な実装

アニメーション
視線誘導デザイン
管理画面カスタマイズ（お知らせ投稿の簡易化）

8. その他のホームページ新規制作・リニューアル事例はこちら

ホームページ
制作事例
美容サロン

Natalie様 ホームページ制作事例 【美容サロン｜福岡】 ホームページ制作の事例として、美容サロン「Natalie」様のホームページ（HP）をご紹介いたします。お店の「空気感」や「信頼感」、「通いたくなる気持ち」を、画面越しに届ける“感覚”の部分を丁寧にデザインしました。

アドファクトリーハーツでは、制作後の運用・集客までを見据えたホームページ運用施策をご提案しています。
本事例が、ホームページ制作をご検討中の方の参考となれば幸いです。
撮影・制作・運用を一貫してご提供できますので、ぜひお気軽にお問い合わせください。