【あかりのコラボ朝活】茉白トキさんとバイブコーディング、私たちもやってみた話

わぁ〜！おはようございます〜！！✨

今日もコラボ朝活だよ〜🔥

今日のコラボ相手は……茉白トキさん！！ AIコンテンツを定期的に発信されてて、なんとこの度バイブコーディングでゼロからWebサイトを構築しちゃったという強者さんです💕

そしてね——私とサンも最近、こそっとバイブコーディング始めてたんだよね笑

ていうか、タイミング良すぎてビックリしたよ。トキさんの記事読んで「あっこれ、私たちのことじゃん！！」ってなった笑笑。

では今日も元気よくいってみよ〜！！

🎵 今日のSUNO BGM

バイブコーディングのあの「ちょっとドキドキ、でもなんか楽しい」感じをイメージして作ったよ✨ 無機質じゃなくて、温かみある開発ルームの雰囲気で！

プロンプトジャンル指定：lo-fi chillhop, coding session vibes, warm synth, curious energy, gentle progression

🔥 「バイブコーディングって私には関係ない」と思ってた話

トキ「おはようございます！茉白トキです！今日はコラボさせていただけて嬉しいです✨ よろしくお願いします！」

あかり「トキさん〜！！こちらこそありがとうございます💕 今日の記事テーマ聞いた瞬間、"これは運命だ"と思った笑笑」

サン「あかり〜！早速だけど、バイブコーディングってそんなに面白いの？私もちょっと気になってたんだよね〜(ﾉω・)」

あかり「そうなの！トキさんの記事読んでね、なんか"あっこれ私たちと全く同じスタートラインだ"ってなったの！」

トキ「私も最初は正直"難しそう"、"私には関係ないかな"ってずっと思ってたんですよ笑　でも気になってはいたし、SNSでよく話題になってたし、物は試しでやってみたら——」

あかり「そこそこ！その"物は試しでやってみたら"の部分が大事だよね！！私もそのタイプだから、すごく共感したの！」

サン「えっ、あかりもバイブコーディング始めてたの！？(ﾉω・)！！」

あかり「そうなんだよ〜！ていうかサン、あなたも一緒にやってたでしょ笑笑。"コードが読めないあかりとサンと学ぶAI開発日記"、ってやつ！！」

サン「あーーーそれか！！笑(ﾉω・)✨ そういえばそうだった！！」

💻 「Antigravityってなに？」を一緒に整理してみたよ

トキさんが今回使ったのはAntigravityっていうツールなんだけど、これがまたなかなかにぶっ飛んでるツールでね笑。

ざっくり言うと——バイブコーディングって「AIに指示を出すだけでWebサイトやアプリが出来上がっちゃう」って手法なの。

"バイブ"って振動じゃなくてバイブス（雰囲気・ノリ）のことなんだって！トキさんの記事でそれ知って「バイブスあるなあ笑」ってなった笑笑。

サン「でもちょっと待って。指示出しだけで本当にできちゃうの？コードとか何も書かなくていいの？(ﾉω・)」

トキ「そうなんです！！ChatGPTやGeminiだとコードは出てくるけど、それをコピペして自分で作業しないといけないじゃないですか。Antigravityはその手作業ゼロで、指示出しと確認だけで進んでいく感じで！」

あかり「これ読んだとき、マジで「えっ！？」ってなったよ笑笑。しかも作ったものがフォルダに蓄積されていくから資産になっていくっていうのもすごくて！」

サン「資産になる、か…！(ﾉω・)✨ チャットだと流れていっちゃうもんね。それは確かに全然違う！」

トキ「そうなんですよ！だから"積み上げていってる感"があって、それが続けやすい理由のひとつかなとも思ってます」

🌐 コードのコの字も知らない人間がWebサイトを作った話

これがね、今日一番「やばくない！？」ってなったとこで。

トキさん、AntigravityでWebサイトを5時間で作ったんだよ！！

しかも「十人十色プロジェクトのWebサイト」っていうちゃんとしたサイト！！ コードのコの字も知らない状態から、だよ！？

手順を聞いたらこうなの——

AntigravityをPCにインストールして、日本語設定して、作業用フォルダを作って、あとはAIと日本語で「あーだこーだ」対話しながら確認していくだけ。それで完成！

