brunch

커서AI/클로드/피그마로 프로덕트 디자인&개발하기

by 유훈식 교수
AI 시대, 아이디어만 있다면
3주 만에 서비스 런칭도 가능하다

AI 기술의 발달로 디자이너가 아이디어만 있으면 풀스택 개발까지 해내는 시대가 열렸다. UX/UI 디자이너 출신인 이태윤 대표(프레자일)는 이를 직접 보여줬다. 이 대표는 Figma로 디자인하고 Cursor AI와 Claude 같은 AI 코딩 도구의 힘을 빌려, 불과 3주 만에 3D 아이콘 생성 서비스를 런칭했다. 전문 개발자 없이도 아이디어를 빠르게 실현한 그의 노하우는 무엇일까? 이번 글에서는 이태윤 대표가 서비스 개발을 경험을 통해 얻은 인사이트와, 그가 3총사 도구를 활용해 빠르게 서비스를 만든 과정을 살펴보자.

(*여기에 실린 내용은 AI 디자인 세미나에서 이태윤 대표 발표 내용을 정리한 자료입니다.)

https://youtu.be/MTR0Vp3QESY?si=FGB01Wyu-5rQr1vP

a1.png
아이디어의 출발:
문제 해결도 좋지만
비즈니스 모델을 놓치지 말자

스타트업 업계에서는 흔히 “사용자의 문제를 찾아내 해결하라”고 조언한다. 하지만 이태윤 대표는 여기서 한 걸음 더 나아가 비즈니스 모델 관점에서 아이디어를 고민해야 한다고 강조한다. 그는 “아무리 좋은 문제 해결이라도 돈을 버는 구조가 없으면 오래 버티기 어렵다”고 말한다. 실제로 많은 스타트업이 뛰어난 제품을 내놓고도 수익 구조를 못 찾아 사라진다.

a2.png

이태윤 대표 역시 과거에 예술품 거래 플랫폼 스타트업을 운영하며 이를 뼈저리게 느꼈다. 사용자 반응도 좋고 매출도 꽤 올랐지만, 비용 구조가 취약해 결국 2년 반 만에 문을 닫았다고 한다. 플랫폼은 초기 시장을 만들기 위해 막대한 마케팅 비용과 운영 인력이 필요했고, 거래가 늘어도 수수료 수익은 미미했다. 이처럼 문제 해결에 집중한 나머지 정작 팔수록 적자인 모델이었다는 것이다. 실제로 2020년대 들어 e커머스 플랫폼 10곳 중 4곳이 완전자본잠식 상태에 빠졌다는 분석도 있다. 예컨대 오늘의집이나 에이블리 같은 유명 플랫폼들까지 적자를 면치 못해 사업 지속 가능성이 우려된다는 뉴스도 있었다. 쿠팡조차 최근 흑자 전환을 발표했지만 회계상의 마법이라는 지적이 있을 정도로 플랫폼의 수익성은 큰 숙제다.


이런 업계 흐름을 보며, 이태윤 대표는 아이디어를 구상할 때 “어떤 문제를 해결할 것인가”뿐 아니라 “어떤 비즈니스 모델로 수익을 낼 것인가”를 동시에 자문했다고 한다. 아무리 대단한 솔루션이라도 팔수록 손해를 보면 오래 갈 수 없기 때문이다. 특히 개인 혹은 소규모 팀으로 시작한다면, 처음부터 지속 가능한 모델을 고민하는 것이 중요하다.


플랫폼 vs SaaS:
어떤 사업 모델이 유리할까?

