【🍕現役デザイナーオススメ😘】稼ぐスキルを確実に身につけるWebデザインスクール

【完全無料】webデザインが独学で学べるおすすめサイト20選

Webデザインを学ぶ

独学でwebデザイナーになるのは難しいのかな?
そんな悩みにお答えする、独学でwebデザインが学べるwebサイトを紹介していきます。

そのほとんどが僕が実際に使ってたやつです。
webデザイナーになってもう8年ほど立ちますが、20代中盤までずっとフリーターだったので、当時はweb業界に一発逆転の夢を描いていたんですよね笑

とにかく早くweb業界に入りたかったので、効率よくwebデザインが学習できるサービスを探しまくってました。
なので当時を思い出して、結構辛口で評価していきたいと思います。

今回は現役でwebデザイナーをしている僕が選ぶ、本当に質の高い情報を載せていて楽しみながらスキルアップできるサイトを紹介していきます。

webデザインが学べるサイト10選

1:デジハリONLINE

フォトピザ
デジハリONLINE | 3ヶ月で成長を実感の声続々
デジタルハリウッド提供する、約20年の教育ノウハウに基づいて作られた動画教材と、12ヶ月版のAdobe ccがセットになっています。
通常の半額以下でAdobe ccが使えて、課題の添削もしてもらえるので多くの方が成長を実感できたと評判です。

これからweb業界を目指す方にとって、まさに最適と言っても良いサービスです。
僕もまさにそうだったんですが、photoshopやillustrator、ちゃんと扱えますか?
この業界はちょっと特殊で、仕事内容はもちろんのこと、習得が大変なAdobeのソフトをまず一通り扱えるようになってからようやくスタートライン、みたいな面があります。

Adobeのソフト、これが人によっては結構苦手意識を覚えるんですね。
なので、転職が決まって働き始めてからついていけない、、なんてことになってしまうのはしんどいですよね。

webデザインの勉強もそうで、結局手を動かしてナンボみたいなところがあるので、座学よりも先にAdobeのソフトを覚えてしまってからの方が圧倒的に覚えが早いです。

先生が動画で分かりやすく教えてくれて、課題の添削もしてくれます。
人に直接聞けるメリットはめちゃくちゃデカい。
僕もデジハリ行ってましたけど、実力と指導力の両方を備えている先生が多くて、とても勉強が楽しかった記憶があります。

※受講料が大幅値引き実施中(73,612円→39,980円)
Adobe マスター講座では、photoshopなどの高価なソフトをお得な値段で使用することができます。
どちらにせよAdobe ccは契約することになるので、それがほぼ半額で使用できるのはヤバすぎます。
最短10分で利用開始できます。
Adobeマスター講座について詳しく見る

2:chot.design

腕利きの現役デザイナー達が運営しているブログです。
完全未経験・知識ゼロでも、無料カリキュラムの順番通りに読み進めれば、webデザインをする上での基礎知識、配色やタイポグラフィーの基礎などが満遍なく頭に入ります。
また、僕が身につけてから見える世界が変わった、デザインの4原則についてしっかりと解説されているので信頼できます。
外観のデザインも可愛らしく、一記事一記事も短いものが多いので、ついつい入り浸って勉強してしまうことうけあいです!(←この感情にさせるのもデザインの為せる技です)

3:Adobe TV

photoshop(フォトショップ:画像加工ソフト)・illustrator(イラストレーター:ロゴやアイコンを作るソフト)の使い方を、開発元であるAdobe社が解説してくれます。
一つの動画は3分〜20分超えと幅広く、必要なスキルを一歩一歩確実に習得できます。
一旦Adobeのソフトの「クセ」を覚えてしまえば早いですが、5年前に初めて触った時は僕も戸惑いまくりでした。
そこを公式にフォローしてもらえるのはありがたいですよね。
またこれらのツールは頻繁にアップデートを繰り返しており、(特にここ数年激しい)本だと情報が古くなりがちです。

なので、ソフトの操作に不安がある人は不満が解消されるサイトになっています。

4:サルワカ

photoshopの使い方や、html/cssコーディング、wordpressの導入方法など、初心者がつまりやすいところにフォーカスしつつも、web制作に必要な知識が一通り網羅されています。

特にgoogleが提唱するマテリアルデザインが詳しく説明されているのが個人的に好印象でした。
マテリアルデザインって出てきて何年も経つのに日本語のガイドラインが不足しているんですよ。
なのでここら辺の情報はとてもありがたい。

あとこれはあくまで個人的にですが、体系的にwebデザインを学べるサイトながら、個人が運営しているメディアというのがとても凄いです。。
正直、ちょっと嫉妬しますね笑

5:Cocoda!

