【Webレビュー】サイボウズ株式会社　採用サイト

URL

採用情報 | サイボウズ株式会社
採用人事で先を行くサイボウズが本気で採用サイトを作ったら？ 戦略と制作過程を解説 | knowledge / baigie

制作会社

株式会社Beigie

第一印象

白と鮮やかな青を基調としており、明るく爽やかな印象を受ける。
ゴシック体で文字間を程よく開けていることで非常に読みやすく、情報が受け取りやすい。
情報がかなり多いが、ページ数を増やし、階層構造を作ることで、情報が整理されており、訪問者が情報を選びやすい。
ナビゲーションが丁寧で、どこにどの情報があるのかも分かりやすくなっている。

ターゲット

求職者…インタビューにもあるように、どんなタイプの求職者にも対応できるような構成にしている。

使用フォント

メイン…Noto Sans CJK JP
全て同じフォントが使用されていることで、統一感が出ている。

配色

青…#006FB9
黒…#00021

デザインポイント

企業理念などから、サイボウズはチームワークを重視していることが窺える。そうした理念を表現するために、全体的に○（輪）の表現が多いのではないか。
また、個性を尊重する文化を表現するために独立した○が散りばめられており、同系統の色にすることで、チームとしての統一感を表しているのではないか。
情報量とページ数の多さから、本サイトの目的は求職者が満足して応募できるだけの情報収集をしてもらうことにあると推測する。そのため、ホームや各詳細ページのトップはナビゲーションの役割を果たしており、テキストやサムネイルでどのリンクにどの情報があるのかが分かりやすく表示してある。
全ての要素の角が丸くなっているのは、柔らかさやとっつきやすさを感じさせる効果を狙っているのではないか。また、クリックできる要素にはうっすらとシャドウをつけており、「押せる感」を演出している。(-20,3,99)

＜写真＞
トップビジュアルはチームワークと多様性を表現するため、老若男女、多国籍の人物が談笑をしている風景にしているのではないか。

全体を通して、サイボウズ株式会社の特徴であるカラフルでユニークなオフィスも背景として見せ、サブリミナル的に印象づけているのではないか。
＜色＞
白がベースで使われていることで、クリアな感じや清潔感を感じる。また、情報量に対して余白が大きくとられており、息継ぎと同時に、オープンな印象も受ける。求職者としては安心できる企業に入りたいと思うのは当然の心理なため、クリアでオープンな印象を持たせたいのではないか。

実装ポイント

＜ヘッダー＞
ただ上部にfixするだけでなく、下部にbox-shadowをかけることでコンテンツが下に入り込んでいるように見せ、自然な感じにしてしまう。役割として常にグローバルナビを見せておきたいが、ただfixするだけだと不自然に感じてしまう。

ラインが伸びるホバーアクション
サムネイルだけズームするホバーアクション