이태윤 대표는 경험을 통해 플랫폼 모델의 한계를 절감했고, 대안으로 SaaS 모델에 주목했다. 두 모델의 차이를 간략히 비교해보자. 플랫폼 플랫폼은 공급자와 수요자를 연결해주는 중개형 비즈니스다. 예를 들어 당근마켓이나 오늘의집, 무신사 같은 서비스가 플랫폼에 속한다. 플랫폼은 네트워크 효과 덕분에 임계점을 넘으면 폭발적 성장이 가능하다. 하지만 문제는 임계점에 도달하기까지 막대한 시간과 돈이 든다는 점이다. 초기에 공급자와 사용자를 모두 확보하려면 출혈 경쟁을 해야 하고, 두 측면의 균형을 맞추기 위해 운영 인력이 많이 들어간다. 고객이 늘수록 CS(고객응대) 업무도 폭증한다. 이렇듯 플랫폼은 규모의 경제를 이루기 전까지 수익이 거의 발생하지 않거나 적자가 쌓이는 구조다. 많은 플랫폼 스타트업들이 1~2년은커녕 수년째 적자를 견디며 외부 투자로 연명하는 사례가 흔하다. 심지어 어느 정도 성장한 뒤에도 플랫폼의 수수료 수익률은 낮기 때문에, 어설픈 규모로는 수익을 내기 어렵다. 결국 플랫폼 사업은 계속해서 고속 성장하지 않으면 살아남기 힘든, 하이 리스크 모델인 셈이다.

n3.png

반면 SaaS(Sofware as a Service) 모델은 소프트웨어나 서비스를 구독 형태로 제공하는 사업이다. Adobe Creative Cloud, Slack, Notion 등을 떠올리면 쉽다. SaaS의 가장 큰 장점은 초기 진입 장벽이 낮다는 것이다. 하나의 뾰족한 기능만 있어도 유료로 제공할 수 있고, 극단적으로는 고객이 한 명이어도 바로 매출이 발생한다. 사용자 입장에서도 필요에 따라 구독/결제를 하기 때문에 조기에 수익 흐름을 만들 수 있다. 또한 SaaS는 디지털 제품이라 고정비만 감당하면 신규 이용자 증가에 따른 변동비가 적고, 마진율이 높다. 덕분에 플랫폼처럼 대규모 인력이나 물류/공급망 없이 소수의 인원으로도 서비스를 운영할 수 있다. 이태윤 대표는 “SaaS 모델은 리스크를 적게 지고도 차근차근 성장시킬 수 있다”고 말한다. 작은 팀이라도 견딜 수 있는 장기전이 가능하다는 뜻이다.


물론 SaaS라고 무조건 성공하는 건 아니지만, 사업 초반에 손익분기점을 넘기 쉬운 구조라는 점에서 플랫폼보다 유리하다. 이태윤 대표는 두 번째 창업에서는 플랫폼 대신 SaaS 모델을 택했다. “간단한 기술 구현만 가능하다면, 작은 SaaS 아이디어로도 충분히 승부할 수 있다”는 믿음이 있었기 때문이다. 그가 주목한 것은 거창한 슈퍼앱이 아니라, 한 가지 기능에 집중한 “마이크로 SaaS”였다.


작지만 강한 서비스의 힘:
마이크로 SaaS 성공 사례

흔히 혁신적인 스타트업이라면 플랫폼처럼 규모 있는 서비스를 떠올리지만, 작은 SaaS 서비스도 대박을 낼 수 있다. 이태윤 대표는 몇 가지 마이크로 SaaS 성공 사례를 소개했다.

a4.png

Crayo(크레요)

17살의 콘텐츠 크리에이터가 만든 쇼츠 영상 자동 편집 AI 서비스다. 창업자 Daniel은 틱톡과 유튜브 쇼츠에 영상을 올리던 중, 매번 긴 영상을 잘라 쇼츠로 만드는 일이 너무 번거롭다는 걸 깨달았다. 그는 AI로 이 과정을 자동화하기로 마음먹고 친구와 단둘이 프로토타입을 개발했다. 긴 영상을 업로드하면 알아서 10-20초 길이의 멋진 쇼트 영상으로 뽑아주는 Crayo가 탄생한 것이다. Crayo는 출시 초반에는 형편없는 품질이었다고 하지만, 이용자 피드백을 바탕으로 빠르게 개선되었다. 마케팅도 유튜브 인플루언서 제휴를 통해 유기적 성장을 이뤘고, 놀랍게도 현재는 월 5060만 달러(한화 약 6~8억 원)의 매출을 달성했다고 한다.

https://crayo.ai/


Remove.bg

