【前編】Udemyで購入した講座が良すぎたのでレビューしました。

Web design

UdemyがWebデザインの勉強に良いってのは知ってるけど

「どの講座がいいかわからない!」

実際受けてみないことにはわかりません。

私自身も購入前にたくさんの講座レビューをしているブログ見てみたけど、

”触り” しか触れていない感想ばかりで結局よくわかりませんでした。

実際に受けた講座がとてもよかったので

私のアウトプットを兼ねて

  • 何が学べるのか
  • 何がよかったのか
  • 完成までに私がしたこと

受ける意味がなくならない程度で、書いていきます。

合わせて、

私なりのUdemy(動画)で学習する

メリット・デメリット をご紹介します。

…と、文章を書いているうちに目次が大変なことになりましたので

記事を3つに分けることにしました。

前編 ▶︎ 購入した講座の感想。

後編 ▷ Udemy(動画)で学習するメリット・デメリット。

番外編 ▶︎ 架空LPの完成までに私がやったこと。

本記事『購入した講座の感想。』についてになります。

最後までお読みいただけたら幸いです。

紹介する講座

今回、実際に購入した講座は

『Webデザイナーのキャリアを未経験からスタートするためのオールインワン講座

Webデザイナーのキャリアを未経験からスタートするためのオールインワン講座
ウェブサイトの企画・設計、Sketchを使ったデザイン、HTML / CSS マークアップ、モバイル最適化など、Webデザインに挑戦したい人が一気通貫して学べる総合学習コース

です。

講師は、(Udemy 講師プロフィールを参照。)

国内外を問わずにフリーランスとして活躍されている

UX / UI デザイナー の Shunsuke Sawadaさん。

UX / UI以外にもプロダクトマネージャーや

バックフロント・エンドにも携わった経験があるとのことです。

講座で制作できるもの

架空のWEBサイト『Chill Cafe』のランディングページを

企画していく工程を見ながら、制作していきます。

ネタバレになるので具体的に言うことはできませんが

いくつか端折っていたり、

画像も用意されたものはダウンロードせず【Unsplash】 の写真を使用しています。

※文章のみダウンロードしています。

講座の内容

スキルレベル:初心者レベル

238レッスン / 19.5時間 分

【導入 & 基礎編】

01.  企画力(ヒアリング、トンマナ、モバイル対応は必要?、予算)

02. デザイン四原則の説明

03. 技術(sketchの操作)

【応用編】

04. ワイヤーフレームの作り方

05. デザインカンプの作り方

06. 基本的なコーディングの説明(HTML / CSS)

【実践編】架空サイトChill Cafeの制作

07.  企画

08.  ワイヤーフレームの制作

09. デザインカンプの制作

10. コーディング

11. レスポンシブ対応

【おまけ】

12. Webサイトの公開手順(Amazon S3を使用して)

使用ソフト

講師miki ❄️
(筆者)
デザインソフト sketchfigma
コードエディターAtomVScord

ご覧の通り、

筆者は figmaVS cord を使用しましたので

他のソフトでも充分に対応可能でした!

sketch は 英語表記で 1年間 99ドル サブスク制。

(日本円で約1万円。※30日間の無料体験 期間あり)

The digital design toolkit
Sketch is a design toolkit built to help you create your best work — from your earliest ideas, through to final artwork.

「なぜsketchを用いるのか?」

については、メリット・デメリットも講座の中で話されています。

figma は 英語表記 で 無料 です。

Figma: the collaborative interface design tool.
Build better products as a team. Design, prototype, and gather feedback all in one place with Figma.

sketchとfigma以外でデザインソフトの代用だと、

Adobe契約されてる方で Adobe XDPhotoshop

Photoshopでデザインカンプ作られる方もいらっしゃるようです。

ちなみに、Adobe XD 無料 で使用できます。

アドビ:クリエイティブ/マーケティング/文書管理ソリューション
アドビは、コンテンツおよびアプリの作成、配信、最適化を支援し、デジタルエクスペリエンスを通じて世界を変革します。

