新Webデザインマスター講座 | SkillhubAI(スキルハブエーアイ)
ホーム/講座一覧/新Webデザインマスター講座
単品の講座 全23レッスン

新Webデザインマスター講座

こんな方へデザインの学習をはじめてする方

本格的なデザインスキルを身に付けましょう。 Webサイトの構成要素や、ユーザビリティに配慮したコンテンツの配置など、Webデザインに関わる人ならば知っておきたい知識・技術解説します。

この講座で、できるようになること

  • デザインの本質的な目的がわかる
  • デザインに必要な4つの原則がわかる
  • Webデザイン特有の要素を理解し、デザインできる
新Webデザインマスター講座
23レッスン
6章
単品買い切り
PROBLEM & SOLUTION

こんな悩みを、この講座で解決します

はじめての方がつまずきやすいところを、レッスンの順番で1つずつほどいていきます。

かかりません。
講座ではAdobeが提供するillustratorを使用しておりますが、別のデザインツールでも受講して頂けます。

初心者でも講座の内容についていけるでしょうか?

ABOUT

この講座について

未経験者歓迎!
30日間集中でWEBデザインを習得する

本格的なデザインスキルを身に付けましょう。
Webサイトの構成要素や、ユーザビリティに配慮したコンテンツの配置など、Webデザインに関わる人ならば知っておきたい知識・技術解説します。

こんなお悩みはありませんか?

デザインに自身が無く
案件受注に挑戦できない

仕事の幅を広げて
もっと効率よく稼ぎたい

子育てをしながら
在宅でお仕事をしたい

30日間で仕事レベル!
Webデザインのコツを習得しましょう

デザイン力に自身が持てるようになる

デザインで何から手を付けて良いか分からない、これで良いのか不安だと感じてしまったことはありませんか? デザインは感性、天性のセンスだと思われがちですが、まとまりあるレイアウトを実現する原理・原則が存在しています。理論を知ることで、自信を持ってデザイン提案が出来るようになりますよ。

クライアントが喜ぶ提案が出来る

デザインの原理・原則やユーザビリティについて学ぶことで、クライアントの求めるサイトビジュアルの提案が出来るようになります。コンペ形式の案件でのお仕事獲得率や、納品時のクライアントの評価も向上します。

スピートが劇的に向上する

慣れていないと、1つのデザインを考えるのにとても時間がかかります。Webサイトで使うデザインの法則を知っていると、短時間でのデザイン作成が可能になります。スピードが上がれば同じ作業時間で、今よりも多くの案件を受け持つことができます。

仕事獲得率がぐんぐん上がる

短時間でクライアントの要望に合ったデザインを作成できるようになれば、高く評価して頂けるようになります。応募式の案件でも選ばれる確率が高くなりますし、クライアントから直接次の案件を振っていただける機会も増えてきますよ。

報酬単価がアップする

デザインスピードが向上すれば受け持てる案件が増え、クライアント評価が高まれば報酬単価が増えます。色々な案件にエントリーして選んでもらう下請けから、仕事をお願いされるWebデザイナーにステップアップしましょう。仕事探しに時間を割かずとも、安定してお仕事と収入が確保できるようになります。

受講生からのメッセージ

2020年2月受講 今田様

クライアントからの紹介で依頼が続々

元々、副業としてWebデザインを行っていました。が、コンスタントに仕事が取ない、取れてもデザイン修正を求められたりと、時間や労力の割に収入にはなりませんでした。何とかしてスキルアップしたいとデザイン講座を受講、講座を進めていくなかで上手く行かなかった理由・どうすれば良いのかが明確になっていきました。

今は仕事を任せて下さった会社から直接お仕事の連絡を頂けるようになりました。サイトを作成させて頂いたお店からの口コミ紹介でのお問い合わせも増えました。クラウドソーシングで手当たり次第にエントリーしていたストレスから解放され、仕事が楽しいと思えるようになりました。

2020年5月受講 YASUKAWA様

残業激減! 上司からも評価されるように

自社の企画を制作会社にお願いする立場ですが、上手くイメージが伝わらず打ち合わせと修正を繰り返す毎日。残業も多く、子どもを迎えに行くのが保育園で一番最後なんてこともしょっちゅうでした。

仕事の後に勉強するのは大変でしたが、お陰で前よりも発注時の失敗や修正事項が減り、残業時間もほぼゼロに。子どもに今日あったことを聞いたり、手の込んだご飯を作ってあげる時間も出来ました。上司からも「仕事が早くなった」と褒められ、企画会議で意見を聞いてもらえることも増えました。デザイナー以外も知っておくべき内容だと思います。

短期間でもプロ級のデザイン力が身に付くカリキュラム

1.理論武装する

デザイン法則・色彩理論など、広いデザイン知識を学びます。