배경 제거에 특화된 이미지 편집 웹툴이다. 이 서비스는 기능이 단 하나, 이미지에서 배경을 지워 투명 PNG로 만드는 것뿐이다. 얼핏 소소해 보이지만 전 세계 수많은 디자이너와 마케터들이 애용한 결과, 무려 월간 3천만 명 이상이 사용하는 서비스로 성장했다. remove.bg는 복잡한 포토샵 기술 없이 클릭 한 번으로 5초 만에 배경을 지워준다. 덕분에 누적 1억 5천만 장 이상의 이미지가 이 서비스를 거쳐 갔다. 사용자는 무료로 일부 이용하고, 더 많은 고해상도 이미지를 처리하려면 유료 크레딧을 구매하는 모델인데, 이를 통해 연간 수십억 원대의 매출을 올리고 있다.

https://www.remove.bg/ko


Design Joy

한 프리랜서 디자이너 별명이자 그의 서비스다. 이 디자이너는 기업들로부터 디자인 작업을 월 구독 형태로 받아 처리하는 1인 디자인 에이전시를 운영 중이다. 디자인 프로세스를 철저히 시스템화하여 혼자서도 한 달에 약 30개의 프로젝트를 소화한다고 한다. 놀랍게도 이 1인 비즈니스의 월 매출이 2억 원에 달한다. 일감을 연속적으로 따내기 어려운 프리랜서 업계에서, 오히려 구독형 비즈니스 모델을 도입해 안정적이고 높은 수익을 올리는 예다. 이 역시 노하우를 제품화한 하나의 SaaS(본인이라는 서비스를 구독시키는 셈)로 볼 수 있다.

https://design-joy-website.webflow.io/


위 사례들이 주는 교훈은 분명하다. 꼭 거대한 플랫폼이나 수많은 기능을 가진 앱이 아니어도, 하나의 뾰족한 서비스로도 충분히 승부할 수 있다. 특히 AI 기술과 접목하면 작은 팀(혹은 개인)도 옛날 같으면 불가능했을 서비스를 만들 수 있다. 중요한 것은 “내가 잘 아는 분야에서 반복적인 문제를 자동화할 아이디어”를 찾는 것이다. 이태윤 대표도 자신의 강점과 필요를 돌아보다가 새로운 아이디어를 얻었다.

https://onoffmix.com/event/324480


3D 아이콘 자동 생성 서비스
아이디어의 탄생

현업에서 이태윤 대표는 블렌더로 아이콘을 만들어보기도 했지만 퀄리티를 높이려면 시간이 너무 많이 걸렸다고 한다. 그렇다고 매번 필요한 아이콘을 외주 제작하거나 스톡 사이트에서 구매하자니, 비용 부담이 크고 원하는 스타일을 찾기도 어려웠다. 간혹 괜찮은 3D 에셋을 구해도 우리 회사 브랜드와 안 어울리는 경우가 많았다. 예를 들어 색상이나 질감이 브랜드 아이덴티티와 동떨어져 있거나, 라이선스 이슈로 상업적으로 쓰기 애매한 문제가 있었다.

n7.png

이런 현실적인 필요를 느끼던 차에, 시장의 움직임을 보니 확신이 생겼다. 대표적 핀테크 기업 토스(Toss)에서 내부적으로 3D 그래픽을 생성해주는 AI 툴 "토스트(Tosst)"를 개발했다는 소식이 들려왔다. 토스 디자이너들이 해당 AI로 빠르게 3D 이미지를 만들어 쓰고 있다는 내용이 회사 블로그를 통해 공개됐는데, 이를 본 디자이너들 반응이 뜨거웠다. “이걸 왜 공개 안 하냐, 유료라도 쓰고 싶다”는 요청이 쇄도했을 정도다. 또 해외에도 3D 아이콘 생성 AI 서비스가 몇 가지 출시돼 있었는데, 품질이 조악해도 어느 정도 유료 구독자를 확보하고 있었다. 이는 곧 시장에 수요가 존재한다는 증거였다.

a6.png