Twitterを見ていると 現場でも Adobe XD が使われてることが多いようですし、

英語が苦手な方としても、Adobe XD を使うのが良いのかもしれないですね。

コードエディター については

しまぶーのIT大学さん の解説に共感して

VScord(Visual Stadio Cord)を使用しています。

エディタのオススメはVSCode!プログラミング初心者やフロントエンドエンジニアを目指す方はVSCode一択!

予測変換と自動生成をしてくれて、つづりを打つことに

時間がとられなくて、とても使い勝手がよかったです。

※プラグインを導入する必要があります。

実施期間

架空Webサイト Chill cafe の LP制作期間としては

すいません、ちょっとだけ嘘ついてます。

2日目(7/19)はもうちょっとかかってます。笑

※番外編にいってしまった話から補足で、1日目分については視聴が2周目です。

購入した講座の 良かった点 と △な点。

✔︎ 基本的なことは充分に学べた。

『ノンデザイナーズ・デザインブック』に出てくる

デザイン四原則シンプルな図形を使用して説明してくれている のはわかりやすかったです。

また、WEBサイトを製作の中でも

「これはデザイン四原則の〜ですね。」って解説してくれているもよかったです。

技術・操作に関しても、

他のデザインソフトを使用する場合は、

あらかじめ自分が使用するソフトの操作に慣れておく必要があります

できること・やることは同じだと思いました。

その根拠として、ワイヤーフレーム 〜 コーディングの過程まで

figma と VScord を用いても問題なく、架空LPが完成できているから。

sketch を使って受講するなら充分に基礎を補う内容だと思いました。

✔︎ 企画力重視の講座。

操作方法(技術)は

  • Googleで検索する
  • YouTubeで検索する
  • 自分の感覚で身につける

ことで習得が可能ですが

企画の手順・構想は、思考力の問題なので、

知識やノウハウを授け受けない限りは身につかないと思います。

企画力を重視している点は、

かなりコスパが良く珍しくもある講座

でもあると感じました。

企画力に通づる話として、

  • クライアントとの向き合い方 【導入編】
  • 根本的に本当にWEBサイト制作の受託でいいのか 【導入編】
  • オリジナル制作の上での参考資料の集め方【実践編】
  • Webサイトに載せる良い写真・良くない写真の見分け方【実践編】

まで解説してくれています。

この点でも、この講座は ”買い” かな と 思います。

顧客ファースト であり 信頼性を構築すること

大切にされていることを強く感じる講座でもありました。

✔︎ 安心した。

【実践編】での 架空Webサイトの構想・企画自体も

本当にぶっつけ本番で撮っていそう です。(伝わってくる)

現役で実際に稼いでる方でも、

「こういうところで間違えたり、重複したりするんだ」と完璧ではないのが見えて

(よくあるつまずきパターンの事例としてで、わざとの時もありそうだけど)

安心した気持ちになりました。

ぜんぜん動じない講師さん。

そして、「おそらくココが原因じゃないか」と即座に予測を立てる講師さん。

プロ意識を感じました…!

✔︎ 項目ごとに分けている。

レスポンシブ対応を分けて学ぶことができた ことが、よかったと思いました。

本講座では、style.css と responsive.css で分けてCSSを書いていきます。

先日、Kindle Unlimited の教材

と コードエディタとPC画面上に並べて

webサイトのコーディングをやってみたのですが

その教材は、style.css 内にレスポンシブ対応を含めて同時進行で書いていくものでした。

progateも段階的に分けて学びますよね。

実際どちらがいいものかは、まだわからないですが

分けて説明してくれていたことで、落ち着いてコードを書くことができました。

✔︎ 現代的なコンテンツを導入している。

  • Google mapsをサイト内で動かせるコンテンツの導入手順。
  • Instagram のロゴを公式からダウンロードする。
  • 実際に、リンク先のURL(Instagram)を貼る。

HTMLとCSSだけのものの、充分にリッチに見えて

現実的な実装として使う頻度が高いコンテンツの導入方法を学ぶことができた

のは、個人的にはかなりポイントが高いと感じました。

