코드 하나 모르는 디자이너가 사내용 제품을 만들기까지

AI 혁신이 폭발적으로 진행되는 요즘, 여기저기서 “커서(Cursor) 대단하다”, “AI 코딩 시대 열렸다”라는 소식을 들었다. 하지만 솔직히 말해 내겐 먼 이야기였다.

‘개발자들만 좋아하는 것 아닌가?’

디자이너로서 더 와닿았던 건 포토샵에서 빈 공간을 자연스럽게 AI로 채워주는 기능 같은 것들이었다. 그래서 커서 이야기도 그냥 스쳐 들을 뿐, 나와는 상관없는 기술이라 생각하며 지냈다.

부끄러운 질문 하나, 그리고 시작된 변화

어느 날, 미국에서 일하는 후배가 한국에 와서 물었다.

“선배도 커서 쓰세요?”

나는 아무렇지 않게 대답했다.

“아니, 아직… 써본 적 없어.”

그 대화 뒤에 흐르던 미묘한 적막.

그리고 이유 모를 부끄러움.

‘이제는 나도 AI를 제대로 써봐야 하는 걸까?’ 하는 자극이 찾아왔다.

직후에 커서를 설치해보긴 했지만, 처음 느낀 인상은 ‘전문 개발자를 위한 툴’ 그 자체. 화면 가득 펼쳐진 코드 중심의 UI는 쉽게 나를 환영하지 않았다.

구글 AI 스튜디오와의 첫 만남

그러던 중 우연히 Google AI Studio를 접하게 됐다.

이 서비스는 템플릿도 많고, 자연어로 말하면 어느 정도의 기능을 ‘찰떡같이’ 구현해줬다.

커서보다 확실히 접근성이 높았고, 그래서 다양한 실험을 해보기 시작했다.

사내에서도 AI 스튜디오로 간단한 프로토타입을 만들어 동료들과 공유했는데, 오히려 말로 설명할 때보다 제품 형태로 보여주는 것이 훨씬 더 명확한 의사소통 방식이라는 사실을 깨달았다.

‘이거… 디자이너에게 꽤 좋은 도구인데?’

디자인 반복 업무를 자동화해보자

마침 사내에서 반복적으로 수행하던 SNS용 디자인 생성 업무가 떠올랐다.

안그래도 빌더를 만들고 싶었지만, 현재 회사 상황상 다른 우선순위 업무들이 많아 개발팀을 쓸 여력이 없는 상황이었다.

“이걸 내가 AI 스튜디오에서 빌더로 만들어보면 어떨까?”

그렇게 바로 구현을 시도했고, 놀랍게도 어느 정도 내가 생각한 형태가 금방 나왔다.

디자인 시스템을 완벽히 반영할 수는 없었지만,

“버튼 색 #000000, 라운드값 4px”

처럼 말하듯 입력하면 바로 UI에 반영되는 경험이 굉장히 신선했다.

AI 스튜디오의 한계, 그리고 커서로의 이주

약 80%까지 완성된 시점에서 문제가 생겼다.

특정 이미지를 임베드한 워터마크와 푸터 레이아웃이 필요했는데

AI 스튜디오에서는 외부 이미지를 컴포넌트로 삽입하는 기능을 지원하지 않았다.

이 지점에서 작업이 멈춰버렸다.

그러던 어느 날, CTO와 술 한 잔을 하던 자리에서 해결책을 들었다.

“AI 스튜디오 프로젝트 그대로 export해서 커서에서 이어서 하면 이미지도 넣을 수 있어요.”

그 말에 다시 용기를 얻었고, 본격적인 커서 생활이 시작되었다.

커서라는 새로운 세계

커서를 사용하며 처음 느낀 점은

• ‘전문성은 확실하지만, 진입 장벽도 만만치 않다’

• Git 연동 / 배포

• 이미지 에셋 삽입 가능

• 개발 서버 실행하여 로컬 미리보기

• MCP를 통한 피그마 연동

이 모든 작업을 AI와 대화하며 할 수 있지만, 최소한 개념은 알고 있어야 했다. 커서는 사용자가 입력하는 토큰을 통해 과금이 좀 더 강하게 반영되는 부분이 있어서 글도 생각에 생각을 거듭해서 가급적이면 수정이 없도록 해야 했다.

특히 프리뷰 같은 경우 AI스튜디오와는 달리 로컬 서버를 실행해서 브라우저로 직접 동작 시키기 때문에, “개발 실행 명령” 같은 것들은 어느 정도 외워야 했다.

디자이너에게 찾아온 ‘구현 설계’라는 과제

개발 환경에서 작업하다 보니 자연스럽게 구현방식이라는 것을 고민하게 된다.

예를 들어,

당연히 작업물을 다운로드하면 SNS 업로드에 적합한 1440px 고해상도 이미지가 나올 줄 알았다.

