
まずは講座の目的や講師の自己紹介をさせていただきます!
目的をまずはしっかりと理解して、学習の方向性を明確にしていきます。
また講座内で利用するAIサービスや今話題のAIサービスも紹介しているので参考にしてみてください!
基本的な生成AIツールの存在や今実際にAIはどう使われているかについて解説しています!
実務でのAIの使われ方についてもお伝えしていて、ITの現場(エンジニアやWeb制作者)での捉えられ方がわかります。
特に重要な部分としては「AIに出来ることと出来ないこと」があります。
シンプルに言えば「AIは責任が取れないこと」があるのですが、それがなぜ重要なのかについても解説しているので、最後までしっかり動画を見てくださいね!
ChatGPTの基本的な使い方を動画で解説します。
またChatGPTが扱えるのであればClaudeやGeminiなど他のAIサービスも活用できるようになるため、注意点を含めて理解しておくと後がどんどん楽になっていきます。
難しいものではないので触りながら理解していきましょう!
ChatGPTの各モデル毎の違いを実際に動きを見てもらいながら解説します。
特にproについては比較的大きめの金額が必要なサービスになるのでどういう動きをするのかは見ておきましょう!
DeepResearchの使い方、ちょっとした注意点についてもお伝えします!
ChatGPTやClaudeなどの対話式のAIサービスの使い方と注意点について解説します。
こうしたAIサービスでは「一回伝えたら終わり」という考え方は捨てましょう。
人に指示を出すのと同じように、友人と会話するかのように、ちゃんとコミュニケーションを取ることを意識するのが大事になってきます!
AIのみを使ったLPの制作に入っていきます!
Web制作の大まかな流れに沿って要件定義をまずは行います。
要件定義のやり方自体もChatGPTなどに相談することが出来るので、AIに対する「何でも聞いて良い」という感覚がわかってくるかと思います!
前篇で行ったChatGPTでの要件定義の続きです!
またClaudeで行う場合にどうなるのかという変化も見てもらいます。
方針決めや壁打ちは複数AIサービスを活用するほうがアイデアが広がりやすく、より精度が高まるのでオススメです!
ワイヤーフレームを作っていきます!
実際のWeb制作業務で行う粒度のものとは少しずれていたり、逆に「作りすぎてしまう」場合もありますが、ここで大事なのはこの構成を「AI自体が理解できるか」になります。
図示されることも大事ですが「どんな構成なのか」がわかるように意識していきましょう!
ワイヤーフレームを元にLPを構築していきますが、その前にコード生成を行うAIサービスの紹介です。
今回は「v0」と「Bolt.new」というサービスを利用していきます。
実際に触るとわかることですが、使い勝手は同じでも出力されるものが全然違います。
用途に応じて使い分けるのが大事なので、何が違ってくるのかをこのセクションで理解していきましょう!
実際にワイヤーフレームを元にLPを構築させていきます!
詳細は動画を見て頂ければと思いますが「AIのみでやる場合の限界」がここで見えてきます。
実務で使えない、とまでは言わないのですが使われる範囲が限定されます。
その理由等やAIサービスごとの違いについても解説します。
ワイヤーフレームを元にv0とboltで生成されたLPをここで見ていきます!
前編で伝えていましたが、ただAIに指示するだけだとv0とboltという似たようなサービスですら大きな違いが発生し、かつ、納品に耐えられないものが出来てきます。
ここをどうクリアしていくのかや何が駄目なのかというのを解説します。
LPの調整をAIのみを使って行っていきます!
限界があるとはお伝えしましたが、それでも出来ることがあること。もっと言えばAIサービスの進化は著しいのでこの調整のやり方を知っていれば今後の進化を見据えたときに、AIサービス単体でLPが作り上げていけるようになります。
そのコツ、やり取りの仕方を是非参考にしてください!
今回のLP制作においては積極的に利用しませんが、画像生成系AIサービスの紹介です。
デザインを作るときやAIのみで構築する時にどうしても画像データが欲しくなる時があります。
そうした際にAIで作れるというのを知っておくと選択肢が多くなります。
ただ特にImageFXを使うときは「Adobe Stock」などで探すほうが早い場合もあるので、AIに拘りすぎないのも大事です!
こちらが提供するデザインカンプデータを元にLP制作を行っていきます!
Figmaのデータをインポートすることでどれぐらいの品質のものが生成されるのかをまずは確認してください。データについてはリソース欄にURLを貼ってあります!
v0やBolt.newとの違いもしっかり把握しておくと良いですね!
最後にLPの調整を行っていきます。
AIのみで全てを行いますが、実際には自身で手を動かしたほうが早い場合もあります。
慣れてきたら部分的なコード修正はChatGPTやClaudeに確認しつつ、Cursorなどのエディタを活用して修正するとよりスピーディにLP構築ができるようになります!
LPの調整を続けていきます!
中編ではレスポンシブの対応を主に行っていきます。
レスポンシブへの対応は現在のWeb制作では当然行わないといけない作業になります。
ただ実際にはある程度AIで自動化したいという要望が強いものでもあるので、ここが出来るだけでも大分楽ができるものになります。
Cursorなどのエディタと併用することでレスポンシブだけをAIに任せたりも可能なので、是非活用してみてください!
LPの最後の調整です!
また追加でWebページを追加する方法、v0やboltの真骨頂であるWebアプリケーション開発についてもご紹介します。
特にアプリ開発に使うと凄まじい力を発揮するので、フロントエンド開発に興味がある方などは必ずチェックしてくださいね!
一通りの学習を行った方に向けた「今後について」お話しします!
AIに出来ること・出来ないことを理解し、AIを使ってモノづくりを体験したことで自分に足りていないものやこれからのIT業界で求められる人というのがわかってきたかと思います。
そこに向けての最後のメッセージをお伝えします!
はじめまして!今回のAI講座の講師を担当する、RaiseTechのエナミコウジと申します!
本コースでは実務で通用するレベルの「様々なAIサービスの活用方法」や「LP制作事例」を動画にてお伝えしています。
またAIを使うことで短期間で成果を出せることを体験していただきたく、講座としては「2日でLPが作れる」ことを目標に設計しております。
実際のところ、ある程度慣れてくれば2日どころか1日もかからずにある程度のLPは作れるようになっていきますので、是非最後まで講座をご覧頂ければと思います。
【講座の目的】
講座の名の通り「LP制作をAIのみで出来るようにする」というのが目的ではありますが、本当の意味ではそこがゴールではありません。
AIを使う時に大事なこと、本当にいちばん大事なことは「AIに出来ること・出来ないことを理解する」ということです。だからこそ実務で実際に使われるレベルを知ることで、それを理解してもらおうという意図があります。
そしてAIというものは「個人の能力を拡張するもの」であることを知っていただきたいと思っています。
AIがあれば何もしなくて良い、学習等も不要で、エンジニアやWeb制作者になれる、なんてことはありません。
今回の講座のテーマとはまるで真逆に感じられるかもしれませんが、実は既に実務で活躍されているような方の場合は2日でLPを作るなんてものでは済まず「AIを活用して1ヶ月もかからず、1人でWebサービスを公開して収益を得られる」というレベルになります。
実際そういうレベルの方は最近ちらほら表舞台に登場しつつあります。もっと規模は大きいですが、それこそAIサービス「Devin」を開発した「Cognition AI」という会社も一例に挙げられるかもしれません。(設立から半年で評価額3,000億を超え、従業員は20名程度です)
今回のAI講座はあくまできっかけで、AIで出来ることを知り、更にそれを拡張するために自身の能力を高める材料にしてもらえればとても嬉しいです!
【講座の特徴】
・2日でLPを作ることでAIを実務に活かす方法を知る
AIについては日々至るところで話題になっており、IT業界を志す人も、IT業界で既に活躍している方もかなり注目しているかと思います。
ただ実際には実務で通用するレベルで活用している人はまだまだ少なく、特に情報の変化が激しすぎるあまり「何から始めたら良いのかわからない」「落ち着いてから触ろう」と考えている人も多いでしょう。
そんな人に向けて「既に実務で使えるレベルであること」「むしろまだAIを使っていないというのは危険であること」を知ってほしいという意味も込めて「2日で出来るLP制作」と題しました。
LPをただ作るだけでなく、実務での使われ方を想定した講座となっていますのでLPを作りながらAIの活用法が理解できるようになっています。
・様々なAIサービスの利用方法や特徴が理解できる
AIの活用方法を知ることもそうですが、実務においては「どれか単一のAIサービスを使えば良い」ということはありません。情報が目まぐるしく変わっていく以上、色々なものを扱える必要があります。
そうした様々なAIサービスの利用方法についても講座内でしっかりと解説しています。プロンプトの考え方、作り方についてもお伝えしているので、短時間の講座ではありますが受け終わった後には一通りのAIサービスを扱えるようになっているはずです。
ChatGPT、Claude、Geminiなどの対話形式のAIサービス。ImageFX、Midjourneyなどの画像生成系サービス。そしてv0やBolt newのようなコード生成系サービスについて講座内で触れていきます。
【受講される皆さんへ】
今回の講座はただ動画を見るだけでもある程度学べる構成にはなっています。
ただやはり実際にAIサービスに触れる、もっと言えば課金をして有料サービスを受けて見えてくるものも多々あります。予算の都合はあるかと思いますが、是非積極的に触ってみるということをやってみてください。
そしてLPが作成できるようになったらそれを活かして実際に実務でも使ってみてください。
クラウドソーシングなどで案件獲得をしていくというのも良いでしょう。LPだけでなく業務効率化に関わることなど色々な仕事に使っていけるはずです。
質問相談ができるDiscordサーバーも用意していますので、使えるものは全部使ってご自身の糧にしてみてくださいね!
最後までメッセージを読んで頂き、ありがとうございます。
これからのAI全盛の時代に向けて、一緒に学んでいきましょう!