Corporate / Recruit UX

SOZO Construction

“人と共に、街を創る。”を、企業サイトにする

架空の建設会社サイト制作例。 「会社紹介」「理念」「社員紹介」「採用導線」を一本の体験にまとめ、 建設会社としての信頼感と、働く人の魅力が自然に伝わる構成を設計しました。

  • Corporate Site
  • People Modal
  • Recruit Flow
SOZO Construction トップページのスクリーンショット
Top / PC
担当
情報設計 / コピー / デザイン / 実装
目的
建設会社の信頼感を伝えながら、採用につながる人の魅力を見せる
制作
HTML / CSS / JavaScript(動画背景切替・社員モーダル・スクロール演出)
設計
企業6:採用4
堅すぎず、軽すぎない建設会社サイトとして構成
表現
人を主役にする
建物だけでなく、社員・施主・地域の人が見えるサイトに
導線
採用へ自然につなぐ
社員紹介から求人情報まで、違和感なく読み進められる

“会社の強さ”を、人から伝える。

Overview

建設会社サイトは、施工実績・重機・完成写真が中心になりやすく、会社の中で働く人の魅力が見えにくくなります。
そこで本制作では、会社紹介・理念・サービス・社員紹介・採用情報を整理し、“人と共に街を創る会社”として伝わる導線を優先しました。

Challenge

課題は「企業サイトとしての信頼感」と「採用サイトとしての親しみやすさ」の両立。
・建設会社としての力強さを出したい
・社員や現場の空気も伝えたい
・求人情報だけが浮かないようにしたい
このバランスが、サイト全体の印象を左右するポイントでした。

Solution

  • トップでは巨大タイポと集合写真で、会社の勢いと人の存在感を強く見せる
  • 理念・サービス・採用の各セクションで、背景に人物写真を使いストーリー性を持たせる
  • 社員カードとモーダルを用意し、20名の個性や役割が伝わる構成にする
  • Recruitは数字・人物像・職種を整理し、応募前の不安を減らす導線にする

Highlights

  • セクションごとの動画背景切替と斜め構成で、建設会社らしいスピード感を演出。
  • 社員カード+モーダルで、会社の中で働く人の魅力を見える化。
  • 企業紹介から採用情報まで、ひとつの流れで自然に読める構成。

Design

黒とイエローを基調に、斜めのライン・巨大タイポ・金属感のある帯で、建設会社らしい力強さを表現。
一方で、写真は人を中心に選び、硬派な印象の中にも親しみやすさと採用につながる温度感を持たせています。

Screenshots

SOZO Construction トップページ
Top
SOZO Construction 理念セクション
理念を人物写真とともに提示
社員カードとPeopleセクション
SOZO Construction 採用セクション
採用導線と求める人物像

Result

建設会社としての信頼感を保ちながら、社員・施主・地域の人々が見えるサイトになりました。
企業紹介、理念、社員紹介、採用情報をひとつの体験としてつなぐことで、「人と共に、街を創る。」というコンセプトが自然に伝わる構成になっています。

Role & Deliverables

  • 情報設計:企業紹介〜採用導線までの構成設計
  • UI設計:背景切替 / 社員カード / モーダル導線
  • 制作:HTML / CSS / JavaScript

Technology

  • HTML / CSS / JavaScript ・ Video Background Switch ・ People Modal ・ Responsive Layout

参考制作費

約 ¥220,000〜¥380,000

コーポレートサイト / 採用導線 / 社員紹介 / モーダルUI / スクロール演出を含む想定です。

※構成・ページ数・機能数・実装内容により変動します。

“人が見える企業サイト”、設計します。

会社紹介・採用導線・コピー設計から実装まで一貫対応。
企業の強みと働く人の魅力を、伝わる形に整えます。

この規模感で相談する

このテイストで作りたい方へ。
“人が見える企業サイト”を体験できます。