AI 디자인 스택은 이미 갈라졌다: Claude Design, Codex Sites, Figma, Lovart, 그리고 MCPlato 컨트롤 룸

2026년 기준 Claude Design, Sites in Codex, Figma, Lovart, MCPlato를 깊이 있게 검토하고, AI 디자인이 이제 승자독식 단일 카테고리가 아니라 웹 경험 스택에 속하는 이유를 설명합니다.

게시일 2026-06-05

2026년에 던져서는 안 되는 질문은 **“어떤 AI 디자인 도구가 최고인가?”**입니다.

더 정확한 질문은 이것입니다. AI를 어떤 일을 하도록 고용하려는가? 창업자에게는 랜딩 페이지 콘셉트가 필요합니다. 제품 팀에는 반응형 웹 경험이 필요합니다. 엔지니어에게는 호스팅된 demo가 필요합니다. 성장 팀에는 캠페인 비주얼이 필요합니다. “AI 디자인”은 시각적 탐색, 호스팅 웹 생성, 디자인 시스템 거버넌스, 마케팅 크리에이티브, 컨트롤 룸형 조율로 나뉘었습니다.

그래서 Claude Design, Sites in Codex, Figma, Lovart, MCPlato는 하나의 순위표가 아니라 하나의 스택에 속합니다.

스튜디오 워크스페이스에서 추상적인 반응형 웹 경험이 떠오르는 프리미엄 에디토리얼 히어로 이미지

그림 1: AI 디자인은 하나의 범용 캔버스가 아니라 웹 경험 스택이 되고 있습니다.

이름에 대한 현실 점검: Claude Design은 실제이고, Codex Sites는 줄임말이다

Anthropic은 2026년 4월 17일 Claude Design을 Anthropic Labs research preview로 출시했습니다.¹ Claude Design은 대화와 직접적인 refinement를 통해 디자인, 인터랙티브 프로토타입, 시각적 one-pager, 마케팅 자료, 초기 랜딩 페이지 콘셉트를 만들 수 있습니다.¹ 따라서 이는 2026년의 실제 제품 방향이지만, 여전히 preview이며 전문 디자인 거버넌스를 대체하지 않습니다.

Codex Sites는 유용한 줄임말이지만, 공식 명칭은 Sites 또는 the Sites plugin inside Codex입니다. OpenAI 개발자 페이지의 제목은 “Sites – Codex”이며, 이 기능을 Sites plugin을 통해 Codex에서 “build and deploy hosted sites”하는 방법으로 정의합니다.² Sites를 통해 Codex는 OpenAI가 호스팅하는 웹사이트, Web app, 게임을 만들고, 저장하고, 배포하고, 검사할 수 있습니다.²

경계가 중요합니다. Sites는 preview이며 ChatGPT Business 및 Enterprise 워크스페이스에서 사용할 수 있습니다. Business는 기본 활성화되고 Enterprise는 관리자 RBAC로 제어됩니다.² 출력은 Cloudflare Worker와 호환되는 ES modules여야 하며, 모든 Sites deployment URL은 프로덕션 배포입니다.² 이것은 호스팅 웹 경험 워크플로로 다뤄야 하며, 최종 프로덕션 디자인으로 다뤄서는 안 됩니다.

제품별 리뷰

Claude Design은 경험이 아직 모호할 때 가장 강력한 출발점입니다. 팀이 디자인 시스템에 커밋하기 전에 homepage, onboarding flow, 제품 내러티브, 프로토타입이 어떤 느낌일지 탐색하도록 도울 수 있습니다. 장점은 속도와 대화형 refinement입니다. 한계는 권위입니다. 취향을 제안할 수는 있지만, 팀에는 여전히 접근성 점검, 브랜드 판단, downstream ownership이 필요합니다.

Sites in Codex는 원하는 아티팩트가 실제 호스팅된 웹 표면일 때 가장 매력적입니다. 랜딩 페이지, 내부 도구, dashboard, 인터랙티브 demo, 작은 Web app, 게임 등이 이에 해당합니다. 이미 구조화된 요구사항, 코드 컨텍스트, 또는 검토 가능한 웹 경험으로 노출하고 싶은 기존 프로젝트를 가진 팀에 잘 맞습니다. OpenAI의 web development use-case collection은 웹 작업에서 Codex의 역할을 강화하고, Codex changelog는 시간이 지나며 플랫폼 변화를 추적하기에 더 적합합니다.³⁴ 약점은 프로덕션 URL이 완료되었다는 잘못된 느낌을 만들 수 있다는 점입니다. 배포는 브랜드, 법무, 성능, 보안 승인이 아닙니다.