Webサイトをデザインするためには総合的なデザイン知識が必要です。構図、配置、配色、メールフォームやナビゲーションなどWebサイト特有のバーツ…どれか一つでもバランスが悪ければ、クオリティの高いWEBデザインとは言えません。デザイン講座では、デザインの原理原則から色彩、ユーザビリティなど、WEBデザインに関わる様々な理論や手法を紹介しています。

2.成果を上げるためのデザイン手法を学ぶ

クライアントが求める「成果が出る」Webデザインを習得します。

Webサイトは「見せる」ものであると同時に、ユーザーが操作するものでもあります。サービス申し込みや商品販売に繋がらなくては、意味がないのです。デザイン講座ではSKILLHUBが行った100社以上のコンパ―ジョンアップ実績を体系化し、ユーザーの心を掴むデザインのポイントも解説しています。WEBマーケティングやUIデザイン領域にも踏み込み、単なるデザインではなく「売上げに貢献するサイトデザイン」を学んでいきましょう。

3. デザインレビューで実践力アップ

質問・レビュー回数は無制限! プロレベルまで徹底サポート

SKILLHUBでは、質問やレビューの回数制限は一切行っておりません。
何度でも分からないところや気になるところを質問し、講師から回答やレビューをもらってください。「分からない」「あっているのか不安」という箇所を即座に解決することで、独学とは比べ物にならないスピードでプロレベルの知識と技術を習得することができます。

Webデザイン講座・プロの学習フロー

01

デザインのスキルカウンセリング

webデザインやデザイン経験の有無、どのようなWebデザイナーを目指しているか…目標や現在抱えている悩みをうかがいます。一ヶ月の学習スケジュール、最終目標を一緒に考えましょう。

02

学習&練習問題で定着

デザイン理論、WEBサイトの構成や効果的なレイアウトを学んで頂きます。1レッスンごとに練習問題をご用意し、実際に手を動かすことでレッスン内容がしっかりと定着します。分からないところは専用フォームからいつでも質問可能。

03

お仕事レベルの最終課題

全てのレッスンを受け終わったら、学習内容を生かした最終課題に挑戦していただきます。実際のお仕事レベルのデザイン課題をご用意しているほか、ご自身で作りたいサイトを最終課題にして頂くことも可能です。

04

最終課題のレビュー

提出して頂いた最終課題のデザインレビューをお送りします。デザインレビューは何回でも受け放題ですので、アドバイスに従って変更してみたり、バリエーションを作成してみるなど、更なるデザインスキル向上にご活用ください。

よくあるご質問

講座受講料以外にお金はかかりますか?

この講座で学べること

  1. デザインの本質的な目的がわかる
  2. デザインに必要な4つの原則がわかる
  3. Webデザイン特有の要素を理解し、デザインできる
  4. デザインに必要なマーケティング知識も学べる
  5. 配色についての基礎知識が身つく
  6. 画像選定の基礎知識が身つく

こんな方におすすめです

  • デザインの学習をはじめてする方
  • 自分のセンスに自身がない方
  • 作ったものがなんかダサく見える…とお悩みの方
  • Webデザイナーになりたい方

受講の前に用意するもの

  • WindowsもしくはMacのパソコンがある方
  • パソコンの基本操作ができる方
  • 【推奨】Adobe Illustrator がインストールされている環境 ※他のグラフィックソフトでもOKですが、講座内の解説はIllustratorを使用しています。
CURRICULUM

カリキュラム

6章 全23レッスン 上から順に進めると、最後まで迷わず進めます

1章 Webサイトの構造・レイアウトの基本3レッスン

  1. 1Webサイト構造(階層)と典型的なデザインWebサイトを構築している1つ1つのページ、そのページを構成する部位にはそれぞれ役割があります。 このレッスンではレイアウトの基本について学んでいきます。
  2. 2Webページのカラム構成WEBページに掲載する情報は、内容や役割に合わせた場所に配置されます。その大まかな配置を決めるための段組みのことをWEBデザインでは「カラム」と呼びます。
  3. 3スマートフォン対応とレスポンシブWEBデザイン近年はスマートフォンの普及により、スマホを使ってWebサイトを閲覧するユーザーが増えています。Webサイトをデザインするうえで必須項目と言える、レスポンシブデザインについて紹介します。

2章 デザインの理論と法則2レッスン

  1. 4デザインの4原則を知ろうwebサイトのデザインと聞くと、「見た目がおしゃれ」「かっこいい」「かわいい」等、見た目(外見)の部分を想像してしまうかもしれません。 しかし、良いサイトを作るために本当に必要なのはそこではありません。
  2. 5デザインの法則を知ろうデザインの為の法則には様々なものがあります。 今回はユーザーの使い勝手にもかかわる、代表的な4つの手法について学んでいきましょう。

