목표: "50장 생성에 1분 이내 완료" 및 "디자인이 깨지지 않는 완벽한 템플릿 매핑"


1. 기존 AI 생성의 한계와 비효율성 분석

현재 구현 방식(api/ai_generate_template.php)은 모든 좌표(x, y, w, h)와 스타일링 속성(폰트, 컬러, 정렬, GSAP 애니메이션 값)을 AI가 직접 연산하고 생성하도록 되어 있습니다.

[원문 텍스트] ──► [Gemini LLM] ──► [모든 좌표 + 스타일 + 애니메이션 + 텍스트 포함 slides_json] (타임아웃!)

🔴 문제점

  1. AI 연산의 병목 및 타임아웃: 장당 수십 개의 CSS 스타일 속성과 위치값을 포함하는 대량의 JSON 데이터를 생성해야 하므로, 10장만 넘어가도 API 출력 토큰 수 한계로 타임아웃이 발생합니다.
  2. 디자인 품질의 한계 (Hallucination): LLM은 수학적 좌표 계산에 약합니다. 텍스트가 템플릿 상자 밖으로 넘치거나, 레이아웃이 겹치고, 어설픈 인포그래픽을 억지로 그리려다 디자인이 완전히 깨지는 현상이 발생합니다.
  3. 극심한 토큰 낭비: 템플릿에 고정되어 있는 메타데이터와 애니메이션 설정까지 매번 재생성하므로 비용과 트래픽이 낭비됩니다.

2. 해결 방안: "콘텐츠 데이터 - 에디터 템플릿 바인딩" 모델

AI는 오직 **"슬라이드의 논리적 본문 구조(Content)"**만 채우고, 스타일, 좌표, 애니메이션 기본값은 **"에디터 내부의 템플릿 엔진"**이 채워 넣는 구조로 완전히 이원화합니다.

 
 
[원문 텍스트] ──► [Gemini (최소 정보만 생성)] ──► [초경량 Content JSON]
▼ (에디터가 기본 템플릿 프리셋과 결합)
[최종 완성 slides_json]

1) AI가 생성하는 초경량 JSON 스키마 (예시)

AI는 좌표나 애니메이션 설정을 일절 계산하지 않고, 슬라이드 레이아웃의 성격(Preset ID)과 그에 대응하는 본문 텍스트만 깔끔하게 생성합니다. 이미지 생성이나 인포그래픽 그리기를 철저히 배제합니다.

json
 
[
{
"slide_index": 1,
"layout_preset": "COVER_TITLE",
"contents": {
"title": "클라우드 서비스 도입 전략",
"subtitle": "비용 절감과 인프라 효율화를 위한 실행 로드맵"
}
},
{
"slide_index": 2,
"layout_preset": "TWO_COLUMN_LIST",
"contents": {
"section_title": "도입 배경 및 현재 직면한 과제",
"left_col_title": "1. 온프레미스의 한계",
"left_col_body": "트래픽 급증 시 서버 다운 빈번, 하드웨어 유지비 연 2억 발생.",
"right_col_title": "2. 기술 부채 누적",
"right_col_body": "레거시 시스템 마이그레이션 지연으로 신기술 도입 불가."
}
}
]

2) 에디터 템플릿 엔진(Client-side)의 기본값 병합(Data Binding) 과정

프론트엔드에서 AI 결과물을 받으면, 템플릿 데이터베이스에서 해당하는 layout_preset ID의 오리지널 스타일 정의를 불러옵니다.

  1. layout_preset: "TWO_COLUMN_LIST"에 해당하는 원본 오브젝트(예: 좌측 텍스트박스, 우측 텍스트박스, 배경 테마 등)를 생성합니다.
  2. 각 오브젝트의 좌표(x, y, w, h), 폰트(font, fontColor, fontSize), 애니메이션(data-anim, animDelay) 속성은 **선택된 템플릿의 완성도 높은 기본값(Default)**을 그대로 상속받습니다.
  3. 텍스트 필드의 내용만 AI가 전달해 준 데이터(contents.left_col_body 등)로 갈아 끼웁니다.

3. "50장 생성 1분 이내 완료"를 위한 비동기 병렬 파이프라인 (Map-Reduce)

50장 분량의 긴 글을 요약 및 구조화할 때 발생하는 지연을 극복하기 위해, **서버 백엔드에서 AI API 호출을 여러 개로 쪼개어 병렬로 동시 실행(Multi-Threading/Concurrency)**합니다.

 
 
[50장 분량 원문]
▼ (Step 1: Planner LLM 호출 — 1회, 5초 소요)
[전체 목차 & 슬라이드 50장의 Layout ID 설계서 확보]
├─► [Worker 1] (1~10번 슬라이드 본문 생성) ──► 비동기 병렬 API 호출 (10초)
├─► [Worker 2] (11~20번 슬라이드 본문 생성) ──► 비동기 병렬 API 호출 (10초)
├─► [Worker 3] (21~30번 슬라이드 본문 생성) ──► 비동기 병렬 API 호출 (10초)
├─► [Worker 4] (31~40번 슬라이드 본문 생성) ──► 비동기 병렬 API 호출 (10초)
└─► [Worker 5] (41~50번 슬라이드 본문 생성) ──► 비동기 병렬 API 호출 (10초)
▼ (Step 3: Assembler — 0.5초 소요)
[각 슬라이드 본문 병합 및 에디터 템플릿 바인딩] ──► 50장 전체 프로젝트 저장 (총 15~20초 소요!)

💡 파이프라인 아키텍처 상세

  1. Step 1 (Planner):
    • 입력 텍스트를 고속 분석하여, 50개 슬라이드의 전체적인 흐름(아웃라인)과 각 슬라이드에 어울리는 레이아웃 프리셋 이름(layout_preset)만 1차로 기획합니다.
    • 이 단계는 응답 텍스트량이 매우 적으므로 3~5초 이내에 완료됩니다.
  2. Step 2 (Parallel Workers):
    • 1차로 설계된 50개 슬라이드 목록을 바탕으로, 10장씩 5개 묶음(배치)으로 쪼갭니다.
    • PHP의 curl_multi_init 또는 Node.js의 Promise.all 등을 사용하여 Gemini API에 5개의 요청을 동시에(비동기 병렬) 전달합니다.
    • 각 워크플로우는 좌표나 스타일 데이터를 완전히 배제한 본문 텍스트 요약 구조만 뽑아내기 때문에, 10장을 생성하는 시간이 8~10초를 넘지 않습니다. 병렬로 실행되므로 50장 전체를 요약하는 시간 역시 약 10초 내외로 수렴합니다.
  3. Step 3 (Assembler):
    • 각각 돌아온 5개 워커의 JSON 결과물(총 50장)을 하나의 배열로 머지하고, 에디터에 전달하여 템플릿 디자인 기본값과 조립합니다.

4. 기대 효과

  • 타임아웃 100% 극복: 전송/수신하는 텍스트 용량이 1/10 이하로 축소되어 Gemini API 응답속도가 획기적으로 개선되며, 50장을 돌려도 15~20초 내에 연산이 끝납니다.
  • 완벽한 디자인 정렬 보장: 복잡한 인포그래픽을 LLM이 상상해서 어설프게 그리도록 방치하지 않고, 에디터에서 정교하게 레이아웃 매핑 처리를 하므로 50장 전체 슬라이드의 디자인 품질이 흐트러짐 없이 유지됩니다.
  • 비용 절감: 불필요한 토큰 수 소모가 90% 이상 절감되어 AI 호출 비용이 획기적으로 줄어듭니다.