Webデザイナースクールに通う前にこの5つをやれ!

本気でWebデザイナーを目指す

Webデザイナーのりうやです!

僕はデジタルハリウッド by LIGでポートフォリオを1つ作成し、無事転職を成功させることができました!

が、スクールでWebデザイナーに転職するために必要な技術を最初から全て学ぶのでは、圧倒的に時間が足りません!!

ということで、スクールに通う前に学習すべき5つを今回はご紹介します。

スポンサーリンク

1. Webデザイナーの仕事を知る

Webデザイン

Webデザイナーとは、Webサイトのデザインを制作する人のことを指し、
以下の業務を担当します。

  1. Webサイトのコンセプト、企画を練る
  2. サイト構成、レイアウトを作成
  3. グラフィックツールでデザインを作成
  4. コーディング
  5. JavaScriptの実装

まずは、Webデザイナーに求められる思考法、実践の基礎を以下の本で
より理解を深めてみましょう!

1-1. ノンデザイナーでもわかる UX+理論で作るWebデザイン

こちらの本では、

ユーザー体験をどのように創造するか?
UI(見た目)のデザインをどう考えて設計するか?

一連のフロー、手法を知ることができます。

初めて Webデザインを学ぶ方、
Webディレクター(プロジェクト管理をする人)を目指す方が対象の本になっているので、 Web制作の仕事の理解を深めることができます。

1-2. ノンデザイナーズ・デザインブック

こちらの本では全くデザインに関わったことがない!!という方に向けて、

デザインの4つの基本原則から、
色と色の関係性、
活字のデザイン、
フォントの選び方までを学ぶことができ、
名刺や広告を用いた実践練習もすることができます。

2. コーディングを学ぶ

コーディング

コーディングとは、
ブラウザ(Chrome,Firefoxなど)にホームページを表示させるために必要な

HTML/CSSを記述する業務のことを指します。

Webデザイナーに求められる技術の1つであるため、
Webデザインの実績が少なくても、コーディングの技術を身に付けることができれば転職できる可能性がアップします。

また、 Webエンジニアを目指す場合は必須のスキルになるため
下記の順番でコーディングに触れてみましょう!

2-1. ProgateのHTML & CSSをやってみる

Progeteとは、無料でプログラミング言語をゲーム感覚で学ぶことができる
サービスです。
有料版じゃないと学習することができないコースもありますが、
触れるだけであれば無料でできる範囲で十分です。
HTMLとCSSでできること、どのように記述していくのか?を
この段階で掴んでしまいましょう!

Progateへ遷移する

2-2. コーディングに関する入門書を購入してみる 

Progeteで雰囲気を掴んだら、コーディングの入門書を一冊購入して、
簡単なWebサイトを作成してみましょう!

書籍は知識が体系化されているので、Webサイトを完成させるまでの書き方を
着実に学ぶことができます。
下記で一番最初に紹介している本は自分が初めてコーディングを学習した際に購入したものなので、非常にわかりやすく、作成するサイトのコンセプトも可愛らしいものなので一気に進めることができました!

また、二番目に紹介してい書籍は少し難易度が高めです。
しかし、現在の 制作で求められている技術、レイアウトを紹介しているため
かなり実務で活かせることを学ぶことができるます。

Webスクールで学ぶ内容に近いので、

もっとコーディングを学びたい。
スクールに通う前からある程度できるようになりたい!

と思う方におすすめです!

3. JavaScriptを学ぶ

コーディングを学んだ後は、JavaScriptに触れてみましょう!

JavaScriptとはプログラミング言語の一つで、

Webページをリロードせずに、 Webページの処理を実行する言語になります。

3-1. ProgateのJavaScriptをやってみる

コーディングと同じように、
JavaScriptで何ができるのか、どのように書くのか?を掴んでみましょう。

Progateへ遷移する

3-2. JavaScriptの入門書を購入してみる

ProgateのJavaScriptを一通り学んだ後は
簡単なWebアプリ、ホームページでの活かし方を知りましょう。

4. PhotoShopの使い方を知る

PhotoShopはWebデザイナーを目指す上で必須のグラフィックツールです!

主に画像の加工、合成を得意とし、
Webデザインのみならず、グラフィックデザインでも使用されています。

4-1. 公式チュートリアルをやってみる

Photoshopでできること、雰囲気を掴むならAdobeが提供する
公式チュートリアルに着手するだけで十分です!

Photoshop公式チュートリアル

おすすめ書籍

一通りの操作方法を網羅したい!と思われる方は下記の書籍をおすすめします!
本の流れを通して、成果物を作成していくような内容ではありませんが、

PhotoShopでできる1つ1つの操作を丁寧に教えてくれています!

5. Illustratorの使い方を知る

IllustratorもPhotoShopと同じく、
Webデザイナーに必須のグラフィックツールです!

Illustratorが得意とするのは、ロゴやバナー、絵を描くことです。

5-1. 公式チュートリアルをやってみる

IllustratorもPhotoshopと同様、雰囲気を掴むならAdobeが提供する
公式チュートリアルに着手するだけで十分です!

Illustrator公式チュートリアル

おすすめ書籍

また、書籍で学びたい!といった方向けに以下の本もご紹介します。
こちらもIllustratorの1つ1つの操作を丁寧に学ぶことができます!

まとめ

まとめ

Webスクールに通う前に学習した方が良い内容になります。
もう一度まとめてみると下記になります。

  • Webデザイナーの仕事、デザインの基礎を書籍で学ぶ
  • Progateでコーディング、JavaScriptに触れてみる
  • Photoshopの公式チュートリアルをやってみる
  • Illustratorの公式チュートリアルをやってみる
  • 各入門書を1冊購入して取り組んでみる

正直、Webデザイナーの業務範囲は年々増加してきています。

逆にその中で、自分が得意、好きなところを磨き切ることで
転職活動が成功しやすくなります!

通う前にぜひ自分がやりたい、伸ばしたい分野を見極め、
ある程度の知識を身につけた上で効率よくスクールを活用してください!