メインコンテンツへスキップ
見出し画像

B2Bセールスの私が、自社SaaSの「仮想敵」を作ってみた話: 何をどうやって作った?編

    takehiroです。

    世の中、バイブコーディングという言葉が流行ってきています。生成AIのClaudeによって、これまで以上に手軽にアプリ開発ができるようになってきて、いろんな人が触り始めたタイミングかと思います。

    そんな中で、非エンジニアの私がSaaSプロダクト開発にチャレンジしてみました。B2Bセールスの私が、自社SaaSソリューションの「仮想敵」を作ってみた話と題して、3本のnoteでまとめます。

    ①何をどうやって作った?編
    バイブコーディングもどきで「こんなことできないのかなー」というアイデアをアプリで実際に作ってみた流れについて、時系列に沿って説明します。作ったプロダクトや、プロダクトに付随するスライド作成なんかにも触れてみたいと思います。

    ②なぜチャレンジしたか?編
    B2Bセールスの立場にあって、プロダクト理解を深めようとした時に「自分で作ってみるか」と考えたのが今回の話のきっかけになっています。日々のセールス活動から、なぜこのようなTryに繋がったか語ります。

    ③思想とプロダクトコンセプト編
    ここは、今回作ったプロダクトの中身を少し深掘りします。企業のグローバルビジネスを強化する「貿易コンプライアンス」という領域に対して、AIをどう活かしていこうと考えたかを解説します。

    今回は、①何をどうやって作った?編です!実際に作ったのはAI判定を行うSaaSプロダクトです。今もまだ改良を重ねていますが、6つのモジュールにサポートAIを載せたプラットフォーム構造となっています。

    今回のnoteでは、特に初期コンセプトのPoCやMVP作りの辺りを中心に話しつつ、最後には現在地としてのプロダクト紹介をします。非エンジニアがわからない事だらけでモヤモヤしながら作っていったドタバタ劇と思ってみていただけたら嬉しいです。


    簡単に今の仕事と扱っているプロダクトの説明

    私は現在、トムソン・ロイター(ニュースでよく出てくるロイター通信の会社です)で国際貿易ソリューションに携わっています。この領域は、昨今のトランプ関税などの企業に対する影響に強く関連します。

    私はこの中でB2Bセールスとして、特に海外拠点や販路を大きく持っている大企業の皆様をメインにやり取りさせていただいています。貿易コンプライアンスは、ヘタすると巨額の追徴課税(直近で300億円超レベルの制裁金事例)、貿易停止、ブラックリスト化など、グローバルマーケットにおけるビジネスインパクトが計り知れません。複雑で、日々変化する世界の法規制と自社のビジネスの突き合わせを「日常的に」「自動化」して「リスクを検知」することで、攻めの国際通商をサポートするのが私の担当するソリューション領域です。

    プロダクトはグローバル法規制コンテンツと、業務プラットフォームによるSaaSです。顧客の基幹システムなどとの連携も柔軟に対応するため、単なるSaaS売りではなく開発構築要素も割とあって、しっかりしたValue Propositionがモノを言う世界です。

    今回の仮想敵を作ろうとした背景にも繋がりますが、輸出管理の世界は複雑で難易度の高い法規制データを扱う領域です。かつ単なる調査ではなく「高度な判断」を求められる専門性の高い複雑な業務が担当者には求められています。

    AIがどこまでサポートできるだろうか、という問いに対して、構造化された法規制データと非構造データである企業のトランザクションの突き合わせによるハイコンテクストな業務判断の連続業務はとてもチャレンジしがいのある領域です。しかし、なかなかすぐにプロダクトが改善したり、開発されるわけではありません(外資だから、と言うだけが原因ではないと思う)。

    そこで、現場で顧客の声を直接聞く機会の多いセールスパーソンが、VoCを車内にテキストだけで伝えるのではなく、絵を描くだけでもなく、動きもので伝えたいと思ったのがプロダクトを作ってみようと思った経緯です。さらに、現場で出てくるアイデアを最短で最小に検証するためにも、いろいろやってみようと考えて手を動かしたのが2025年末のことでした。


    プロダクト開発への挑戦

    まずはchatGPTに相談

    日頃セールス活動を行う中で、こんなことできないのかなーというものをchatGPTに日々壁打ちすることが多かったです。2025年も暮れにかかる頃、顧客からのリクエストが強く、且つたくさんあるにも関わらず、自社開発がなかなか進まない領域がありました。そこに対してAI活用して「こんなことできないか?」と相談してみたことが今回のプロダクト作りの最初の一歩になりました。

    画像
    最初の方にchatGPTにぶつけてみた内容。当初から、特許をうまく使えないだろうか?と目論んでいて、発想をそのままぶつけてる

    このスレッドには、この後莫大なやり取りが続いていくのですが、なんかだんだんとchatGPTがコンセプトをPoCレベルで勝手にコーディングし始めました。このタイミングでは、私はあまりモック作りを狙って壁打ちをしてきたわけでは無いのですが、せっかく面白そうな提案が来たので試しに実装してみようとなります。

    元々少しPythonを触っていて、前職でSaaSプロダクトを扱った際にWeb開発にも興味を持ち、そんな流れでFastAPIによるWebアプリ作りの本を何冊か読んだり、実際にコーディングしてみたりやっていました。せっかくやるならばこれで行こうと思い、やり取りしたスレッドの内容を切り替えてFastAPIベースでのモック作りを始めました。

    いわゆる「バイブコーディング」の走り始め

    セールスなどビジネスサイドでエンジニアでも無い人間がコーディングをやるのはハードルが高いです。一方で、日々の顧客対面とプロダクトの狭間で「こういう事ができたらもっと貢献できるのにな」と思う瞬間は沢山あるはずです。

    これらを言語化してchatGPTに伝えて、やり取りして、それを動きモノにしてもらう作業を「バイブコーディング」の簡易的なものというか、そうやって作り始めました。自分のPC (Intel Macの古いMacbook Air)でアプリ開発環境であるVS Code(多分今回の話を一番わかりやすく理解していただけるサプーさんの動画を引用)に、chatGPTが書いてくれたコードをコピペします。ターミナルなんてほとんど使った事なかったけど、起動コマンドとか色々覚えていきました。(Git管理もだんだんわかる様に。。)

    chatGPTが作ったUIがシンプルで綺麗だったのは驚きで、見た目はほぼこのままで良さそうなものが出来上がりました。

    さて、大変なのはここから。。。

    動かない、直らない、伝わらない

    chatGPTは、割とこちらの意図を汲んでくれて良い提案を出してくれます。それに基づいてコーディングしてくれるので、基本はそのままVS Codeにコピペすれは欲しい機能ができます。ただし、後からちょっと違うことを追加したり、気になるところを直してもらった途端にエラーが出て作ったアプリが起動しなくなります。

    非エンジニアは「デバッグ」が出来ません。つまり、エラーが出ても自分で直せないんです。

    画像
    全てをAI任せにはできない、、、非エンジニアの苦悩

    開発環境に直接紐ついていないchatGPTに相談しても、なんか的を得た解決法を示してくれず、やり取りしている間にchatGPTのスレッドが超絶長くなり、ブラウザが落ちるようにもなってきました。完全にAI任せではしんどいなーとか、これを言い訳に古いMacBook Airを新しいCPUを詰んだMacに買い替えちゃうかなど、色んな思いが巡りました。

    それを経て、なんとか最初に作れたのが2つのアプリです。

    ①品目管理UIアプリ
    企業が自社の製品や、その構成品を管理する想定のデータベースで、法規制データによるリスク審査結果などを紐つける、いわば土台になるもの。

    ②AI判定アプリ
    貿易コンプライアンスの世界で重要な「該非判定」という、法規制と自社製品の突き合わせから審査判定するものをAIで自動化する試みです。ここに、通常のアプローチとは違う特許×輸出管理というチャレンジをしてみたのが今回の肝です。

    PoCからMVPへ

    まさにコンセプトを壁打ちし、動く形になった時には感動しました。FastAPIで作っているので、Google Chromeで開いでブラウザ上で動作を確認します。UIは結構イメージしていたものができるもんだなと嬉しくなりますが、法規制+特許に対するインプットデータの突き合わせと言うアプローチにおいて、いくら突き合わせのモデルを磨き込んでも、当てる先のデータセットがゴミだったら結果もゴミしか生まれません(まさに、GIGO: Garbage in, garbage outです)。

    ここから先は、FastAPIの開発と並行して、できる限り良質なデータセットを作っていこうという修行が始まります(これは今でも続く終わらない旅になります)。

    データセット作成には、正しい情報収集が欠かせないため、日頃からお世話になっている課金済みのPerplexity AIにはかなりお世話になりました。正しい情報をAIが集めて、気合と根性でスプレッドシートを加工して、アプリ内で使えるデータセットの形にしていきました。JSON型でインデックスを作る作業です。

    このおかげで、AIの判断を「ただ似たものを突き合わせた結果だけ返す」モデルから、「判定根拠を提示して判断を補助する材料を返す」モデルに進化させることができたので、ここが今回のアプリ開発の生命線になりました。

    Claude Codeデビュー

    最初の2つのアプリを作る段階で、chatGPTのスレッドがものすごいテキスト量になっていきます。これは当然で、コード生成もデバック用のエラーメッセージも、何でもかんでもスレッドに入れていたので、PCからブラウザのchatGPTのスレッドを開くたびに落ち、リロードしてまた落ちての繰り返し。。。正直、無駄な待機時間とイライラで年末年始の時間が溶けていったものです。

    そのタイミングで、話題になり始めた生成AIツールのCalude Codeかなり良さそうだと色んなところで見かけるようになり、思い切って26年1月末に課金して使い始めてみました。VS Codeの拡張機能でClaude Codeを開いて、チャットするだけでコード生成もエラー修正も開発計画も全部やってくれます。しかも、VS Code内で開いていることもあってかchatGPTみたいに落ちることもなく、スムーズにスラスラと開発が進むじゃないですか。これはもっと早くやるべきだった、、、

    画像
    セールスパーソンだからこそ、解像度高く「これを実現したい!」という想いを持っている
    Claude Codeがそれを少し実現に近づけてくれるかもしれない。

    chatGPTを手放せなかった理由の一つに、パーソナライズが気に入っていたことがあります。これまで色んな相談をしてきたので、私の質問の意図を汲んで、GPT-5.2なんかはすごくポジティブに回答を返してくれて、良き理解者だと思っていたので切り替えの踏ん切りがつきませんでした。

    しかし、Claude Codeもかなり初手から意図理解してくれました。ここまでchatGPTで作ってきたプロジェクトの内容を引き継ぎ文章としてまとめ、それをClaude Codeに読ませたら、ちゃんとこれまでの開発方針とか理解してくれました。完全によきパートナーが完成したため、やっぱり早く環境を切り替えておくべきだったなと。。

    一点注意は、Claude Code (Claudeも共通します)は時間ごとに利用上限がかかる制約があります。調子に乗ってハイコンテクストな依頼ばかりしてコーディングをバンバンやっていると、すぐ制限に引っかかって数時間単位で利用停止状態になります(5時間単位でのトークン量制限だったような)。つまり、ノリノリのタイミングでいきなり足止めを食うのが痛いです。

    実際、そんなに莫大な量を集中してアプリ開発しないので、プランを最上級にするなどは必要ないですが、コーディング→アプリ起動→エラー修正→アプリ再起動などを繰り返していると、割とすぐロックがかかります。

    画像
    実際のVS Code開発画面。右側のチャット欄に思いの丈を綴ると、Claude Codeがよく理解して実現してくれます。こうやって作業報告とかもわかりやすくまとめてくれる。

    単体アプリからプラットフォームへ

    現在は、最初に作った2つのアプリをプラットフォーム上のモジュールとして稼働させています。このプラットフォームには合計6つのモジュールと、AIアシスタントを作って配備しています。チャットボットのようで、単なる一問一答ではなく意図を理解してアクションを導いてくれる「AI先輩」です。

    プラットフォームにすることで、モジュール間の連動性が高まりました。例えば、R&Dプロジェクトモジュールで起案した新規プロジェクトのコンプライアンスリスクを判定するために、ワンクリックでAI判定アプリにタスクが飛んで、返ってきた結果が表示されます。他にも、登録した品目データ(製品のスペックなど)からAI判定を行ったり、取引審査起案を連動してデータを引き継いだりすることができるようになりました。

    画像
    基本的なプロダクト構成。業務が求める機能を各モジュールに託しつつ、データ周りはプラットフォームで統合的に管理する方針。セールス場面で、データが分断されたりAIで統合的に操作できないフラストレーションがあったので、それを解決したくてこういう構成に。

    B2Bの業務は多くの場面で「単発」ではなく「連動」しています。しかし、多くの企業がシステムを内製化するときに、単独の機能の効率化にとどまった設計になっています(つまり部分最適化)。これは、各業務単位で見たときの機能要件が異なるため、業務理解があまりない状態でIT設計してしまうと狭いスコープで「効率化」だけをピンポイントで狙ってしまった結果ではないかと思います。だからこそ、業務に対する解像度がある程度は高い人が(簡単に)MVPを作って検証を回せる新時代のAIアプリ開発は重要になると信じています。


    プロダクト開発だけじゃないAI自動化の驚き

    今回の開発を進めてみて、せっかくだからプロダクトのLPとかセールス資料を作りたいなと思い、チャレンジしてみました。

    まず最初にやってみたのがLP作成。これが驚くほどカッコよく出来上がりました。試しに公開してみたのでみてみて下さい!

    セールススライドも作成しました。これには2つほどコツがあります。ただスライド作成をClaude Codeで依頼しても、多分納得いく内容にはなりません。

    ①まずHTMLでスライドテンプレートを作成してもらう

    画像
    実際に作成したスライドテンプレートのHTML。ちゃんと16:9でスライド1ページ分いレイアウトを納めて作ってくれています。

    これはLPを先に作成した恩恵もあったのですが、いきなり「スライド作って」と指示するのではなく「LPをスライド化して」と頼んだことから偶然辿り着きました。こうすることで、レイアウトも綺麗にできて、全体でのまとまりもおさまりも良くなっています。

    ②Python-pptxを使う

    画像
    Python-pptxで作ったスライドをGoogleスライドで開いた時の一枚。かなりレイアウトも整っていて、すぐに使えるレベル感。

    HTMLを最初に作ってスライド化する作戦はかなりよかったのですが、いざそれをスライドに書き起こしたときにしっくりきませんでした。この時、HTMLを直接Googleスライドに転記するようにClaude Codeに指示を出していました。頑張ってAPI繋いでやってくれたのですが、フォントサイズなどが綺麗に合わず、修正の手間が結構大変でした。

    そんな中でいい方法はないかな?と探して出会ったのがPython-pptxというPythonライブラリです。これは、Pythonからパワーポイントファイルを操作できるライブラリで、Claude Codeに「python-pptxでHTMLをスライド化させて」と伝えただけでササッと綺麗なスライドを作成してくれました。(ササッと言っても、実はスライド化のためのスクリプト作成とかは結構時間がかかってます、Claude Codeが書いてくれていますが)

    内容はちょっと修正が必要ですが、手をつけてない状態でのファイルと参考までに共有します。セールスdeckを作ってくれという依頼での納品物です。

    もう一つ作ったコンテンツは仮想的な事例記事と開発ストーリー記事。それぞれを対外的なインタビュー記事とオウンドメディア記事をイメージして作成してみました。これも、なかなか面白いものができています。

    こちらが事例記事。

    こちらが開発ストーリー記事。

    こんなことまでできるのね、と面白半分で作っています。


    今回やってみた学びと次の話に向けて

    元々少しPythonをかじっていたり、普段から自社プロダクトをデモしまくってるスタイルの私なので、プロダクト思考は一般的なセールスパーソンより強いかもしれませんが、それでもかなり手軽に「こんなことできないのかな」を検証可能な形にできる世の中は本当にすごいです。

    セールス活動を行っていると、どうしてもプロダクトに対する要求が通らなかったり、顧客の悩みをもっと解決したいという狭間で苦しいことも多いかと思います。その中で、自分でSaaSを作ってみて感じたのが以下の点です。

    ①すぐできるんだけど、すぐには使えない
    繰り返し書いている通り、Claude Codeでかなり高速にモックを作ったりアプリを検証可能なレベルにすることはできます。ただし、実際は作るよりも直す作業のほうが圧倒的に時間がかかっています。chatGPTで書いたコードをVS Codeにコピペしていた時期は本当に地獄で、エラーが出るたびにその内容をchatGPTに貼って、修正を行って、でも全然直らなくて、、、の繰り返しでした。

    VS Code内のClaude Codeは、このエラー修正まで指示一つでやってくれますが、それでもアプリ開発をしていると過去の開発内容の負債が出てきたり、追加開発が他のモジュール機能やデータテーブルと不整合を起こしてアプリが起動しないことが頻発します。「早く検証を回す」ことに意味があるということがよーーーくわかりました。だから、本当は日々のビジネスでも早く顧客に当てられる機能を出して、グルグルと検証を回してもらいたいんですけどね。。。

    セールスの皆さんが簡単にできるでしょ?といってプロダクト側に投げているリクエスト、多分どれもめちゃめちゃ大変ですよ、、!

    ②コンテンツ is King、改めて
    今回作成したソリューションの特性上、グローバル法規制データというコンテンツが機能精度の肝になります。AIマッチングのための技術も結構こだわって作っているのですが、対象になるデータセットがちゃんとしていないと、当然良いアウトプットは出ません。

    AI活用でアプリの話になったときに、どうしても「機能」ばかりハイライトしてしまいがちです。これはセールスパーソンが商談の際に「機能」ばかり説明して案件が全然前に進まないのと同じ流れですが、どんなに外っ側が良くても、根本的な中身が最高級になっていないと、B2Bの実務では全然使い物にはなりません

    こういったB2Bの業務アプリだと、顧客側のデータの持ち方やアプリへのデータの入れ込み方も重要になりますが、最高級のコンテンツを持っていることは価値が高いことだと深く実感しました。

    ③お金とって安定的に顧客のビジネスを動かすプロダクトの凄さ
    勘違いしてはいけないのが、素人がサクッと作ったアプリに対して、簡単にB2Bの大企業が大金を叩いて買うなんてことはないということです。

    プロダクトとして挙動が安定していて、データがセキュアな環境で守られ、サポートがあって、、、など、買い手企業の意思決定において、自社ビジネスに利益になるソリューションでないと導入決裁されません。これはB2Bセールスを最前線でやっているセールスパーソンであれば、痛いほど実感していることです。

    どんなに素晴らしいアプリができたとしても、それはやはりMVPでしかないと思ったほうが良いです。それでも、顧客の真のニーズを引き出し、解決すべきペインと解決によるベネフィットを今まで以上に解像度高く提示できるのであれば、このようなプロダクトを作ってみて顧客との議論に活かしていくのはセールスとしてのレベルアップと成果の向上につながっていきます。

    プロダクト側のメンバーにも、顧客の言いなりになれというわけではなく、顧客が何を価値として捉えてお金を払ってでも使ってくれるのか、考えるきっかけになってくれたら嬉しいです。

    画像

    今回は主として「やってみた」の内容でしたが、次回はセールスパーソンがどこまで「プロダクト思考を持つべきか?」を少し掘り下げていこうと思います。

     
     
    UMass MBA 13期 | 理学修士(有機化学) | FP2級 トムソン・ロイターの国際貿易管理プロダクトのBDM 赤羽のご飯屋巡りとカメラとDJが大好きです LinkedIn → https://bit.ly/2Pb0BlC 個人サイト → bit.ly/3jIm9Wa

    あなたへのおすすめ