WEBデザイン

未経験からお洒落なWebデザインをはじめるのに必要なこと

どの企業でも自社サイトをいかにお洒落でサイトに訪れたユーザーにステキな体験を提供できるかを考えるようになりました。

そんな今だからこそ

「未経験だけどWebデザインを覚えたい」

「Webデザインに必要なスキルを知りたい」

「プログラミングは挫折したけど、Webデザインは頑張ってやってみたい」

こんなモチベーションのあなたのために、この記事ではWebデザインをはじめるのに必要なことを紹介します。

そんな僕はWebエンジニアとして17年経験があります。

Webデザインは専門ではないですが、必要なことは理解しているつもりです。

先に結論を書いておきます。

Webデザインをはじめるのに必要なこと
  • デザインを知る
  • UI/UXの創造力
  • プログラミングスキル
  • Adobe系ソフトスキル
  • パソコンかタブレット
たわしむし
たわしむし
Webデザイン流行ってんのか?
ユウキ
ユウキ
どうも、ユウキです。
企業サイトや、ランディングページをお洒落にするために、Webデザイン需要は増加傾向にあるからね。
未経験からでもこの記事でWebデザインをはじめるきっかけにしてほしい!

Webデザインをはじめるのに必要なこと

デザインセンスを磨く

Webデザインにまず必要なデザインセンスなんだけど、デザインセンスがよくわかんないよね。

Webデザインは1つ1つに説明できるようになることだと友人のデザイナーが言ってました。

  • 色使い
  • フォントの使い分け
  • 強調部分の表現の仕方
  • 構成力やディレクション

これらのスキルは日頃から目にするWebサイトや商品のパッケージなんかがデザインの最高の学習教材になります。

プログラミングスキルを磨く

プログラミングと大げさになりましたが具体的にはマークアップ言語等のフロントエンド言語のスキルが必要です。

  • HTML
  • CSS
  • JavaScript

この3つは必須スキルです。

それぞれ深堀した記事があるので貼っておきます。

HTML初心者
ホームページを作りたいプログラミング未経験者向けに「HTML」について5分で解説!プログラミング初心者や、ホームページ作成に取り組んでいこうとしているあなたが まず最初に聞く単語といえば、「HTML」ですよね。 ...
CSSとは
ホームページを作りたいプログラミング初心者向けに「CSS」について5分で解説!ホームページを作ろうとしているあなたが最初に出会うのが「HTML」、そして「CSS」ですね。 ホームページを作るにはHTMLと...
JavaScript初心者
ホームページを作るのに使うプログラミング入門でもある「JavaScript」について5分で解説!ホームページ作成するのに「HTML」を覚えたら「JavaScript」も使う必要が出てきたでしょ? ホームページを作るのにJa...

UI/UXは見て学ぶ

UI(ユーザーインターフェース)は、Webサイトに訪れたユーザーが実際にサイトに触れる部分の設計

UX(ユーザーエクスペリエンス)は、Webサイトに訪れたユーザーに体験を提供する設計

言葉は似ていますがどちらも大事です。

UI/UXについは未経験のあなたはまずは言葉悪いですが「パクる」ことから始めましょう。

お洒落サイトをできるだけたくさんみてください。

おすすめのギャラリーサイトをまとめた記事があるので合わせて読んでください。

【ギャラリーサイト7選】Webデザインはお洒落サイトを見て学ぼうWebデザインは見た目はもちろん、UI/UXをストレスなく表現できるかですよね。 「Webデザインをはじめようと思ってる」...

Adobe系ソフトを使いこなす

PhotoShop、Illustrator、Adobe XDなど使いこなせるスキルは必要になります。

Adobeのソフトは月額払いのサブスクで利用可能です。

\Adobe Photoshopはこちら!/
Adobe Photoshop
※月額1,680円から利用可能です。(2020/05現在)

 

どうやって学ぶかは、Youtubeだったり、動画教材だったり、そもそもデザインスクールで学ぶ方法もあります。

