【課題】LPトレース

１.　トレースしたLP

株式会社Luup様のLPをトレースしました。※現在はサイトリニューアル済み

２.　スタイルガイド

サイトの配色、タイポグラフィ、余白についてまとめ、分析しました。

３.　スマホとPCのレイアウト比較・分析

レイアウトの違いを図にまとめ、分析しました。

４.　工夫した点

■要素の配置・大きさなどの細かな調整

限りなく見本に近いトレースをするために、見本を下敷きしピクセル単位のズレもないように工夫しました。また、要素を随時整列させながら進めました。

■検証ツールの活用

Photoshopと検証ツールを何度も往復し、文字のサイズ・色・文字間、図形の大きさなどが一致しているか何度も確認しながらトレースしました。

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

■届けたい商品やサービスのコンセプト・想いが伝わるサイトづくり

今回トレースしたサイトでは商品のブランドカラーがアクセントに使用されており、アピールしたい商品・サービスを認知しやすかったです。制作の際はサイトの目的と届けたい情報を整理し、それが叶うようなデザインをすることが大切と学びました。

■あしらいの工夫

背景に敷いている長方形があえて中央からずらして配置されており、シンプルでまとまりがある中にも少しの工夫を加えることで一気に垢抜け、読み進めたいサイトになることを学びました。