Problem
왜 만들었나요?
쏠북의 제본 서비스는 매일 들어오는 주문마다 표지를 별도로 디자인해 PDF로 만들어 인쇄하는 과정이 필요했습니다. 디자인은 6종의 정해진 템플릿(오트밀·레인보우·오렌지·빌딩·스카이·픽셀)을 썼지만, 실제 작업은 디자이너가 한 건씩 손으로 텍스트를 바꿔 PDF로 저장하는 방식이었습니다.
속도 병목
표지 1장에 약 5~10분. 하루 수십 건이 쌓이면 디자이너 시간이 통째로 묶임.
디자이너 의존도
디자이너가 자리를 비우거나 다른 업무 중이면 표지 작업 전체가 멈춤.
수작업 편차
학원명·교재명 길이에 따라 매번 폰트 크기·줄간격을 손으로 조정 → 같은 디자인인데도 결과물이 미묘하게 달라짐.
반복 노동의 비효율
디자인은 똑같고 글자만 다른데, 같은 작업을 매번 처음부터 반복.
→ “이건 사람이 할 일이 아니다, 자동화해야 한다”는 판단으로 프로젝트를 시작했습니다.
Approach
어떻게 만들었나요?
저는 비개발자 기획자입니다. 코드는 거의 못 쓰지만 Claude와 대화하며 단계별로 시스템을 설계·구현했습니다. AI가 작성한 코드를 제가 검증하고, 결과물을 보며 피드백을 주는 방식으로 완성도를 점진적으로 높였습니다.
Input ①
디자이너 표지 디자인 6종
좌표·폰트·색상 정의 (디자이너 샘플 PDF 기준)
→ slots.json
Input ②
구글시트 주문관리 탭
Google Sheets API로 주문 데이터 자동 조회
→ 교재명·학원명·전화번호 등
▼
② Python 처리 (PyMuPDF + Pillow)
- 한글을 이미지로 렌더링해 폰트 미설치 환경에서도 깨짐 방지
- 글자 길이에 따라 폰트 크기 95~60% 자동 축소
- 2줄 자동 분할 + 단어 단위 균형 분할 + 줄임표 처리
▼
④ 인쇄용 표지 PDF 자동 생성 (앞면+뒷면 A4 2쪽 · 6종 중 선택)
Downloads/YYYY-MM-DD/ 폴더에 자동 저장
{주문번호}_표지_{고객명}_{수량}_{색상}_{제본방식}_{페이지}_{원본파일명}.pdf
💡 웹 버전(라이브 데모)은 같은 좌표·폰트를 브라우저에서 사용해, 디자이너가 아니어도 누구나 직접 표지를 만들 수 있게 한 또 하나의 갈래입니다.
사용한 기술
| 영역 | 사용한 것 |
|---|
| AI 협업 | Claude (Cowork mode) |
| 자동화 언어 | Python 3 |
| PDF 처리 | PyMuPDF (fitz) |
| 한글 렌더링 | Pillow — 이미지로 렌더링 후 PDF 임베드 (폰트 미설치 환경에서도 깨짐 없음) |
| 디자인 소스 분석 | (초기) Figma REST API → (현행) 디자이너 샘플 PDF 픽셀 측정 |
| 데이터 연동 | Google Sheets API (gspread) |
| 한글 폰트 | Pretendard 9 weights · Eulyoo1945 · RiaSans · 학교안심리코더오 · HSHwalkongSerif |
| 웹 도구 | 단일 HTML + jsPDF (GitHub Pages 배포, 폰트·이미지 base64 내장) |
| 운영자 인터페이스 | Windows .bat 더블클릭 / 웹 링크 접속 (비개발자도 운영 가능) |
자동화의 핵심 아이디어
01
디자인–데이터 분리
디자인은 템플릿으로 고정, 글자 교체는 100% 자동화.
02
자동 레이아웃
글자 길이에 맞춰 폰트 크기 축소·2줄 분할·균형 분할점 탐색을 자동 처리.
03
운영–제작 두 갈래
대량 처리는 .bat 자동화, 한 건씩은 웹 도구 — 둘 다 동일한 결과물.
04
운영자 진입장벽 제거
비개발자도 .bat 더블클릭 한 번, 또는 웹 링크 접속 한 번이면 사용 가능.
Problem Solving
기술적으로 풀었던 문제 — 역량 사례
처음부터 매끄럽게 된 건 아니었습니다. 좌표 정확도를 잡는 과정에서 여러 시행착오를 거쳤고, 그 과정이 곧 문제 정의·검증·개선 역량을 보여줍니다.
Figma API 연동 시도 → 더 정확한 방식으로 전환
초기엔 Figma REST API로 원본에서 좌표·폰트·색상을 자동 추출했지만, 실제로는 디자이너가 내보낸 샘플 PDF의 텍스트 좌표가 최종 인쇄 기준이라는 점이 더 정확했습니다. 기준을 샘플 PDF로 통일하고 Figma 경로는 정리. → “두 시스템을 다 연동해 보고, 정확도를 기준으로 더 나은 쪽을 선택”한 사례.
좌표 기준 불일치 해결
엔진은 글자의 윗변(em-top)을, 웹은 밑줄(baseline)을 기준으로 좌표를 해석해 둘이 어긋남 → baseline 기준으로 통일해 근본 원인 제거.
템플릿 비율 문제 발견
일부 배경이 A4 비율이 아니어서 글자가 ~25pt 밀려 선에 붙는 현상 → 전 템플릿을 A4 비율 배경으로 교체.
6종 전면 최신화
모든 템플릿의 배경·좌표·폰트·색상을 최신 디자이너 샘플 기준으로 교체하고, 픽셀 단위 겹침 비교로 검증.
Result
결과는?
| 항목 | Before | After | 효과 |
|---|
| 표지 1장 제작 | 약 5~10분 (수작업) | 약 2~5초 (자동화) | 약 100~300배 단축 |
| 일일 처리량 | 디자이너 가용시간에 비례 | 클릭 한 번 일괄 처리 | 사실상 무제한 |
| 디자이너 투입 | 표지 작업 100% | 템플릿 디자인만 | 표지 텍스트 작업 의존도 0% |
| 품질 편차 | 작업자마다 다름 | 동일 알고리즘·좌표 | 100% 일관성 |
| 운영 가능 인원 | 디자이너만 | 누구나 (.bat·웹 링크) | 운영 부담 분산 |
* 정량 수치 일부는 추정치로, 실측 후 업데이트 예정입니다.
디자이너는 본업에 집중
반복 노동에서 해방되어 새 템플릿 디자인 등 창의적 업무에 시간 투입.
확장성 확보
새 디자인은 샘플 PDF로 배경·좌표만 교체하면 추가 가능.
품질 일관성
“어제와 오늘 표지가 미묘하게 다르다”는 문제 해소.
운영 자유도
디자이너 부재 시에도 기획자·CS 누구나 운영 가능.
Takeaway
이 프로젝트가 보여주는 것
- AI를 활용한 비개발자의 실무 자동화 구축 역량
- Google Sheets · Figma · Python 등 이종 시스템 연동 설계, 그리고 정확도 기준의 기술 선택
- 디자인–개발 협업 파이프라인 자동화 기획 능력
- 운영자(현장 사용자) 친화적 UX 설계 (.bat 더블클릭 / 웹 링크로 단순화)
- 단계적 검증과 개선 — PoC → 좌표 추출 → 기준 통일 → 픽셀 검증 → 실운영
AI 협업(Claude)PythonPyMuPDFPillowjsPDFGoogle Sheets APIGitHub Pages자동화 기획비개발자 도구화