課題制作-LPトレース-

-----------------------------------

・制作期間：2週間

・使用ツール：Photoshop]

-----------------------------------

【目次】

1.トレースしたLP

2.デザインガイドライン

3.PCとSPデザイン比較

4.制作を通して学んだこと

◆トレースしたLP

今回トレースさせていただいたサイトはこちらです。 

◆デザインガイドライン

◆PCとSPデザイン比較

◆制作を通して気づいたこと

• 女性向けの人材紹介サイトということで、濃い過ぎず清潔感があり華やかな色を選択されている。
• メインカラーや文字を紺色を配色することメリハリを持たせ視線が届くようになっている。
• あしらいとそれぞれのアイコンを区別するアクセントの色分けで分かりやすくなっている。
• 日本語の箇所の大半はNoto Sans JP占めている、 ゴシック調で読みやすい。複雑してないくスッキリしている。
• メニューバーなどの英数字はBrandon-grotesque で統一している。丸み帯びて可愛いらしい印象に。
• 一部のキャチコピーをヒラギノ角ゴ ProNにして変化を持たせている。
• 余白のスペースをバランス良く配置を決めることで、Webサイト全体の情報が伝わりやすくなっている。
• ユーザーが得たい情報を短時間で求めやすくする。
• 余白のスペースをとったことによって必要なコンテンツのグループを見つけやすくなっている。
• 文字と文字の間、行と行の間に適切なスペースをあけることで、読みやすくなっている。

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

デペロッパーツールでホームページ制作側での意図を読み取り、

一定のルールに則ってデザインするということを学ぶびました。

また特有のデバイス（レスポンシブ）によるレイアウトの変化を

学ぶことで、次のLP制作活かせることができ大変有意義な勉強でした。