まなびめも

新卒でWEBデザイナーとなる22歳女子が、自由気ままにお勉強メモを残していきます。

上達への近道。まねっこWEBトレース! #1

この間のGWに、丸一日時間がとれる日があったので
大学のWEB専攻の仲間と集まり、サイトのトレースを行いました!



WEBトレースとは?

その名の通り、現在公開されているWEBサイトを
そっくりそのまま同じに作ること。まねっこです。

つまり、
どこかのプロのWEBデザイナーが作ったデザインを
そっくりそのまま作ってみることで
デザインの細部を勉強しちゃおう!という勉強法です。



トレースによって上達する理由

これは、やってみるとよーくわかると思うのですが
「気づき」 がたくさん得られます。
自分では考えもしなかったところが
トレースしているときに見えてきます!

マージンルールや配色、レイアウト、
細かいシャドウやグラデーションなどなど、

「これ、私が作るときにはできない表現だな〜、すごいな〜」

と何度も思います。笑

本屋などで「Photoshopの基本!」などの分厚い本を見かけますが
やりながら覚える
これが一番身につくと思います!



トレースする前に...

今回は
こちらの「スポーツクラブNAS」さんのサイトを
トレースさせていただきました。


このサイトを選んだのは

  • 自分自身グラデーションが苦手なので克服したい!
  • ボックスが並ぶデザインなので、余白の取り方が参考になりそう!
  • 「清潔感のあるデザイン」を学びたい!

といった理由からです。



私は、トレース元のサイトを選ぶときに
「なぜこのサイトにするのか」 を考えることが
とても大事だと思っています。

自分が苦手な分野をしっかり把握して
それを克服するためにトレースを活用するのが
最も良い勉強法じゃないかな〜と思っているためです。



長くなってしまったので、
今回のトレースで実際に学べたこと、
気づいたことは次の記事で紹介します!