未経験からWEBデザイナーになるには？｜必要なスキルと知識5選

私はデザイナーの採用面接も担当しているのですが、未経験からWEBデザイナーを目指すとき、何から勉強を始めたらいいのか分からないという悩みをよく耳にします。

インターネットで検索をすると、デザインからコーディング、プログラミングまで様々な情報に溢れています。

でも、完全に未経験の方に向けた記事って意外と少ないんですよね。

というわけで、今回は現役デザイナーの筆者が、未経験の方がWEBデザイナーになるために最低限必要とされるスキルと知識を5種類紹介します。

❶ WEBリテラシー

WEBリテラシーとは？

WEBリテラシーとは、WEBに関する基礎的な知識です。

WEBサイトってどうやって表示されているか知っていますか？
私は就活を始めるまで知りませんでした。

そのため、面接の際に簡単な用語を使われただけでも言葉に詰まってしまうことがあり、これはいかんと勉強を始めました。

• WEBの世界がどのように動いているか
• サーバーやクライアントなどの基礎知識
• プロジェクトマネジメントについて
• WEBサイトの構築設計
• デザインやプログラムの制作

など、その範囲はとても幅広いです。

一見デザインとは関係ないように見えますが、他職種のメンバーと円滑にコミュニケーションをとるのには重要な知識です。

また、自分が作ったものがどのような仕組みで表示されるのかを知っていると、制作の際に気をつけるポイントが明確になります。

面接でちょっとしたWEBの用語を聞かれたときにさっと答えられると「お、知ってるな」という雰囲気を出せてポイントも高いですよ。

WEBリテラシーを勉強するには？

とはいえ、基本的なことがわかっていればいいので、入門書を読めば十分。

WEBリテラシーの入門には「Webリテラシー第3版（ウェブの仕事力が上がる標準ガイドブック）」がオススメです。

検定試験 「Web検」 の公式テキストで、先ほど書いた内容を幅広くカバーした情報を勉強できます。

実際に検定試験を受ける必要はありませんが、WEB業界の一般常識を学ぶためにも入門としてぴったりですよ。

▼ 試験を受ける必要がない理由はこちらで紹介しています
デザイナーに資格は必要ありません｜就活で有利になる条件とは？

❷ デザインリテラシー

デザインリテラシーとは？

WEBリテラシーと同じく、デザインについての基礎知識のことです。

具体的には、デザインをする上で扱わなければいけない要素となる線や色、フォント、タイポグラフィ、空間、写真など。
先ほどのWEBリテラシーよりも実践に近い内容なのでイメージしやすいかもしれませんね。

未経験採用の場合、こう言った基礎的な知識は研修で教えてもらえるでしょう。

しかし、自分で前提知識として知っているかどうかは最初のスタートダッシュで大きく差のつくところでもあります。

また、デザインについての知識を披露すると、意欲や積極性を評価される場合も少なくないので、アピールしたい方は是非身につけておくといいでしょう。

デザインリテラシーを勉強するには？

初心者がデザインリテラシーを学習するには、「ノンデザイナーズデザインブック」をオススメします。

タイトル通り、デザイナーではない人にもわかりやすくデザインの基本を教えるために書かれた本なので、初心者でもつまづかずに知識を身につけられます。

デザイン用語辞典をご活用ください

このサイトではデザイン用語辞典を作成中です。

まだ数は少ないですが、一通り見ればデザインリテラシーが身に付くように項目を増やしていくので、是非ブックマークをしてご活用ください。

▶︎デザイン用語辞典

❸ Photoshop（フォトショップ）

WEBデザインを制作するツールはいろいろありますが、その中でもマスターしておきたいのがPhotoshopです。

Photoshopは長い間WEB制作のスタンダードツールとされており、今でも多くの制作会社が活用しています。

最近ではSketchやXDなど他のツールを使うところも増えてきていますが、Photoshopを使いこなせるようになると他のツールにも応用しやすいですし、写真の編集など他の作業にも使えるので、まずはPhotoshopから入るのがおすすめです。

▼Photoshopについて、詳しくはこちらを読んでみてください。
Photoshop（フォトショップ）とは？｜デザイン用語辞典

Photoshopを勉強するには？

Photoshopを勉強するには、しっかり入門シリーズがおすすめです。

