Daily UI #3

こんばんは！
本日3日目！今日のお題はLPです！スマートフォンの画面設計が多く、webは久しぶりなので時間がかかりそうですが、今日も頑張って制作していきます！

ステップ1, webサイトの内容を考える

今回は要素を洗い出す前に、何のサイトなのかを明確にしないとヘッダー欄が埋まらないと思ったので、先に内容を決めます。
そもそも、LPとHPの明確な違いがわからなかったので調べてみました。

LPとHPの違いとは？

LPはランディングページの略で、ユーザーに特定の行動をしてもらうように促すサイトで、商品を紹介したのちに購入してもらったり、サービス概要を説明したのちにお問い合わせ、資料請求をしてもらう、などといった内容を指します。
一方HPとはホームページの略で、情報を提供することを目的としています。例えば、コーポレートサイトの中に、企業説明、業務内容、採用などの項目があり、それらの情報をユーザーに見せるという内容を指します。

このような違いがあり、今回はLPを制作するというお題ですので、何かのアクションを最後に想定したサイトということになります。

今回は、案件獲得を目的としたフリーランスデザイナーのポートフォリオサイトをテーマに設定しました。

ステップ2, 必要な要素を洗い出す。

メインビジュアルに必要な要素を考えていきます。

• ヘッダー

  • ページ遷移先

    • トップ

    • ギャラリー

    • コンタクト

    • 経歴

• 名前

• 写真

• 役職

ステップ3, UI画面をデザインする

あまりにも情報が少なすぎたのでSNSへの遷移を入れてみました。

工夫した点

• 作品や写真を邪魔しないようにモノトーンでまとめ、使用色を少なくした

• 洗礼された印象かつ親しみやすい丸みを帯びたフォントを使用

• 要素が少なく余白が多いので、バランスを考えた

改善点

• コンセプトがぐらぐらすぎて作り込めなかった

最後までお読みいただきありがとうございました！🙇‍♀️