100時間かかっていたWeb制作の入口を、AIはどう変えるのか?AIデザインワークショップ開催レポート

AIと一緒にWeb制作を

「ホームページを作ってみたい」と思っても、HTMLやCSS、デザイン、公開方法など、学ぶことの多さにハードルを感じる方は少なくありません。

これまでは、Webページを自分で作れるようになるまでに、100時間〜200時間ほどコードを書きながら学ぶ必要があると言われることもありました。

しかし、生成AIの登場によって、その入口は大きく変わり始めています。

AI Mateでは、5月27日(水)17時より、武蔵小山にて「AIデザインワークショップ」を開催しました。

今回のテーマは、HTMLとCSSの基本を学びながら、AIを活用してWebページ制作に挑戦することです。

目次

HTMLとCSSを、初心者にもわかりやすく

ワークショップでは、まずWebページの基本となるHTMLとCSSについて学びました。

HTMLは、見出しや文章、画像などを配置するための「ページの骨組み」です。
CSSは、色や余白、文字の大きさ、レイアウトなどを整えるための「見た目のデザイン」です。

専門的に聞こえる言葉も、一つひとつ分解していくと、Webページをつくるための部品として理解できます。

今回のワークショップでは、難しいコードを暗記することが目的ではありません。
AIにどのように指示を出せばよいのか、出てきたコードをどう確認し、どう調整すればよいのかを体験することを大切にしました。

AIデザインワークショップ風景01

完全初心者でも、美しいWebページが完成

参加者の皆さまは、Web制作の完全初心者でした。

それでも、AIに指示を出しながらHTMLとCSSを組み立てることで、その場で1枚のWebページを完成させることができました。

完成したページは、ハンドメイド雑貨のブランドサイトのような、やわらかく統一感のあるデザインです。
メインビジュアル、ナビゲーション、商品一覧、価格表示まで整っており、初心者が短時間で制作したとは思えない仕上がりになりました。

これは、AIがすべてを自動で作ってくれるという話ではありません。

大切なのは、AIに任せる部分と、人が判断する部分を分けることです。
「どんな雰囲気にしたいのか」
「誰に向けたページなのか」
「どこを直せば、より伝わりやすくなるのか」

こうした視点を持ちながらAIを活用することで、これまで時間がかかっていたWeb制作の入口を、ぐっと身近にすることができます。

完成したLPページ

参加者の皆さまからの声

ワークショップ後には、参加者の皆さまからうれしい感想をいただきました。

自分のサイトの修正までしていただき、とてもうれしかったです。

AIを使う講座は初めてでしたが、挑戦できてうれしかったです。もっとしっかり落とし込んで、自分のものにしたいです。

楽しく、効果的で、AIのすごさを実感できました。復習したいと思えるほどハマりました。

参加者の声からも、AIを使ったWeb制作は「難しいものを一気に簡単にする」だけではなく、「自分にもできるかもしれない」という感覚を生み出すことがわかります。

AIデザインワークショップ風景02

AIを“使う”から、“形にする”へ

AI活用で大切なのは、便利なツールを知ることだけではありません。

実際の仕事や発信の中で、どの作業をAIに任せるのか。
出てきたものを、どう自分の目的に合わせて整えるのか。
その流れを体験して初めて、AIは実務に活きる力になります。

今回のAIデザインワークショップは、まさにその第一歩となる時間でした。

AI Mateでは、生成AIを「使ってみる」で終わらせず、実際の業務や制作に活かせる形で学べる場づくりを行っています。

次回も武蔵小山での開催を予定しています。

「AIを使ってWebページを作ってみたい」
「HTMLやCSSに苦手意識がある」
「自分のサービスや活動を紹介するページを作りたい」

という方は、ぜひ次回のご案内をお待ちください。
生成AIの活用や、社内の業務効率化にご関心のある企業様も、お気軽にお問い合わせください。
AI Mateでは、現場の業務に合わせた生成AI活用研修・業務改善支援を行っています。

よかったらシェアしてね!
目次