また、

  • ”1ピクセル単位まで” というデザインへの細かいところまでの拘り。
  • SEO対策のためにもと、顧客ファーストを感じられる細かい指摘。

架空サイトにも関わらず、ここまで現実性と熱量を持って講座を

完成させたのは凄いなと思いました。

△ 英語サイトガンガン見せられる・進みます。

講師の方が、国内外問わずに活躍されている方なだけあって

実際にWEBサイトを見せて解説する際は ほとんどが英語のサイトです。

日本語訳を交えて解説しているので問題はないかと思いますが、

コーディングの際につけるタグ名も、

スラスラ英語に置き換えて進めていくので

英語苦手な人にとっては ちょっと大変かも しれないです。

私は2、3個初めて知った単語がありました。

inquiry(お問い合わせ)とか。

しかし、コーディングは英単語ばかりですし

今回カフェの架空サイトなだけあって簡単な単語が使われているので

これを機会に覚えてしまう勢いもありだと思います。

【前編】の まとめ

この講座、元値 ¥24,000 なだけある!!!!!

筆者は新規会員のセールで ¥1500 で購入しております。

Udemy30日間の返金対応があるので、

冒頭の、【導入編】あたりを見てみて

共感を感じるなら「一度買ってみるべし!」です!

全体的な総評としてまとめると

  • webデザインって何?って人が受けてもOK!
  • 自分がお気に入りのソフトを使ってもOK!
  • 英語に苦手意識がある人は もしかしたら、大変かも?

学ぶることを まとめる と、

  • 企画力(最重視
  • sketchの操作方法
  • HTMLとCSSを使用したWebサイトの制作

さらに、

提案型の人材が求められる中で

  • オリジナルサイトを作る上でのノウハウ
  • クライアント(自分自身・上司にも置き換えて)との向き合い方

まで本講座で学ぶことができるので

フリーランスを目指す方も、就職を目指す方にも

受ける価値のある講座だと思いました。

※【提案型の人材】についての詳しい説明については講座内で説明されています。

ちなみに、

テキストベースの復習サイト(※制作途中段階)が用意されています。

最後にはなりましたが、思うより熱量のあるレビューになってしまったのと、

購入の促しがある一文がありますが

補足をしておきますが、回し者ではありません のでご安心ください。

ただ説明が長くなるのと、著作権問題になるので促しているだけですので ご了承ください。

ブログ自体も、広告バナーを貼らないので、いつまで経っても収益化はされそうにありません。笑

冒頭でも書きましたように、続編があります。

後編 では Udemy(動画)で学習するメリット・デメリット。

番外編 では 架空LPの完成までに私がやったこと。

既に文章は書いてあるので、次の投稿までに時間のかかることはない

と思うので、少しでも気になる方は 続編を読みにいただけたら嬉しく思います!

後編はコチラ▽

【後編】Udemy / 動画 でWebデザインを学習する5つのメリット・4つのデメリット。
Udemyに関する記事を3部構成にしてお届けしています。前編 ▶︎ 購入した講座の感想。後編 ▷ Udemy(動画)で学習するメリット・デメリット。番外編 ▶︎ 架空LPの完成までに私がやったこと...

番外編はコチラ▽

【番外編】Udemy講座 / 架空LPの完成までに私がやったこと。
Udemyに関する記事を3部構成にしてお届けしています。前編 ▶︎ 購入した講座の感想。後編 ▷ Udemy(動画)で学習するメリット・デメリット。番外編 ▶︎ Udemy講座 / 架空LPの完成までに私がやった...

最後まで読んでいただきありがとうございました!

良きWebデザインライフを!笑

今回、ご紹介させていただいた講座

『Webデザイナーのキャリアを未経験からスタートするためのオールインワン講座』のURL ▽

Webデザイナーのキャリアを未経験からスタートするためのオールインワン講座
ウェブサイトの企画・設計、Sketchを使ったデザイン、HTML / CSS マークアップ、モバイル最適化など、Webデザインに挑戦したい人が一気通貫して学べる総合学習コース

コメント

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