상품 상세페이지 자동생성

아키텍처 레이어 개요

모든 이미지의 색감 / 무드 통일

각 섹션별 텍스트 생성

톤 조절

모든 요청은 하나의 Job ID를 발급받음

Web: Next.js / React

[Client]

역할

사용자가 최소 정보만 입력
복잡한 AI 구조는 전부 숨김

주요 기능

이미지 업로드
상품명 입력
언어 선택
옵션 선택 (폰트 / 템플릿 / 리뷰 URL)
“생성하기” 버튼

기술 예시

Dashboard형 UI (Figma-like는 ❌, Notion-like ⭕)

[API Gateway]

역할

인증
요청 분기
속도 제한
로그 수집

포인트

이후 모든 에이전트는 이 Job ID 기준으로 협업

[Input Orchestrator](입력 해석 & 정규화)

핵심 역할

“사람이 준 정보 → AI가 이해 가능한 구조로 변환”

처리 내용

이미지 전처리
- 해상도
- 배경 여부
- 제품 중심성 분석
텍스트 정규화
언어/문화 코드 설정
옵션 누락 시 기본값 자동 설정

Output (예시)

{
"job_id": "UUID",
"product_name": "OOO",
"language": "ko",
"tone": "balanced",
"has_review": true,
"visual_style": "clean",
"constraints": {
"font": "optional",
"template": "optional"
}

[Insight Layer](의미 추출 & 해석 계층)

⚠️ 이 레이어가 서비스의 ‘두뇌’

구성 에이전트

🔍 Image Insight Agent
🧠 Review Insight Agent
🌍 Culture & Language Agent
🎯 Target Persona Agent

4-1. Image Insight Agent

제품 유형 분류
사용 맥락 추론
시각적 강점 추출

출력:

{
  "product_category": "생활용품",
  "key_visual_strength": ["미니멀", "고급감"],
  "usage_context": ["집", "일상"]
}

4-2. Review Insight Agent (옵션)

리뷰 URL 크롤링
감정 곡선 분석
불만 → 전환 → 만족 포인트 추출

출력:

{
  "pain_points": ["내구성 걱정"],
  "conversion_triggers": ["사용 후 안정감"],
  "emotional_keywords": ["안심", "만족"]
}

4-3. Culture & Language Agent

단순 번역 ❌
설득 문법 변환 ⭕

출력:

{
“persuasion_style”: “공감 중심”,
“taboo_expressions”: [],
“preferred_structure”: “문제→해결”
}

[Story Engine]

역할

“이 상품을 왜, 어떤 순서로 보여줘야 구매할까?”

내부 구조

Story Architect Agent
Copywriting Agent
CTA Agent

Story Architect Agent

구매 여정 설계
섹션 수 결정
감정 흐름 설계

출력:

[
  "empathy",
  "problem_definition",
  "solution_intro",
  "evidence",
  "trust",
  "call_to_action"
]

Copywriting Agent

브랜드 문체 반영

[Visual Engine]
구성

Prompt Generator Agent
Image Generation Agent
Style Consistency Agent

Prompt Generator Agent

사용자는 프롬프트를 절대 안 씀
스토리 + 인사이트 → 이미지 프롬프트 자동 생성

Image Generation Agent

Stable Diffusion / DALL·E 등
섹션별 이미지 생성

Style Consistency Agent

“AI 티 나는 문제” 해결용

[Composition Engine]
역할

이미지 + 텍스트 + 위치 = 상세페이지 설계도

기능

레이아웃 자동 배치
강조 포인트 계산
시선 흐름 최적화

출력:

{
  "section": "solution",
  "image_id": "img_03",
  "text": ["문구1", "문구2"],
  "layout": "center_focus"
}

[Export Engine]

Output 타입

✅ 최종 상세페이지 이미지
✅ PSD (레이어 분리)
✅ 텍스트 JSON
✅ 이미지 요소별 분리 데이터

PSD 구조 예

– Background – Image_Group – Text_Group ├ Headline ├ Subcopy └ CTA

[Output Storage & Delivery]

S3 / GCS

CDN

Job ID 기반 다운로드 링크

Input

이미지
설명(옵셔널)
상품 이름
사용할 언어
폰트(optional)
템플릿(optional)
리뷰(리뷰가 있는 뤱사이트 url 주소)(optional)
- 리뷰를 넣고싶은 사람에 한하여

Output

상품상세 이미지
각 이미지 요소(옵셔널)
각 텍스트 내용(옵셔널)

API

서버 세팅

프롬프트 엔지니어링

Psd 원본 파일로 포토샵에서 수정 할 수 있게 만들 수 있는지

단계별 필요한 프롬프트

이미지 생성 프롬프트
스토리라인 작성 프롬프트
1. 스토리
2. 텍스트
이미지 텍스트 합치는 프롬프트
psd화 하는 프롬프트
서브 에이전트 프롬프트

Step 1

제품군을 선택 할 수 있음 – 상품

템플릿 –

언어 – 언어, 폰트

상품

이미지
설명(옵셔널)
상품 이름

상품 페이지 쪽 수(상세페이지 길이) – 상품 설명을 길게 하고 싶으면 추가 과금으로 유도

Step 2(크레딧 소모 없음)

입력된 정보를 기반으로 스토리 라인을 만들어서 보여줌, 텍스트로만 – AI 모델로 작성해서 보여주고 고객이 수정도 가능함

이 내용을 보고 고객이 마음에 들면 생성하기 클릭

Step 3(optional)

원본 파일 생성 (psd 파일로 생성하기)

추가 기능

참고할 브랜드 상세 페이지(Optional)
상세페이지 -> 숏폼 콘텐츠 자동 전환 (추가 수익 모델)

참고자료

https://www.youtube.com/watch?v=GL3LXWBZfy0

enough-rest