1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

AI駆動開発で「讃岐うどんの食感」を可視化するアプリを1日でリリースした話

1
Posted at

はじめに

はじめまして、うどん県(香川県)に移住して以来、毎日がうどん三昧のデータサイエンティストです。(´・ω・`)

香川のうどんは奥が深く、店やメニュー、果てはその日の気温や湿度によって「食感」が絶妙に異なります。しかし、その感動を「コシがあって最高!」という語彙力不足な言葉でしか表現できない自分に、DSとしての敗北感を感じていました。

「なんか違う」を「データ」に変えたい。
そして将来、誰かにおすすめを聞かれた時に、データに基づいた完璧な回答をしてドヤ顔( ・´ー・`)をしたい。

そんな純粋(?)な動機から、AI(Cursor & Gemini)を相棒に、うどんの食感を可視化するアプリ『UdonTextureLog』を1日で作り上げた記録を共有します。

開発の裏側:AI駆動開発のワークフロー

今回は「1日でリリースまで持っていく」という爆速スプリントを課しました。それを支えたのがAIによるワークフローです。

1. 要件定義の自動化

まず、特定のドメイン知識を整理するために専用の「詳細要件定義Gem」を作成しました。
「うどんの食感を5軸(コシ、伸び、肌、弾力、粘り)で評価したい」という抽象的なアイデアを投げ、Cursorがそのまま実装に落とし込めるレベルのマークダウン形式のプロンプトへ変換させました。

2. Cursor (Pro) + Gemini 1.5 Pro の力

エディタには Cursor を使い、モデルは Gemini 1.5 Pro を選択。
DSとしてPythonは書き慣れていますが、TypeScriptやReactの型定義などは不慣れです。そこはAIに「このライブラリを使って、型安全なレーダーチャートコンポーネントを作って」と丸投げすることで、脳のリソースを設計と検証に集中させました。

結果、朝に要件定義を始め、その日の夜にはVercelへのデプロイまで完遂することができました。

技術スタック

「維持費ゼロ」と「開発体験」を両立させるため、以下の構成にしました。

カテゴリ 選定技術 理由
Frontend React (Vite) / TypeScript AIとの相性が抜群に良いため
Styling Tailwind CSS デザインセンスをAIに補完させるため
Visualization Recharts 5軸レーダーチャートをサクッと作るため
Backend/Auth Supabase 認証とDBを爆速で立ち上げるため
Hosting Vercel GitHub連携でデプロイを自動化するため

UdonTextureLog 入力画面のスクリーンショット!

泥臭いトラブルと解決策(AIも救えなかった凡ミス)

爆速開発にトラブルは付き物です。特に今回は「認証」周りで自爆しました。

① localhostの罠

開発中は localhost:3000 で完璧に動いていたのですが、デプロイ後にスマホからログインしようとすると、なぜかログインできない。
原因: Supabase側の「Redirect URL」を本番URLに変え忘れ、ローカルに戻ろうとしていました。
AIはコードを直してくれますが、コンソールの設定までは見てくれません。物理的な設定ミスには人間がしっかり目を光らせる必要がありますね……( ;∀;)

② 無料枠の洗礼(セルフ締め出し)

開発中のテストで何度もマジックリンク(メール認証)を送りすぎた結果、SupabaseのRate Limit(送信制限)に引っかかりました。
その結果、開発者本人である私が、自分の作ったアプリから締め出されるというマヌケな事態に。
無料枠を使いこなすには、開発時のテスト頻度にもDSらしい「最適化」が必要だと学びました。

今後の展望:データの類型化(DSの血が騒ぐ)

現在はただログを溜めるだけのアプリですが、スコアが溜まってきたらここからが本番です。

  • 食感のクラスタリング: K-means法などを用いて、「この店は太麺モチモチ系」「ここは細麺グミ系」といった客観的な類型化を試みます。
  • 自動推論ロジック: 店名や麺の種類を入力するだけで、AIが過去のデータから「期待される食感」を推論する機能を実装したいと考えています。

おわりに

「未経験の領域でも、AIという最強の相棒がいれば1日で形にできる」
今回の開発を通して、そのワクワク感を肌で感じることができました。一人で悩んでエラーと戦っていた時代を思うと、隔世の感がありますね。

今回作成したアプリは、こちらから実際に触っていただけます。
https://udontexturelog-udonds.vercel.app/

次回は、溜まったデータを使って実際にどのような分析ができたのか、あるいは次なるトラブルにどう立ち向かったのかを報告したいと思います。

同じくAIで「自分の好き」を形にしたいエンジニアの皆さん、ぜひコメントでアドバイスや感想をいただけると嬉しいです!一緒にうどんを食べましょう!(`・ω・´)

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?