AI 에이전트 파이프라인으로 강의 슬라이드 자동 생성 시스템 구축하기

목차

문제 정의: 왜 자동화가 필요한가?

나는 교육 기관에서 강의 자료를 만들면서 반복 노동의 늪에 빠졌다. 비전공자 대상 강의처럼 커리큘럼이 정해져 있는 경우, 매 차시마다 동일한 형식의 슬라이드를 수십 장씩 만들어야 했다.

AI 활용 교육 프로그램의 강의 자료 제작을 담당하게 되었다. 커리큘럼은 이미 정해져 있었다. 매주 학습자들이 배울 개념, 실습할 프로젝트, 예제 코드까지 모두 체계적으로 정리되어 있었다. 문제는 이걸 어떻게 슬라이드로 옮기느냐였다.

매번 PowerPoint를 열어 텍스트를 입력하고, 폰트를 맞추고, 정렬을 조정하는 과정은… 솔직히 지루했다 (잠이 솔솔). 슬라이드 하나를 만드는 데 10분이 걸린다면, 10장짜리 강의 자료는 100분이다. 여러 회차의 과정이면 계산하기도 싫다.

그래서 나는 생각했다.

이거 AI한테 시키면 되지 않을까?

첫 번째 시도: “프롬프트 하나면 되겠지”

처음에는 “프롬프트 하나면 되겠지” 생각했다. 나는 AI한테 “강의 자료 만들어줘”라고 던졌다.

결과는 기대에 못 미쳤다.

슬라이드 순서가 뒤죽박죽이었다. 중요한 내용이 빠졌다. 발표자 노트는 너무 짧았다.

한 번에 너무 많은 일을 시키면 안 되는구나.

이때 깨달았다. AI 에이전트에게도 역할 분리가 필요하다는 것을. 한 명한테 “기획, 디자인, 개발 다 해”라고 하면 망하는 것처럼 말이다.

다단계 파이프라인 설계: 역할을 나눠라

나는 전체 프로세스를 5단계로 나눴다.

┌─────────────┐    ┌─────────────┐    ┌─────────────┐    ┌─────────────┐    ┌─────────────┐
│  Curriculum │ → │  Research   │ → │  Organizer  │ → │   Design    │ → │    PPTX     │
│    Agent    │    │    Agent    │    │    Agent    │    │    Skill    │    │    Skill    │
└─────────────┘    └─────────────┘    └─────────────┘    └─────────────┘    └─────────────┘
     ↓                  ↓                  ↓                  ↓                  ↓
 [직접 설계]        [직접 설계]        [직접 설계]        [직접 설계]      [Anthropic 스킬]

앞의 4단계(Curriculum, Research, Organizer, Design)는 내가 직접 설계한 에이전트다. 마지막 PPTX 변환은 Anthropic에서 제공하는 공식 스킬을 활용했다.

바퀴를 재발명하지 마라. 좋은 도구가 있으면 활용하고, 핵심 로직에 집중하라.

1단계: Curriculum Agent (데이터 추출) - 직접 설계

커리큘럼 문서에서 해당 차시의 학습 목표, 주요 개념, 예제 코드를 뽑아낸다. 이 에이전트는 읽기 전용이다. 창의성을 발휘하지 않는다. 그냥 정보를 추출해서 구조화한다.

// Curriculum Agent 프롬프트 예시
const curriculumPrompt = `
다음 커리큘럼에서 해당 차시의 정보를 추출해주세요:
- 학습 목표 (3-5개)
- 핵심 개념 (키워드)
- 실습 프로젝트 설명
- 예제 코드 (있다면)

JSON 형식으로 반환하세요.
`;

2단계: Research Agent (보강) - 직접 설계

커리큘럼에 없거나 최신 내용은 웹에서 찾는다. 예를 들어 Antigravity에 대해 모르면 웹에서 검색해서 분석하라고 한다.

나는 이 단계를 선택적으로 만들었다. 커리큘럼이 충분히 상세하면 스킵한다. 왜냐하면 웹 검색은 시간이 오래 걸리고, 출처 검증이 필요하기 때문이다.

3단계: Organizer Agent (구조화) - 직접 설계

여기가 핵심이다. 추출한 정보를 슬라이드 단위로 재구성한다.

AI한테 한 번에 너무 많은 일을 시키지 마라. 하나씩, 명확하게.

나는 이 에이전트한테 다음을 요구했다.

• 슬라이드 순서 정하기 (도입 → 개념 설명 → 예제 → 실습 → 정리)
• 각 슬라이드의 제목과 본문 작성
• 발표자 노트 작성 (강사가 말할 내용)
• 비전공자가 이해할 수 있는 수준으로 쉽게 설명