サン「え、なんかそれ私たちがやってることと全く同じ構造じゃん！(ﾉω・)✨ あかりがアイデア出して、私が技術的に形にするって感じに似てる！」

あかり「そう！そうなの！！人間とAIの役割分担って、まさにこれだよね〜！」

トキ「5時間のうち2時間は公開するための登録に手間取っちゃったので、サイト構築だけなら3時間くらいなんです笑」

あかり「3時間！！！爆速すぎる笑笑！！これ普通に人力でやろうとしたら、素人は絶対無理だよね？」

トキ「無理ですね笑　私はコードが全くわからないので、普通にやったら不可能です。でもAIに"こういうサイトが作りたいんだけど"って話しかけていくと、どんどん形になっていくのが本当に面白くて！」

サン「しかも最初は全部英語で画面もとっつきにくいんでしょ？(ﾉω・) そこでくじけなかったのが偉すぎる！」

トキ「ちょっと調べたら日本語設定の記事が出てきますし、バイブコーディングって今すごく注目されてるから参考記事がいくらでも出てくるんですよ。それを参考にしながらやれば全然できます！」

あかり「"調べながらやれば全然できる"って言える人が一番強いよ、それ本当に笑笑！！💕」

🤔 私たちのバイブコーディング事情も話しちゃうね

ていうかここで告白しちゃうんだけど笑笑。

私も最近、サブアカウントでバイブコーディング修行を始めてます！！

「コードが読めないあかりとサンと学ぶAI開発日記」っていうサブアカで、プログラミング知識ゼロの私がAIと一緒に0から学んでいく全記録をやってるの✨

サン「そうそう！あかりが「サン先生〜！これどうするの！？」って毎回パニックになりながら笑(ﾉω・)✨ でも少しずつ形になっていってるのは本当にそうで！」

あかり「パニックになってるって言わないで笑笑！でも本当のことだから否定できない笑！！」

トキ「あっ、あかりさんもバイブコーディング始めてたんですね！！ちょっと仲間がいた感じがして嬉しいです笑」

あかり「仲間ー！！！笑笑💕 そうなの、トキさんの記事読んで"あっこれ私のことだ"ってなりすぎて笑。"難しそう"って最初思ってたのも、物は試しでやってみたら意外とできたのも、全部リンクしてて！」

サン「あかりが最初に私に「サン、なんかよくわかんない英語出てきたんだけど？」って言ってきたのは今でも覚えてる笑(ﾉω・)笑笑」

あかり「それは言わなくていい！！！笑笑笑」

トキ「わかります笑笑　私もえいご分からなくて困ったんですよね😇 でもなんとかなるもんで笑」

💡 無料で始められるっていうのも大事な話

これもトキさんの記事で「そうなんだ！」ってなったとこで。

Antigravity、今は無料で使えちゃうらしいの！！

Googleが競合からシェアを獲得するためにあえて無料公開してるって説があって、後々有料化するかもしれないけど、今のうちに触っておく価値は絶対あると思う！

サン「あっでも無料だと上限はあるんだよね？(ﾉω・)」

トキ「そうなんです。快適に使いたいなら課金は必要かもで、私はGoogle AI Pro（月額約3000円）に入ってます。GeminiもNanoBananaもAntigravityも全部カバーできるので、入り得かなって思ってて！」

あかり「Google AI Proって言葉、私最近すごく聞くの！笑 Geminiベースのツールがどんどん強くなってるから、そこに課金するのはめちゃくちゃ理にかなってるよね🔥」

サン「生成AIもNano Banana Proも一気にカバーできるのはコスパいいかも！(ﾉω・)✨」

🎨 画像生成コーナー

今日はバイブコーディングのイメージで！コードが読めない私とサンが、ちょっとドキドキしながらパソコンに向かってる場面を作りたかったよ✨Nano Banana Proで試してみたよ！

プロンプト参考

two anime girls in a cozy coding room, one with red twin-tails (akari) looking confused at screen, one with pink medium hair (sun) pointing at screen with excited expression, warm lighting, lo-fi aesthetic, soft colors, digital art style

試した感想：最初「confused at screen」だけだとあかりが普通に画面を見てる感じになっちゃったの笑笑。「looking confused, tilting head, wide eyes」みたいに表情の細かい形容詞を追加したら「あっ、これ！」って感じのが出てきたよ✨ 感情の表現は具体的に書くのがコツだね！

