7
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?

株式会社スピードリンクジャパンAdvent Calendar 2024

Day 4

3秒で提案?!AIが叶える冷蔵庫の食材からお弁当メニュー提案機能をRailsで実装!

Last updated at Posted at 2024-12-04

はじめに

この記事は、株式会社スピードリンクジャパン Advent Calendar 2024 の4日目の記事です。

こんにちは!社会人1年目の石川です。
まずは、この記事を開いていただきありがとうございます!
現在、私はRailsを使ってAI機能を組み込んだサイトの開発をしています。開発を進める中で、「AIってすごいな…!」と驚かされることが多々ありました。
そこで今回は、そのAIの力を借りて、「お弁当メニューを提案してくれる機能」をRailsで作ってみたので、その過程を皆さんに共有したいと思います!

目次

  1. お弁当提案機能を作った理由
  2. 開発環境
  3. 機能の説明
  4. 実装の詳細
  5. まとめ

お弁当提案機能を作った理由

「なんでお弁当提案?」と思われた方もいるかもしれませんので、少しだけ背景をお話しします。
私は毎週日曜日に一週間分のお弁当を作り置きしています。学生時代、老人ホーム用の食事を調理するアルバイトをしていたり、大学の栄養学の授業を履修していたりと、昔から「食」への興味は大きい方でした!そして、料理も好きです!
ただ…毎週お弁当を作り続けていると、「冷蔵庫の中身は大体同じだなぁ…」「これ、また同じメニューだ」と飽きてしまうことも多く、次第に新しいアイデアを考えるのが負担になってきました。
そこで、「AIに助けてもらおう!」と思い立ちました。冷蔵庫の余り物から簡単にメニューを提案してくれるAI機能があれば、毎週のお弁当作りももっと楽しくなるはず! そんな思いで、この記事を書いています!
最後まで読んでいただければ幸いです。

開発環境

  • Ruby: 3.2.2
  • Rails: 7.1.3.4
  • データベース: MySQL 8.4.2
  • AI: OpenAI API
  • CSSフレームワーク: Tailwind CSS
  • コンテナ化: Docker

機能の説明

作成したお弁当提案機能について概要を説明します!

1. 食材を入力

使いたい食材を入力欄に記入します。複数の食材を使いたい場合はカンマ区切りで入力します。
例: 鶏肉, ほうれん草, 卵

2. 味の好みを選択

和風、洋風、中華の中から好みに合うものを選択します。

3. オプション設定

ヘルシー、節約、時短の3つのオプションから重視したいものを選択します。複数選択も可能です。

4. 提案を生成

「提案を生成」ボタンを押すと、AIが以下の情報を含むメニューを提案します。

  • メニュー名
  • 主な食材
  • 簡単な調理方法
  • 調理時間
    以下の画像が実際の画面です!
入力画面

お弁当メニュー提案

提案結果画面

お弁当メニュー提案結果

実装の詳細

以下に主要な部分の実装詳細を紹介します。

入力フォーム部分(view)

ユーザーが使用する食材や味の好み、オプションを入力するフォームです。

  • form_withを使用してデータを送信
  • 入力欄、チェックボックスなど、ユーザーが直感的に操作できるUIを提供
リクエスト処理と結果の受け渡し部分(controller)

フォームから送信されたデータを受け取り、AIへのリクエストを処理です。
Formクラスを使用してプロンプトを生成し、OpenAIのAPIを呼び出します。生成された結果をビューに渡します。

  • create メソッド内で入力データを整形し、AdForm を利用してAIから提案を生成
  • 結果が存在する場合はビューに渡し、結果がない場合はエラーメッセージを表示
提案結果部分(view)

APIから返却された結果を整形して表示します。

  • 各メニュー名、使用した主な食材、調理方法、調理時間をリスト形式でわかりやすく表示する
プロンプト(yml)

AIにリクエストを送る際のテンプレートを定義します。

  • ユーザーの入力を動的に挿入し、AIが理解しやすい形式でプロンプトを構築
ロジック部分(formクラス)

ユーザーの入力データを整形し、プロンプトを生成します。
APIへのリクエストを送信し、返却された結果を解析します。
generateメソッドでプロンプトを生成し、APIリクエストを送信します。

  • 結果の解析には正規表現を使用し、データを構造化して整形

まとめ

本記事では、お弁当メニュー提案機能の実装について説明しました。プロンプト生成や結果の解析部分を工夫することで、応用範囲を広げることも可能です。今回は最低限の基本機能しか実装しませんでしたが、さらなる改良を加えることでより実用的な提案が実現できると考えています。
今後の展望として、食材の旬や流行を考慮したメニューや、これまでの提案メニューをリスト化する機能、買い物リスト生成機能などをつけたいと思いました!
最後まで閲覧いただきありがとうございました!

7
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
7
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?