動画教材はUdemyがおすすめ

オンラインで学ぶWebデザイン講座

Udemyは初めてアクセスしてから24時間以内は80%前後値引きされていることがある。
何度かアクセスしているならブラウザのキャッシュを消すか、シークレットモードで開きなおせば割引された状態になるので新規割引を利用して、定価で購入しないようにしましょう!

デザインスクールのおすすめはこちらの記事にまとめてます。

Webデザインを始める
【比較表あるよ】ITエンジニアのおすすめWebデザインスクール7選ITエンジニア歴17年の僕がおすすめするWebデザインが学べるスクールを、通学型・オンライン型・留学型の3パターンに分けて、授業形態・料金・無料体験などで比較して7つほどご紹介します。...

Mac派?Windows派?

デザインといえばMac一択だと友人のデザイナーはいいますね。

なんでなんでしょう?同調圧力もいいところな気がしますがWindowsでもAdobeのソフトは問題なく使えるわけで。。

結局Macはマシンスペックがすごくいいんですよ。

なので、MacでもWindowsでもどっちでもいいですが、マシンスペックはいいものを用意しましょう。

2020年5月時点での推奨マシンスペック

MacならiMac Proといいたいですが、まずはiMacで十分です。

Windowsなら、CPU Intel COREi5以上、ハードドライブはSSD、メモリは8GB以上がおすすめです。

Webデザインをはじめるのに知っておいてほしいこと

Webデザインをはじめるのに知っておいてほしいこと

余談になるかもですが、Webデザインをはじめるのに知っておいてほしいことも2つだけなので読んでおいてください。

成長の方程式

時間を無駄にしないために、成長の方程式を理解しときましょう。

成長の方程式

時間 × お金 = 成長

時間はみんな一律になくなっていくだけ。

お金も有限だけど、Webデザイナーとして仕事を頑張れば増やすことができる。

特にプログラミングスキル・Adobeソフト系スキルは、専門家に学ぶとすぐ身につく。

もちろん、独学でもマスターは可能です。

でも成長の方程式の時間を消費することになります。

デザインスキル、UI/UXスキルもせっかくだから、専門家に学びましょう。

Webデザインを始める
【比較表あるよ】ITエンジニアのおすすめWebデザインスクール7選ITエンジニア歴17年の僕がおすすめするWebデザインが学べるスクールを、通学型・オンライン型・留学型の3パターンに分けて、授業形態・料金・無料体験などで比較して7つほどご紹介します。...

Webデザインでどれくらい稼げるか

例えば、Webデザイナーになったとして、大体月収のイメージは以下の通り

Webデザイナーの月収相場

フリーランス:0~100万

サラリーマン:30~40万

フリーランスの場合、幅広いですね。

トレンドのLP案件などをクラウドソーシングサービスなど利用し、うまく案件をこなせば実現できる数字です。

もちろん、なにもしなければ0の月もあります。

サラリーマンの場合、平均で30万くらいでしょうか。

これをみると、Webデザイナーでサラリーマンやってるあなたなら、ある程度知識があればフリーランスになるのもいいと思いますよ。

ユウキ
ユウキ
僕の友人がデザイナーでサラリーマンやってたときは、かなりブラックでしたね。
彼は独立してから、月7桁稼げるようになったようなので、フリーランスを目指せるのは魅力的です。

まとめ:Webデザインをはじめるのに必要なこと

まとめ
Webデザインをはじめるのに必要なこと
  • デザインを知る
  • UI/UXの創造力
  • プログラミングスキル
  • Adobe系ソフトスキル
  • パソコンかタブレット

Webデザインと一言でいえど、図解イラストだったり、アイコンだったり、配色センスだったり、構成力やディレクションも必要です。

とはいえまずは、簡単なWebサイトから構築を目標にしてゴールはWebデザイナーかもしれないけど、その過程でプログラミングも楽しく学んでほしいですね。

ユウキ
ユウキ
では、この辺でおわります。
ユウキでした。