グローバルパートナーズ
| サイト種別 | コーポレート採用サイト（WordPress） |
| 目的 | 「制度づくり＝採用ブランディング」という認識を中堅IT企業の人事責任者に持ってもらい、顧問契約・スポット導入の問い合わせにつなげること |
| ターゲットユーザー | 中堅IT企業(従業員50〜300名規模)の人事責任者。社内稟議のため、実績・数字での説得材料を求めている層 |
| 制作環境 | WordPress / 自作カスタムテーマ / Local（ローカル開発環境） |
| 対応デバイス | スマートフォン優先（SP/PC レスポンシブ対応） |
| 製作期間 | 約2週間 |
目的
「制度づくり＝採用ブランディング」という認識を、中堅IT企業の人事責任者に持ってもらうこと。そのうえで、顧問契約・スポット導入の問い合わせにつなげることをゴールに設計しました。
ターゲット
中堅IT企業(従業員50〜300名規模)の人事責任者。30代後半〜40代。採用競争力を高めたいという課題感を持っており、制度変更を進めるには社内稟議を通す必要があるため、実績や数字といった説得材料を求めている層です。
制作環境・対応デバイス
PC/SP対応。WordPress自作テーマ、FLOCSS設計。
Scope
ヒアリングシートからデザインカンプまでを一気通貫で担当。コーディングはClaude Codeが担当しました。
使用技術・ツール
WordPress自作テーマ／FLOCSS設計／カスタム投稿タイプ(導入事例)／Claude Code
制作のポイント
1. 士業ジャンル、初挑戦
これまでのポートフォリオにない業種でした。税理士・社労士・弁護士という選択肢の中から社労士を選んだのは、「制度」という目に見えにくいものを扱う難しさに惹かれたからです。そのうえで「制度・労務のプロ」という手堅い打ち出し方ではなく、あえて「攻めの人事戦略パートナー」という切り口を選びました。士業というと保守的な業界イメージが強いぶん、そこに切り込む意味があると考えたためです。
2. ヒアリングシートからコンテンツマップまで、テンプレート運用へ完全移行
これまでmdファイルで作成していたヒアリングシート・仕様書・ディレクトリマップ・コンテンツマップの4工程を、xlsxテンプレートで作成した初めての案件でもあります。特にコンテンツマップは、Excelの図形機能でボックス+コネクタ線によるサイト階層図を組み上げる形式で、実務に近い緊張感のある作業になりました。
3. Claude Designとの協業・比較検証
同じヒアリングシート・仕様書というブリーフから、2つのデザイン案が生まれました。ひとつはネイビー×斜めカットの幾何学的な案、もうひとつはネイビー×ピル型ボタンの柔らかい案です。配色の方向性は同じ結論にたどり着きながら、ディテールの解釈が違う ―― という発見がありました。最終的には後者を採用しましたが、双方の良いところを見比べながら進められたのは、複数の視点を持てるからこその収穫でした。
4. 新しい配色・タイポグラフィへの挑戦
ネイビー×ビビッドコーラルオレンジという配色は、明朝体やブラッシュ書体を中心にしてきたこれまでのポートフォリオにはなかった方向性です。BtoB SaaS寄りのシャープな印象を意図的に狙い、ポートフォリオ全体のバランスを広げる意味も込めています。
却下した案
- 士業の種類:税理士事務所・弁護士事務所とも比較したうえで、社会保険労務士事務所を選定。「制度・労務のプロ」という守りの路線ではなく、”攻め”を打ち出せる余地の大きさを決め手にしました
- ブランドの世界観:「制度の複雑さを整理する路線」「経営者の隣で伴走する路線」も検討しましたが、他の案件にない現代的なトーンを出せる「攻めの人事戦略パートナー」路線を選定
- 事務所名称:STRIDE社会保険労務士法人、組織デザイン社会保険労務士法人「NOWA」とも比較し、成長を前面に出した読みやすさを重視して「グロースパートナーズ」に決定
- ペルソナ:急成長スタートアップの創業者/CEO、二代目経営者(レガシー産業)という案もありましたが、「社内稟議のための説得材料を求める」という具体的な行動につながる、中堅IT企業の人事責任者を選定
- サイト構成:1ページLP型・ハイブリッド型とも比較したうえで、BtoBの意思決定者が情報を探しやすい複数ページ型を選定
目的から表現への接続
ペルソナ設定で「社内稟議のための説得材料が欲しい」という行動特性を定めたことが、そのまま表現の判断基準になりました。料金プランページに詳細な比較表を設けたのも、導入事例をBefore/After形式で数値化したのも、すべて「稟議を通す人事責任者が、上司に説明しやすい形にする」という一点から逆算しています。配色のネイビー×ビビッドアクセントも、「守りの労務から攻めの人事へ」という世界観をそのまま視覚化したものです。
制作物一覧
| 工程 | 成果物 |
|---|---|
| ヒアリング | ヒアリングシート |
| 要件定義 | 仕様書 |
| サイト構造 | ディレクトリマップ、コンテンツマップ |
| 画面設計 | ワイヤーフレーム(全15ページ) |
| デザイン | デザインカンプ(全13ページ) |
| 実装 | WordPress自作テーマ(Claude Code実装) |