自社のコーチングサービス「Be Coach」の公式サイトを制作しました。 全体のデザインには“波線”のモチーフを用い、ゆらぎや柔らかさを表現。コーチングが堅苦しいものではなく、自然体で取り組めるものだと感じてもらえるよう意識しました。 また、メインカラーにはやさしさと安心感を与えるエメラルドグリーン(#1CC18E)を使用。サブカラー(#E4F5F0)やキーカラー(#0F3C3C)との組み合わせで、信頼感と誠実さを演出しています。 ポップなイラストと、読みやすい余白設計、そしてスクロールだけで全体が把握できる構成により、「コーチングはなんだか怪しい」「難しそう」といった印象を払拭。 まるで、信頼できる誰かと話しているような空気感を持ったデザインに仕上げました。
仕事や家庭、人生そのものに向き合いたいと考えるビジネスパーソン。
特に「キャリア・家庭・理想の生き方」など、全体のバランスを整えたい人。
頭の中がモヤモヤしていて、どこから手をつければいいか分からない。
一人では継続できず、思いがあっても行動に移せない人が多い。
「ありたい姿=Be」の言語化と、そこに向かう行動の伴走。
コーチングという手段を通して、自分自身の思考・感情・行動を整理し、自己信頼と納得感を持って未来に進む支援を行う。
トップページ内でサービスの全体像を把握できるようにし、深く読みたい人はスクロールで必要情報にアクセス可能な構成に。
よくある悩み・ビフォーアフター・サービス内容・料金などをスムーズに把握できるよう整理。
スマホ閲覧がメインであることを想定し、シンプルで直感的に理解できる構成と、読みやすく余白を活かした親しみのあるデザインを採用。
「前向きに踏み出したくなる静かなエネルギー」を感じられるよう、視認性の高いフォントと最小限のアニメーションで構成。情報が頭にスッと入る静かなUIを意識しています。
企画 / 情報設計 / ワイヤーフレーム
デザイン
コーディング
公開設定
2週間
3週間
4週間
1週間
Figma / Illustrator / VScode