【実践課題】LPページトレース

OVERVIEW

SHElikes MULTI CREATOR COURSE にてLPページトレースを行いました|スタイルガイド作成、LPトレース、PCとスマホ画面の分析 [制作時間:13H / 使用ツール:Photoshop]

YEAR 2023

1.制作物

LPトレース

株式会社スマートバンクが提供する「B/43」のLPをトレースしました。

実際のページはこちら

▼見本とトレース

▼PC画面とスマホ画面の分析

▼スタイルガイド

Chromeの検証ツールを用いて、配色、フォント、余白の分析を行いました。

2.制作を通して学んだ点

1)配色は商品であるカードのカラーをアクセントとして起用

2)余白、フォントサイズは規則性をもって構成されている

3)お金を扱うサイトではあるが、フォント、写真の色味、見出しの文章のキャッチーさなどで親しみやすさを演出している

4)テキスト量は多いがアンダーラインやカラーを使って読みやすい工夫をしている

5)スマホではタップしやすいよう、ボタンの大きさや余白感が調整されている