하지만 실제로 받은 파일은…

프리뷰의 자글자글한 해상도 그대로였다.

이 문제를 파고들며 알게 됐다.

AI 스튜디오가 내부적으로 canvas2html이라는 방식을 사용 중이었고,

나는 이걸 비활성화한 뒤 아웃풋을 직접 렌더링하는 구조로 바꿔야 한다는 것을 깨달았다.

그 이후로 “다운로드·프리뷰·렌더링 결과가 모두 동일한 고해상도로 나오게 하려면 어떻게 아키텍처를 짜야 하는가”를 동안 고민하고 시행착오를 겪어야 했다.

AI의 장점과 단점, 그리고 시행착오

커서는 분명 강력했다.

하지만 동시에, 사고도 많이 쳤다.

거의 매일 이런 일들을 겪었다.

• A만 고쳐달라고 했는데, 갑자기 C가 망가지는 일

• “이 부분만 수정해줘”라고 했더니 엉뚱한 파일 전체를 다시 써버리는 경우

• 문맥을 잘못 이해한 채 스스로 구조를 바꿔버리는 상황

문제는 이런 ‘작은 사고’들이 생각보다 큰 비용으로 이어진다는 점이었다.

간단한 수정 하나에도 AI가 작업 범위를 과하게 넓혀버리다 보니

토큰은 순식간에 소모됐다.

그럴 때마다 ‘이 정도 수정에 이만큼 비용이?’라는 생각이 들었다.

그래서 어느 순간부터는 바로 커서에게 말을 걸기보다,

GPT로 먼저 프롬프트를 검토하고 정리하는 습관이 생겼다.

• 내가 진짜 원하는 수정이 무엇인지

• 어떤 범위까지만 건드려야 하는지

• 이걸 한 문장으로 어떻게 정확히 말할 수 있는지

AI에게 일을 시키기 전에 오히려 내 생각을 먼저 다듬는 과정이 필요했다.

그렇게 프롬프트를 다듬고, 다시 시도하고, 망가진 부분을 복구하고,

또 한 번 고쳐보는 날들이 이어졌다.

결국 중요한 건, 얼마나 잘 닿느냐였다

여러 도구를 오가며 작업하다 보니

점점 한 가지 생각으로 수렴하게 되었다.

결국 중요한 건 기술의 뛰어남보다,

얼마나 쉽게, 얼마나 부담 없이 쓸 수 있느냐였다.

AI는 분명 빠르게 발전하고 있지만

그 발전을 체감하는 속도는

‘접근성’과 ‘비용’에 크게 좌우된다.

접근성이라는 측면에서의 구글 AI 스튜디오

처음 AI 스튜디오가 편하게 느껴졌던 이유는

기술적인 장벽보다도 환경적인 익숙함 때문이었다.

대부분의 스타트업은 이미 구글 워크스페이스를 사용하고 있고,

그 안에서 AI 스튜디오는

별다른 장벽 없이 바로 시작할 수 있었다.

무엇보다 좋았던 점은

• 무료로 실험할 수 있는 범위가 넓고

• 토큰 비용에 대한 부담 없이

• 아이디어를 빠르게 형태로 만들 수 있다는 점이었다

‘이게 가능할까?’를 고민하기 전에

‘일단 만들어보자’고 말하게 만드는 도구였다.

디테일의 세계로 들어가면, 다른 선택지가 필요해진다

하지만 작업이 깊어질수록

AI 스튜디오의 한계도 분명해졌다.

디자인 자산을 세밀하게 다루고 싶거나,

이미지를 임베디드하고,

구조를 직접 통제하고 싶은 단계가 되자

자연스럽게 커서(Cursor)나 v0 같은 도구를 찾게 되었다.

이 지점부터는 분명히

과금이 전제된 선택이 된다. (물론 회사에서 지원을 해주면 여기도 괜찮은 선택지가 된다)

토큰 비용은 생각보다 빠르게 쌓이고,

작업량이 늘어날수록 체감도 크다.

하지만 그만큼

• 더 정교한 제어가 가능하고

• 실제 서비스에 가까운 결과물을 만들 수 있었다.

결론: AI 시대에도 ‘공부’는 피할 수 없다

이번 경험을 통해 깨달은 사실은 하나였다.

<aside>

“결국 코드를 알아야 노코드 AI도 제대로 쓸 수 있다.”

</aside>

AI는 분명 디자이너에게 새로운 가능성을 주는 도구다.

하지만 동시에 그 가능성을 제대로 실현하려면 스스로 공부해야 한다는 사실도 함께 알려준다. 내가 이 글을 쓰고있는 이 순간에도 새로운 서비스들이 계속적으로 생겨나고 있다.

AI가 길을 만들어주고 열린 문을 보여주는 건 맞지만,

그 길을 선택하고 걸어가는 건 결국 본인이다