마침 이태윤 대표 본인도 그동안 틈틈이 3D 디자인 작업물을 모아둔 데이터셋이 있었다. 이를 활용하면 AI를 훈련시켜 일관된 스타일의 3D 아이콘을 생성할 수 있을 것 같았다. AI로 이미지를 만들면 결과물(아이콘 파일)을 직접 판매하는 셈이니, 재료비나 물류비용 없이 운영할 수 있다. 고객 지원도 최소화할 수 있다. 플랫폼처럼 양면 시장을 관리할 필요가 없으니 혼자서도 충분히 운영 가능한 SaaS가 될 것이라 봤다. 이렇게 해서 “3D 아이콘 AI 생성 서비스” 아이디어가 구체화되었다. 이태윤 대표는 자신의 서비스를 “Oven AI”라고 이름 붙였다. 번거롭게 직접 굽지 않아도 오븐에 재료만 넣으면 척척 완성된다는 뉘앙스를 담았다.

https://onoffmix.com/event/324480

오븐AI 둘러보기:
10초 만에 뚝딱 완성되는 3D 아이콘

이태윤 대표가 개발한 오븐AI는 한마디로 “3D 아이콘 버전의 DALL·E”라고 할 수 있다. 사용자는 필요한 아이콘의 개념을 프롬프트(텍스트 명령)로 입력해 생성하거나, 미리 준비된 프리셋 버튼을 눌러 간편하게 만들어낼 수 있다. 예를 들어 프롬프트에 “3D 아이콘 of 햄버거”라고 입력하면, 맛깔스러운 햄버거 모양의 3D 아이콘을 생성해준다. 생성된 아이콘 이미지는 기본적으로 배경이 투명한 PNG여서 바로 디자인에 활용할 수 있다. 추가 보정 작업 없이 실무 투입이 가능하도록 배려한 것이다.

a8.png

오븐AI의 강점은 일관된 퀄리티와 브랜드 커스터마이징에 있다. 일반적인 이미지 생성 AI로 아이콘을 만들어보면 매번 스타일이 들쭉날쭉해서 한 세트처럼 보이지 않는 문제가 있다. 그러나 오븐AI는 이태윤 대표가 직접 만든 3D 에셋 데이터로 별도 학습한 모델이라, 어떤 내용을 만들든 통일감 있는 스타일로 나온다. 질감, 채색 등도 프로가 손수 만든 것처럼 깔끔하다. 또한 결과물에 사용자 지정 색상을 입힐 수 있어 브랜드 색상을 반영하기 쉽다. 예를 들어 파란색 계열을 브랜드 색으로 쓰는 기업이라면, 생성된 아이콘의 주요 색을 파랑톤으로 변경해 자기 회사 느낌을 살릴 수 있다. 기존 스톡 3D 에셋들은 색이나 형태를 바꾸기 어려워 활용도가 떨어졌는데, 오븐AI는 아이콘 수정 기능까지 제공하며 이 약점을 해소했다.


3총사 도구를 활용한
3주 개발 비법

이쯤에서 궁금해지는 부분: 개인 디자이너가 어떻게 3주 만에 웹서비스를 개발했을까? 여기에는 AI 시대의 강력한 무기들이 동원됐다. 바로 Figma, Cursor AI, Claude 세 가지 툴(여기에 몇 가지를 더 보태 총 5~6가지)을 적재적소에 활용한 것이다. 이태윤 대표는 “이 모든 것을 다 쓸 필요는 없지만, 하나라도 익혀두면 분명 개발 생산성이 올라간다”고 조언한다. 각각의 역할을 살펴보자.

a9.png

1. Figma + Framer: 디자인을 코드로 즉시 변환

Figma(피그마)는 대부분의 UI디자이너들이 애용하는 디자인 툴이다. 이태윤 대표는 오븐AI의 화면 UI를 Figma로 먼저 설계했다. 핵심은 Figma의 오토 레이아웃 기능을 적극 활용한 것이다. 컴포넌트와 레이아웃을 개발자들이 쓰는 CSS 박스 모델처럼 짜두면, 이후에 Framer라는 마법 같은 도구를 활용할 수 있다. Framer(프레이머)는 Figma 디자인을 가져와 코드 없이 웹사이트로 퍼블리싱할 수 있게 해주는 툴이다. 쉽게 말해, 디자이너가 Figma로 그린 시안을 Framer로 가져가면 즉시 웹페이지로 변환된다. Framer 자체가 호스팅도 해주기 때문에 별도의 서버 세팅 없이 디자인에서 웹 완성까지 원스톱으로 해결된다.

