AI 이미지 생성을 제품에 붙이면 처음에는 잘 굴러가는 것처럼 보입니다. 프롬프트를 넣으면 그럴듯한 이미지가 나오니까요.
문제는 그 다음입니다. 굿즈나 POD(주문제작) 쪽에 붙이는 순간, 생성 API가 돌려주는 건 "그림"이지 "인쇄소가 받아주는 파일"이 아니라는 걸 알게 됩니다.
실제로 필요한 건 이 세 가지였습니다.
이 글은 그 사이를 메우면서 겪은 것들을 정리한 내용입니다. 스택은 Next.js / Vercel / sharp 입니다.
먼저 짚고 갈 부분입니다. DPI는 픽셀 데이터를 바꾸지 않습니다. 메타데이터일 뿐입니다.
즉 DPI만 300으로 고쳐도 실제 해상도가 올라가지는 않습니다. 반대로 픽셀이 충분한데 DPI 메타데이터가 빠져 있으면, 인쇄 쪽 툴에서 엉뚱한 물리 크기로 잡혀서 반려되는 일이 생깁니다.
그래서 픽셀 크기와 DPI 메타데이터를 둘 다 명시적으로 관리해야 합니다. 둘 중 하나만 맞춰놓고 "괜찮겠지" 하면 마지막에 터집니다.
처음에 떠올리기 쉬운 방식은 특정 색상 범위를 잘라내는 것입니다. 배경이 단색이면 그럭저럭 동작합니다.
문제는 실패하는 경우가 하필 제일 티 나는 곳이라는 겁니다.
이런 데서 색상 기반 컷아웃은 경계가 갉아먹히거나, 반대로 배경 찌꺼기가 남습니다. 셔츠에 인쇄하면 흰 테두리로 그대로 보입니다.
그래서 semantic segmentation 모델을 태우는 쪽으로 갔습니다. 색이 아니라 "이게 피사체인가"를 기준으로 나누기 때문에, 디테일이 많은 아트워크에서도 경계가 살아남습니다.
여기가 실제로 제일 많이 물린 부분입니다.
파이프라인은 대략 생성 → 배경 제거 → 리사이즈 → 내보내기 순인데, 각 단계에서 무엇이 유지되고 무엇이 떨어지는지를 모르면 사고가 납니다.
sharp를 쓸 때 특히 주의할 점 두 가지입니다.
fit 옵션과 배경 설정에 따라 결과가 달라집니다.두 번째는 실제로 다른 플랫폼에 제출할 때 걸렸던 케이스입니다. 로고를 정사각형으로 리사이즈해서 냈는데, 요구사항이 "배경색 있는 정사각형"이었고, 리사이즈만 한 파일은 모서리가 투명이라 규격에 안 맞았습니다. .flatten({ background: '#ffffff' })을 붙여야 알파가 실제로 제거됩니다.
핵심은 이겁니다: 마지막 한 단계 전까지 눈으로 보기엔 멀쩡합니다. 브라우저에서 미리보기 하면 다 정상으로 보이고, 인쇄 입고 단계에서야 반려됩니다.
인쇄 가능 영역은 의류 종류마다 다릅니다. 캔버스를 꽉 채워서 디자인을 만들면, 실제 인쇄에서 가장자리가 잘립니다.
그래서 생성 단계에서부터 안전 여백을 전제로 구도를 잡도록 하고, 최종 파일도 그 규격에 맞춰 내보냅니다. 이건 후처리로 억지로 맞추기가 어렵습니다. 이미 잘린 구도를 되살릴 수는 없으니까요.
결과물을 셔츠 위에 얹어서 보여주는 라이브 프리뷰를 넣었는데, 처음에는 그냥 "보기 좋으라고" 만든 기능이었습니다.
써보니 실제 역할은 달랐습니다. 이건 사용자가 다운로드 전에 스스로 검수하는 단계입니다.
6가지 의류 타입과 12가지 색상을 브라우저에서 바로 전환해볼 수 있게 한 것도 같은 이유입니다. 파일을 받아서 인쇄소에 넘긴 다음에 발견하면 늦습니다.
AI 이미지 생성을 "출력물"까지 연결할 때 결국 중요했던 건 이 네 가지였습니다.
생성 모델 자체보다, 생성 이후의 파이프라인에서 시간을 더 많이 썼습니다. "그림이 나온다"와 "쓸 수 있는 파일이 나온다" 사이의 거리가 생각보다 멉니다.
글쓴이는 문장 하나로 티셔츠 디자인을 만드는 T-Shirt Design AI를 개인 개발하고 있습니다. 이 글의 내용은 해당 제품에서의 구현을 기반으로 합니다.