ファーストビューデザインを業種別に作ってみた｜特別編

こんにちは、デザイナーのAbe.Cです。

前編・後編と2回に分けてお送りしました「ファーストビューデザインを業種別に作ってみた」はいかがだったでしょうか？

これまで「アパレル」「Webサービス・アプリ」「学校・教育機関」「旅行・宿泊施設・交通機関」という業種で作成した4つをのファーストビューデザインを紹介させていただきました。

今回は特別編ということでもう3つご紹介させていただきます。

業種については、「医療」「飲料・食品」「人材」になります。是非ご覧になってみてください。

制作するうえで決めたこと

採用サイトを制作するうえで重要になるのが「誰に」「何を」伝えるのかという点です。

ターゲットを明確にしないまま制作をスタートしてしまうと、魅力を伝えるべきお客様に、正しく伝わらなくなってしまう為、役割を果たせない採用サイトになってしまいます。

なので今回は「ペルソナの設定」と、サイトを作るうえでポイントとなってくる「配色」の2点を踏まえて制作するようにしました。

詳しい内容は以下の通りです。

ペルソナ

• 年齢
• 性別
• 人物像
• 業界

配色

• ベースカラー
• メインカラー
• アクセントカラー

ではさっそく、私の制作したファーストビューデザインを見ていきましょう。

医療

ペルソナ

• 年齢：20代～30代前半
• 性別：男女
• 人物像：医療現場の営業又は医師として働きたいと思っている求職者
• 業界：医療系

配色

• ベースカラー：白
• メインカラー：青（グラデーション）
• アクセントカラー：なし

デザインするうえで意識したこと

• 医療現場の営業又は医師として働きたいと思っている求職者向けの採用サイトをイメージしたため、働いている社員の写真を全面に出したデザインにしました
• 医療系のサイトは清潔感や安心感を与える青を使用したサイトが多かった為、青を使用しました
• 写真は真っすぐ置くのではなくあえて斜めに置いて3列のうち左右の列が上に自動スクロール、真ん中の列が下にスクロールし、色んな社員の写真が見えるようにしました
• FV内にお知らせを掲載しているサイトもいくつかあり、伝えたい情報がすぐに求職者に伝えられるようにFVの下部にNEWSを設置しました

飲料・食品

ペルソナ

• 年齢：20代（新卒）
• 性別：男女
• 人物像：製造ラインの管理や商品開発の研究などを行うことに興味がある新卒の求職者
• 業界：飲料・食品

配色

• ベースカラー：白
• メインカラー：赤
• アクセントカラー：なし

デザインするうえで意識したこと

• 飲料・食品（パンの製造を行ってる企業のサイト設定）の採用サイトをイメージしたため、実際に商品を食べている消費者の写真を大きく使用しました
• 調査した結果、飲料・食品系のサイトはメインカラーに赤を使用しているところが多かった為、メインカラーに赤を使用しました
• 尖ったデザインよりも安心感を与える柔らかい曲線を取り入れたデザインで作成しました
• キャチコピーは分かりやすく大きくしました

人材

ペルソナ

• 年齢：20代～30代
• 性別：男女（どちらかというと男性寄り）
• 人物像：バリバリ働きたい男女（ビジネスマン、キャリアウーマン）
• 業界：人材

配色

• ベースカラー：白
• メインカラー：黒
• アクセントカラー：蛍光グリーン

デザインするうえで意識したこと

• 人材会社の採用サイトをイメージしたため、求職者に会社の理念を訴えかけられるよう、キャッチコピーは目立つデザインにしました
• キャッチコピーには男性の写真をクリッピングマスクし、さらに減算することで深みのあるデザインにしました
• 奥行感を出す為に男性社員の写真を拡大し、ぼかしたものを一番後ろに敷きました
• 全体的に重厚感のあるデザインになっている為、アクセントカラーには蛍光グリーンを使用しました

まとめ

いかがだったでしょうか？

見せ方はターゲットによって無限にあります。今回作ったデザインの中にはアクセントカラーのないものもありましたが、必ずアクセントカラーを入れなければならないというルールはないので企業に合った配色ルールを設けて作成してみてください。

それではまた次の記事でお会いしましょう。