LP制作（PC/SPデザイン・実装）

◯サイトの内容を決めた経緯

友人との些細な会話がきっかけです。
友人と好きな食べ物の話をしており、私が餃子が好きだと話すと、友人は餃子にネガティブなイメージを持っていたため、そのネガティブなイメージを変えたいと思いました。また同時に、よくデリバリーを利用するがデリバリーに対しての不満もあるという話から、この内容に決めました。

◯クライアント情報

見た目のかわいらしいパッケージや餃子の内容が女性向けの店舗を持たない餃子専門店。出来立てを早く配達することにこだわっているため、大阪駅から4km圏内にのみデリバリーをしている。オンラインショップで冷凍餃子の販売も行なっている。従来の餃子のイメージを払拭し、新しい魅力を伝えたい。

○要件 

目的▶︎従来までの餃子のイメージを変えて、餃子を購入してもらうこと

ターゲット▶︎写真映えを狙う流行に敏感な女性、餃子にネガティヴなイメージを持っている女性、美味しくて速く届くデリバリーを探している方

トンマナ ▶︎「親しみやすい雰囲気」「女性らしさ」「可愛らしさ」「シンプル」「清潔感」「洗練されている」

◯ペルソナ

架空の人物を設定することで、ターゲットの解像度を上げ、ペルソナの立場になってリアルに、目的を達成するために必要な要素やビジュアルの方向性を考えました。

◯ワイヤーフレーム

◯制作したLP

制作したLPはこちらです。

◯工夫した点

• サイト名は「準備ができている/すぐに届く」という意味の「Ready to」と「女性へ向けた」という意味の「Lady to」の2つの意味をかけ合わせています。

• ロゴは四角の上にリボンのついた餃子を上にのせることで、クライアントが売り出したいと考えているこだわったプレゼントのような餃子のラッピングを表現しています。

• 餃子の油っぽさを感じさせないよう背景を白にし、清潔感を出しました。また、中華らしい食欲を増進させる赤と組み合わせることでトンマナに合わせた新しく洗練された印象になるようにしました。

• コーディングは、コースの動画を繰り返し見ながら、インデントを合わせ、綺麗にコードを書くことで崩れが少なくなるよう意識して書きました。

• ヘッダーはスクロールしても動かないよう固定しました。サイト名を表示させておくことでユーザーの印象に残りやすくし、ボタンはいつでも注文できるようユーザビリティーを考えました。

◯修正したLP

• 「セクション間のグルーピングを意識できると良い」「赤と白以外の色も使えるといい」とのフィードバックを受け、背景色をラッピングの色に合わせたくすみピンクと交互にしました。「ここからここまで」がはっきりして、ユーザビリティが良くなったと思います。

◯制作を通して学んだこと

• 具体的なペルソナ設定の重要性

かなり細かくペルソナを設定して、デザインに取り組みました。そうすることでユーザーストーリーを想像しやすく、情報設計もしやすくなりました。

• UI /UXを考えたデザイン

ヘッダーを固定したり、ボタンの色を目立たせたりなど、ユーザーの目線に立ち、直感で操作できるように意識してデザインすることの重要性を実践を通して学びました。

• コーディングを意識したデザイン

初めてコーディングをしましたが、複雑で難しいため、かなりシンプルなデザインになりました。これからも学習を続けて理解を深め、複雑な実装もできるようになりたいです。