43号線を西へ東へ

フリーランスの備忘録、アウトプットの実験場

業務用Webアプリを作成しました【9月〜12月】

このブログはプロモーションリンクを含むときがあります


久しぶりのブログ更新となってしまいました。

9月から業務システムを開発していまして、11月半ばに正式運用を開始しました。うちの会社に来てくれているAI君に指示を出していたら、予想以上に時間がかかって、ブログを書く時間がなくなった次第です。

そもそも、AIを導入すれば業務は効率化され、その結果時間が空いてもっと文化的な生活が送れると思ったのですが、結果は違いました。

自分の実力以上のことに手を出し、余分に忙しくなる。どこで意思決定を間違えたのか、そのうち検証せねばいけませんね。

とりあえず、業務システムの概要とAIに書いてもらったコード数、AIのやり取りのトークン数をグラフ化したので年末のログとしておいておきます。

今回作った業務システム

今の仕事にピッタリあうシステムを作りたい。

その気持ちが高じてAIを雇って開発してもらいました。

ぼくのかんがえたさいきょうのしごとアプリ

今回作ったのは会社の方の業務アプリではなく、個人向けサービス用の予約アプリです。お客さんとミーティングのアポ取りに活躍してくれています。

そもそも、アポのスケジュール管理には他社製の一般サービスを使っていました。単機能でシンプルで使いやすいものなのですが、ちょっとしたメモ書きもできないので、不便を感じていたのです。

どうせならメモだけではなく、見積もりや決済機能までのっけて、自分の仕事に必要な機能の全部乗せのアプリを作ってみようと思った次第です。

普通に外注して開発したら、時間はもっとかかるでしょうし、かなり高そうです。AIを雇用(サブスク)して内製化することにしました。

実際にアプリのせた機能は、こちらのメモだけでは無くて、先方に見てもらう見積もりや提案レポート、横展開するサービスの紹介、将来的には決済機能ものせれる様な機能となっております。

AmazonYoutubeのトップページが人によって異なるように、顧客ごとに内容の見せ方が変化できたらいいなと思いながら基本設計したアプリです。

もちろん、現状で全てを実装しているわけではないものの、大枠を作ることが出来たのは大きな一歩です。

使ったAIやWebサービス

next.jsというJavaScriptの後継言語を使って、Vercelというサーバで入り口を、Supabaseというサービスでログイン認証や各種データベースを任せる方法で作りました。

全て、うちのAI君たちががお勧めしてくれた方法です。

今回の開発にあたって、ChatGPT、Gemini、Cursorと3つのAIサービスを雇いました。

ChatGPTに設計図(要件定義)を書いてもらって、Geminiに添削してもらって、もう一度ChatGPTに確認を取ってから、AIエディタのCursorに実際にプログラムを書かせるという方法で進めました。

以上の流れから、最低限の機能を搭載させて11月13日にお客さん向けに向けて最低限の実装でリリースしました。

ただ、お客さんの個人情報を預かるので、セキュリティ面のことはいろんな角度から調査して、穴や抜け、漏れがないよう気をつけたつもりです。

リリース後も、LINE連携や細々とした修正を行いながら、次の目玉機能の実装に向けて作戦を練っているところです。

コードやトークンから見る開発のログ

11月

AIが書いたコードの行数とAIとの対話であるトークン数を棒グラフにしてみました。9月・10月は2万行程度でしたが、11月には12万行を超えるプログラムを書かせていました(左図)。

右図が、AIに指示を送った月別トークン数のグラフです。トークンとは、AIが文章を理解・生成するときに使う最小の処理単位です。

トークン数の例をあげると、

  • 「こんにちは」→ 1〜2トークン(モデル次第)
  • 「AIとの会話時につかうトークンとは何ですか?」→ 数十トーク

となります。日本語と英語でも扱いが異なるようです。

累積トークン数のグラフ

AIエディタCursorとの会話トークン数を積み重ねてみました。11月13日が業務アプリの運用開始日です。下のグラフ左側の黄色エリア準備期間、右側の運用後の会話トークン数です。

AIエディタのCursorの累積トークン数

最初は平坦だったグラフですが、11月に入って一気に右肩上がりになっていますが、12月になると少し緩やかなグラフに戻ります。

計画段階(要件定義)、実装段階(プログラム)、バグとりや微修正段階で、それぞれコードを書く量が異なっていることが興味深いです。またリリース前には、かなりの時間を費やしていますから、どうしてもコード生成量は多くなるということがわかる興味深いグラフとなりました。

AIを使いまくってみて

最後に感想を述べたいと思います。

AIが業務を劇的に変える

外注にコスト的に見合わないアプリも片手間に作ることができました。業者の出来合いのアプリに業務をフィットさせるぐらいなら、自分で作った方がいいということを身をもって体験することができました。

まだまだ素人ですが、自分で使うアプリを数個作れば経験者、10個作れば中級者でしょう。その頃にはいろんなノウハウが溜まっているはずです。

自分で書くわけではないのでプログラマーではありませんが、バイブコーディングネイティブソフトウェア製作者とは名乗れると思います。

世の中が変わり目に生きていることの幸せを噛み締めております。

現状ではAIがいるから早く帰れるれるわけではない

AIの存在で効率化されていくのは間違いありません。ただGPT-5の現状では、AIが優秀になってしまったことにより、今まで手を出せなかったことまでお願いできてしまう事になりました。

予約システム、業務システムの開発なんてGPT-4時代にはやろうと思いませんでした。

たた、プロンプトを考えてもらうためにプロンプトを打つこと、AIか用意したTODO項目をチェックする事、生成されたプログラムのエラーを探してきてAIにコピペして教えてあげることなど、まだまだ手作業が残っています。

ほったらかしにコードを書く環境を作れていないので、結果としてかなりの時間をかけて開発を行いました。

将来的には早く帰るためにAIを活用することを目指していきたいですね。