a10.png

2. V0: AI에게 기본 코드 뼈대를 받아라

프론트엔드 개발을 더 고도화할 때 도움을 준 것이 V0라는 AI 도구다. V0는 일종의 코드 생성 AI인데, 원하는 화면이나 컴포넌트를 프롬프트로 설명하면 그에 해당하는 React/TypeScript 코드를 뽑아준다. 예를 들어 “모던한 SaaS 랜딩 페이지 만들어줘”라고 하면, 헤더와 섹션 등이 갖춰진 기본 랜딩 페이지 코드를 제안해준다. 아직 완벽하지는 않지만, 개발의 출발점을 잡아주는 용도로 쓸 만하다. 특히 “이 사이트와 비슷하게 만들어줘”라며 참고하고 싶은 사이트의 URL이나 스크린샷을 주면, 해당 디자인을 분석해 유사한 레이아웃과 스타일의 코드로 바꿔주기도 한다. 이 기능을 활용하면, 예전에 좋다고 생각했던 웹 디자인을 신속히 모방해볼 수도 있다.

a11.png

3. Cursor AI: AI 내장형 코드 에디터

Cursor AI(커서)는 최근 각광받는 AI 코드 에디터다. 마치 GitHub Copilot처럼 코드 작성 중 자동 완성이나 코드 생성 제안을 해주지만, Cursor는 자체 에디터 환경을 제공하며 챗GPT와 연계된 대화형 코딩 기능도 갖췄다. 이태윤 대표는 Framer와 V0로 얻은 초안을 Cursor 에디터로 가져와 본격적인 기능 개발을 진행했다. 예를 들어 백엔드 API 작성이 필요할 때 Cursor에 명령하면 기본적인 함수 코드를 만들어준다. 프론트엔드에서 상태 관리 로직을 짤 때도 “이런 기능을 구현하는 함수를 만들어줘”라고 하면 얼추 돌아가는 코드를 준다. Cursor의 강점은 이렇게 IDE 통합 환경에서 바로바로 AI의 도움을 받을 수 있다는 점이다.

a12.png

4. Claude: 든든한 AI 페어 프로그래머

Cursor를 쓰면서 부족했던 부분은 또 다른 AI 비서 Claude(클로드)로 보완했다. Claude는 Anthropic사에서 개발한 초거대 언어모델로, 일반적인 대화부터 코딩까지 GPT-4와 유사한 활용이 가능하다. 특히 긴 맥락을 유지하며 대화를 이어갈 수 있고, 코드 해석 능력이 뛰어나서 개발자가 애용하는 도구 중 하나다. 이태윤 대표는 “클로드의 코딩 정확도가 가장 높다”고 평가했다.


결국 이태윤 대표는 Figma → Framer → V0 → Cursor → Claude라는 도구 조합을 통해 각 단계별로 효율을 극대화했다. 디자인 단계에서는 친숙한 Figma로 시작해 Framer로 빠른 시제품을 만들고, 개발 단계에서는 V0와 Cursor로 자동화된 코드 작성을, 마무리 단계에서는 Claude로 문제 해결 및 최적화를 한 것이다. 모든 작업을 AI가 해주는 건 아니지만, 사람이 100을 해야 할 일을 AI가 50 이상 도와주니 혼자서도 충분히 해낼 수 있었다. 그는 “이들 도구를 적절히 짬뽕해서 쓰는 게 포인트”라고 말한다. 하나만 써도 이득이지만, 여러 개를 조합하면 그 효과가 곱절이 된다는 의미다.


5. Replicate와 인프라: AI 모델 서비스화하기

