ベビー用品の採用webサイト(自主制作)
SHElikes PROデザイナーの課題にて初めてデザインからコーディングまで作成しました。転職を考えている20~40代男性女性のエントリー数を増やす目的として作成しました。(制作時間5週間)
🌸対応範囲🌸
・情報設計
・デザイン制作
・コーディング
アップ
🌸情報設計🌸
1.サイトの目的
・転職希望者にエントリーしてもらうこと
2.ターゲット
・転職を考えている20~40代男性女性
3.その他の情報
・清潔感/純粋/優しさ/親しみをテーマにしている
・色に関しては、全体で清潔感を出しつつ、アクセントカラーで優しい印象を加える。ただし、男性にも受け入れられるようにメインカラーには青ベースのものを使用。また、アクセントカラーにパキッとした色を使用することでアクセントを加えている。
🌸ペルソナ🌸
・転職活動中30代女性
・子供用品を扱う会社に興味がある
・子供だけでなく、お父さんお母さんの笑顔にもフォーカスしている会社を探している
🌸ペルソナに届けたいこと🌸
・子供だけでなくお父さんお母さんも包む会社に共感してくれること
🌸工夫したところ🌸
①エントリーボタンを目立つようにする
・アクセントカラーを使用すし、常に表示させることで目立つようにし、エントリーボタンにすぐたどり着けるようにする

②メインビジュアルに会社のコンセプトが伝わる写真を配置
・メインビジュアルにお母さんが赤ちゃんを抱っこしている写真を使用することで、会社名にもなっているコンセプトである「包む」を表現

③NEWSを配置して、今募集している職種がわかるようにする
・リアルタイムで募集職種を表示させることで、転職者の興味を引き付ける

④写真を使ってどんな事業を行っているのか、視覚的に伝える
・それぞれの事業の説明に、事業のイメージ写真を使用することでどんな事業を行っているのか、パット見てわかるようにしている
⑤採用フローを追加
・転職者にとって必要な情報である採用フローをアイコンを使って視覚的にもわかりやすく

🌸学習を通して学んだこと🌸
・デザインカンプを作成した段階で、余白をどこにどれくらい設けたかわかるようにしておくといいということ
・レスポンシブ対応のことを考慮して、PC版で左右の余白を多めに取っておくことが大切であること
・今回の課題のメンバー紹介のようにカードで画面表示するものは3つを上限にしないと画面幅が早い段階で崩れてしまうということ
・マークアップの段階でクラス名を細かく付けておくことが大切であること
