Web制作

コーポレートサイトのリニューアル制作|ブランディング・オリジナル撮影・Astro構築|株式会社ShareDan

  • ディレクション
  • デザイン
  • microCMS
  • コーディング
  • スチール撮影
  • UI設計
Overview
ShareDanのコーポレートサイトをゼロから再設計した自社サイトのリニューアル案件。旧サイトは、当時のShareDanが提供していることや目指している姿と、サイトから受ける印象が合わなくなっていました。制作・開発の相談、当時の採用活動、情報発信のいずれの入り口としても、期待する役割を果たせていない状態でした。 これを起点に、誰に何を伝えるかの整理から、ブランドメッセージの策定、オリジナル撮影、情報設計、デザイン、実装までを一貫して行いました。
Client
株式会社ShareDan
Scope
ディレクション | デザイン | microCMS | コーディング | スチール撮影 | UI設計
Year
2026

課題|サイトから受ける印象が、会社の実態と合わなくなっていた

旧サイトの課題は、現在のShareDanが提供していることや目指している姿と、サイトから受ける印象が合わなくなっていたことでした。具体的には3つの入り口がいずれも機能していませんでした。

制作・開発の相談:リニューアル前は、サイトを名刺代わりと考え「あればいい」という位置づけでした。そのため、サイトをきっかけにした相談は増やせていませんでした。

採用:当時はエンジニア採用に苦戦していましたが、自社サイトに採用ページがありませんでした。

情報発信:そもそも継続的に発信するブログやコンテンツがなく、公開後に情報を積み上げていく仕組みもありませんでした。

リニューアルの必要性は以前から認識していたものの、社内承認に時間を要し、着手できない時期が続いていました。

なぜその構成にしたか|「誰が何を求めて来るか」から決めた

承認後、デザインの刷新と並行して整理したのは「誰が、どんな課題や情報を求めてサイトに辿り着くのか」です。

当時の対象は2軸に絞りました。

- Web制作やシステム開発を検討している企業の担当者

- エンジニア採用の候補者

誰に何を伝え、どんな行動につなげたいのかを決めてから、情報構成とデザインを具体化しています。これは、ShareDanがお客様のサイト制作でも最初に確認している「誰に・どんな課題を・どんな成果につなげたいか」を、自社サイトにも適用したものです。

5軸に整理し、トップと下層で役割を分けた

サイト全体を ABOUT / SERVICE / WORKS / RECRUIT / BLOG の5軸で整理しました。閲覧者がそれぞれの目的に最短距離で到達できる構造です。

あわせて、トップページは概要、事業内容ページは詳細という役割分離を決めました。トップに情報を詰め込まず、知りたい人が深く読める場所を別に用意する形です。

これまで存在しなかったRECRUITページを新設したのも、この整理の結果です。

ブランドメッセージを策定し、ページ全体の語り口を揃えた

「We Build. We Grow. / 作るだけじゃない。仕組みも、人も、育てる制作会社」というコピーを策定し、全セクションの語り口とトーンを統一しました。

単にサービス項目を並べるのではなく、Webサイトを作ること、その後の仕組みを整えること、人材育成にも向き合うことを、ShareDanの姿勢として伝えるための言葉です。旧サイトと当時の会社像のずれを埋めるうえでも、デザインと文章を別々に考えないことを意識しました。

コーポレートカラーの緑を、サイト全体で一貫して使った

アクセントに使った緑は、リニューアル時に新しく選んだ色ではありません。もともとのコーポレートカラーを、ShareDanを識別する色としてサイト全体で一貫して使用しました。

色だけに新しい意味を持たせるのではなく、写真、文字、余白、動きと組み合わせたときにShareDanらしい見え方になることを重視しています。

装飾は抑えつつ、ミニマル志向に寄りすぎないことも意識しました。ユニバーサルデザインとアクセシビリティの視点を全体に通し、誰にとっても明快で迷わない構造を目指しています。

情報の順序と導線まで含めてデザインした

デザインは装飾だけの作業ではありません。今回は、**どの順番で情報を見せるか、次の行動にどう進んでもらうか**までを含めて設計しました。

たとえば旧サイトでは、スマートフォンの最初の画面が画像で埋まり、その先の情報へ進みにくい状態でした。新サイトではPCとスマートフォンの両方で情報の順序を見直しています。

問い合わせへの導線も複数の場所に配置しました。ヘッダーにCONTACTボタンを固定し、PC・スマートフォンのどちらでもスクロール中に接触機会が切れないようにしています。

写真は完全オリジナル撮影

写真は、サイト全体のデザイントーンをつくる要素として、最初から設計に組み込みました。汎用的なストックフォトでは会社固有の雰囲気を伝えにくいと考え、使用する写真を完全オリジナルで撮影しています。

制作の現場では、撮影を行わず支給素材やストックフォトでサイトを構成するケースもあります。その経験があるからこそ、オリジナル撮影が会社らしさを伝えるうえで重要であることを、サイト自体から感じてもらいたいという意図がありました。

一方で、顔を全面的に写したくないという希望もありました。顔を大きく見せる写真だけに頼らず、構図、切り取り方、ページ内での使い方を調整し、希望に配慮しながらブランドの印象を保つことを目指しています。

撮影をするかどうか、人物をどこまで見せるかに、すべての会社で同じ正解があるわけではありません。企業側の希望や制約を確認し、その条件のなかで何を伝えるかをデザインと一緒に考えることを重視しました。