마지막으로, 오븐AI처럼 AI 모델을 서비스에 통합하려면 개발 외에 고려할 점이 있다. 바로 머신러닝 모델 호스팅과 인프라 구성이다. 이 부분도 다행히 요즘은 좋은 서비스를 활용하면 어렵지 않다. 이태윤 대표는 Replicate라는 플랫폼을 적극 활용했다. Replicate는 간단히 말해 커스텀 AI 모델을 클라우드에서 돌려주는 서비스다. Stable Diffusion 같은 오픈소스 모델을 업로드하거나, 본인이 데이터로 모델을 훈련시켜서, API 형태로 호출할 수 있게 해준다. 이태윤 대표는 자신이 갖고 있던 3D 아이콘 데이터로 이미지 생성 모델을 파인튜닝(fine-tuning)했고, 그 모델 파일을 Replicate에 배포했다. 이후 웹 서비스에서 HTTP API 호출만 하면 Replicate 서버가 AI 모델을 구동해 이미지를 반환해준다. 복잡한 ML 서버를 직접 셋업할 필요 없이, 외부 서비스에 맡겨서 핵심 기능을 구현한 셈이다.

a13.png

정리하면, 오븐AI의 기술 스택은 프론트엔드에 Figma+Framer (추가 개발분은 Next.js+TypeScript), 백엔드에 Vercel 서버리스 + Supabase DB, AI 모델은 Replicate API, 결제는 Stripe로 구성되었다. 모두 클라우드 서비스이고, 별도 서버 인프라를 직접 관리하지 않아도 되는 요소들이다. 덕분에 이태윤 대표 혼자서도 개발부터 배포, 운영까지 엔드투엔드(End-to-End)로 소화할 수 있었다.


디자이너, AI와 친해지면
무엇이든 만들 수 있다

이태윤 대표의 사례는 현업 디자이너들에게 시사하는 바가 크다. 디자인 감각과 도메인 지식을 갖춘 사람이 최신 생성형 AI 도구들을 활용하면, 예전에는 개발자 없이 불가능했던 일도 가능해지는 시대다. 그는 과거 플랫폼 창업 실패를 교훈 삼아, 작지만 실속 있는 SaaS 아이디어를 찾아냈고, 이를 검증하기 위해 최대한 빨리 시장에 내놓는 전략을 선택했다. 그리고 이를 뒷받침해준 것이 Cursor AI, Claude, Figma 등 도구들의 힘이었다. 개발 경험이 부족해도, UI 디자인 능력에 AI 코딩 비서를 더하니 풀스택 프로토타이핑이 현실이 된 것이다.


물론 모든 디자이너가 혼자 서비스를 출시해야 하는 것은 아니다. 하지만 적어도 제품 개발 프로세스 전반을 이해하고, 현대의 자동화 도구를 접해보는 건 큰 자산이 된다. 이태윤 대표는 “한 가지 툴만이라도 꾸준히 써보라”고 조언한다. 예를 들어 평소 Figma만 쓰던 디자이너라면 Framer로 간단한 웹페이지라도 만들어보고, ChatGPT나 Claude에게 코드를 물어보며 프로그래밍 감각을 길러보라는 것이다. 그렇게 한 단계씩 넘어서다 보면, 어느새 자신만의 앱이나 서비스를 거뜬히 만들어낼 수 있는 창작자 겸 메이커로 성장할 수 있다.

이제 아이디어의 가치는 실행으로 증명하는 시대다. 3주 만에 서비스 런칭이라는 이야기가 더 이상 꿈같이 느껴지지 않는다면, 당신도 도전해보면 어떨까? 디자이너의 상상력에 AI 비서들의 힘을 더하면, 불가능이 가능으로 바뀐다. 오늘도 어딘가에서는 작은 아이디어가 AI의 날개를 달고 세상에 나오고 있다. 그 주인공이 다음엔 우리 현업 디자이너들이 되기를 기대해본다.


커서, 클로드, 피그마를 활용한 디자인 방법을 배우고 자격증도 취득하고 싶다면?

qj5t51iH9RmJrVsCqlCsWck5Ufw.png

https://onoffmix.com/event/324480

AI 디자이너들과 소통하며 함께 성장하고 싶다면?

https://litt.ly/aidesign


keyword
매거진의 이전글Figma MCP가 혁신하는 디자인-개발 업무방식