【課題】LP制作(デザイン/コーディング)

OVERVIEW

SHElikes MULTI CREATOR COURSE の課題。架空のクライアントからの依頼(テキスト・ヒアリング動画)を元に、PC・スマホのワイヤーフレーム、デザインカンプ、実装までを行いました。

YEAR 2025

制作時間:約40時間(デザイン15時間、コーディング25時間)
制作範囲:情報設計・ワイヤーフレーム・デザインカンプ・コーディング(レスポンシブ)

制作物:


① 要件

  • 制作に関して
    • まだ明確ではないため、トンマナの指定なし
    • ロゴの提供あり/色変え自由
  • 制作目的
    • LPを通してターゲットに募集職種へのエントリーを行なっていただきたい
    • リクルートサイトという位置付けではあるが、“会社の色”を知ってもらうものにしたい
  • ターゲット
    • カルチャーフィットした人、会社にしっかりと合っている人にご応募いただきたい 

②制作物


③ 制作意図

◼︎クライアント様が入れたい要素

  • KV
  • 私たちについて
  • 働く環境
  • 事業について
  • 募集職種
  • メンバー紹介
  • エントリー
  • フッター

◼︎ペルソナ設定

  • 30歳女性
  • アパレル関連企業で企画職
  • 家族構成:夫
    • まだこどもは居ないが、仕事が楽しい
    • 35歳までにはひとりこどもがほしい
  • こどもを持つことを視野に入れ初めて、あかちゃん関連のプロダクトに興味を持ちはじめた
    • ベビー用品関連で自分のアパレル企画での知識が生かせるのではないかと思っている
  • 誰かのためになることが好きな平和主義者
  • 職場に対しては、人間関係や雰囲気を重視している

◼︎ムードボード



◼︎情報設計

KV|

あかちゃんをメインに、リクルートサイトであるということを示すために、事業に関連する写真、働いている人の写真を使用したKVを作成。雰囲気を伝える。

会社の解像度をあげるエリア|

  • この部分で引き続き会社の雰囲気を伝える。
  • メンバーエリアは、下層に詳細が表示される想定で作成している。

実際に応募するための解像度をあげるエリア

  • できればある程度の経験がある方に来てほしい意図がある。
  • 職種別にどういった人を求めているのか?についてはこちらも下層で詳細を表示する。
  • 自分も応募できるか?貢献できるか?ここで働きたいか?を判断してもらう。
  • 福利厚生を見てもらうことで、この会社で働くメリットを提示しておく。

エントリーボタン(CTA)|

  • エントリーボタンはヘッダーにも設置し、固定で表示してあるので、どのタイミングでもエントリーは可能な状態にしている。

④感想

一通りの流れを想定した制作を経験する中で、期日を守り、クライアントの要件を守り、どのように雰囲気を伝えるのか?を経験することができた。

期日を意識することで、今回は自分の技術力から複雑な構成をせず、シンプルに制作することに決めた。

コーディング自体はマークアップ設計書を作成することでPCはスムーズに実装できた。

レスポンシブ対応についてはまだ中間サイズの作成も行いたいと考える。


WEBSITE