企業向けに「伝わる資料づくり」と職場づくりの伴走支援を行う、サザラボ 末宗由奈 様のホームページリニューアルを、マーケティング戦略・要件定義・ディレクション・デザイン・実装・公開対応まで弊社で一貫して担当させていただきました。
目次
リード文(一覧カードにも表示される冒頭文)
働く人の「伝わる」をつくる伴走支援事業を展開されているサザラボ 末宗由奈 様のホームページリニューアルを、マーケティング戦略・要件定義・ディレクション・デザイン・実装・公開対応まで弊社で一貫して担当させていただきました。
プロジェクト概要 (Overview)
企業向けに、マニュアル・研修資料・採用資料などの「伝わる資料づくり」と職場づくりの伴走支援を行うサザラボ様のウェブサイトをフルリニューアルいたしました。マーケティング顧問として事業のターゲットや強みの整理から携わり、BtoBの経営者・人事担当者に向けて「どんな人が、どのように伴走するのか」が伝わるサイトへと再設計いたしました。
クライアントの課題・背景 (Challenges & Background)
既存サイトは末宗様ご自身がAIを活用して制作されたもので、サービス内容は掲載されているものの、誰に向けた支援なのかが伝わりにくい構成となっておりました。また、明朝体中心の硬い印象のデザインで、サザラボ様の親しみやすさや、現場に寄り添う姿勢が表現しきれていない状態でした。Google検索で「サザラボ」と検索してもヒットしにくいことも課題となっておりました。
提案内容・アプローチ (Our Solutions)
毎週の定例MTGで方針をすり合わせながら、事業整理とサイト制作を並行して進めました。主な提案内容は以下の通りです。
- ターゲットの明確化:ヒアリングシートと定例MTGをもとにペルソナを整理し、ターゲットを建設・製造/人材派遣・請負/企業向けヘルスケアなどのBtoB企業に絞り込みました。「こんな企業様にご依頼いただいています」として業種を明示しております。
- 課題起点の構成:「こんなお悩みありませんか?」から入り、事業内容 → お客様の声 → ご支援の流れ → 料金体系 → よくある質問 → お問い合わせへと、検討の順番に沿って読み進められる構成といたしました。
- 信頼の可視化:法人名入りのお客様の声を掲載し、プロフィールと代表メッセージ・沿革・屋号の由来をAboutページに独立させ、「人」で選ばれるサービスであることを伝えております。
- 問い合わせ導線:ご相談の種類を選べるお問い合わせフォームを設置し、自動返信メールまで含めて実装いたしました。
デザイン・実装のポイント (Key Features)
- 硬い印象から一転し、イラストと柔らかな配色で親しみやすさを表現いたしました。ブランドカラーはロゴの青(#0050c1)に統一しております
- 屋号の由来である「さざなみ」をモチーフに、泡のあしらいやスクロールに合わせたアニメーションで、小さな変化が広がる世界観を演出いたしました
- スキップリンク・ランドマーク・十分なコントラストなど、アクセシビリティに配慮した実装を行いました
- 問い合わせフォームはPHPで実装し、入力チェック・スパム対策を施したうえで、送信ドメイン認証(SPF・DMARC)まで整え、通知メールが確実に届くようにいたしました
- PC・SP(760pxブレークポイント)の両対応を実施し、iOS・Androidの実機で表示とフォーム送信を確認いたしました
担当領域・制作情報 (Project Scope)
| クライアント | 末宗由奈様(サザラボ) |
|---|---|
| 担当領域 | マーケティング戦略(ペルソナ設定・競合調査)/ ヒアリング / 要件定義 / 情報設計 / UI/UXデザイン / コーディング / フォーム実装 / QA / 公開対応 |
| 使用技術 | HTML / CSS / JavaScript / PHP |
| 制作期間 | 2026年9月〜2026年10月(約5週間) |
| 制作体制 | 弊社にて要件定義および全体のディレクション・監督を行い、徹底した品質管理を行いました。 |
| サイトURL | https://saza-lab.net/ |

