[課題]TSUTSUMU 採用サイト LP制作
SHElikes MULTI CREATOR COURSEの制作課題として採用サイトのLP制作をしました。ベビー用品事業などを取り扱う企業の採用サイトのワイヤーフレーム作成からデザインカンプ制作、コーディングまで行いました。
制作期間・・・5週間(デザイン2.5週間)(コーディング2.5週間)使用ツール・・・(デザインカンプ)Photoshop(コーディング)HTML、CSS
●制作物
(デザインカンプ)
●課題要件
●情報設計で工夫したところ
①ペルソナの設定
②ユーザーストーリーとそれを元にコンテンツを再考する
デザインで工夫したところ
①ビジュアルデザイン
・「世界をやさしさでつつむ」という企業理念であるため、角丸四角や丸のシェイプを使 い、柔らかく優しい雰囲気にしました。
・ボタンはグラデーションにし、柔らかい雰囲気の中でも目立つようにしました。
②ホバー時のデザイン
③レスポンシブ対応
・ヘッダーにハンバーガーメニューを設置し、タップしてナビゲーションメニューが出る ようにしました。
④配色
TSUTSUMUの企業概要からの包むような温かいイメージが連想されたため、オレンジとをピンクをコーポレートカラー(以後CC)と設定しました。そして、コーポレートサ イトでは、CCをベースカラーやメインカラーに使われていると仮定し、採用サイトで は白をベースカラーにし、柔らかい雰囲気の中にも、求職者に向けて企業のクリーンな イメージをアピールできるようにしました。
⑤フォント
サイト全体の柔らかい温かい雰囲気の中でも、必要な情報が目立つように、和文・英文 共にはっきりとしたフォントを選びました。
●学んだこと
初めてワイヤーフレーム作成からデザインカンプ制作、実装まで行いました。コーディ ングする際、その前に行うマークアップ設計図で整理することが非常に大切であると 学びました。コーディングを始めてから、マークアップ設計図の不備に気づくことも 多かったため、今後はデザインカンプ作成時から、おおよそのマークアップ設計図をイメージできるように意識してまいります。