Figma는 제품 및 웹 디자인의 전문 source of truth로 남아 있습니다. Figma Sites는 디자인 팀에 웹 지향 생성 경로를 제공하고, Figma Make는 채팅, 첨부 파일, point-and-edit, 스타일 컨텍스트, 코드 에디터, publishing beta를 갖춘 prompt-to-app 워크플로를 추가합니다.⁵⁶ Figma Design AI는 에셋 검색, 콘텐츠 교체, 인터랙션, 레이어 이름 변경, 텍스트 작업, 이미지 도구, 벡터화, First Draft를 포괄합니다. Figma의 AI agent는 2026년 5월 20일 제한적 beta 롤아웃을 시작했습니다.⁷⁸ 이 웹 스택은 여전히 디자인 시스템 규율에 의존합니다.⁹

Lovart는 창의적 및 마케팅용 비주얼 에이전트로 보는 것이 가장 적절합니다. 공식 페이지는 자연어 파이프라인, 통합 캔버스, 이미지 및 비디오 생성, 레이어 수준 편집, 배치 생성, PNG/SVG 내보내기를 강조합니다.¹⁰ 그래서 캠페인 세계관, 무드보드, hero image 방향, 제품 사진 콘셉트, 출시 변형에 유용합니다. 반응형 디자인 시스템을 거버넌스하거나 호스팅된 사이트를 검사하기에 최적의 장소는 아닙니다.

MCPlato는 컨트롤 룸 레이어에 맞습니다. 전문 디자인 캔버스도 아니고, 호스팅 사이트 플랫폼도 아니며, 전문 마케팅 이미지 스튜디오도 아닙니다. 사이트 프로젝트가 리서치, 소스 자료, 오래 실행되는 작업, 승인, 세션, 아티팩트 규율, 인수인계에 의존할 때 유용합니다. 관찰 가능한 오피스 AI 작업을 둘러싼 MCPlato의 공개 포지셔닝은 Claude Design, Codex, Figma, Lovart 주변의 일을 조율하는 workspace라는 점을 보여주며, 이들을 대체하지 않습니다.¹¹

비교 표: 각 도구가 맡아야 할 일

제품 / 워크플로	주요 job-to-be-done	가장 잘하는 것	약한 것	최적 입력	출력 / 아티팩트	최적 사용자	적합하지 않은 경우	스택에서의 권장 역할
Claude Design	대화형 시각 탐색	콘셉트, 프로토타입, 랜딩 페이지 방향, one-pager	최종 디자인 시스템 권위	브리프, 제품 아이디어, 참고 스타일, 직접 피드백	시각 콘셉트, 프로토타입, 경험 레이아웃 초안	창업자, PM, 방향을 탐색하는 디자이너	픽셀 단위의 프로덕션 디자인	경험 아이데이션 레이어
Sites in Codex	호스팅 웹 경험 생성	웹사이트, Web app, 게임, dashboard, 내부 도구, demo	시각적 취향, 거버넌스, 리뷰 규율	요구사항, 코드/프로젝트 컨텍스트, 제약, 리뷰 기준	호스팅 웹사이트, Web app, 내부 도구, dashboard, 랜딩 페이지, 인터랙티브 demo	엔지니어, 기술 운영자, 제품 팀	검토 없는 출시 또는 새로운 브랜드 정체성 작업	호스팅 프로토타입 및 웹 실행 레이어
Figma	전문 디자인 source of truth	디자인 시스템, 협업, 반응형 웹 디자인, 관리되는 에셋	인간의 디자인 판단 대체	컴포넌트, 스타일, 제품 요구사항, 팀 라이브러리	디자인 파일, 프로토타입, 사이트, 브랜드 에셋	디자인 및 제품 팀	비정형 리서치 오케스트레이션	기록 시스템 디자인 레이어
Lovart	마케팅 크리에이티브 탐색	무드보드, 캠페인 비주얼, 브랜드 방향, 배치 크리에이티브	디자인 시스템 거버넌스, 사이트 검사	브랜드 프롬프트, 캠페인 목표, 시각 참고자료	이미지, 비디오, 레이어형 크리에이티브 에셋, 내보내기	마케터, 크리에이터, 브랜드 팀	제품 UI source of truth	크리에이티브 탐색 레이어
MCPlato	관찰 가능한 다중 자료 작업 조율	리서치, 승인, 세션, 아티팩트, 비동기 작업, 인수인계	전문 디자인 캔버스 또는 호스팅 웹 runtime	소스, 로컬 자료, 작업 계획, 승인, 브리프	보고서, 아웃라인, 작업 이력, 산출물	운영자, 리서처, PM, 일을 관리하는 팀	Figma, Codex, Lovart 또는 디자이너 대체	컨트롤 룸 레이어

