Webページトレース

目次

1. Webページトレースの目的とゴール
2. Webページの分析
3. 頑張ったポイント

1. Webページトレースの目的とゴール

■目的

• Webデザインにおける基本的なビジュアルデザインの感覚を掴む
• Webデザインをする際に一定のルールに則ってデザインするということを学ぶ（スタイルガイド）
• Webデザイン特有のデバイスによるレイアウトの変化を学ぶ

■ゴール

• 見本のWebページとの差分が少ないクオリティの高いトレースを完成させることができる
• 見本のWebページを分析してスタイルガイドをまとめることができる
• PCとスマホでどのようにレイアウトが変わるのかを言語化することができる

2. Webページの分析

3. 頑張ったポイント

デベロッパーツールを活用しながら、元のWebサイトに忠実にトレースすることと、スタイルガイドのデザインを頑張りました。

トレースについては、トレース見本とデベロッパーツールを行き来しながら、フォントのサイズや色も細かく調整しました。

シャドーについても、つけ忘れがないように細かく確認しました。