코딩 없이 AI(구글 안티그래비티)로 ‘누끼 텍스트’ 서비스 만든 과정

코딩 1도 몰라도 OK. 구글 안티그래비티로 ‘인물 뒤 텍스트’ AI 서비스 만든 과정 (Feat. 누끼 텍스트)

안녕하세요, 기획하는 디자이너 스탠리탬입니다.

요즘 유튜브 썸네일이나 인스타그램, 혹은 보그(Vogue) 같은 잡지 커버를 보면 인물 뒤에 텍스트가 자연스럽게 배치된 디자인을 자주 보셨을 겁니다. 이걸 포토샵으로 하려면 ‘누끼(배경 제거)’ 따고, 레이어 순서 바꾸고… 꽤 번거로운 작업이죠.

“이걸 웹에서 1초 만에 해주는 도구가 있으면 어떨까?”

이 단순한 아이디어 하나로 시작해, 저는 단 며칠 만에 [누끼 텍스트 (Nukki Text)] 라는 서비스를 런칭했습니다. 놀라운 점은, 제가 직접 코드를 짠 게 아니라 AI 에이전트(구글 안티그래비티 & 제미나이)에게 지시만 내려서 완성했다는 것입니다.

오늘은 그 생생한 제작기와 시행착오를 공유합니다.

---

1. 아이디어: “Rexan Wong의 3시간, 나도 할 수 있을까?”

해외 개발자 Rexan Wong이 ‘Text Behind Image’ 서비스를 3시간 만에 만들었다는 소식을 들었습니다. 저는 여기서 한 발 더 나아가, 한국 크리에이터들에게 딱 맞는 직관적인 기능을 담고 싶었습니다.

• 핵심 기능: 이미지 업로드 즉시 배경 제거 + 텍스트 합성
• 차별점: 서버 비용 0원 (사용자 브라우저 처리), 한국어 폰트 최적화, 직관적인 UI

2. 개발 과정: AI 에이전트와의 협업

저는 ‘구글 안티그래비티(Google Antigravity)’라는 에이전트 중심의 개발 방식을 활용했습니다. 개발 과정은 마치 유능한 개발 팀장에게 업무 지시를 내리는 것과 같았습니다.

Phase 1. 핵심 로직 구현 (샌드위치 기법)

가장 중요한 건 “어떻게 텍스트를 인물 뒤로 보내느냐”였습니다. 제미나이는 ‘샌드위치 레이어링’이라는 명쾌한 해답을 주었습니다.

이 순서대로 겹치니 감쪽같이 텍스트가 뒤로 들어갔습니다.

Phase 2. 브랜딩 & UI 개선

초기 이름은 단순히 ‘Text Behind Image’였지만, 한국 시장에 맞춰 ‘누끼 텍스트(Nukki Text)’로 리브랜딩했습니다. “누끼 딴다”는 말이 디자이너들에겐 가장 직관적이니까요.

• 다크 모드 UI 적용
• 드래그 앤 드롭 지원
• 미드저니로 만든 고퀄리티 예시 갤러리 추가

3. 위기: “배포했더니 작동을 안 해요!” (트러블 슈팅)

물론 순탄치만은 않았습니다. 로컬(내 컴퓨터)에서는 잘 되던 게 Vercel에 배포하니 먹통이 되는 현상이 발생했습니다.

🚨 문제: 외부 API 서버를 썼더니 비용 문제와 CORS(보안) 에러가 발생.
✅ 해결: 제미나이의 조언대로 Transformers.js를 도입해, 서버를 거치지 않고 사용자의 브라우저(Client-side)에서 AI가 직접 돌아가도록 전면 수정했습니다.

덕분에 서버 비용은 0원이 되었고, 속도는 훨씬 빨라졌습니다. (이 과정에서 터미널 경로 문제로 git push 오류가 났던 건 비밀… 하지만 이것도 제미나이가 알려준 PowerShell 명령어로 해결했습니다. 😂)

4. 결과물 공개: 누끼 텍스트 (Nukki Text)

그렇게 완성된 서비스가 바로 이것입니다. 지금 바로 접속해서 테스트해 보세요.

[주요 기능]

• ✅ 0.1초 자동 누끼: 업로드하자마자 AI가 배경을 분리합니다.
• ✅ 디자인 자유도: 텍스트 크기, 컬러, 위치, 폰트까지 자유롭게 수정 가능.
• ✅ 완전 무료: 회원가입 X, 워터마크 X, 무제한 다운로드.

5. 마치며: 기획자의 상상은 현실이 된다

이번 프로젝트를 통해 깨달았습니다. 이제 ‘코딩을 못해서 아이디어를 실현 못 한다’는 말은 핑계가 되었습니다. 중요한 건 코딩 실력이 아니라, “무엇을 만들 것인가(Planning)”와 “AI에게 어떻게 질문할 것인가(Prompting)”입니다.

여러분도 나만의 아이디어가 있다면, 지금 바로 AI와 함께 시작해보세요. 생각보다 훨씬 빠르고, 재밌습니다.