Udemyで「Googleタグマネージャーと始めるJavaScript入門」を作った理由
どうも、エンジニアのgamiです。
この度、学習コンテンツを個人で制作してUdemyで公開しました。コース名は「Googleタグマネージャーと始めるJavaScript入門」です。
【Udemyでコースを作りました🎉】
— gami@Udemyで非エンジニア向けJavaScript入門コース作った (@jumpei_ikegami) August 20, 2022
「Googleタグマネージャーと始めるJavaScript入門」
という、主に非エンジニアの方に向けた実践的なコースを公開しました！いやあ、頑張った！
Webの仕様に対する解像度を上げたい方は、ぜひ受けてみてください！
コース内容は添付画像へ。https://t.co/xCXDPdGE5e pic.twitter.com/IdYvN1pJlA
このコース、動画が63本 合計約6時間あり、構成を決めて撮影や編集をするだけでトータル100時間以上はかかっています。
ここまで大変な労力をかけてこのコースを作ったのには、いくつかの理由があります。まさにこれまで僕が色々な活動を通して考えてきたことの集大成として、「このコースを作ってUdemyで公開するしかない」と思うに至りました。
今回はUdemyコース「Googleタグマネージャーと始めるJavaScript入門」の公開を記念して、このコースを作るまでの経緯について紹介します。
なぜ非エンジニア向けにデジタル領域の学習コンテンツを作るか？
そもそもこのUdemyコースに限らず、ここ数年の僕は「非エンジニア向けにデジタル領域の学習コンテンツを作る」という活動を色々なメディアを通じてやってきました。
YouTubeチャンネルには、デジタル技術教育系の動画を50本以上アップロードしています。
また一時期は「非エンジニアのためのデジタルリテラシー」というWebサイトの更新に注力していて、JavaScriptやSQLを簡単に学べるチュートリアルシナリオをいくつか掲載しています。
他にも、このnoteは『仕事を楽しくするデジタルリテラシー読本』というnoteマガジンの1記事ですし、仕事でも非エンジニア向けSQL研修など教育コンテンツ制作を活動の1つの軸にしてきました。
こうした活動を続けてきた理由は、僕が個人的に掲げているミッションに関係します。それは「楽しく働く人を増やす」というミッションです。
「楽しく働く人を増やす」ための手段は、きっとものすごくたくさんあります。僕自身、過去には若手エンジニア向けの転職支援みたいなことも個人的にしていました。
ここ数年は「なんかエンジニアと非エンジニアの間に落ちるボールってめちゃくちゃいっぱいあるな」というのを痛感させられており、それが原因で仕事が思うようにいかない非エンジニアの方もたくさんいそうだということがわかってきました。そこで、そうした人たちの「楽しく働く」を少しでも支援できるように、「エンジニアと非エンジニアの間」を意識した学習コンテンツを量産しています。
この辺りについては、過去にもいくつかnoteを書きました。
なぜUdemyの有料コースなのか？
すでに述べてきたように、これまでYouTubeの無料動画や個人Webサイトの無料記事をたくさん作ってきました。一方で、今回の教材はUdemy上で有料コースとして販売しています。
有料の学習コンテンツを作らねばいけないと考えた理由は、主に2つあります。
1つは、学習する人のコミットメントを引き出すためです。
僕は過去にもWebサイトの無料記事として、JavaScriptを学べるハンズオン学習コンテンツをいくつか公開してきました。しかし、これらを真剣に受講して学びに変えてくれたという人の話は、少なくとも僕の耳には入ってきていません。
人は無料のコンテンツに対してそれ相応の軽い気持ちで向き合います。一方で、Udemyで数千円を支払って受講するコースに対しては、ある程度の真剣さを持って取り組むはずです。
僕自身、何か新しいことを学ぶときに「まずは本やコンテンツにお金を払ってからやる気を出す」ということがあります。この「もうお金払っちゃったしちゃんとやるかー」という心理作用をうまく使った方が、学習のモチベーションを持ちやすい。この点が、有料コンテンツの学習者に対する重要なメリットであることに気付きました。
2つ目は、制作する僕のコミットメントを引き出すためです。
僕はこうした教育コンテンツ制作を個人活動としてやっており、本業ではフルタイムで会社員として働いています。また家では2022年3月に生まれた乳飲み子を育てており個人活動の可処分時間はさらに削られています。そんな中で何とか時間を捻出して継続的にコンテンツ制作を続けるには、ある程度のモチベーションが必要です。
これまでもYouTubeチャンネルの運営などやっていましたが、無料のコンテンツの場合、「数万人に見られる」とか「そこから面白い人のつながりが生まれる」といったインパクトが無いと、趣味ではとても発信活動を続けていけないなと思いました。
一方で、noteでは『仕事を楽しくするデジタルリテラシー読本』という定期購読マガジンをやっていて、ありがたいことに毎月お金を払って読んでくれる読者の方がいます。僕の心には「お金を貰っている以上はちゃんとやらなきゃ」という責任感が生まれ、一定のクオリティの記事を毎月数本書くことにコミットしやすくなります。
Udemyの有料コースも、制作中から「期待して数千円払ってくれた人をがっかりさせたくない」という思いが芽生えて、かなり力を入れてコンテンツづくりをすることができました。
他にも、Udemyでコンテンツを公開するという意思決定の裏には、次のような期待がありました。
Udemyというプラットフォームを通じて、リーチできなかった層にも認知してもらえる
Udemy上でのQ&Aやレビューなどを通じてちゃんとしたフィードバックが貰える
なぜGoogleタグマネージャー+JavaScriptなのか？
今回公開したコースは「Googleタグマネージャーと始めるJavaScript入門」です。なぜ僕はこんなタイトルのコースを作ったのでしょうか？
前述のように、僕の中での最近の課題感は「なんかエンジニアと非エンジニアの間に落ちるボールってめちゃくちゃいっぱいあるな」です。その中で結構な割合を占めるのは、Webに関するボールだと考えています。
たとえばBuiltWithというWebサイト情報検索ツールに登録されているだけでも、世界には約6億7300万個のWebサイトがあります。たとえばスマートフォンアプリと比較すると、App Storeに公開されたiOSアプリで約180万（2022年時点）、Androidアプリ数は約320万（2018年時点）なので、文字通り桁違いにWebサイトの方が多くなっています。皆さんが仕事で関わっている会社でも、その多くが自社のWebサイトを持っているはずです。
コストをかけてWebサイトを作った以上、普通はその運用や効果計測をしたくなります。一方で、その全てをカバーするにはエンジニアの数は全く足りません。実際、Webの運用やマーケティングに関わっている人の多くはエンジニアではありません。GoogleアナリティクスやGoogleタグマネージャーを見様見真似で触っている非エンジニアに、僕は何人も出会ったことがあります。
「Googleタグマネージャーと始めるJavaScript入門」では、簡単なJavaScriptプログラムに触れることを通じてWebの仕様を少しだけ深く理解できます。もちろんWebの仕様をそこまで深く知らなくても最低限のWebサイト運用はできます。しかし、ちょっと複雑なことをやろうと思ったら、そもそもWebがどう動いているのか、JavaScriptを書くと何ができるのかを理解しないと壁にぶつかってしまいます。
また、Webに関わる非エンジニアの多くは、JavaScriptの文法を学びたいのではなく、仕事に役立つ範囲でWebの仕様を手っ取り早く理解したいと思っています。別にWebサイト制作をしたいわけでもありません。にも関わらず、世にあるJavaScript学習コンテンツの多くはエンジニアが読むことを想定した文法解説やWeb制作Tipsが書かれています。これはWebに消極的に関わっている多くの非エンジニアにとって、望ましいコンテンツではありません。
ここに世の中のニーズと既存学習コンテンツとのギャップを実感し、それを埋めるためのコンテンツを作ったというわけです。
非エンジニアがJavaScriptを学ぶ価値については、以前もnoteに詳しく書きました。
ということで、仕事でWebに関わる人に向けた実践的な学習コンテンツを作ることができました。「受けた方がいいかも？」と少しでも思った人は、ぜひ気軽に受講してみてください！
Udemyコース作成の裏話
以下、マガジン購読者&記事購入者向けにコース作成の裏話を雑多に残しておきます。スケジュールの話や、動画制作の方法、Udemyの講師向け機能についてなど。読みたい人だけ、どうぞ。
スケジュールの話
コースの構想自体は、今年2022年の初頭からありました。記録を見てみると、だいたい次のようなスケジュールでコース作りが進んでいます。仕事や育児の合間にちまちま進めて、期間だけでいうと約6ヶ月かかりました。
2022/02/12
GitHubに「Udemyコース作成方針を決める」というissueを作る
2022/02/19
コース原稿をNotionに作り始める
2022/03頃
コース原稿がだいたい完成する
動画撮影を開始
ここで第一子が爆誕（里帰り出産）
2022/04末
全レクチャーの撮影が終了
2022/05
弊娘を自宅に迎える
1ヶ月の育児休暇が始まる
ここからコース制作がいったん止まる
2022/07
育児と仕事の両立ペースが掴めてくる
レクチャー動画の編集を本格的に再開
2022/08/11
全レクチャーの動画編集が終了
コースのサムネイル画像の制作を配偶者に依頼
2022/08/14
全ての準備が整ったので、コースをUdemyの品質審査プロセスに提出
2022/08/16
審査の結果、1点だけ指摘があったのでその部分をカットし再提出
2022/08/20
めでたくコースが承認され、Udemyのマーケットプレイスに公開🎉
途中で子供が生まれて制作が約2ヶ月ストップしましたが、何とか立て直せてよかったです。
撮影と編集の話
YouTube動画を作ってたときは、次のようにかなりハイコストな動画制作をしていました。
グリーンバックを自分の後ろに広げる
画面収録と自分の顔を別々の動画として撮影
2つの動画をPremiere Proでワイプ化し、そのままカット編集と字幕付け作業をする
今回は動画の本数も多かったのと、エンタメコンテンツに比べて学習コンテンツは編集を頑張っても割に合わないことに気付き始めたので、かなり楽をしました。
それでも編集だけで1本30分以上はかかりました。字幕を付けなければ冒頭と末尾をカットするだけなので5分もあれば終わるのですが、内容的には仕事中に見る人もいるはずで、そうなると音声無しで受講したい人も出てきそうなので、頑張って全動画に字幕を付けました。Vrewの字幕自動生成にはかなり助けられましたが、それでも技術用語やプログラム内容などは一発で意図通りの字幕が生成されることは無いため、かなりの手直しが必要でした。
QudenとVrewについては、以前のnoteでも別のテーマで紹介しています。これらは僕にとって神ツールでした。
サムネイルについて
動画制作は撮影から編集まで自分1人で全てやりましたが、コース画像だけは配偶者に依頼しました。配偶者はデザイン系の学科を出て仕事でもIllustratorやPhotoshopを触っているので、家庭内発注しました。「ステーキ食べたい」とのことだったので、報酬にステーキを買いました。
最初はYouTube動画のサムネイルのようにテキスト込みの画像にしようとしてたのですが、Udemyのコースイメージ画像品質基準によるとテキストの使用は禁止されていました。
Udemyのコース一覧画面を見るとわかりますが、サムネイル画像のほとんどがどこかの素材サイトからダウンロードした風の画像になっています。その理由が初めてわかりました。
Udemyについて
今回のコース制作で初めてUdemyの講師向け機能を使いました。感想としては、必要な機能がシンプルなUIで揃えられていてとても使いやすかったです。基本的には、動画と字幕をアップロードし、各レクチャー説明文や資料を設定するだけコースができます。簡単ですね。
コースの品質管理も割とちゃんとしており、恐らく動画の中身を全て見た上でUdemyのポリシーに反する部分を指摘してくれました。
実際にあった指摘として、「コース内で "Twitterで連絡ください" というのは規約違反なのでやめてください」というものがありました。個人的には受講生とのつながりたいので、Q&Aにおさまらない内容については個別に連絡がほしいと思っていました。しかし、Udemyのポリシー上は「ユーザーがお互いの個人情報を交換することなくコースが完結すること」を目指しているらしく、Twitter DMでのやりとりを促す行為はNGだそうです。ただし、僕が知らなかっただけでUdemy上にもDM機能はあるらしいので、それでいったんは事足りそうでした。
以上です。今回のUdemyコースが好評ならまた別のコースも作りたいと思っているので、ぜひ受講して感想をお聞かせください✨
ここから先は
仕事を楽しくするデジタルリテラシー読本
【初月無料】デジタル時代の歩き方について考えたことを発信します。ソフトウェアの時代とは何か。エンジニアの頭の中はどうなっているのか。NoC…
サポートをいただけると、喜びドリブンで発信量が増えます！初月無料のマガジン『仕事を楽しくするデジタルリテラシー読本』もおすすめです！