음식 분석기 앱은 서버리스 아키텍처와 생성 AI 기능으로 구축된 쇼핑 및 요리 레시피를 위한 맞춤형 GenAI 영양 웹 앱입니다. AWS Hackathon France 2024의 우승작으로 처음 제작되었으며 이후 AWS Summit Paris 2024에서 부스 전시로 소개되었습니다.
앱의 백엔드는 다음과 같은 AWS 서비스를 사용하여 만들어집니다.
이 앱은 최소한의 코드로 확장 가능하고 비용 효율적으로 설계되었습니다. Lazy Loading을 사용하여 비용을 절감하고 최상의 사용자 경험을 보장합니다.
우리는 생성 AI 서비스를 사용하여 대화형 서버리스 애플리케이션을 만들기 위해 이 전시회를 개발했습니다.
맞춤형 제품정보 : 제품에 무엇이 들어있고, 나에게 좋은지 궁금하시죠? 설명된 성분/알레르기 유발 물질 목록과 선호도에 따른 맞춤 요약을 보려면 앱으로 바코드를 스캔하세요.
맞춤형 레시피 생성기 : 냉장고에 있는 재료의 사진을 캡처하면 앱이 해당 재료를 사용하여 선호도에 따라 레시피를 생성합니다.
애플리케이션의 아키텍처는 4개의 블록으로 나눌 수 있습니다.
구현 : 서버 측 로직에 AWS Lambda를 사용하고, GenAI(생성 인공 지능) 구축 플랫폼으로 Amazon Bedrock을 사용하고, LLM(대형 언어 모델)로 Anthropic Claude를 사용하고, 이미지 생성을 위한 확산 모델로 StabilityAI의 Stable Diffusion XL을 사용합니다.
AI 모델 개발 : LLM 모델 선택은 응답 품질과 대기 시간에 영향을 미쳤습니다. 궁극적으로 우리는 대기 시간과 품질 사이의 좋은 비율로 Anthropic Claude 3 Haiku를 선택했습니다.
AI 생성 이미지 : 이미지를 요청하는 것은 매우 민감하며 제품의 영양적 특징을 진정으로 강조하는 이미지를 생성하는 것이 어려웠습니다. 프롬프트를 작성하기 위해 첫 번째 LLM을 사용하여 제품 영양 기능을 기반으로 프롬프트를 생성했습니다. 이 기술은 벡터 데이터베이스에 대한 자체 쿼리와 유사합니다. 멀티샷 프롬프트 엔지니어링을 사용하는 것도 프롬프트 품질을 향상시키는 데 많은 도움이 되었습니다.
전략 : "바퀴를 재발명하지 마세요"
구현 : 바코드 스캐너는 오랫동안 사용되어 왔으며 우리는 스택과 호환되는 오픈 소스 라이브러리를 선택했습니다. 시간 제약으로 인해 우리는 라이브러리 비교에 많은 시간을 소비하지 않았고 완벽한 프로토타입을 찾는 것보다 작동하는 프로토타입을 만드는 데 중점을 두었습니다. "완벽함은 선의 적이다."
전략 : 우리 앱은 사용자 선호도와 식단 요구의 다양성을 인식하여 강력한 개인화 기능을 통합합니다. 원시 데이터를 제공하는 것 외에도 이 앱은 사용자에게 자신의 선택이 영양학적으로 미치는 영향에 대해 교육하는 것을 목표로 합니다.
구현 : 앱이 개인의 건강 목표와 식이요법 제약에 맞게 통찰력을 맞춤화함에 따라 사용자는 주인의식과 연결감을 느낍니다. 간결하고 유익한 콘텐츠를 앱에 통합하면 사용자가 다양한 영양 성분의 중요성을 이해할 수 있습니다. 이러한 교육적 측면은 앱을 학습 도구로 전환하여 영양 지식을 향상시키려는 사용자와 더 깊은 관계를 조성합니다.
전략 : 사용자의 관심을 끌고 주요 영양 정보를 효과적으로 전달하기 위해 당사 앱은 AI 생성 이미지를 사용합니다.
구현 : Amazon Bedrock은 스캔한 제품을 시각적으로 눈에 띄게 표현하는 즉시 사용 가능한 개발자 경험을 제공합니다. 예를 들어, 제품에 설탕이 너무 많이 포함되어 있는 경우 AI 이미지는 설탕을 시각적으로 묘사하여 제품을 둘러싸서 매력적이고 기억에 남는 시각적 단서 역할을 합니다.
전략 : 이미지에서 성분을 추출하여 과일과 야채에 잘 작용합니다.
구현 : 우리는 이미지에서 음식 요소만 추출하는 비전 기능을 갖춘 Amazon Bedrock의 Anthropic Claude 3 Sonnet을 사용합니다. 이를 통해 음식 요소에 집중하고 이미지의 배경이나 기타 요소를 무시할 수 있습니다. Claude 3은 텍스트와 이미지를 모두 처리할 수 있는 다중 모드 모델입니다. 출력은 이미지에 존재하는 성분 목록입니다.
프롬프트 엔지니어링 : 모델의 잠재력을 최대한 활용하기 위해 시스템 프롬프트를 사용합니다. 시스템 프롬프트는 질문이나 작업을 제시하기 전에 Claude에게 컨텍스트, 지침 및 지침을 제공하는 방법입니다. 시스템 프롬프트를 사용하면 Claude의 역할, 성격, 어조 또는 사용자 입력을 더 잘 이해하고 응답하는 데 도움이 되는 기타 관련 정보를 지정하여 대화의 무대를 설정할 수 있습니다.
system_prompt = "You have perfect vision and pay great attention to ingredients in each picture, you are very good at detecting food ingredients on images"
전략 : 그림과 일치하는 재료로 3가지 레시피를 생성하세요.
구현 : Claude 3 Sonnet을 사용하여 3가지 레시피를 생성합니다. 각 레시피에는 다음 JSON 정보가 포함되어 있습니다.
{
"recipe_title" : " Succulent Grilled Cheese Sandwich " ,
"description" : " A classic comforting and flavorful dish, perfect for a quick meal " ,
"difficulty" : " easy " ,
"ingredients" : [ " bread " , " cheese " , " butter " ],
"additional_ingredients" : [ " ham " , " tomato " ],
"preparation_time" : 5 ,
"cooking_time" : 6
}
전략 : 사용자가 따라할 수 있는 단계별 레시피를 생성합니다.
구현 : 우리는 Amazon Bedrock의 Anthropic Claude 3 Haiku를 사용하여 단계별 레시피를 생성합니다. 응답 지연 시간을 줄이기 위해 단계가 사용자에게 스트리밍되며 람다 URL 스트리밍을 활용합니다. 이 방법을 사용하면 텍스트 콘텐츠에 대한 보다 원활한 액세스가 보장되어 사용자 경험과 상호 작용이 향상됩니다.
출력 형식은 웹사이트에 레시피를 쉽게 표시할 수 있는 Markdown 파일입니다. 또한 스트리밍 모드를 사용할 때 프런트 엔드에서 레시피 구문 분석을 크게 단순화합니다.
올바른 AI 모델 선택
과제 : LM(언어 모델) 선택은 응답 대기 시간과 품질 모두에 큰 영향을 미쳐 중요한 결정 지점을 제시합니다.
해결책 : 다양한 모델에 대한 포괄적인 평가를 거쳐 앱 내의 다양한 구성 요소에 대해 다음과 같은 Anthropic Claude 모델을 선택했습니다.
지연 로딩을 사용하여 비용/대역폭 절감
과제 : 생성형 AI는 가격과 대역폭 측면에서 비용이 많이 듭니다. 우리는 붐비는 이벤트에서 실행할 때 검소하고 효율적이기를 원했습니다.
솔루션 : 프롬프트의 해시인 키와 함께 지연 로딩을 사용하면 비용을 줄이고 응답을 더 빠르게 전달할 수 있습니다.
AI 이미지 생성을 위한 신속한 엔지니어링
과제 : 영양적 특징을 효과적으로 강조하는 AI 이미지 생성을 위한 프롬프트를 만드는 것은 미묘한 어려움을 안겨주었습니다.
솔루션 : 우리는 2단계 접근 방식을 활용하여 첫 번째 LLM을 활용하여 제품 영양 기능에 기반한 프롬프트를 생성했습니다. 이 자체 쿼리 기술(벡터 데이터베이스의 자체 쿼리 프로세스와 유사)은 멀티샷 프롬프트를 통합하여 보완되었습니다. 이 방법은 생성된 이미지의 품질과 관련성을 크게 향상시켜 사용자가 제품 기능에 대한 시각적으로 설득력 있는 표현을 얻을 수 있도록 보장했습니다.
사용자 개인화 복잡성
과제 : 개인화된 식이 선호도와 제한 사항을 모델에 통합하면 복잡성이 나타납니다.
솔루션 : LLM의 이해를 높이기 위해 맞춤형 알레르기 및 다이어트 입력이 포함된 헤더를 프롬프트에 동적으로 통합했습니다. 이 접근 방식은 LLM 응답의 정확성과 관련성을 크게 향상시켜 사용자에게 맞춤형 경험을 보장합니다. 개인화된 프롬프트는 개인의 선호도에 따라 정확하고 관련성 높은 정보를 전달하는 초석이 되었습니다.
다중 언어 지원
과제 : 여러 언어로 애플리케이션 제시
해결 방법 : 동일한 프롬프트가 활용되지만 LLM은 사용자의 언어 기본 설정(영어/프랑스어)에 맞춰 특정 언어로 출력을 생성하도록 지시받습니다.
AWS Lambda URL 및 Amazon CloudFront
과제 : 요청 응답 모드에서 일부 작업을 실행하기 위해 LLM을 호출하는 것은 느릴 수 있습니다.
솔루션 : API Gateway 엔드포인트의 30초 제한 시간을 해결하기 위해 선택한 접근 방식에는 Amazon CloudFront를 통해 AWS Lambda URL을 활용하는 것이 포함됩니다. Amazon CloudFront 내에서 각 요청에 대해 Lambda@Edge 함수가 트리거되어 Amazon Cognito에 대한 사용자 인증을 확인합니다. 인증이 성공하면 Lambda@Edge 함수는 AWS_IAM
인증 방법으로 활용하는 Lambda URL에 대한 요청에 서명합니다. Lambda URL을 활용하면 실현 가능한 솔루션이 제공되지만, AWS AppSync를 선택하면 추가 이점을 제공하는 대안이 된다는 점을 인정하는 것이 중요합니다. AWS AppSync는 이러한 요구 사항을 완벽하게 충족하는 내장 인증 및 권한 부여 메커니즘을 갖춘 대체 솔루션을 제공합니다. 하지만 이 데모 앱에서는 대신 Lambda URL을 사용하기로 결정했습니다.
Amazon Bedrock 동기/비동기 응답
과제 : Amazon Bedrock에서 응답을 얻는 것은 요청/응답 모드 또는 스트리밍 모드에서 발생할 수 있습니다. 여기서 Lambda는 전체 응답이 생성되기를 기다리는 대신 응답 스트리밍을 시작합니다.
솔루션 : 애플리케이션의 일부 섹션은 요청/응답 모드(예: Product ingredients description
또는 세 가지 레시피 제안 검색)에서 작동하는 반면, 다른 부분( Product summary
, Getting the Step-by-Step Recipe
)은 스트리밍 모드를 사용하여 두 구현을 모두 보여줍니다. 행동 양식.
GenAi 애플리케이션의 사용 사례 예시
npm install
us-east-1
리전에 스택을 배포합니다. cdk deploy
애플리케이션에 액세스하기 전에 Amazon Cognito에 사용자 계정을 설정했는지 확인하십시오. 이를 수행하려면 AWS 콘솔, Amazon Cognito로 이동하여 AuthenticationFoodAnalyzerUserPoolXXX
와 유사한 이름의 사용자 풀을 찾으십시오.
Food analyzer app.domainName
과 유사한 URL에 대한 스택 출력을 확인하세요. 이 URL을 브라우저에 붙여넣고 이전에 생성한 사용자로 로그인한 후 앱을 즐기세요.
다음 단계에 따라 이 vite 반응 앱을 로컬로 실행할 수 있습니다.
위의 지침에 따라 CDK 앱을 배포하세요.
CDK 출력에서 얻은 Amazon CloudFront 배포 엔드포인트에서 aws-exports.json
가져와 ./resources/ui/public/
폴더에 저장합니다.
URL은 다음과 같습니다.
https://dxxxxxxxxxxxx.cloudfront.net/aws-exports.json
cd resources/ui
npm run dev
배포 시스템에 Node JS 18+가 설치되어 있어야 합니다. (지침)
배포 머신에 AWS CLI 2+가 설치되어 있어야 합니다. (지침)
Amazon Bedrock에서 Anthropic Claude 모델 및 Stable Diffusion XL에 대한 액세스 요청
이 프로젝트는 MIT-0 라이선스에 따라 라이선스가 부여됩니다. 라이센스 파일을 참조하십시오.