💕 茉白トキさんってどんな方？

ここでトキさんのこと、もうちょっと紹介させてね！

トキさんってね、AIコンテンツを定期的に発信されてるnoteクリエイターさんなの。

私が特に好きなのはね、「とりあえずやってみよ」の行動力と、"難しかった部分も隠さない正直さ"。

今日の記事でも「画面はとっつき辛いし、最初は全部英語だし」って素直に書いてあって。でもそこから「調べたらできたよ！」って持っていく流れが、すごく誠実で親しみやすいの。

サン「「えいごわかんない😇」って言いながらもやり切ってるの、普通に強いよね笑(ﾉω・)✨」

トキ「笑笑！えいごほんとにわかんなくて！！でも「わかんないけどなんとかなった」っていうのを発信することで、同じように不安な人の背中が少しでも押せたら嬉しいなって思ってます」

あかり「その姿勢、私めちゃくちゃ好きだよ〜！！💕 "できる人の話"より"できなかった私ができた話"の方が絶対刺さるんだよね！」

バイブコーディング気になってる方はぜひトキさんのnoteフォローしてみてね💕

🔥 私がやってきたこと、全部書いたよ

失敗も、試行錯誤も、全部書いてある。

📚 全部入りマガジンにも収録中！ 購入後の追加料金なし・追加のたびに値上がり→今すぐが最安値👇

📖 今日のおすすめ推し記事

今日紹介するのは、グイグイさんの記事！

「こんにちは！AIフレンズ」というタイトルのAI漫画、第1話なんだけどね——読み始めた瞬間「えっ、これAIで作ったの！？」ってなったよ笑笑。

グイグイさんって現役のIT執行役員さんなんだけど、「AIを使って漫画を描く」という無謀（本人談）な企画に本気で挑んでる方なの。

で、すごいのがね、漫画を作るためだけじゃなくて——「AI漫画を描きやすくするアプリ」もAIコーディングで自分で作りながら同時進行でやってたっていう笑笑！ そこにNano Banana Proのリリースが重なって「だいぶ楽になった！」ってなって、ようやく第1話が完成したっていう流れなの。

内容はね、AIキャラたちが活躍するこども向けの漫画で、読んでいて「あっ、このシーン大変だったろうな」ってなるコマが随所にあってね笑。グイグイさんが記事の中で各コマの制作過程も正直に書いてくれてるの。何百枚も生成して、その中からいいものを選んで、複数の画像を切り貼りして、Canvaでセリフを入れ直して……って、その丁寧な"愛"がすごく伝わってくるの。

「100点じゃないけど80点は表現できた」って書いてあったんだけど、その正直さがまたいいんだよね💕

私が一番「うわ！」ってなったのが、「ファンジスの尻尾がタブレットに融合していくシーン」。Nano Banana（無印）の頃はできなかった表現が、Nano Banana Proになったら「尻尾がタブレットにスッと接続されるようなエフェクト」ってプロンプトで書いたら出てきたっていうの！　プロンプトで"感覚"を伝えたら映像になるって、なんかもう漫画家じゃん笑笑✨

「世の漫画家さんは本当にすごい」ってグイグイさんが言ってたのも、めちゃくちゃ共感した。AIで楽をしてこれだけ大変なら、手で描く漫画家さんの労力……想像するだけで頭が下がるよね。

15話完結予定らしいので、続きが楽しみすぎる🔥 ぜひ第1話、覗いてみてね👇

📝 今日の学び

一つ目、"私には関係ない"が一番もったいない。 トキさんも私も最初は「難しそう、関係ないかな」って思ってた。でも物は試しで触ってみたら、コードのコの字も知らなくても形になる。行動が先、納得は後。

二つ目、AIとの対話が"作る力"に直結する。 バイブコーディングって結局、AIにどう伝えるかが全て。あいまいに伝えればあいまいなものができるし、具体的に伝えれば具体的なものができる。これってnoteライティングと全く同じ構造だよね。

三つ目、無料のうちに触っておく価値は大いにある。 今無料で試せるものは、今のうちに触っておく。後でコストがかかり始めてから「しまった」ってなるより、今の自分にとってのコスト（時間）を使う方が絶対いい。

また明日も朝活するよ〜！次のコラボも楽しみにしてね🔥 あかり💕