【実践課題４】LPデザイン　カンプ制作

●制作情報

制作時期：2024年 9月
制作時間：２週間
使用ツール：photoshop
制作の目的：
・ワイヤーフレームがある状態からデザインカンプを制作することに挑戦する
・イメージを固めるためのムードボード作成に挑戦する
・Webデザインをする際に気をつけるべき点を学ぶ
・前回の課題でインプットしたPCとスマホのレイアウトの変化を自分で考えられるようになる

●要件定義

・クライアント情報
　クライアント名:WORK ,inc.
　女性向けのビジネススクールを展開している。会員は20~30代の女性が多く、キャリアアップのためにビジネススキルを学び、さらにそのアウトプットの場として定期的にビジネスコンテストなどのイベントも開催されている。

・コンセプトとテーマ

　コンセプト：働く女性が勤務後でもくつろぎながら勉強できる環境を提供すること、またその周知
　テーマ：キャリアアップのためのリラックススペース

・ペルソナ設定
クライアントより指定あり

●制作物

PCカンプ

●クライアントから支給されたワイヤーフレームとそのブラッシュアップ

●ムードボードとスタイルガイド

●課題を通して学んだこと

・ワイヤーフレームの大切さ
見切り発車でなんとなく制作するのではなく、必要な要件を組み込んだり、アクションに繋がるCTAの配置位置をどうするかを事前に決めることによって統一感が出ました。説得力のあるLPになりました。

・ペルソナ設定とペルソナを意識したムードボード

どんなペルソナにするかを設定したことで、イメージがブレずに設計することができました。目的達成のために必要な写真や配色を決めることでスムーズに制作できました。

・WEBデザインの基礎
UI/UXを意識した構成を考えること、またコーディングすることを想定して、フォントサイズや余白に規則性を持たせることも大切だと言うことを学びました。

●こだわったポイント

・目的に沿ったデザインを作ること
LP制作の目的を正確に理解し、目的達成のためにクライアントの要件を深掘りし、情報設計をしていくことを学びました。

・UI、UXの意識
どんな配色、写真にすれば目を惹くだろうか、アプリへ誘導できるだろうかなど
常に考えながら作業することができました。

・基本的なデザインへの意識や技術の定着
苦戦していたデザイン4原則も意識できるようになってきたと思います。
Photoshopで使ったことのない機能を使ってみたいと思い、Conceptなどのメイン文字の
色づかいや、UIのボタンの立体感などは自分なりに調べて作ってみました。