デザインを学べるだけでなく、WantedlyのようなSNSの機能も有しています。
こちらのコンテンツは、XDを使用したUIデザインが学べることが一番の売りです。

基礎からマイペースに学んでいき、実力がついてきたと感じたらポートフォリオを作り、他の人に共有できます。
また、有志で集まるコミュニティも数多くありますよ。

デザインに限らずですが、一人で独学を続けるのはやはり難しいものです。
そんな時に所属しているコミュニティの仲間と励まし合ったり、時には刺激しあったりすることが自分の中での支えになるはずです。

7:LIG社のブログ

ここで企業ブログの登場です。
LIG.incは言わずと知れたweb業界の雄で、デザイン性の高さも日本トップクラスながら、webサイト制作 x マーケティングを中心に毎年数多くのwebサイトを世に出しています。

ここのブログはバーグハンバーグバーグっぽいおもしろ系で、ついつい読んでしまうので、おすすめです。文調はふざけていたりしますが、内容はとっても濃い記事が多いです。

デザイン・コーディングで詰まった時僕は結構LIG社のブログを見ます。
だいたい解決するのでオススメです。

6:Udemy

Udemyかよ!って思ったかもしれません笑
オンライン講座を世界中から購入できるので、新しいジャンルの勉強をスムーズに始めることができます。デザインだけでなく、ビジネス・マーケティング・プログラミング・写真などとにかくカテゴリーが膨大で、自分が学びたいと思う分野で検索するとほぼ確実にヒットします。

講座は買い切りで、一度の購入で何度でも視聴できます。
お値段がちょっと高く感じるものもありますが、90%セールみたいなのが頻繁にやってますのでそれを待って買いましょう。

レベルの高い講座のまとめセットが1000円くらい出せば買えます。
ただ、良質なプログラミング関係の講座なんかは海外のビデオが中心なので、だいたい英語だったりしますけどね。

8:Baigie社のブログ

こちらもweb制作会社ではかなりメジャーな会社です。
Baigie社は、社長がtwitterでいつもふざけている印象ですが、記事のレベルの高さは毎回驚かされます。ハウツーより、考え方なんかをつらつらと紹介している記事が多く、独学で勉強する間のコーヒーブレイク的な感じで見ると面白いです。勉強というより、読み物としての感覚が個人的に強いですね。

特に僕が新米のデザイナーさんに読んで欲しいのがこちらの記事ですね。
美的感覚に自信があって、今まさにwebデザイナーをしている、という人は心を動かされるんじゃないでしょうか。

9:Schoo(スクー)

こちらは様々なジャンルの講義が生放送形式で配信されており、メインコンテンツというちょっと変わりダネな感じのするサービスです。

youtubeの生放送だけ・かつ勉強用で絞ったサービスというイメージ。
生放送には無料で参加できるものもありますよ。
月額980円で録画授業が見放題なのが凄い。

個人的にいいなって思ったのは、UXリサーチ・心理学のデザインへの応用など、デザインの中でも新しい分野の知識を人に解説してもらえることが一番お得だと思います。

10:SKILLHUB(スキルハブ)

こちらはudemyのカジュアル版ってイメージです。
web制作に必要なデザイン・コーディングのベーシックな知識を一通り無料で学ぶことができます。
ただ、どちらかというとコーディング周りが勉強したい人にオススメですね。

デザイン面ではビジュアルというより、設計方面からの知識や、デザインをコーディングで再現する時の技術的な情報がかなり充実しています。

Webデザインを盗んで学ぶ、無料まとめサイト10選

ここから実際のwebデザインを見て学ぶ編です。
丸パクリじゃなければパクリまくってokです。
デザインってパクってなんぼなので!

あ、でもパクるって意味が誤解されがちなので一応解説しておくと、「参考のデザインのどこが、何故良いかをちゃんと理解した上で同様の手法を自分の仕事に取り入れる」ってことですよ。
とはいえ、デザインに正解はないのでとりあえず自分だけの解釈でokです。

独学中の人は、上で紹介したサイトで勉強しつつ、プロが作るデザインも定期的に見てデザイナーとしての目を鍛えるのがオススメの上達法です。
それではどうぞ!

1:MUUUUU.ORG

見たことない人いるんでしょうか?っていうくらい有名なまとめサイトです。
QUOITWORKS Inc.の代表であるムラマツヒデキさんが運営されています。
webデザイナーという職業の存在を知ると同時に、憧れるきっかけにもなるお洒落なwebデザインがずらりと並んでいます。
初めて見るっていう人は確実に衝撃を受けます。断言します。

数多くのまとめサイトがある中で、クリエイティビティはトップクラス。
デザイナーに憧れる学生から、悩める現役デザイナーまで色々な人を受け入れてくれる父親のようなサイトです笑

2:現代デザイン(GENDAI DESIGN)

