webデザイナーになって約3ヶ月。学んだこと

webデザイン

独学新卒でWEBデザイナーになって3ヶ月が経とうとしています。己の甘さに泣いている…。いかに自分が無知だったか、無知であることに気づいていなかったか思い知らされました。周りの人がボロクソ言わず、優しく教えていただけていることに感謝しかありません。

ここで書く「学んだこと」は本当に初歩的なことで、デザインに関わる方からすれば「えっ…そこから?」ということばかりかもしれません。今まで、他の人からフィードバックをもらうことがなかった自分は気づかず、やれていなかったことが多々ありました。SNS、特にTwitterには独学でWEBデザイナーを目指す人がたくさんいるかと思います。わたしもそのうちの1人で、同じ時期に勉強を始めた人の勉強方法や作品を参考にしつつWEBデザイナーを目指していました。勉強中まわりにいるのは、自分と同じくらいのレベルの人で、どうしてもプロを雲の上の存在、遠い存在だと認識しがちです。ですがいざ働き始めると周りの人が、その雲の上の存在だった人、プロだらけになります。いかに自分のレベルが低いかを痛いほど実感することになるので、WEBデザイナーになる前に勉強できることはしておいて、いずれは自分も上にいくんだという覚悟が必要だったなと思いました。

わたしと同じような環境にいる、独学でWEBデザイナーを目指す方の参考になればうれしいです。

環境設定をしっかり整える

当たり前のことですが、めちゃめちゃ大事だなと思います。オンラインスクールに通ってても、ここの説明はされていないことが多いので独学の方は忘れがちな点かとおもいます。下記の設定は一通りやっておくことをおすすめします。あと物理的な環境、椅子と机にパソコン置いて回線もしっかり整えるとかも作業効率的な意味で大切です。

Photoshopの作業が快適になるオススメの環境設定 -Photoshop CC 2017対応
2016年は5月にPhotoshop CC 2015.5がメジャーアップデート並に機能が追加され、11月にCC 2017が新しく使う人やしばらく使っていなかった人向けにアップデートされ、この一年でPh

ショートカットキーを覚える

Vで移動、Bでブラシ、Eで消しゴムとかです。ほかにもレイヤー階層の移動や複製などレイヤー関連とツール切り替えは使えるようになったほうが効率よく作業ができます。(マウスでカチカチするのずっとやると疲れてきます…)下のサイトが練習に最適です。

ショートカットの練習サイト「COMMAND LAB」
楽しく直感的に ショートカット&コマンドを 練習できるサイト。

トレースは1pxもずらさない覚悟でやる

1pxの大切さは研修中にめちゃめちゃ教えられました。(最近ようやく自分でも大切にしないといけないことがわかってきた)なんとなくの色と位置とサイズをあわせたトレースで学べることは、配置のセオリーと配色、レイヤースタイルの大まかなつくりかたくらいです。いざ仕事としてたくさんの人の目にふれるものをつくるとなったときは、プロの目から見ても違和感のない、道理の通っているデザインをしなければいけません。特に立体的で質感の作り込まれているデザインは、横長の帯の上にワントーン明るくした一本の線、下にワントーン暗くした一本の線が重ねられていて光と影で立体感が表現されているものがあります。よくみると一色ではなくうっすらグラデーションだったり、テクスチャがオーバーレイでのせられていたり、白くぼかされた光で反射が表現されていたりと、細部までこだわられています。こうした部分に気づいて細部までトレースできれば、自分で新規でつくるときも作り込むことができるようになるので、真似することをなめたらいかんなと思いました。

文字間や大きさのバランスの違和感に気づけるようになる

文字をベタ打ちしただけだと、。や・などの記号の前後や数字やカタカナの大きさのバランスがずれていて、違和感があります。文字の隙間を調節するショートカット「Alt+→」と、数字をベタ打ちしたときにすこし浮いて見えるのを下げるショートカット「alt+Shift+↑」は早めに覚えて調整できるようになるときれいな文字列になります。(はじめのうちは文字間の違和感に気づけませんでしたが、トレースをしているうちにふと気づけるようになりました!)

初心者デザイナーに知ってほしい、少しの手間でデザインがプロっぽくなる「カーニング」のコツとやり方 | Webデザイナー・副業フリーランスを目指す【大阪Webデザインスクール】|Creators Factory
独学でデザインを学びたい初心者の方に向けて、文字を美しく見せる調整方法「カーニング」の基本と調整の具体的なやり方を紹介しています。大阪の社会人向けWebスクールCreatorsFactoryが運営。

推しフォントをみつける

使い勝手のいいフォントをみつけます。ベタ打ちでもあるていどバランスがいいフォントや、可読性の高いフォントを見つけておくとデザインするとき楽です。フォントを探しているうちに、明朝体やゴシック体といったかんたんな違いだけでなく、丸ゴや角ゴ、ウロコの形など細かい違いにも気づけてこだわれるようになります。はじめは明朝体とゴシック体の違いしかわかりませんでしたが、この3ヶ月で丸ゴ角ゴといった違いはもちろん、どこの会社のフォントかも予想できるようになりました(笑)(まだ完璧ではないですが…)

ターゲットとコンセプトを意識してつくってみる

ターゲットとコンセプトをしっかり設定して、それに合わせたデザインができると、統一感が生まれてそれっぽいデザインになります。ただかわいいじゃなくて、小学校の女児向けのキラキラした可愛さであれば、たくさん色をつかってフォントは太めの丸ゴシックで装飾も多めにと考えられるし、大人の男性向けの高級感あるかっこよさであれば、明朝体で文字間のゆったりした金の質感がつくりこまれたデザインにするなど、考えやすくなります。ちっちゃい子向け×かわいい→丸っこくなどある程度セオリーがあるので、Pinterestなどで画像をあつめて規則性をみつけておいて、それを実践できるようになると、デザインを効率よく考えられるようになるのかなと思いました。

さいごに

忘れないうちに感じたことを書きなぐりました。あぁ~つよつよデザイナーなりたい。その前に最低限違和感のないデザインができるようになりたいです。WEBデザイナーになれたことだけに満足せず、お金をもらった分仕事ができるようにがんばります!

コメント

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