3章 ユーザーを意識した設計3レッスン

  1. 6ユーザー導線の設計とペルソナユーザー導線とは、ユーザーがサイトに訪れる目的を達成する為に導くという事です。 このレッスンではユーザー導線の設計までに行う具体的な手順を紹介します。
  2. 7ワイヤーフレームの作り方・書き方のコツワイヤーフレームとは、サイトの設計図の様なものだと前回のレッスンで学びました。 このレッスンでは実際の作り方・書き方などについて学んでいきます。
  3. 8UIとモバイルファーストを意識するユーザーインタフェース(UI)とは、何らかの操作を行う際の、見た目や操作感/使いやすさを指します。 スマートフォンを使ってサイトを訪れる方でも、難なくサイトを閲覧・操作できるように設計をしましょう。

4章 作って学ぶWebページのパーツと設計10レッスン

  1. 9ここからのレッスンと実習についてここからのレッスンでは末尾に実習が付いています。 実習部分を一緒に行って、サイトのデザインを完成させてみましょう。
  2. 10ナビゲーションの種類と設計このレッスンではWebサイトのナビゲーションの種類や、ナビゲーション設計について学びます。 グローバルナビゲーションやローカルナビゲーションなどはどのようなものか、それぞれを設置する際のポイントなど、ナビゲーションの基本を解説します。
  3. 11スマホ幅でのナビゲーション表示PCサイトのナビゲーションをスマートフォンでそのまま使用すると、狭い画面範囲が更に狭くなり、コンテンツの配置が制限されてしまいます。 スマートフォンで使いやすいナビゲーションについて考えてみましょう。
  4. 12ファーストビューのレイアウトこのレッスンではサイトを訪れた方へ即座に概要を伝えるために必要な、ファーストビューの設計についてご紹介します。
  5. 13スマホ向けのファーストビューレイアウトファーストビューで写真とテキストを重ねる場合、パソコン幅のレイアウトを基準に設定するとスマホ幅で読みにくくなる可能性が高いです。 スマホでもテキストの可読性が保てる配置を心がけましょう。
  6. 14ゾーンニングと見出しの設計Webページは開いて数秒で内容が把握でき、ユーザーに「このページを読もう」と思ってもらえることが重要です。 内容を整理し、適切な見出しをつけつことでユーザーに興味を持ってもらいましょう。
  7. 15UIデザインパターンで使いやすく情報を整理するUIデザイン(ユーザーインターフェース)パターンとは、ユーザーにとっての使い勝手を良くするための型のことをいいます。 このレッスンではUIデザイン(ユーザーインターフェース)パターンとは何か、そしてその代表的なパターンをいくつか取り...
  8. 16リンクの設計を考えるほぼ全てのWebページで使われている要素と「リンク」について学習しましょう。 リンクが分かりにくいサイトはユーザーが目的のメージに到達できず、去って行ってしまう可能性が高いので注意が必要です。
  9. 17フォームのレイアウトお問い合わせや申し込みなどコンバ―ジョンに繋げるためには、お問い合わせや申し込みページで使われるフォームの最適な設計が不可欠です。 フォームの役割や構成、フォームに導くなどユーザーのアクションを誘発するボタンついて紹介します。
  10. 18リストとテーブルで情報を整理するこのレッスンではWebページ内で様々な情報を整理して表示する、リストとテーブルの使い方や実例を紹介します。ページ内にある情報を分かりやすく整理し、読みやすいページを作りましょう。

5章 配色・図版・フォント4レッスン

  1. 19色の属性、与えるイメージWebサイトのデザインを行う上では「色の選定」も重要な要素です。 色はユーザーに視覚的に情報を伝えたり、イメージを持たせたりする役割もあります。色を構成する属性や色の種類、一般的に持たれている各色のイメージを見ていきましょう。
  2. 20Webデザインに役立つ配色ルール配色とは「色の組み合わせ」を指します。 配色は、サイトのイメージを決めるだけではなく、使い勝手の部分にも影響するものです。
  3. 21写真と図版を使用するWebサイトではユーザーに瞬時にメージの内容や情報を伝えるため、写真やグラフなどの図版を使用することもあります。 Webサイトに使用するための写真の選び方やトリミングのポイント、図版の種類をおさえておきましょう。
  4. 22美しさ・わかりやすさをUPするフォントとアイコンフォントやアイコンなどの設定も、サイトデザインを分かりやすく、美しいものにするための重要なポイントです。 フォントの種類やアイコンの使い方を学んでいきましょう。

6章 まとめ1レッスン

  1. 23講座終了実習:スクールサイトのLP作成新Webデザインマスター講座、レッスン総まとめの実習について説明します。
FAQ

よくある質問

大丈夫です。
本校の講座は分かりやすさに定評があります。質問回数にも制限はありませんので安心してお申し込みください。

パソコン初心者でも大丈夫ですか?

START

新Webデザインマスター講座

デザインの学習をはじめてする方に向けた、全23レッスンの講座です。上から順に、1つずつ進めてください。

  • デザインの本質的な目的がわかる
  • デザインに必要な4つの原則がわかる
  • Webデザイン特有の要素を理解し、デザインできる
  • デザインに必要なマーケティング知識も学べる
この講座を申し込む価格:¥139800