디자인 목업을 만들고, 개발자에게 전달하고, 피드백을 주고받고, 다시 수정하고… 이 과정이 며칠씩 걸리던 시절이 있었습니다. 이제는 2분이면 됩니다.
온라인 개발 플랫폼 Replit이 Gemini 3 모델 기반의 Design Mode를 출시했습니다. 자연어 명령만으로 인터랙티브한 목업과 정적 웹사이트를 2분 안에 만들 수 있는 도구입니다. PM이 아이디어를 스케치하든, 디자이너가 컨셉을 반복 수정하든, 창업가가 랜딩 페이지를 만들든—코드를 전혀 모르는 사람도 즉시 멋진 결과물을 만들어낼 수 있습니다.
출처: Design Mode – Replit Blog
디자인을 이해하는 AI
Replit Design Mode의 핵심은 Google의 최신 Gemini 3 모델입니다. 기존 AI 코딩 도구들이 “코드를 잘 짠다”에 집중했다면, Gemini 3는 한 발 더 나갑니다. 레이아웃, 색상, 타이포그래피, 시각적 위계를 이해하죠.
“로그인 페이지 만들어줘”라고 입력하면 단순히 로그인 폼 코드를 뱉는 게 아닙니다. 어떤 요소를 강조해야 하는지, 여백을 어떻게 배치해야 보기 좋은지, 버튼 색상은 무엇이 적절한지를 스스로 판단해서 완성도 높은 디자인을 만들어냅니다. 그리고 “버튼을 더 크게”, “색을 밝게 바꿔줘” 같은 자연어 명령으로 실시간 수정이 가능합니다.
두 가지 사용 시나리오
Replit Design Mode는 크게 두 가지 목적으로 쓰입니다.
빠른 프로토타이핑: Figma Make, Magic Patterns, Claude Artifacts의 대안입니다. PM과 디자이너가 몇 분 만에 인터랙티브 목업을 만들고, 클릭 가능한 프로토타입을 팀과 즉시 공유할 수 있습니다. 개발자에게 수동으로 전달하는 과정 자체가 사라지죠.
완성형 웹사이트: Wix나 Squarespace 대신 사용할 수도 있습니다. 랜딩 페이지, 개인 포트폴리오, 소규모 비즈니스 사이트를 만들고 바로 도메인에 배포할 수 있습니다. Replit은 기존 빌더보다 5배 빠르다고 주장합니다.
디자인에서 앱으로: 원클릭 전환
Design Mode로 만든 결과물은 기본적으로 프론트엔드만 있는 정적 페이지입니다. 로그인 기능이나 결제 폼을 요청하면 ‘시각적으로만’ 구현됩니다. 실제로 작동하지는 않지만 디자인이 현실적으로 보이도록 만들어주는 거죠.
진짜 혁신은 그다음입니다. “Convert to App” 버튼을 클릭하면, 그 디자인이 풀스택 애플리케이션으로 전환됩니다. 백엔드 로직, 데이터베이스, 실제 기능을 추가할 수 있는 환경이 열리는 겁니다. 모든 게 같은 워크스페이스 안에서 이뤄집니다.
이건 단순히 편의 기능이 아닙니다. 디자인과 개발 사이의 벽을 허무는 시도입니다. PM이 프로토타입을 만들고, 개발자가 그걸 실제 앱으로 확장하는 과정이 하나로 연결됩니다.
Figma와 Wix 사이의 공간
Replit Design Mode가 노리는 건 명확합니다. Figma보다 빠르고 실용적인 프로토타이핑 도구, Wix보다 빠르고 유연한 웹사이트 빌더 사이의 공간입니다.
물론 한계도 있습니다. 복잡한 디자인 시스템이나 세밀한 인터랙션 디자인에는 Figma가 여전히 강력합니다. 고도로 커스터마이징된 사이트에는 다른 솔루션이 필요할 수 있습니다. 하지만 “빠르게 괜찮은 걸 만들어야 하는” 대부분의 상황—그러니까 실제 업무의 80%—에서는 충분히 매력적인 선택지입니다.
AI가 디자인까지 이해하기 시작하면서, 아이디어와 결과물 사이의 거리가 계속 좁아지고 있습니다. Replit은 그 거리를 2분으로 만들었다고 말합니다.
답글 남기기