個人的にここ最近推しているサイトです。
muuuuu.orgと同じく、流行のデザインが中心に掲載されていますが、日本のwebサイトが特に多いです。

これって実はとてもありがたくて、いわゆる「かっこいい」サイトってほぼ9割海外なんですよね。
で、デザインって文化とも密接に関わってくるので、あまり日本で挑戦的なデザインって出てきづらい。クライアントに受け入れてもらい辛いんです。

そんな中で、最近のデザイントレンドを取り入れている日本のサイトが中心なので、どれくらいのテンションで作ったら良いか、という肌感を知ることができます。

3:Web Design Clip

カテゴリー分けが秀逸で、僕は個人的にかなり好きなサイトです。
日本 / 海外 / LP / スマホでそれぞれ別サイトにまとめられていて、数がとにかく膨大です。

インスピレーションを得るというより、探すことに特化しているイメージなので、必ず目的のものが見つかる安心感があります。

4:URAGAWA

個人的にMUUUUと同じくらい信頼度が高いサイトです。
メリハリがしっかりついていて、かつ独創的なアイデアのビジュアルが多めなので、いつも参考にさせてもらっています笑

5:Awwwards

こちらはもはや説明不要ですね。
世界中のwebサイトに対して投票を行い、超絶クリエイティブなサイトをみんなで決めようぜっていうサイトです。

応募条件を満たしていれば誰でも投票ができます。審査項目は以下の4つです。

  • play_arrowデザイン:50%
  • play_arrowクリエイティビティ:25%
  • play_arrowユーザビリティ:15%
  • play_arrowコンテンツ:10%

審査会には180名ほどのメンバーが在籍しており、うち4人は日本人です。
権威あるAwwwardsで表彰されることはデザイナーにとって非常に名誉なことで、世界中のデザイナーが賞の獲得を目指しています。

6:LPアーカイブ

こちらはLPに特化したまとめサイトですね。
特筆すべきはその数で、他のギャラリーサイトとはちょっとケタが違います笑

LPというのはwebデザインの中でもちょっと特殊で、webデザインがどのような形になれど、促販物として今後も重要なポジションを占めるでしょう。

「訴求する」デザインの参考を一度に多く見れるのはやはり嬉しいです。

7:Dribbble

Dribbbleは海外のデザイナー向けのSNSです。

閲覧して参考のデザインを探せるのはもちろんのこと、求人が出ていたり、デザイナーに仕事を依頼したりもできます。

最大の特徴はtwitterみたいに気軽に作品を投稿できないことです笑
作品を投稿するには、既にDribbble上で作品を上げているデザイナーから「招待」を受ける必要があります。
なので、う◯この落書きを投稿したりふざけた投稿はできず、結構ガチなサービスです。
お互いに作品を褒め合うだけでなく、フィードバックなんかもコメントでもらったりできます。

8:bookmark

イケてるサイトが多く、見ているだけでもテンション爆上がり間違いなしです。
ここもmuuuuのようにインスピレーション目的で使うと幸せになれると思います。

お気に入りに追加してまとめることもできるので、閲覧だけでなく普段使いできますね。

9:AGT

sp版デザインのまとめサイトです。
PC版のデザインで力尽きてしまった or sp版はとりあえず要素を縦に積むだけでいいか、、なんて感じにデザインしてしまいがちじゃないですか?

なので、意外とsp版に関する引き出しって少なかったりしますよね。
そんな時に便利なサイトです。
また画像を押さずとも、ホバーするだけで勝手にスクロールしてくれてサイトの内容が見れるのも嬉しいポイントです。

10:sps collection

こちらもspデザインのまとめサイトですね。
数が多くて使いやすいです。

更新頻度も高めで、2~3日に一回更新されている印象です。

11:Banner Matome

最後にバナーのまとめサイトです。
バナーって実はデザインの基礎が凝縮されたものってご存知でしたか?

実際の仕事でもバナーだけで何パターンも提出したり、何回も修正が来続けたりします。バナーは運用して成果を出すことが求められますのでデザイナーの想像以上にクライアントが気合い入っていたりします。

なのでクオリティの高いデザインが求められたときにできるように、参考サイトの一つとして是非見ていってくださいね。

まとめ

いかがでしたか?

今回は僕が実際に使ったサービス / 現在も使っているサイトを中心にまとめました。
ここまで紹介しておいてなんですが、どのサイト・サービスも特色があり、それぞれの良いところを少しずつつまんでいくスタイルがオススメです。

複数の人に意見を仰げる勉強方が個人的に最強だと思っていて(セカンドオピニオン的な)、デジハリ・cocodaの二刀流とか面白いんじゃないかと思います。

ちなみにcocodaは僕もやっているので、どこかで会うかもしれませんね笑
それでは本日はここら辺で。

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