株式会社コスモ
コーポレートサイト
プロの美容師向けにヘアケア商品や美容機器を販売する美容ディーラー、株式会社コスモのコーポレートサイトをリニューアル。
ただ商品を卸す「販売代理店」ではなく、サロンのニーズに寄り添う「購買代理店」という企業姿勢を体現。自社で更新できる「商品」「セミナー」「ニュース（美容情報）」の3つのコンテンツを1つのサイトに集約し、美容師やサロンオーナーが有益な情報にアクセスできるWebサイトとして設計しました。
※現在の公開サイトはメインビジュアルの変更など一部アップデートされている可能性があります
💭 課題
- 情報の散逸：商品情報、セミナー情報、毎月発行する美容ニュースなどのコンテンツが整理されておらず、美容師が欲しい情報にスムーズにたどり着けない状態だった
- 営業現場での活用：営業担当がサロン訪問した際に、会社の最新情報や拠点情報をサッと提示・共有できるツールが不足していた
- 運用：クライアントが自分たちで複数のコンテンツ（商品・セミナー・ニュース）を簡単かつ継続的に更新・発信できる仕組みが整っていなかった。
🔍 ターゲット
- 日々の業務や経営に役立つ美容情報を効率よく収集したい美容師やサロンオーナー
- 商談やサロン訪問時に自社の最新情報や営業所情報をその場ですぐに提示・確認したいコスモの営業担当者
📃 目的
- サロンの成長を支えるパートナーとしての信頼を獲得し、関係性を深める
- 営業先で自社の強みや情報をその場でスムーズに提示できるツールとして活用する
- クライアント自身の手で手軽に情報発信を続けられる持続的な運用環境を作る
💻 デザインのハイライト
美意識の高い美容師を対象とするプラットフォームとして、発信する情報の価値を損なわないよう、現代的で信頼感のあるビジュアル設計を徹底しました。ベースは白を基調としたミニマルなトーンと、質の高い写真を活かすシンプルなレイアウトを採用。コーポレートカラーの紫はホバー時や細部のアクセントに留めることで、企業としてのアイデンティティとサイトの機能性を両立させました。
トップページView Page
- 「Pickup Item」スライダー：商品写真とテキストを組み合わせたスライダー形式を採用し、製品自体の洗練されたビジュアルを活かして魅力的に訴求できる設計に
- 「Product」セクション：注目の商品カテゴリーをハッシュタグ風に配置して回遊を促し、ビジュアルにはファッション雑誌を参考にした写真のレイアウトを採用することでメリハリのあるデザインに
商品詳細（Product）View Page
WordPressのカスタム投稿を使用し、クライアント自身で投稿・管理ができる仕様の商品詳細ページです。
- タイトルや本文の他に「概要」「CTAボタン」「商品スペック表」など、クライアント自身で柔軟に管理・更新できるカスタムCMSを設計
- 「ブランドサイト（詳細閲覧）」「購入ページ」「取り扱い店舗」など複数のCTAボタンを配置することで、ユーザーの検討状況に合わせた導線を最適化
会社概要（About）View Page
- 上部の企業理念は印象的なビジュアルでブランドの世界観を伝えつつ、実務的な「会社情報」や「営業所一覧」へすぐ移動できるよう追従メニューを実装
セミナー情報（Seminar）View Page
- 以前のサイトで分かりづらかった「受付状況」や「開催スケジュール」を一目で把握できるよう情報を整理
- 「受付中」タグ、終了イベントの自動ソートを実装することで、スムーズな情報収集を可能に