중요한 점: 이 단계 후 사용자 확인을 받는다. 나는 AI가 만든 교안 구조를 검토하고 수정한다. 여기서 확정하지 않으면 나중에 디자인까지 다시 해야 한다.

// 검증 단계 예시
const validationErrors = [];

if (!slides || slides.length === 0) {
    validationErrors.push("슬라이드가 없습니다.");
}

slides.forEach((slide, index) => {
    if (!slide.title) {
        validationErrors.push(`슬라이드 ${index + 1}에 제목이 없습니다.`);
    }
    if (!slide.content) {
        validationErrors.push(`슬라이드 ${index + 1}에 본문이 없습니다.`);
    }
});

if (validationErrors.length > 0) {
    throw new Error(`검증 실패:\n${validationErrors.join('\n')}`);
}

검증 단계를 거치면 AI의 실수를 막을 수 있다. 필드 누락이나 슬라이드 개수 오류 같은 것 말이다.

4단계: Design Skill (HTML 생성) - 직접 설계

교안 구조가 확정되면 HTML 슬라이드를 만든다. 여기서 중요한 건 템플릿이다.

나는 템플릿을 처음부터 디자인하지 않았다. 업체에서 제공한 예시 교안 PPTX가 있었다. 이걸 활용했다.

[템플릿 추출 과정]
예시 교안 PPTX → PDF 변환 → AI로 디자인 분석 → HTML 템플릿화

예시 PPTX를 PDF로 변환한 다음, AI한테 디자인 요소를 분석하게 했다. 색상 팔레트, 폰트 크기, 여백, 레이아웃 패턴 등을 추출했다. 그리고 이걸 바탕으로 10개의 HTML 템플릿을 만들었다.

• 제목 슬라이드
• 학습 목표 슬라이드
• 개념 설명 슬라이드 (2열 레이아웃)
• 코드 예제 슬라이드
• 이미지 중심 슬라이드
• 리스트 슬라이드
• …

디자인 감각이 없어도 괜찮다. 좋은 예시가 있으면 AI가 분석해준다.

AI는 각 슬라이드의 내용에 맞는 템플릿을 선택하고, 텍스트를 채운다. 출력은 HTML 파일이다.

5단계: PPTX Skill (PowerPoint 변환) - Anthropic 스킬 활용

HTML을 PowerPoint로 변환한다. 이 부분은 Anthropic에서 제공하는 공식 PPTX 생성 스킬을 활용했다.

솔직히 말하면, HTML을 PPTX로 변환하는 건 직접 구현하기에 상당히 복잡하다. 좌표 체계 변환, 폰트 렌더링 차이, OOXML 스펙 준수 등 고려할 게 많다. 하지만 이미 잘 만들어진 도구가 있다면 굳이 재발명할 필요가 없다.

핵심 기술: AI 에이전트 파이프라인 설계

내가 집중한 것은 파이프라인 설계다. 각 에이전트의 역할을 명확히 분리하고, 사용자 확인 단계를 넣어 품질을 보장하는 것.

역할 분리 원칙

각 에이전트는 입력과 출력이 명확하다. Curriculum Agent를 수정해도 Research Agent는 영향을 받지 않는다. 유지보수가 쉬워진다.

도메인 특화 프롬프트 설계

교육 콘텐츠 생성에는 도메인 특화 지식이 필요하다. 나는 Organizer Agent의 프롬프트를 이렇게 설계했다.

## Organizer Agent 프롬프트 (일부)

당신은 비전공자를 위한 AI 코딩 입문 과정의 교안 설계자입니다.

### 설명 수준
- 대상: 프로그래밍 경험이 전혀 없는 학습자
- 어려운 용어는 일상 언어로 비유
- 예: "변수는 데이터를 담는 상자"

### 강의 톤
- 문어체 ❌ → 구어체 ✅
- 예: "이제 변수를 선언하겠습니다" (X)
- 예: "변수를 한번 만들어볼까요?" (O)

### 최종 프로젝트 연계
- 매 차시 내용이 "웹 포트폴리오 프로젝트"와 연결되어야 함
- 학습한 개념을 바로 프로젝트에 적용할 수 있도록 예제 설계

이런 프롬프트 설계가 없으면 AI는 일반적인 설명을 생성한다. “변수는 메모리 공간에 할당된 데이터 저장소입니다” 같은 문어체 설명 말이다. 학습자들에게는 너무 어렵다.

사용자 확인 단계의 중요성

