Webデザインのデザインスキルを向上させる練習方法

Webデザインを上達させる練習方法 Webデザイン
Photo by Radek Grzybowski on Unsplash

こんにちは、コンスキです。

Webデザインが上手くなりたいけど練習方法がわからない

Webデザインを始めたばかりだと、そう思うことあるかもしれません。

そこで、今回は僕がやっているデザインの練習方法をご紹介します。

参考にしていただけたら嬉しいです。

いいところを真似する練習

吸収したい素敵なデザインを探す

まずは、Webデザインを参考にすることができるサイトで自分がいいなと思うデザインを見つけます。

Webデザインを参考にすることができるサイトは次のようなところを利用しています。

SANKOU! | Webデザインギャラリー・参考サイト集
Webデザイン制作の参考になるステキなWebサイト・LPを集めたギャラリー。業種・テイストなどで絞込検索可能。最新トレンドをチェック!

上のサイトを使ってサイトを探していたところ、今回はこちらのサイトがいいなと思いました。

惹きつけられる理由を探す

いいなと思うサイトを決めたら、そのサイトのいいところを書き出していきます。

例えば、上のサイトだと次の部分がいいところだと感じました。

  • 文字の大きさを小さくしたり記号を作る線の太さを細くしたりすることで繊細さが出ているところ
  • 横書きだけじゃなくて縦書きのところがあって変化があるところ
  • 濃い文字色のところもあれば薄い文字色のところもあってメリハリがついているところ
  • 全体的にシンプルなのに対して、写真には気品溢れていて落ち着きのある写真を使用しているところ
  • 文字や写真、記号の開始点が縦横で揃っているところ

「ここいいな」「惹きつけられるな」と感じる部分を見つけてそれを言葉にする作業です。

いいところを自分のデザインに取り入れてみる

次は先ほど見つけたいいところを使って自分でデザインをしてみます。

今回はAdobeXDを使ってデザインしてみました。

いいところを取り入れているのでどうしても参考にしたWebデザインと似てしまう思います。

それは仕方ないことです。

大事なのは細部まで真似するというよりも、いいところをいかに取り入れるかだと思います。

写真の位置を少し変えてみたり、背景色を変えてみたり少し自分らしさを出してみてください。

そうすると、他のWebデザインから学んだいいところを自分のものにしていくことができます。

とにかく真似する

よく言われることですが、デザインが最も早く上達する方法は真似することだと思います。

服や髪型も、雑誌やネットを見て参考にしませんか?

Webデザインも同じです。

かっこいいな、魅力的だなと思う既存のサイトのいいところを自分で使えるようにする練習をするんです。

もちろん、真似したデザインを自分のものとして発表するということはよくありません。

それを使ってお金を手に入れるということもやってはいけないと思います。

しかし、自分のデザイン技術を向上させる上で、真似は必要不可欠なものです。

そして、他のデザインを真似して手に入れた技術を使って、自分のアイデアをより魅力的にしていくということがWebデザインの上達を考える上で重要ではないでしょうか。

自分らしさを出す上で便利なツール

真似をして技術を手に入れたあと、その技術を使うときになかなか自分らしさを出せないという悩みが出てくるかもしれません。

そんな時におすすめなのがこちらのサイトです。

このサイトはさまざまな色の組み合わせを見られるサイトです。

この中から自分が好きな色を選んで背景色や文字色として使ってみてください。

少し自分らしさを出せると思います。

他にも、選んだ2色からを画像に適用したり、グラデーションを作ったりするなんてこともできます。

グラデーションの機能については下の記事で詳しく紹介しているのでもしよかったらご覧ください。

さいごに

Webデザインって難しいですよね…

正直どんなデザインが正解なのか自分でもよくわかっていません。

ただ、サイトに訪れた人がデザインを見て、そのサイトを信頼して商品を買ってくれるなんてことがあったら嬉しいですよね!

そう考えると、他の人の目線に立ったデザインをする必要が出てくるのではないでしょうか?

いいデザインを作るといっても自分が納得するデザインを作ればいいっていうわけでもないかもしれないのが特に難しいです。

サイトを訪れる人のうちなるべくたくさんの人に納得してもらえるデザインを考えるという上では、すでにある魅力的なデザインのいいところを自分のものにするというのがやはりいい練習方法ではないかなと思っています。

コメント

タイトルとURLをコピーしました