LPトレース

＊トレースしたLP

＊スタイルガイド
＊レイアウト分析

＊概要

スタイルガイド必須要件

・ 色 

・ タイポグラフィ（フォント/サイズ） 

・ 余白 

・ 各項目について気づいたこと 

・サイズ 

レイアウト分析必須要件

・ PC/スマホのスクリーンショット 

・ レイアウトの違いについての分析内容 

・ その他デザインの工夫で気づいた点 

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

1.Webサイトを作成する上での総合的な知識

フォントや画像の配置の仕方、メニュー、表、入力欄のレイアウト方法やスマートフォンでのリサイズ方法等、Webサイトを作成する上での総合的な知識を実践的に学ぶことができました。

2.検証ツールでの分析

題材として選んだ「HELLOスクーター」のサイトは、色使いやフォントサイズ、余白が細かく使い分けられていたため、”検証ツール”での分析の仕方については、今回の課題でより深く身に付いたように感じます。

3.複数色でのデザインのまとめ方

メインカラーやアクセントカラーが複数色になっても、色のトーンを意識して制作するこで、ポップな印象でも、煩雑にならないようなサイトに仕上げることができるということくを学びました。

＊工夫した点

トレースしたLPと同じトンマナを使用

検証ツールで調べてみると、今回の題材には多くの色とフォントサイズが使用されていることがわかりました。それらの規則性をみつけてまとめるだけでなく、LPと同じトンマナを使用して、スタイルガイドや分析をまとめることにこだわりました。