Astro × microCMS × Vercel を選んだ理由

技術は新しさだけで選ばず、表示速度と更新のしやすさを両立する目的で Astro × microCMS × Vercel を採用しました。

Astroで表示部分を構築し、ブログや実績などの更新情報はmicroCMSで管理、公開環境にはVercelを使用しています。発注担当者がすべての技術名を理解する必要はありません。重要なのは、表示する内容と更新方法に合わせて必要な構成を選ぶことです。

ShareDanはデザインと開発の両方に対応しているため、デザインを決めたあとで実装方法を考えるのではなく、更新のしやすさや表示方法まで同じチームで検討しました。これにより、デザインの意図と実装のずれや、工程間の手戻りを抑えやすくなります。

成果①|複数のデザインギャラリーに掲載

公開後、リニューアルしたサイトは複数のWebデザインギャラリーに掲載されました。掲載そのものが問い合わせや売上を保証するわけではありませんが、今回重視したデザインが複数の外部の視点から取り上げられた事実として受け止めています。

このうち[MUUUUU.ORG]では、2026年6月30日の「SITE OF THE DAY」に選出されました。掲載ページでは、アクセントカラー、やさしく柔らかい配色、人物写真、細やかな動き、レスポンシブ対応といった特徴で分類されています。

このほか、次のギャラリーにも掲載されました。

- [Web Design Clip]:メインカラー・サブカラーの緑、Astro、レスポンシブWebデザイン、シンプル、スクロールテキスト、テキストエフェクトなどの特徴が付与

- [KASOU]:トップページと下層ページを掲載

- [S5-Style]:ハイクオリティなサイトを集めるギャラリーに掲載

「デザインに力を入れました」と自分で言うのは簡単です。ただ、第三者が運営するギャラリーに実際に取り上げられると、目的の1つだった「トレンド感を取り入れて印象を刷新する」ことが、外部の基準でも達成できていたという確認になります。

成果②|公開後71日間で、自然検索の露出と滞在時間が増えた

公開前後の同じ71日間を比較しました(公開前:2026年3月1日〜5月10日/公開後:5月11日〜7月20日)。

  • Google自然検索の表示回数:2,360回 → 8,709回(約3.7倍)
  • Google自然検索のクリック:130回 → 360回(約2.8倍)
  • 自然検索ユーザー1人あたりの平均エンゲージメント時間:1分3秒 → 2分4秒(約2倍)

見つけてもらえる回数だけでなく、自然検索から訪れた人がサイトを見る時間にも変化がありました。

### 改善できていない点も併記します

一方で、平均掲載順位は5.81位から9.05位へ下がり、検索結果でのクリック率も5.51%から4.13%へ低下しています。新しい検索語で表示される範囲が広がった結果でもありますが、上位表示や検索結果上の見せ方はこれからの課題です。

また、次の点は成果として扱っていません。

  • サイト全体のセッション数:他サイトからの流入や有料検索を含むため、リニューアルだけの成果としては扱えません。ここでは自然検索を切り分けて掲載しています
  • 問い合わせ数:計測方法を変更しているため、リニューアル前後を同じ条件で比較できません
  • 各施策の寄与度:リニューアルと同時にページ構成の変更、採用ページの新設、記事の追加を行っているため、どの施策がどれだけ影響したかは切り分けられません

増えた数字だけで成功と判断せず、検索語やページごとの状況を確認しながら改善を続けています。

成果③|技術構成が、実際の商談につながった

この技術構成を自社サイトで採用した実績がきっかけとなり、実際の商談につながりました。

受注や売上を確約する話ではありませんが、自社サイトがデザインを見せる場所だけでなく、技術対応力を確認してもらう制作実績としても機能した事例です。

コーポレートサイトのリニューアルをご相談ください

今回の経験から改めて感じたのは、リニューアルはデザイン、情報設計、撮影、開発、公開後の運用を別々に考えるより、**一つの目的でつなげたほうが判断しやすい**ということです。

次のようなご相談をいただいています。

  • 会社の事業内容や姿勢が、今のサイトから伝わっていない
  • トレンド感だけでなく、自社らしさのあるデザインにしたい
  • ストックフォトではなく、撮影を含めてデザイントーンを整えたい
  • 更新しやすさや表示速度も含めて技術を選びたい
  • 公開後のブログや集客、改善まで相談したい

ご相談時には、参考サイトの好みだけでなく、誰に何を伝えたいか、現在のサイトで困っていること、公開後に誰が更新するかまで伺います。要望がまだ言葉になっていなくても、目的と課題を一緒に整理します。

ShareDanでは、目的整理から情報設計、デザイン、開発、公開後の運用までご相談いただけます。月額契約だけでなく、必要なときのスポット対応もあります。

また、このサイトのデザインを気に入っていただけた場合は、担当したデザイナーを指名してのご依頼も承っています。

このリニューアルの詳しい経緯は、ブログ記事で解説しています。対応範囲はサービスページをご覧ください。

採用情報

(Toward a Team That Grows Together)

技術で、誠実に。 育て合うチームへ。 現場で学び、共につくる環境があります。

実装の現場で積み重ねる日々の経験こそが、技術を深め、
信頼できるチームをつくる土台になると私たちは考えています。
ShareDanでは、共に学び合い、育て合う文化を大切にしています。

お問い合わせ

制作のご依頼・ご相談

お電話

03-4362-7069

受付時間 平日10:00 〜 18:00