【実践課題】LPページトレース
OVERVIEW
SHElikes MULTI CREATOR COURSE にてLPページトレースを行いました|スタイルガイド作成、LPトレース、PCとスマホ画面の分析 [制作時間:13H / 使用ツール:Photoshop]
1.制作物
●LPトレース
株式会社スマートバンクが提供する「B/43」のLPをトレースしました。
実際のページはこちら
▼見本とトレース
▼PC画面とスマホ画面の分析
▼スタイルガイド
Chromeの検証ツールを用いて、配色、フォント、余白の分析を行いました。
2.制作を通して学んだ点
1)配色は商品であるカードのカラーをアクセントとして起用
2)余白、フォントサイズは規則性をもって構成されている
3)お金を扱うサイトではあるが、フォント、写真の色味、見出しの文章のキャッチーさなどで親しみやすさを演出している
4)テキスト量は多いがアンダーラインやカラーを使って読みやすい工夫をしている
5)スマホではタップしやすいよう、ボタンの大きさや余白感が調整されている