# Antigravityがすごい！直感的にWebサイトを修正できる？！ 5分で学べる、ハチ子のAI実践カフェ おはようございます。こんにちは。こんばんは。 この番組では、ママエンジニア、ハチ子がAIでできたことや、おすすめのAI活用法をお届けしています。 さて、11月28日、金曜日。皆様、いかがお過ごしでしょうか? 今日は、正真正銘ブラックフライデーなのかな? 月末、最後の金曜日ということで、買い忘れは何かありませんか? ぜひ、この期間に買っていただきたいのは、先日出版しました、Kindle本。 1日10分、自由を増やす。初めてのスマートフォーム。 こちら、期間限定で0円でダウンロードしていただけます。 そして、なんとなんと、Kindle無料ランキングというものがあるんですけども、そちらの3部門で1位になっております。 すでにダウンロードしてくださった皆様、本当にありがとうございます。 スマート化はいいかなという方、きっとその中には、実はスマート化がぴったりな方がいらっしゃいます。 なぜなら、私も結構長い間そう思ってきたからです。 そのくらいいいでしょうみたいな。電気とか普通にボタンを押せばいいでしょう。 リモコン?いや、リモコン立てに立っておけばいいからって思ってました。 でも、1回、いろいろその手間1つを取り除いてみると、めちゃくちゃその良さがわかります。 もうね、前には戻れない。 もちろん無理にスマート化しなくてもいいんですけど、まずはどんなものなのかなとか、どんな機械を買うのかなとか、 どのくらいお金がかかるのかなみたいなところをちょっと知りたいなという方は、ぜひこの無料の期間の間にこちらの書籍をダウンロードしてみてください。 期限は11月30日日曜日16時59分まで無料となっております。 皆様よろしくお願いいたします。 さて、今日の本題に行きたいと思います。 今日のテーマは、「アンチグラビティがすごい!直感的にウェブサイトを修正できる!」ということで、 今ね、私はUDEMYのコースの一覧のウェブサイトを作っています。 アンチグラビティを使って作成し始めたんですけども、途中で見慣れない動きをして、 結果的にですね、そのウェブサイトの修正がすごく直感的にできて、今までのCLIツールにはなかった機能だなと思ったのでご紹介します。 アンチグラビティでウェブサイトを作っていって、HTMLで今回作っているんですけど、これをプレビューしてってお願いしたんですよね。 そしたらですね、まずChromeがログインしていない状態で立ち上がってですね、Chrome拡張を入れろと言ってきます。 アンチグラビティのChrome拡張というのがあるんですね。 言われるがままに入れてみました。さすがに公式だからちょっといいだろうと思って。 もう一回プレビューしてよって言ったらですね、Chromeでプレビューしてくれたんですよ。 そしてなんかね、チカチカって動いてるからなんだろうと思ったら、なんかテストしてくれてたんですよね。 そういう機能あるんだと思って。 調べてみたところですね、いつからこれあったのか最初からあったのか覚えてないんですけど、 アンチグラビティとやり取りするチャット欄のところで、プランニングというのとファストというのを選ぶ選択肢があるんですよね。 その右隣にモデルを選ぶところがあって、最初だとGemini3が選ばれてるかなと思いますが、 このプランニングっていうやつにしていろいろやり取りしていると、どうやらいろいろ考えていろいろやってくれるらしい。 そのテストして、エラーも解消しましたみたいな報告書を出してくれるんですよね。 この報告書はウォークスルーって言うんですけど、ウォークスルーができた時にはちょっと目立つように薄いんですけど、 囲いがあって、オープンっていうボタンが出てくるんですよね。 自分が入力するラインじゃなくて、別のAIのアウトプットの中にそういうのが出てきて、 このウォークスルーをオープンすると、なんと修正した内容とか作った内容と、 あとスクリーンショットが勝手に出てくるんです。 そのページの上の方にレビューっていう折りたたみメニューみたいになってるやつがあって、 このレビューっていうのをポチッと一回開くと、サブミットコメントという欄が出てきて、 ここにAdd a messageって書いてあるので、もっとこうしてくださいって指示を出して、 サブミットってボタンを押すとその指示を出せたり、 あと勝手に出てきたスクリーンショットの上にマウスをオーバーすると、 そこにもレビューって出てきて、このレビューっていうやつを押すと、 このスクリーンショットに対して直感的に、視覚的に指示を出せるんですね。 この文言直したいなとかをピーってドラッグすると選べるんですけど、 選ぶとまたコメントを書いてみたいな欄が出てきて、 キャンセルとアッドコメントってのがあるんで、コメントを入れられるんですよね。 ボタン、私ちょうどやったときはボタンの名前がすごい長い、 ボタンにクーポンコードが入ってるみたいなボタンが出てきたんで、 クーポンコードがいりませんみたいに、 このボタンを囲ってからクーポンコードいりませんっていう指示を入れてですね、 それだけじゃ何も起きなくって、 いろいろコメントを全部入れ終わったらですね、 さらにチャット欄の一番右側、画面の一番右下になると思うんですけど、 そこにサブミットっていうボタンができてるので、 それをポチッと押すと、この画像に入れたコメントを元に修正をかけてくれるみたいです。 ちょっとまだ私も、昨日ちょこっとやっただけなんで、 もしかしたら他にもいろいろできるのかもしれませんが、 でもこれだけでもすごい便利ですよね。 この文言を変えたいなっていうときに、 例えば今の例だったら、ボタンの名前にクーポンコードが入ってるんで、 そのクーポンコードはなしにしてください。 文字だけで入れてもいいと思うんですけど、 それだけでできるのもすごいんですけど、 さらに画像で指示できる、これって言えるっていうのはすごいなと思って、 文言だったらテキストで持ちやすいですけど、 ここの隙間を狭くしてとか広くしてとか、 そういうのってエリアでパーってしてできたらいいですよね。 なので、このアンチグラビティの、なんていう機能なんだろうね。 このウォークスルーというページで、 視覚的に修正をかけられるってすごく便利だなと思いました。 ウェブサイトやウェブアプリを作られる方、 これHTMLだけじゃないのかもしれませんけど、 少なくともウェブサイトではできるようなので、 ぜひぜひお試しいただけたらと思います。 ということで、今日もここまで聞いてくださって本当にありがとうございます。 もしこの放送を気に入っていただけたら、 いいねやフォロー、コメントなど、ぜひぜひお待ちしております。 よろしくお願いします。 今日も一緒にAIでちょこっと進化していきましょう。 それでは、またね。