AI 지원 웹 경험 워크플로의 프리미엄 세미 3D 아키텍처 단면도

그림 2: 이 스택은 탐색, 거버넌스된 디자인, 호스팅 실행, 크리에이티브 에셋, 조율을 분리합니다.

시나리오 추천 매트릭스

시나리오	주요 추천	보조 도구	이유
랜딩 페이지 시각 방향	Claude Design	Lovart, Figma	Claude Design은 초기 탐색을 가속합니다. Lovart는 무드와 캠페인 방향을 넓힙니다.
반응형 사이트 디자인	Figma	Claude Design, MCPlato	Figma가 컴포넌트, 반응형 동작, 협업, 검토 가능한 결정을 맡아야 합니다.
Prompt-to-web app 프로토타입	Sites in Codex	Figma Make, MCPlato	Sites in Codex는 기술 컨텍스트에서 호스팅 Web app이나 demo를 만드는 데 적합합니다.
내부 dashboard/도구	Sites in Codex	Figma, MCPlato	Codex는 호스팅 기술 표면을 만들 수 있습니다. Figma는 UX 패턴을 거버넌스하고 MCPlato는 요구사항을 조율합니다.
마케팅 캠페인 에셋	Lovart	Figma Buzz, Claude Design	Lovart는 창의적 다양성, 무드보드, 출시 비주얼에 더 적합합니다. Figma Buzz는 대량 에셋을 돕습니다.
사이트 구축 전 다중 자료 리서치	MCPlato	Claude Design, Figma	MCPlato는 소스 수집, 노트, 승인, 인수인계의 중심입니다.
기존 프로젝트를 호스팅 demo로	Sites in Codex	MCPlato	Codex Sites는 호환되는 웹 작업을 호스팅 배포로 바꿀 수 있습니다. MCPlato는 주의사항을 추적합니다.
디자인 시스템이 거버넌스하는 웹 경험	Figma	Sites in Codex	Figma는 기록 시스템을 소유합니다. Codex는 호환 구현을 리뷰용으로 노출할 수 있습니다.
장기 사이트 프로젝트 조율	MCPlato	Figma, Sites in Codex, Lovart	다단계 사이트 작업에는 보이는 리서치, 결정, 에셋, 배포 노트, 승인이 필요합니다.

팀이 피해야 할 것

첫째, 호스팅 URL을 최종 승인으로 취급하지 마세요. OpenAI의 Sites 문서는 모든 deployment URL이 프로덕션 배포라고 명시합니다.² 작동하는 demo도 소스 리뷰, 접근성 리뷰, 브랜드 리뷰, 보안 리뷰, 이해관계자 승인이 여전히 필요합니다.

둘째, 줄임말이 ownership을 혼동하게 두지 마세요. “Codex Sites”는 편리한 제목이지만 공식 기능은 Codex 내부의 Sites입니다. Figma는 거버넌스된 디자인 시스템을 맡아야 합니다. Lovart가 제품 UI의 source of truth가 되어서는 안 됩니다. Claude Design을 완성된 프로덕션 디자인으로 취급해서는 안 됩니다. MCPlato는 자료와 결정을 조율해야 하며, 디자인 캔버스나 호스팅 레이어인 척해서는 안 됩니다.

디자인 캔버스, 호스팅 웹 객체, 크리에이티브 스튜디오, 조율 데스크를 비교하는 고급 에디토리얼 제품 사진

그림 3: 크리에이티브, 디자인, 배포, 조율 표면이 구분될 때 웹 작업은 더 안전합니다.

결론: 이기는 워크플로는 스택이다

2026년 AI 디자인 스택은 하나의 승자로 수렴하지 않습니다. 전문화되고 있습니다. Claude Design은 경험과 시각 방향을 탐색합니다. Figma는 디자인 시스템과 반응형 협업을 거버넌스합니다. Lovart는 캠페인 비주얼과 브랜드 세계 변형을 만듭니다. Sites in Codex는 적합한 아이디어와 프로젝트를 호스팅 웹 경험으로 전환합니다. MCPlato는 리서치, 소스 자료, 승인, 반복, 인수인계를 관찰 가능한 상태로 유지합니다.

최고의 팀은 ownership을 배정할 것입니다. Claude Design에서 탐색하고, Figma에서 거버넌스하고, Lovart에서 캠페인 에셋을 생성하고, Sites in Codex로 적합한 프로젝트를 호스팅 demo로 바꾸며, 증거와 결정이 계속 보이는 곳에서 장기 작업을 조율합니다.