CITRON AIのエンジニアMです。
今回はAIを活用したアプリケーション開発の第4弾として、食事のアミノ酸スコアを計算するWebアプリを開発しました。
アプリの開発背景
アミノ酸スコアとは
食品に含まれるタンパク質の栄養価を評価する指標で、必須アミノ酸のバランスを示すものです。
必須アミノ酸は体内で合成できないため、食事から摂取する必要があります。
アミノ酸スコアが高いほど、必須アミノ酸がバランス良く含まれており、体内で効率的にタンパク質を合成できるとされています。
例えば、納豆＋ごはんだけでは、メチオニンが不足してアミノ酸スコア80程度、ここに卵を加えるとその不足が補えて食事のアミノ酸スコアは100になります。
開発の背景
私は筋トレが趣味で、食事にもそこそこ気を使っているのですが、トレーニー向けの食事を紹介するWeb記事などでは「アミノ酸スコアを意識した食事をしよう」という内容のものが多くあるものの、具体的に食品ごとの必須アミノ酸の組み合わせを計算をできるアプリがありませんでした。
そこで、食事の必須アミノ酸バランスを具体的に把握できるようにするべく、このアプリを開発しました。
このアプリは、食事に含まれる必須アミノ酸を計算して、アミノ酸スコアとともに不足している必須アミノ酸を表示して、さらに不足している必須アミノ酸を補う食品を提案してくれるものになっています。
アプリの利用方法
アプリは以下のリンクからご利用いただけます。
https://www.citron-ai.com/wp/wp-content/uploads/webgl/amino-calculator
操作手順
1. 食品選択欄に食材名を入力して、サジェストからリストに追加したい食材を選んでください。（例：「白米」など）
2.食品の量を入力してください（例：100g）
3.「追加」ボタンを押して食品を計算リストに追加してください。
4.さらに食材を追加する場合、1～3の手順を繰り返してください。
5.「アミノ酸スコアを計算」ボタンを押すと、計算結果が表示されます。
6.結果の右下には、不足している必須アミノ酸を多く含む食品の候補が表示されます。「追加」ボタンから計算リストに追加ができます。
ex.「計算対象食品一覧」ページからは、利用できる食品の一覧と、それぞれの必須アミノ酸組成の詳細が確認できます。
【計算対象食品一覧ページ】
https://www.citron-ai.com/wp/wp-content/uploads/webgl/amino-calculator/recommended.html
注意事項
このアプリは継続的な保守は予定しておりません。
実装を終えた所感
今回はGithub CopilotのAgentモードをフル活用しつつ、Claude sonnet 3.7に指示を出すことで、アプリの大半をAI駆動で実装することができました。
フレームワークにはVue.jsを採用して、計算元となるデータも全てフロントエンドに持ち、フロントエンドで完結するアプリになっています。
開発に要した時間は、アイデアから仕様にまとめるのを含めて、6～8時間ほどだったと思います。
同じAIでも、ChatGPTとClaude sonnetを比較すると、特にUIを含む部分の開発に関しては、Claude sonnetのほうがクオリティの高いものを出してくれる印象があります。
ただ、現状はChatGPT、Claudeどちらも、0から「こういう仕様で」という指示に従って開発をするのは得意ですが、「ここを修正して」という指示では、上手く動いてくれないことが多いです。
今回も、食品選択のJavaScript処理にバグが発生していたのですが、何度指示してもAIは上手く修正することができず、結局その部分は私が手動で修正を行いました。
不具合修正をAIに上手く進めさせられる方法を見つけられれば、AI活用した開発を一段ステップアップさせられるため、今後は不具合修正の手法も模索していきたいと思います。
