WEBサイト・LPのトレースはじめます。
きょうからトレースをやるぞ!と決めました。
目標
1週間に1トレース! WEBサイト、LP交互に行う
ふるいたった記事
トレースのメリット
・デザインの細部を確認できる
・ 配色やレイアウトなど、デザインのトレンドを学ぶことができる
・ どういう作業にどのくらい時間がかかるのか知ることができる
サイトデザインの深いところまで思考することができます。
・ なぜこのマージンルールなのか
・ なぜこの配色なのか
・ なぜこのレイアウトなのか
なぜトレースがデザインの上達につながるのか?
・「デザインは細部に宿る」と言われますが、その細部に気付く」
・「デザインの引き出しが増える」
・「自分の悪い所が解る」←これが一番重要!
トレースしながら意識するところ
・ 余白間(マージン)の取り方
・ 見出しやテキストとのジャンプ率の付け方
・ 使用色の割合と使用数、差し色の使い方
・ 要素同士のサイズ感のバランス
・ 際立たせたい箇所の目立たせ方
トレース手順
①サイトの全画面スクリーンショットを撮る。
②photoshopで開いて、その上からシェイプツールで要素の範囲を囲う。 画像は黄色、テキストは緑色、マージンは水色と自分の中でいルールを決めておく。
③サイトのcssを見て、カラーコードや使用しているフォントなどもチェック。