Photoshopを初めて触る人を対象とした入門書なので、基本の機能からひとつづつ勉強することができますよ。

サンプル画像をダウンロードして手を動かしながら学べるので、使い所をイメージしやすくしっかりと身につきます。

上記に一つでも当てはまる人は、要チェックです！

さらにPhotoshopを勉強したいなら、下記の記事でおすすめの本を紹介しています、参考にしてみてください
▶ 初心者がPhotoshopを勉強するのにおすすめな本ベスト5

このサイトでも、Photoshopの使い方や豆知識を紹介しています。
▶ Photoshopの使い方

❹ Illustrator（イラストレーター）

Illustratorは、PhotoshopのようにWEBサイト自体を制作するために使う場面は少ないですが、その中で使用するロゴマークやアイコン、イラストなどのデザイン素材を制作するのに使用します。

また、チラシやパンフレットなどの印刷物をデザインするのにもよく使われます。
就活の際デザイナー職に応募するときに必須なポートフォリオを作成することもできるのでIllustratorを使えると便利ですよ。

Photoshopとは似ているようで操作感が違う部分も多いので、実際に触ってみて慣れておくのをオススメします。

▼Illustratorについて、詳しくはこちらを読んでみてください。
Illustrator（イラストレーター）とは？｜デザイン用語辞典

イラストレーターを勉強するには？

Illustratorの勉強にも、しっかり入門シリーズがおすすめです。

Photoshop版と同じく、Illustratorを初めて触る人を対象とした入門書なので、基本の機能からひとつづつ勉強することができますよ。

上記に一つでも当てはまる人は、是非手にとって見てください。

このサイトでも、Illustratorの使い方や豆知識を紹介しています。
▶ Illustratorの使い方

Adobeは自己投資と割り切って使い倒そう

PhotoshopとIllustratorはAdobe Creative Cloud を契約する事で使用できます。
月5680円と高額なサービスではありますが、デザイナーとしてスキルアップしていくためには必須なツールなので、早いうちから慣れておきましょう。

❺ HTML/CSS

HTMLとCSSは、デザインしたサイトをブラウザで表示するためにPCに指示をするための言語です。
デザイナーとコーダーは分かれている会社も多いですが、だからと言って知らなくていいわけではありません。

HTML/CSSの知識を持っている事で、WEBサイト上でできる表現や機能をイメージしやすく、コーダーとの意思疎通もやりやすくなります。

結果的にデザイン制作の効率も上がるので、勉強の段階で簡単でいいので触れておきましょう。

▼HTML/CSSについて、詳しくはこちらを読んでみてください
HTMLとは？｜デザイン用語辞典
CSSとは？｜デザイン用語辞典

HTML/CSSを学ぶには？

HTML/CSSの学習にはオンラインプログラミングスクールのProgateがおすすめです。
言語別に実践を重ねながら楽しく学習を始められますよ。

入力したコードがすぐにプレビュー画面に表示されるので、文字列が変わっていく過程がよくわかってワクワクします。

HTML/CSSの他にもいろいろな種類の言語にも対応しているので、将来フロントエンドエンジニアなどを目指している人にもおすすめです。

デザインスクールを活用しよう

以上がWEBデザイナーになるために必要なスキルと知識の解説でした。
最低限と言っても、独学で攻略しようとするとかなりの時間がかかると思います。
自分との戦いになるので、モチベーションを保つのも一苦労です

そこで、効率よく学習をするためにWEBデザインのスクールに通うのはいかがでしょうか。

未経験者向けのスクールは数多くありますが、その中でもお勧めなデザインスクール「TECH::CAMPオンラインデザイナーコース（TECH::EXPERT）」を紹介します。

TECH::EXPERTでは、短期間で実践的なカリキュラムを学ぶ事ができるので、デザインの現場に出た時に役立つスキルが効率よく身につきます。

また、同じくWEBデザイナーを目指す同期仲間ができるので、切磋琢磨しながらモチベーションを高く持って学習する事ができますよ。

カウンセリングだけなら無料で受ける事もできるので、これからWEBデザイナーを目指すにあたって不安な点などがあれば相談だけでもしてみてはいかがでしょうか？

TECH::CAMPオンラインデザイナーコース（TECH::EXPERT）

最後までお読みいただきありがとうございます。

おまけ：未経験からWEBデザイナーになるために役立つ本一覧