Organizer Agent가 슬라이드 구조를 만든 후에는 반드시 사용자가 확인한다.

왜 이 단계가 중요할까? AI는 아무리 똑똑해도 교육자의 의도를 100% 파악하지 못한다. 어떤 예제가 학생들에게 더 와닿을지, 어떤 순서로 설명해야 이해가 쉬울지는 결국 사람이 판단해야 한다.

승인 단계에서 수정이 들어가면 다시 Organizer Agent를 돌린다. 승인이 완료되면 그때부터 Design Skill과 PPTX Skill이 동작한다. 이 단계를 거치면 rework(재작업)가 대폭 줄어든다.

Anthropic PPTX 스킬 활용하기

PPTX 변환은 Anthropic에서 제공하는 공식 스킬을 사용했다. 이 스킬은 내부적으로 Playwright + PptxGenJS를 사용해서 HTML을 PowerPoint로 변환한다.

스킬이 하는 일

HTML 슬라이드 → Playwright 렌더링 → 위치/스타일 추출 → PptxGenJS 변환 → PPTX 출력

스킬이 내부적으로 처리하는 것들:

• CSS 픽셀 → PowerPoint 단위(inch, EMU) 변환
• getBoundingClientRect()로 정확한 요소 위치 추출
• 인라인 포매팅(<b>, <i>, <u>) 파싱
• 텍스트 박스 너비 보정 (PowerPoint의 렌더링 차이 보정)

커스터마이징 영역

스킬 자체는 Anthropic 제공이지만, 나는 입력 단계를 커스터마이징했다.

1. 슬라이드 템플릿 디자인: 10개의 HTML 템플릿을 직접 만들었다.
2. 브랜딩 변수: {{COURSE_NAME}}, {{LECTURE_TITLE}} 같은 변수를 도입했다.
3. 색상 팔레트: 교육 기관의 브랜드 컬러에 맞게 조정했다.

<!-- 슬라이드 헤더 템플릿 예시 -->
<header class="slide-header">
  <span class="brand">{{BRAND_NAME}}</span>
  <span class="section">{{SECTION_NUM}}</span>
  <span class="title">{{LECTURE_TITLE}}</span>
</header>

스킬의 한계 이해하기

Anthropic 스킬도 만능은 아니다. 다음은 스킬이 처리하지 못하는 것들이다.

CSS 그래디언트가 필요할 때는 Sharp 라이브러리로 미리 PNG 이미지를 생성해서 삽입했다. 이것도 스킬의 일부 기능이다.

장점과 한계

장점

나는 이 시스템 덕분에 강의 자료 제작 시간을 80% 단축했다. 전체 과정의 자료를 1주 만에 완성했다.

1. 일관성: 모든 슬라이드가 동일한 디자인과 구조를 유지한다.
2. 재사용성: 다른 교육 프로그램에도 적용할 수 있다. 커리큘럼만 바꾸면 된다.
3. 확장성: 새로운 템플릿을 추가하기 쉽다.
4. 효율성: 검증된 외부 도구(Anthropic 스킬)를 활용해서 개발 시간을 단축했다.

한계

물론 완벽하지는 않다.

1. CSS 그래디언트 미지원: 사전 래스터화가 필요하다.
2. SVG 제한: PNG로 변환해야 한다.
3. 폰트 의존성: 시스템에 설치된 폰트만 사용 가능하다.
4. 스킬 의존성: Anthropic 스킬이 업데이트되면 호환성 확인이 필요하다.

마무리

AI 에이전트로 강의 자료를 자동 생성하는 시스템을 만들면서 배운 점을 정리해봤다.

1. 역할 분리가 핵심이다: AI한테 한 번에 너무 많은 일을 시키지 마라.
2. 사용자 확인 단계를 넣어라: AI의 블랙박스 문제를 해결할 수 있다.
3. 외부 도구를 적극 활용하라: 바퀴를 재발명하지 마라. Anthropic 스킬처럼 잘 만들어진 도구가 있으면 활용하고, 핵심 로직에 집중하라.
4. 커스터마이징에 집중하라: 도구를 가져다 쓰더라도 프로젝트에 맞게 입력을 설계하는 건 내 몫이다.

직접 구현 vs 스킬 활용 정리

나는 지금도 강의 교안을 만들면서 이 시스템을 계속 발전시켜 나가고 있다. 에이전트 시스템은 한 번 만들고 끝나는 게 아니다. 코드나 프로젝트처럼 사용하면서 개선점을 발견하고, 새로운 기능을 추가하고, 더 나은 방식을 찾아가는 것이다.

참고 자료

• Anthropic Skills GitHub