バイブコーディングでAIに任せても良いこと、逆に人間が考えなければいけないこと

2026年7月17日更新: 2026年10月11日

冨岡　優喜（トミークリエイト代表）14分で読めます

バイブコーディング非エンジニアプログラミング未経験 Cursor スワぽいアイまーる実践

ノートPCの画面に、AIへの短い指示とスワイプ式ニュースカードのプレビューが並んでいる。手前のスマホを指で動かす手、緑のリングの休憩タイマー、USBメモリが机にある — カード、休憩タイマー、USB。言葉にした体験を、最後は人の手で直す。

正直、最初は「バイブコーディング」という言葉を軽く見ていました。

「雰囲気で作る」という響きだけ聞くと、雑なやり方に思えたんです。

でも、スワぽいを作って、アイまーるを作って、真壁探偵事務所まで触るうちに、これは「AIに全部任せる」話ではないと分かりました。

私は、バイブコーディングを、作りたい体験を言葉にして、AIと一緒に画面や処理を直し続ける作り方だと捉えています。きれいな定義は、ここでは置いておきます。

バイブコーディングとは？私が実際にやっていること

細かいコードを書くより、「こういう感じにしたい」と伝えて、動くものを見ながら直していく。よく言われるイメージは、そんなところだと思います。

私がやっているのは、もっと泥くさい作業です。

スワぽいの最初の指示は、だいたいこれでした。

「右スワイプで保存、左でスキップ。カード1枚ずつ出したい」

設計書はありません。それでも、カード1枚が出るところまでは行けました。そのあとで、スワイプ、保存一覧、ニュース取得、ログイン、課金、と足していきました。

アイまーるでは、最初に決めたのは機能のリストではなく、「何を守るか」でした。眼精疲労対策であること。AOAが説明する20-20-20 を中心にすること。会員登録なしで使えること。記録はなるべく端末の中に置くこと。この4つは、途中で変えませんでした。

「タイマー画面を作って」とだけ頼むと、タイマーはできます。でも、休憩を忘れにくい道具にはなりません。「休憩を忘れにくくしたい」「スマホで片手でも迷わず使いたい」と書いたほうが、近いものになりました。

非エンジニアにとって、何が変わったのか

一番変わったのは、「最初の画面」までの距離だと思います。

以前なら、HTMLやCSS、JavaScriptをある程度覚えないと、動くものを作るところまで行けませんでした。いまはCursorを使うと、先に動くものを出してから考えられます。

スワぽいでは、朝にぼんやり考えていたものが、夜には動いていた日もあります。一方で、Cookie同意を入れたあとに、アクセス解析の新規ユーザーが急に0になった日もありました。同意の前に計測を飛ばす設定が抜けていたのが原因です。直すまでは、「壊れたのか、設定のミスなのか」と焦りました。

派手な機能より、こういう地味なところに時間を取られます。ニュースの重複を除くことや、90日より古い記事を出さないことといった条件も、私から言わないと、AIは入れてくれませんでした。バイブコーディングは速いですが、条件を決めて指示するのは、人間の仕事です。

AIに任せてよいことと、人間が決めること

「作れる」と「ちゃんと出せる」は、別のものです。

スワぽいでは、ニュースを全文転載していません。見出しと要約だけを見せて、本文は配信元に送る形です。著作権まわりで、おかしなことをしたくなかったからです。その判断はバイブコーディングの前に、利用規約を見るに残しています。

課金の線引きも、動くものが出てから、自分で確認しました。無料は1日50回までスワイプできて、PROは月額プランが980円、買い切りプランが9,980円です。決済はStripeとGoogle Playに寄せて、カード番号を自分のサーバーで預かることはしていません。課金や決済を自分で組むと、セキュリティ上のリスクが大きいからです。ログインはGoogleかメールリンクで、ニュースのジャンルは、テクノロジー、ビジネス、スポーツ、エンタメ、科学、政治、健康、国際の8つです。どれも、いま公開している実物のとおりの内容です。

アイまーるでは、目の疲れの記録を、外部に送らないようにしました。サイトには「AI疲労推定」と書いていますが、利用履歴をChatGPTに送って判定させているわけではありません。連続で使った時間や、休憩できたかどうかなどから、端末の中で参考のスコアを計算しています。休憩の間隔は、12〜20分のあいだで変わる設定もあります。便利だからといって、何でもサーバーに置きたくなかったからです。

ガイド記事の下書きにも、AIを使っています。出てきた文章は、そのままでは公開していません。健康の話なので、言い切りを避けて、医師の監修がないことも書きました。AOAの20-20-20の説明や医薬品医療機器等法も確認しています。医療機器ではないことも、サイトに書いてあります。出典の並べ方は実験ログ#002 に残しています。

こういう判断は、AIが勝手に決めてはくれません。

「いい感じにして」と頼むと、何が起きるか

「いい感じにして」とだけ頼むと、見た目は整っていても、なぜその画面が必要なのか分からないものが出てきます。

真壁探偵事務所でも同じでした。AIに頼むと、きれいなランディングページはすぐ出てきます。ただ、販売はBoothでやっているのに、公式サイトまで「買ってください」と押す作りになると、事務所の入口としての空気が壊れます。欲しかったのは、「ここは何かありそう」と思える入口です。ボタンの言葉も、「購入」だけにせず、「案件を開く」「報告ポータルへ」といった言い方にしています。CASE FILE OPENや調査の流儀も、先に言葉として置いてから、画面を直しました。

「誰が、どの場面で、何に困っているのか」を伝えると、かなり良くなります。

スワぽいなら「ニュースを読む前に仕分けたい」、アイまーるなら「休憩を忘れる自分を止めたい」が軸でした。この軸がないと、機能だけが増えて、散らかります。

私が実際に公開したもの

スワぽいは、ニュースをカードで見て、右スワイプで保存、左スワイプでスキップするWebアプリです。React系とTailwindで作っていて、GitHubの main にpushするとCloudflareで公開されます。

アイまーるは、20-20-20のタイマーと、目の体操、呼吸、ガイドをまとめた眼精疲労対策アプリです。React、Vite、TypeScriptで作っています。公開したあとで、メニューをホーム側にまとめ直しました。Android版も作りましたが、Google Playに出すと自宅の住所が載ってしまうので、公開は止めています（経緯はこちら）。

真壁探偵事務所は、USBメモリとWebのポータルを使った体験型ミステリーです。公式サイトは事務所の入口で、販売はBoothです。2026年10月11日の時点では、まだ一つも売れていません。USBを発送したあとに「全部差し替えます」とは言いにくい、という難しさもあります。

全部が最初からうまくいったわけではありません。計測が止まったり、アイまーるでURL末尾のスラッシュの扱いで検索まわりが面倒になったり、公開してから細かく直しています。開発の途中の名前（OptiGuard）が、コードの置き場所に残っているのも、その名残です。

それでも、非エンジニアが「自分で出せる」ところまで来やすくなったのは、確かです。

バイブコーディングについてのよくある疑問

プログラミングを一切知らなくていいの？

最初から詳しくなくても、始められます。ただ、完全に見ないまま進めるのは、やめたほうがいいと思います。エラーが出たら、そのままAIに貼る。直ったら、何を直したのか、ざっくり聞く。どの画面、どの機能が変わったかは、自分で確認する。Cookie同意のあとに計測が止まったときのように、画面のエラーだけでは分からないこともあります。数字や動きも、あわせて見てください。