무료 Claude Design 대안? Open Design AI 실전 테스트
웹사이트 구축·운영을 업으로 삼는 WordPress 개발자가 자신의 코딩 에이전트 구독을 연결해 Open Design을 무료 오픈소스 Claude Design 대안으로 라이브 테스트——브랜드 가이드라인과 클래스룸 퀘스트 타일을 제작합니다. Dan Davies의 실전 방송을 기반으로 합니다.
이것은 디자이너라고 자처하지 않지만 웹사이트를 만들고 운영하는 것을 업으로 삼는 사람이 진행한, 대본 없는 실제 Open Design 테스트입니다. Dan Davies는 Claude Design이 출시됐을 때 정말 좋아했지만, 곧바로 낮은 사용량 제한이라는 벽에 부딪혔습니다——그래서 자신의 AI 구독을 연결할 수 있는 오픈소스 대안을 찾아 나섰습니다. 그의 라이브 워크스루에서 전체 세션을 보거나, 아래 글 버전을 읽어보세요.
Open Design 작업 공간: 원하는 것을 설명하고 모드를 선택하면, 이미 비용을 지불하고 있는 코딩 에이전트가 나머지를 처리합니다.
Open Design이란?
Open Design은 오픈소스이자 로컬 우선 디자인 플랫폼——Claude Design과 Figma의 에이전트 네이티브 대안입니다. 특정 벤더의 모델과 고정된 크레딧 풀에 가두는 대신, 이미 사용 중인 코딩 에이전트 위에서 동작합니다.
- 오픈소스, Apache-2.0——클론하고, 셀프호스팅하고, 모든 코드를 읽거나, 그냥 데스크톱 앱을 다운로드하세요.
- 로컬 우선——프로젝트는 다른 누군가의 클라우드가 아니라 당신 자신의 머신, 당신 자신의 폴더에 존재합니다.
- 자신의 key뿐 아니라 자신의 에이전트를 가져오세요——Claude Code, Codex, Cursor, Gemini, Copilot, OpenCode, Hermes 등을 연결하세요. 연결한 CLI가 생성을 주도합니다.
- 프로토타입 그 이상——브랜드 가이드라인, 마케팅 그래픽, 슬라이드 스타일 레이아웃, 완전한 웹 디자인까지, 모두 하나의 작업 공간에서.
Claude Design을 써봤다면 그 느낌이 곧바로 익숙할 것입니다. Dan이 영상에서 말하듯, "이건 그냥 Claude Design이나 마찬가지다——레이아웃도 같고 작동 방식도 같다." 다른 점은 그 아래에 무엇이 있는지, 그리고 누가 비용을 지불하는지입니다.
Open Design이 해결하는 사용량 제한 문제
Dan의 이야기는 많은 사람이 공감할 만한 것입니다. 그는 출시 당시 Claude Design에 정말 감명받았습니다——만들어낸 결과물이 마음에 들었습니다——하지만 "사용량 제한이 너무 낮아서 계속 쓰는 게 지속 가능하지 않았다"고 말합니다. 실제 프로젝트에 들어가 반복 작업을 시작하면 금세 한도에 부딪히고, 하필 탄력이 붙은 그 순간에 도구가 조용해집니다.
바로 이 한 가지 답답함이 그를 다른 길을 찾아 나서게 만들었고, 그것이 정확히 Open Design이 메우는 공백입니다. Open Design은 오픈소스이며 당신에게 모델 접근권을 재판매하지 않기 때문에, 당신의 작업 위에 별도의 디자인 도구 크레딧 계량기가 얹히지 않습니다. 자신의 에이전트를 가져오면, 사용량은 디자인 도구가 부과하는 한도가 아니라 이미 가지고 있는 그 에이전트 요금제를 따릅니다.
WordPress 에이전시를 운영하면서 커뮤니티에 WordPress를 가르치는 개발자인 Dan에게, 이는 셈법을 완전히 바꿔놓습니다. 디자인은 더 이상 사용량으로 과금되는 사치품이 아니라, 하루 종일 반복해서 다듬을 수 있는 것이 됩니다.
자신의 에이전트를 가져오되, 자신의 청구서는 아닙니다
이것은 Dan이 계속 되돌아오는 기능이며, 명확히 이해할 가치가 있습니다. Open Design은 자체 모델을 제공하지 않습니다. 설정에서, 이미 당신의 머신에 설치된 코딩 에이전트 CLI를 감지하고 그 사이를 자유롭게 전환할 수 있게 해줍니다.
Dan의 환경에서는 두 가지가 발견되었습니다: 명령줄의 Claude Code와, 그가 ChatGPT 구독으로 구동하는 Hermes agent입니다. "기본적으로 뭐든 연결할 수 있다"고 그는 말합니다——"모델뿐만 아니라 에이전트도." 자신의 Claude 구독을 쓰고 싶다면 쓸 수 있고, Codex 요금제도, 순수 API key도 쓸 수 있습니다.
그가 긋는 구분선이 중요합니다: 그는 의도적으로 순수 API key를 피하는데, 호출당 과금되는 크레딧이 반복적인 디자인 작업에서 실제 돈을 빠르게 태우기 때문입니다. 이미 비용을 지불하고 있는 구독——Claude Code의 요금제, 혹은 Hermes를 통한 ChatGPT——에 Open Design을 연결한다는 것은 두 번째 청구서를 쌓지 않는다는 뜻입니다. 그것이 그가 자체 제한이 있는 호스팅형 디자인 도구보다 이것을 선호하는 가장 큰 이유입니다.
템플릿과 스킬 라이브러리——Figma 마이그레이션이나 React·Next.js로 내보내기 같은 기능도 포함되어 있어, 빈 캔버스에서 시작하지 않아도 됩니다.
그는 또한 확장 영역을 일찍 발견합니다: 실제 커뮤니티 영상을 링크하는 튜토리얼 섹션, 호버 시 애니메이션되는 완성 템플릿으로 가득한 플러그인 영역, 그리고 Figma migration, export to React, export to Next.js 같은 스킬들입니다. 그는 아직 전체 기능을 다 탐색하지 못했다고 분명히 밝히지만——이건 첫 실습이니까요——구조는 이미 뚜렷하게 갖춰져 있습니다.
테스트 1: 대략적인 아이디어에서 브랜드 가이드라인 만들기
Dan의 첫 번째 본격적인 과제는 보통 전문 디자이너의 시간이 필요한 종류의 일입니다: 자신의 WP Odyssey 스쿨 커뮤니티를 위한 브랜드 가이드라인 문서. 그는 로고, 아이콘, 폰트, 색상에 대한 명확한 문서를 가지고 있지 않았기에, Open Design에 하나 만들어 달라고 요청했습니다.
결과는 그를 감명시켰습니다. 그것은 브랜드를 제대로 된 가이드라인 시트로 포착해냈습니다——로고 사용법, 그가 학생들을 이끄는 학습 여정을 상징하는 삼지창 "아이덴티티 마크", 여백 규칙, 오용 예시, 거의 검정에 가까운 "잉크" 색까지 이어지는 보라색 범위, 그리고 그가 원하던 폰트까지. 심지어 기존의 단색 보라색보다 더 마음에 드는 보라색 그라데이션을 도입했고, 코스를 관통하는 여정을 위한 "경로" 모티프까지 배치했습니다.
그가 설명하는 방식에서 두 가지가 두드러집니다. 첫째, Open Design은 구조화된 결과물을 만들어냈습니다——어수선한 에셋 더미가 아니라 일관된 사고방식을 가진, 그대로 내놓을 수 있는 문서였습니다. 둘째, 그는 그것을 살아 있는 결과물로 취급했습니다: "이걸 계속 다듬어서 개선해 나갈 것이다." 그것이 의도된 순환입니다——실제 브랜드에서 강력한 첫 버전을 생성한 다음, 다듬어 나가는 것.
모든 것이 완벽하지는 않았습니다. 더 앞선, 거의 브리핑 없이 클라이언트의 자산관리 웹사이트를 "개선"해달라고 요청했던 짧은 테스트는, 그의 표현으로는 흔한 "AI 슬랍"처럼 보이는 결과로 돌아왔습니다. 그 자신의 평가는 공정하고 유용합니다: "문제가 항상 도구에 있는 건 아니다"라고 그는 말합니다. "프롬프트를 주는 방식의 문제다."
테스트 2: 퀘스트 타일 디자인하기
핵심은 정말로 까다로운 디자인 문제입니다. Dan의 커뮤니티에는 한 줄에 세 개씩 배치된 14개의 "퀘스트" 타일이 있고, standard, premium, VIP 등급으로 나뉘어 있으며, 그는 등급이 올라갈수록 보라색이 진해지고, 점선 "여정" 라인이 각 줄을 가로지르며 타일 사이에 정렬되고, 각 타일이 저마다의 개성을 조금씩 유지하기를 원했습니다.
그는 전날 ChatGPT(Hermes agent 경유)로 이를 시도했지만 잘 되지 않았습니다——색이 틀렸고, 라인이 깨졌고, 타일이 모두 똑같아 보였으며, 한 번은 브랜드 사양에서 완전히 벗어났다가 지적받고 나서야 그것을 인정했습니다. 그래서 방송에서 그는 새 프로젝트를 깨끗하게 시작해 에이전트를 Claude Code로 다시 전환하고, 제대로 된 입력을 주었습니다: 내보낸 브랜드 가이드라인 PDF, 현재 클래스룸의 참고용 스크린샷, 그리고 페이지 전체가 아니라 타일만 다시 디자인하도록 하기 위한 샘플 타일 한 개입니다.
이번에는 에이전트가 좋은 디스커버리 질문들을 던졌습니다——최종 에셋 크기, 종횡비, 보라색을 어떻게 진하게 할지(등급별로 단계적인 그라데이션), 한 줄에 몇 개씩——그런 다음 강력한 첫 결과물을 만들어냈습니다. Dan의 평가는 단호했습니다: "어제 ChatGPT가 한 것보다 백만 배는 낫다." 타일은 올바른 색을 사용했고, 결정적으로 여정 라인이 타일 사이에서 자동으로 정렬되었습니다——그가 직접 손봐야 할 각오를 했던 부분입니다.
Open Design은 생성된 작업물을 어수선한 파일 뭉치가 아니라 실제적이고 구조화된 결과물로 제시하는 경향이 있습니다——여기서는 미리보기에 완전히 렌더링된 디자인이 보입니다.
완벽하지는 않았습니다——standard 등급의 보라색이 그가 원했던 것보다 더 진하게 나왔고, 다양성이 있었으면 하는 곳에 로고가 반복되었습니다——하지만 이런 것들이야말로 다음 프롬프트에 그대로 피드백하면 되는 부분입니다. 그는 또한 정직한 비용 데이터 포인트 하나를 언급했습니다: 그 타일 배치를 생성하는 데 20달러짜리 Claude 요금제 사용량의 약 50%가 들었다는 것입니다. 디자인 반복이 모델 비용에서 완전히 자유로운 것은 아닙니다. 다만 두 번째 디자인 도구 청구서로부터는 자유롭습니다.
연결하는 모델이 중요한 이유
Dan의 세션에서 가장 뚜렷한 결론은 결과물의 품질이 연결한 에이전트에 따라 달라진다는 것입니다. 동일한 작업이, 동일한 도구 안에서, 한 에이전트로는 뒤죽박죽인 결과물이 되었다가 더 강력한 에이전트로는 깔끔한 초안이 되었습니다. Open Design은 작업 공간과 구조를 제공하고, 모델이 엔진입니다.
그는 또 일반 이미지 도구와의 멋진 비교를 보여줍니다: 비슷한 작업을 일반적인 이미지 생성기로 시도해봤더니 "고전했다"면서, Open Design은 "결과물에 좀 더 구조가 있는 것 같다"고 합니다. 그래픽을 요청하자, 이를 보여주고 다운로드할 수 있는 작은 웹페이지를 만들어냈습니다——단순한 원본 출력이 아니라, 그대로 내놓을 수 있는 결과물로서요.
여기서부터의 그의 계획은 이 도구가 실제 워크플로우 어디에 들어맞는지를 잘 보여줍니다: 타일을 계속 다듬은 다음 웹사이트 홈페이지 제작으로 넘어가고, 오른쪽 상단에서 결과물을 VS Code로 넘긴 뒤, 결국 편집 가능한 WordPress 템플릿을 생성해 클라이언트가 진짜 CMS의 이점을 계속 누리게 하는 것입니다. 전담 디자이너가 없는 기술 팀에게, 개방적이고 에이전트를 갈아 끼울 수 있는 디자인 도구가 열어주는 것이 바로 이 실질적인 궤적입니다——마케팅 에셋에서 출시 가능한 사이트까지.
자주 묻는 질문
Open Design은 정말 무료인가요? 이 소프트웨어는 Apache-2.0 라이선스 하에 오픈소스이며 로컬에서 무료로 실행할 수 있습니다. Open Design 자체에는 아무 비용도 지불하지 않습니다. 연결한 코딩 에이전트의 사용량에 대해서만 비용을 지불하며——이미 가지고 있는 구독(예: Claude Code 요금제)을 연결하면, 추가 디자인 도구 청구서는 없습니다.
Claude Design과 어떻게 다른가요? 같은 익숙한 느낌이지만, 오픈소스이고 로컬 우선이며 에이전트를 갈아 끼울 수 있습니다. 고정된 낮은 크레딧 풀을 가진 단일 호스팅 모델 대신, 자신의 에이전트를 가져오고 사용량은 기존 요금제를 따릅니다. Dan의 세션이 보여주듯, 이는 Claude Design을 무거운 반복 작업에서 지속하기 어렵게 만들었던 사용량 제한의 벽을 없애줍니다.
API key를 꼭 써야 하나요? 아니요——그것이 Dan이 가장 강조하는 지점입니다. Open Design은 머신에 있는 에이전트 CLI를 감지해, 호출당 과금되는 API 크레딧 대신 구독을 사용할 수 있게 해줍니다. 그는 후자가 반복 작업에서 돈을 빠르게 태운다는 것을 발견했습니다.
어떤 에이전트를 연결해야 하나요? 작업에 가장 좋은 결과를 내는 것을요——결과물의 품질은 모델에 달려 있습니다. 영상에서는 동일한 타일 디자인 작업이 한 에이전트로는 엉망이었다가 Claude Code로 전환한 뒤에는 깔끔한 초안이 되었습니다. 결과가 중요할 때는 역량 있는 에이전트를 선택하세요.
디자이너가 아니어도 실제로 좋은 결과를 얻을 수 있나요? 네, 올바른 입력만 있다면요. Dan은 디자이너가 아니라 개발자지만, 쓸 만한 브랜드 가이드라인과 클래스룸 타일을 얻어냈습니다——다만 그가 스스로 얻은 교훈은 부실한 프롬프트는 "AI 슬랍"을 만든다는 것입니다. 실제 브랜드 사양, 참고 이미지, 명확한 제약을 주고 나서 반복하세요.
이 글 가이드는 Dan Davies의 Open Design 실전 테스트를 바탕으로 합니다. 위의 전체 세션을 시청하고, WordPress와 AI 도구에 관한 더 많은 실전 방송을 위해 Dan Davies를 구독하세요.