どうも、AI駆動開発ラボ大森です。
最近ですね、YouTubeのチャンネル登録者数がぐんぐん伸びています。
もうそろそろ5000人いきそうだなっていうような状態なんですけれども、
僕最近ですね、そのAIで作った嘘の特撮のショート動画が伸びているんですけど、
それを見に来てくださっている方たちに、AI駆動開発にもっと興味を持ってほしいなと思いまして、
ちょうどですね、簡単にですけど、AI駆動開発でヒーローの名前、何でもいいんですよ、キリンとかを入れるだけで
嘘の特撮ヒーロー、キリンマンの画像とキメ台詞が出てくるよ、なんていう簡単なウェブアプリをですね、
AI駆動開発で作ったりしました。
これをショート動画を見てくれている方にですね、公開して遊んで使ってってすると、
AI駆動開発ってこんなことできるんだなってすごく興味を持ってもらえるんじゃないかなとかって思ってます。
みたいにですね、今後誰でも何でもサッとですね、頭の中に思いついたアイデアを具体的に形にする。
ゲーム作ってみたりアプリ作ってみたりウェブサイト作ってみたりが、
どんどんどんどんいろんな人が多くの人ができるようになる1億総開発者時代が来ると思っています。
で、それに向けてですね、どういうことを今やってたらいいのか、これからできるようになるといいのかということをお話しします。
今回の話はですね、もしいつか自分でもゲームとかアプリとかウェブサイトを作れるようになったら楽しいだろうなとか、
お金稼げるかもなとか思われている方にお届けしたいと思ってます。
今回の話を聞くとですね、おそらくどういうことを勉強したらいいのかがわかる。
つまり、私は何ができるようになる必要があって、逆に何ができるようにならなくていいんだということがわかると思います。
そして、あ、俺でもできそうだなって多分思えると思います。
ちょっとそういう感じでですね、自分でも私でも俺でもちょっとできるようになるかもしれないな、
これができるようになったらいいんだということですね。
視針が見えるような感じでお話をしたいと思っています。
このチャンネル、AI駆動開発ラボではですね、こういう感じで、
AIに言葉ですね、日本語でこういうものを作ってくださいっていうだけで、
AIが勝手にプログラミングしてアプリとかゲームとかサイトを作ってくれるというAI駆動開発について、
僕自身がプログラミング才能なしで全くできなかったんですけれども、
そういう視点でですね、なるべくこういう思いでもできるようになったよということを、
難しい言葉を使わずにお話ししていくという放送です。
ということで、はい、じゃあ今後ですね、1億総開発者時代が来るにあたって、
何ができるようになるといいのかということを先に置くと、
CSSとUI UXのデザインができるようになったら良いです。
CSSっていうのは、HTML CSSっていう、もしかしたら聞いたことがあるような単語の並びでよく出てくるんですけれども、
ウェブサイトとかのデザインを決めるものですね。
何か設計図、この要素はこれぐらいの大きさで赤色ですよ、みたいなことを教えてあげること。
もう一つのUI UXデザインっていうのは、アプリとかのボタンはここにあったほうが使いやすいな、
ボタンこれぐらいの大きさがいいなとかっていう美術的なデザインではなくて、
少し工学的な、人間工学に基づいたみたいなそういうデザインのお話です。
CSSとUI UXデザインができるようになるといいんですよということをここからお話ししていくんですけど、
まずそもそもですね、僕が1億総開発者時代になるんだって言ってますけど、
僕がどういうものが見えていて、何でそういうことを思っているのかということをまずお話しします。
その後にCSSとUI UXデザインっていうのが何なのか、もうちょっと詳しいお話をします。
その最後3つ目に、それをどういうふうに勉強したらいいのかとか、どういうふうにやっていければいいのかみたいなことをお話しします。
よろしくお願いします。
ということでまず1つ目、1億総開発者時代ってなんだと、
どういうものを想像してどうしてそうなると思っているんだというお話をします。
まず最近の時事ネタなんですけど、YouTubeあるじゃないですか、動画プラットフォームがですね、
まだ日本では出てないんですけど海外先行してですね、
YouTube内でゲームを作って、そのYouTubeの視聴者がYouTube内で簡単にゲームで遊べるみたいなものを作って
テストとしてリリースしました。
これ12月の17日ですね。
これもAI駆動開発で、ゲーム開発だからすごいプログラミングとか必要なくて、
こういう鳥が飛んでいて、鳥を押している間だけ上昇して、鳥を離すと加工する、
そういう糸通しみたいなゲームを作ってくださいみたいなことを言うと、
AIが勝手にそのゲームを作ってくれる。
そのYouTubeのゲームプラットフォーム内でいろんな人が遊べるみたいなものを作ったりしています。
知っている人いましたか。
また他の時事ネタなんですけど、チャットGPTあるじゃないですか。
あれが何だろうな、AppleとかAndroidみたいなスマホアプリストアみたいな感じですね。
チャットGPT内にアプリを開発したものを出すと、
チャットGPTが商品棚に並べてくれるよっていうものがもうできたのかな。
年明けぐらいから一般の人でもそこに並べられるようになるよっていう時事ネタがあったり。
あと最近はiPhone、Appleのアプリストアが規制を緩和して、
とにかくもっともっといろんなアプリを簡単にみんなに触ってもらえる形で出すようになったよみたいなお話があります。
この3つのニュース、1つ目がYouTubeでゲームをみんなが開発して遊べるようになるよ。
2つ目がチャットGPTでもアプリが出せるようになるよ。
3つ目がApple、iPhoneが規制を緩和してもっといろんな人が簡単にアプリを出せるようになったよ。
このニュースは全部この開発のハードルが下がる方向に話が進んでます。
日本語、英語でもいいんですけど、言葉から何か作ったものをそのまま公開できる。
アプリとして公開できるみたいな感じになっていってます。
つまりみんな開発してみんなリリースしてねみたいなことにだんだんなっていくんじゃないかなと思ってます。
今回さっきYouTubeの話とチャットGPTの話とiPhoneの話ありましたけど、
単純にAI駆動開発ツールというか、言葉からどんどん高性能なしっかりしたものが作れるようになるためのツールというのも
どんどんどんどん出てきてどんどんどんどん性能も上がっているので、
やっぱりそういう方向でも1億総開発者時代にはなっていくんじゃないかなと思っています。
つまりその時代において乗り遅れない、乗りこなす、いいポジションを取るためにはやっぱり開発者、開発できる人になっておくといいと思ってます。
この話が一つ目。こういうニュースがあるから1億総開発者時代になると思っているんだという話ですね。
2つ目。じゃあそういう時代になるとして、私は今どういうことを勉強してどういうことができるようになる必要があるのかということをお話ししていきます。
まず結論としてCSSとUI UXデザインなんだということを最初にお話ししました。
それぞれもうちょっとだけ改めてわかりやすく説明します。
まずCSSというのはアルファベットが出てきて怖いよ、俺できないよという方がいると思いますけど、
これ大盛りの認識ですけど、プログラミングって考えているいろいろあるじゃないですか、ターミネーターみたいな緑色のアルファベットが流れてくるようなものよりももっともっと簡単でどちらかというとパズルのようなものに近いと思っています。
このCSSというのはウェブサイトとかを人間が見えやすいようにする、色をつけたり要素の場所を変えたり大きさを変えたりするみたいなデザインの指示をする用語というか概念なんですね。
HTML、CSSというのがウェブサイトを作るという勉強をするにあたって一番最初に通るものです。
僕も何年前ぐらいかなウェブ開発できるようになるぞというときにまずそこから勉強しました。
これどういうものかというとHTMLというのがこのサイトにはこういう文字があってこういう情報が入りますよというもの。
その文字の大きさとか配置とかボタンのデザインを指定してあげるのがCSSなんですね、HTMLとCSS。
これは大盛り目線ですけどとてもプログラミングって皆さんが想像しているものと比べて簡単です。
簡単です。少なくとも大盛りは簡単だなと思いました。
逆に言うとHTML、CSSはできたんだけどプログラミングはできなかったなという大盛りの体験からの逆説の話なんですけど、このCSSですね。
もう一つがUI UXデザインというものがあって、UI UX、ユーザー体験とユーザーインターフェースというリアクションを説明するとそうなんですけど、
アプリとかで説明がなくてもタップするとホーム画面に行くんだとか、こういう風にスワイプすると次に行くんだとか、
あとは何だろうな、ボタン、ホームボタンに家のアイコンがついてたらホームボタンに行くんだなってわかるんですけど、
ホームボタンに例えば炎みたいなアイコンがついてたら何するんじゃいってなっちゃうと思うんですけど、
こういうような人間がアプリとかを使う上でどうしたらもっとわかりやすく使ってくれるかなみたいなことを考えるデザインの話なんですね。
これがしっかりできてるとすごく使いやすい、使ってて楽しいっていう風になるし、それがあんまりできてないとどこに何があるかわからないし、
次俺何したらいいかわからないよみたいなことになってしまうっていう概念なんですね。
だからCSSとUI UXデザインができるようになる人があると思ってます。
それぞれの共通点ってデザインなんですよ、デザイン。
CSSもデザインを起こすもの。
UI UXデザインはデザインがどうあるべきかを考えるものなんですね。
なんでオモリはデザインができるようになる人があるのかということをお話ししていきます。
まずプログラミングはできるようにならなくていいのかという問いに対しては、できるようにならなくていいと思ってます。
なぜオモリがプログラミングができるようになる必要がなくてデザインはできるようになる必要があると思っているのかを言うと、
プログラミングっていろいろなケースがあると思うんですけど、だいたい最適解が決まってるんですよ。
こうなっているとセキュリティ的にも問題ないし、パフォーマンスですね、速度とか的にも問題ない、見やすいみたいなベストな答え、唯一の正解っていうのがありやすいんですね。
もちろんどこで使うアプリなのか、人が使うのか会社が使うのか、または会社内で使うのかいろいろあると思うんですけど、比較的最適解が分かりやすい。
逆に言うとデザインっていうのは最適解が分かりづらいんですね。
いやいやでもデザインもいいデザインと悪いデザインは分かるじゃん。
それはそうなんですけど、いいデザインの中にもめちゃめちゃいろいろあると。
なんで、つまりAIはプログラミングが得意だけどデザインが苦手ですというお話をしているんですけど、じゃあなぜデザインがAIは苦手なのかというと、
デザインっていうのは西洋画みたいな美しいねではなくUI UXみたいな機能的な工学的な意味があるものに対しては、
使い方を絞るというかどんどん削いでいく。
ユーザーがどういう画面になっていたら一番使いやすいかということをですね。
このユーザーは若者だ。若者でこういうアプリに慣れているからこういうUI UXデザインにするぞみたいな。
他の可能性、高齢者が使う可能性もあるしとか、別のアプリ使っている可能性もあるしみたいな可能性を削いで削いで、
一つこの人がこうだったら一番使いやすいっていうふうに決める、フォーカスする必要があるんですよ。
それを考えるにあたって、とにかく把握していないといけないことが多すぎる。
今どういうアプリが流行っているのかとか、そのユーザーの人たちはどういうような考え方をしているのかとかですね。
とにかくいろいろなことをですね、感覚とか経験とかによるんですけど、
そういうことで一つのデザインというところに落としていくっていうのが、
多分デザイン、ソフトウェアのデザインにおいて一番いいんじゃないかなと思っているんですけど、がAIが苦手です。
特に知らないといけないことが多すぎるし、何を重視して何を重視しないかっていうところの線引きがAIは難しいんですね。
少なくとも今はあと多分3年5年というか、AIの性質上難しいと思っているんですけれども。
どうやってそのCSSとUI UXデザインを勉強すればいいのかっていうことを三つ目、最後のブロックでお話をします。
CSSあまり具体的なものとしてお話をして、概念としてHTMLっていうものでサイトの情報とかテキストを決めて、
それを色とか位置とか大きさを配置するために使うんだよCSSっていうのはって言ってるんですけど、
もうちょっとだけもうちょっとだけHTMLもCSSも知らない方向けに、
でもなんとなくこういうものなのかなっていうことを分かりやすく言うと、
本当にパズルみたいな感じです。
ここの文字は12ピクセルという大きさで白色で文字に影がついていて横並びになっていますよということを英語で書くみたいな感じですよ。
フォントサイズイコール12ピクセルとかカラーイコール白みたいなふうに書く。
これプログラミングっぽく聞こえるんですけど、なんだろうな、翻訳作業に近いと。
なのでプログラミングだと恐縮して私俺できないって思わなくていいと思っていて、
僕がウェブサイト制作を勉強しだすの時に一番すごく入門として役に立ったサービスがあって、
Progateって言うんですけど、P-R-O-G-A-T-E、プロゲートっていうものがあります。
これ無料でもある程度使えるんですね。
無料で使える範囲で買ったので全然大丈夫だと思ってるんですけど、
とにかく初心者に分かりやすいようにゲーム感覚でここにこういうふうな文字を打ってみよう、やった文字の色変えれたねみたいな感じで書いてくれてます。
これすごくすごくすごくおすすめです。なんだろうな、怖くなくやり始められます。
やっぱりプログラミングのやつって教材とかYouTubeとか文字とかあるんですけど、
初心者の人、怖いってなっちゃうなと僕は思ってたんですけど、
すごく忍者の犬のキャラクターがいて、このマイステップすごく褒めてくれるんですね。
やったねーみたいなことを言ってくれるのでめちゃめちゃよかったです。
これでCSSをちょっと触ってみてほしいなと思います。
UI、UXデザインすごく難しいんですよ。
勉強する理論みたいな、パッケージングされて勉強できるってなかなかないんですけど、
これはですね、僕がすごく大事だと思う。
美を見極める、審査する目ですね。
神秘感を養う。
つまりこういうアプリってこうだった方が使いやすいよな。
これってめちゃめちゃデザイナーじゃなくても普通の人でも思える。
アプリとか使ってて、うわ、これなんか全然生きてないなとか、
めちゃめちゃ使いづらいじゃんって思ったりしたことあると思うんですけど、
それがもうUI、UXデザインの神秘感の話なんですね。
つまりこの今UI、UXデザインっていうのがあるんだっていうふうに、
頭の中の概念として生まれたと思うんですね。
その状態でですね、これからウェブサイトとかアプリを使うっていくと、
何かこれ使いづらいなって思ったときに、
ちょっとこれUI、UXデザインってあつかって思えると思うんですよ。
たときにちょっとだけ、これなんで使いづらいんだろうなって思うようにできればしてみれると、
それだけでですね、どんどん自分のUI、UXデザインのステータスが上がっていくと思うんですよ。
つまり何がダメだからこれが使いづらいのかが分かると、
じゃあこれをこうしたらいいんだとかが分かる。
それってUI、UXデザインだよねというようなことです。
これかなりですね、何だろうな、福利的にどんどんそういうふうな心がけで日常を過ごしているだけで、
いつの間にか何かが積み上がっていくようなものなので、
めちゃめちゃコスパがいいというか、
ぜひ今のうちからですね、UI、UXデザインっていうのがあるんだと、
頭の片隅に置きながらいろいろスマホとか触ってもらえると、
自然といろいろ勝手に経験値が溜まるんじゃないかなと思ってます。
で、CSSはProGateっていうサービス、無料で使えます。
有料、1ヶ月だけ、無料版を使い切ってもっとやりたいぞって方は1ヶ月だけ入って、
1ヶ月1490円ですけど、1ヶ月だけ入って、
もうその間にガッと全部やるとすごくコスパがいいと思ってます。
CSSはProGateで勉強して、UI、UXデザインはそういうUI、UXデザインっていう概念があるんだなと思いながら、
日々スマホとかを触ってもらえると自然と経験値が溜まると思ってます。
これがお話ししたかった3つ目ですね。
4つ目に、ちょっとCSSって知ってるし、なんとなくわかるし、UI、UXデザインなんとなくわかるっていう方向けに
少しだけ上級というか少しだけ踏み込んだことを言うと、
これちょっとプログラミング知ってる人向けになるんですけど、
CSSからもうちょっと発展して、テイルウィンドっていうのができるようになると、とってもいいです。
CSSって、なんだろうな、こういうテキスト、こんにちはっていうテキストがあると、
そのこんにちはっていうテキストにタグ付けをするんですね。
挨拶、ハローみたいな、ハローっていうタグ付けをすると。
そのタグ付けをしたハローはこういうフォントを使って、こういう大きさで、こういう色ですよってことを書くんですけど、
それの書き方の一つにテイルウィンドっていうのがあるんですね。
これ僕もいつぐらいでも、1年半前ぐらいにこれはやったほうがいいぞと思ってやりだしてもできるんですけど、
めちゃめちゃAI文脈で使われてます。
例えばGoogle AI Studioっていう無料で使える日本語だけでウェブサイトとかウェブアプリ作れるめちゃめちゃすげえコスパがいいやつあるんですけど、
そこでもテイルウィンドが使われてます。
テイルウィンドっていうのはタグ、このハローっていうのはこういう要素ですよっていうんじゃなくて、
ハローは文字サイズ12の要素と文字色が白の要素というのがあるよって書いていく感じなんですね。
全く知らない人は何が違うねんってもし思われたらそれでいいです。
そんなに変わらないとかそんなに難しい話じゃないんです。
やり方の違い、考え方の違いだけなんですけど、
とにかくAI文脈で何か駆動開発をしたりするときにテイルウィンドがめちゃめちゃ使われてる。
めちゃめちゃ使われてます。
テイルウィンド、すずり、T-A-I-L-W-I-N-D、テイルウィンドって言うんですけど、めちゃめちゃ使われてます。
これができるようになるだけで何かAI駆動開発でポンって出てきたものの、
ちょっとここのフォントサイズが大きいほうがいいぞとか、このボタン、緑色のほうが分かりやすいぞ。
UI、UXデザインの概念ですね。
パッと反映できるようになる。
それができないと、CSSもできないとボタンを緑色にしてくださいみたいなことを言って、
AIがちょっとやって、できましたみたいに返ってきて、この一往復がいるんですけど、
自分でCSSないしはテイルウィンドができるだけで、
緑色のほうがいいな、書き換える。
緑だ、いいな。
もうちょっと濃いほうがいいな。
自分でできるようになる。
これだけでデザインどんどん変わって、とてもいいものになっていくと思ってます。
テイルウィンドも知ってたからCSSを勉強しました。
勉強してます。
知ってますって方、ぜひテイルウィンドもできるようになってください。
これですね、メインのお話は終わります。
3つの話、4つの話をしました。
今回のお話でですね、僕が一番伝えたかったことは、
今プログラミングできないよとか思っている方、
これからですね、あなたがウェブサイトとかゲームとかアプリを作れるようになるために、
難しいプログラミングとかは勉強する必要なくて、
もっともっと簡単なことをですね、書き起こすみたいなCSSみたいなこととか、
どういうのだったら使いやすいんだろうなっていう、
UI、UXデザインみたいなことができるようになるだけで、
あなたもとても楽しいものが簡単に作れるようになりますよっていう、
そんなに難しいことじゃない、怖いことじゃない、
あなたの実績にその1億総開発者時代の開発者になれるぞという道があるんですよ、
ということをお伝えしたかったです。
自分が想像したものをですね、作れるってめちゃくちゃ楽しいので、
その楽しさをぜひとも感じてほしいなというような思いから、
このお話をしています。
これをここまで聞いてくださった方にですね、
してほしい小さな一歩としては、このProGateですね、
アカウント登録してみてください。
ちょっとハードル高いんですけど、無料でできます。
アフィリエイトとかは全くもらってないですけど、
メールアドレスでも登録できるし、Googleアカウントとかでも登録できます。
登録するときは全然無料です。
このProGateでCSSっていうのが勉強できます。
HTMLも勉強できるし、もしもっともっと興味がある方は、
JavaScriptっていうものとか、あとはPythonとかいろいろあるんですけど、
すごく実践的なものがあるので、これ見てみてください。
本当に忍者の犬がキャラクターなんですけど、かわいいので。
ちょっと忍者の顔を見に行くかついでに、
ProGate、P-R-O-G-A-T-Eと検索していただくと一番上に出てくるのかな。
できれば無料で買いに登録してみてください。
そうすると、森が言ってた通り、CSSってあまり怖くないなと思えると思うので、
そうしていただければすごく嬉しいです。
AI駆動開発ができるようになって、めちゃめちゃ楽しいと。
結構ずっと、小さい頃発明家になりたいなとか思ってたりしたり、
こういうのがあったらいいのにな。
ゲームもしここがこうだったら楽しいのになみたいなことを思いながら、
でもプログラミングできねえみたいな。
俺の人生の道にはねえみたいな。
もっと遠い世界だと思ってたんですけど、
本当に去年一昨年ぐらいからやってやり始めてできるようになって、
本当にめちゃめちゃ楽しいです。
ゲームで遊んでるのに仕事になってるというか、
何か現実世界が変わってるというような感覚がして、
とにかく楽しいので、
本当に作る楽しさっていうのをぜひぜひ多くの人に知ってほしいなと思いながら、
こういう発信をしております。
ここまで長々30分ぐらいお話ししましたけど、
ここまで聞いていただけた方、ご清聴どうもありがとうございました。
もし今回のお話がよかったよ、参考になったよ、なるほどなと思ったよって方、
ぜひいいね、高評価みたいなことしていただけると思われてる100倍嬉しいです。
これだけの人の心に止まったんだなと思って、
発信頑張っていくぞってなるので、よければポチッと押していただけるとありがたいです。
また今回のお話でですね、よく分かんなかったよ、これはどうなのって思われる方、
質問等々ある方はですね、ぜひコメントいただければですね、
コメントないしはまた別の放送としてお話ししますので、
ぜひ気軽にコメント書き込んでいただければと思います。
ということで、ここまでご清聴いただきどうもありがとうございました。
AI駆動開発ラボ大森でした。
また次回の放送でお会いしましょう。またね。