Open Design로 영상이나 글을 슬라이드 덱으로 만들기 (무료 크레딧으로)

Open Design은 웹 페이지만을 위한 것이 아닙니다 — 강력한 프레젠테이션 생성기이기도 합니다. 이 가이드는 바로 그 점에 집중합니다: YouTube 자막이나 어떤 글이든 세련된 애니메이션 슬라이드 덱으로 바꾸고, 코딩 에이전트의 무료 등급에서 무료로 실행합니다. 또한 무료 Codex 설정, 디자인 시스템, 스케치 도구, Claude Design ZIP 가져오기도 다룹니다. 이 글은 Eli Rigobeli가 자신의 영상에서 보여준 심층 워크스루를 따르며, 영어로 다시 쓰고 현재 릴리스에 맞춰 업데이트했습니다. 위의 영상을 보거나, 글로 된 버전을 계속 읽어 보세요.

슬라이드 덱 모드: 덱 카테고리를 고르고 예시를 fork해 출발점으로 삼으세요.

Open Design이란?

Open Design은 오픈소스이자 로컬 우선 디자인 플랫폼입니다 — 자신의 머신에서 실행하는 Claude Design 대안으로, 한 공급자와 토큰 상한에 묶이는 대신 원하는 어떤 에이전트나 모델이든(Codex, Claude Code, Gemini, OpenCode, 또는 자신의 API key) 구동합니다. 풍부한 디자인 시스템 라이브러리(각각이 하나의 DESIGN.md)와 디자인 스킬을 갖추고 있으며, 페이지를 넘어 슬라이드 덱, 이미지, 영상까지 다룹니다.

1단계 — 설치하고 무료 모델 연결하기

open-design.ai/download에서 설치 프로그램을 내려받거나(macOS / Windows), 소스에서 실행하세요:

git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable && pnpm install
pnpm tools-dev run web

출력되는 로컬 URL을 여세요(포트는 동적입니다 — 하드코딩하지 마세요). 무료 설정을 위해 Eli는 무료 ChatGPT 계정으로 로그인한 Codex를 연결하며(주간 크레딧이 제공됨), 그래서 전체 세션에 비용이 들지 않습니다. 설정에서는 연결 테스트, 미디어 공급자(이미지/영상/오디오) 추가, 언어 전환, 데스크톱 펫 입양도 할 수 있습니다.

2단계 — 기존 콘텐츠로 슬라이드 덱 생성하기

이것이 가장 돋보이는 워크플로입니다. 덱을 처음부터 쓸 필요가 없습니다 — 이미 가지고 있는 콘텐츠를 Open Design에 넣으세요:

1. 슬라이드 덱을 선택하고 이름을 붙인 뒤 디자인 시스템을 고르세요(둘을 섞을 수도 있습니다, 예: 브랜드 룩 + 코드 룩).
2. 원본 콘텐츠를 가져오세요 — Eli는 YouTube 영상의 자막을 복사합니다(어떤 글이든 가능) — 그리고 LLM에게 그것을 덱 브리프로 바꾸게 하세요("이 자막에서 5장짜리 프레젠테이션의 prompt를 생성해 줘: …").
3. 그것을 Open Design에 붙여넣고 보내세요. 짧은 디스커버리 단계(대상, 비주얼 톤 — 예: "매거진 에디토리얼", 애니메이션 정도)와 비주얼 방향을 거친 뒤 빌드합니다.

결과물은 정말로 세련된 덱입니다 — Eli의 것은 부드러운 슬라이드 전환 애니메이션과 다섯 장에 걸친 일관된 에디토리얼 룩을 갖춰, 전체 화면으로 발표할 수 있습니다. 강연, 글, 영상을 공유 가능한 슬라이드로 바꾸는 가장 빠른 방법입니다.

미리보기에서 렌더링된 실제 생성 프로토타입 — Open Design은 덱뿐 아니라 완전한 인터랙티브 페이지도 만듭니다.

3단계 — 더 많은 입력: 스케치, 레퍼런스, Claude Design ZIP

Open Design은 텍스트 prompt 외에도 여러 출발점을 받아들입니다:

• 스케치 도구 — 대략적인 레이아웃("여기에 배너, 아래에 카드")을 그리고 주석을 단 뒤, 스케치를 바탕으로 만들게 하세요.
• 레퍼런스 파일 — 이미지, 스크린샷, 폴더를 컨텍스트로 끌어다 놓고, prompt 안에서 바로 @로 언급하세요(스킬도 마찬가지).
• Claude Design ZIP 가져오기 — 이미 Claude Design에 디자인 시스템이 있나요? 그것을 ZIP으로 내보내 가져오면, Open Design이 기존 토큰과 브랜드를 따르는 새 산출물을 만듭니다.

HyperFrames 갤러리: fork하고 리믹스할 수 있는, 코드로 구동되는 모션과 영상 작품들.

4단계 — 편집하고, 비용을 살피고, 출시하기

편집/인스펙트로 요소를 시각적으로 조정하고(인스펙트가 요청하면 에이전트가 data-oid 태그를 추가하게 하세요), 코멘트로 편집해 위치를 표시하세요. Eli는 무료 Codex 잔액을 주시합니다 — 랜딩 페이지는 주간 무료 크레딧의 약 21%, 덱은 조금 더 — 돈을 내지 않고도 실제 작업을 할 수 있음을 보여줍니다. 완료되면 공유로 PDF/PowerPoint/ZIP/HTML로 내보내거나 Vercel에 배포할 수 있습니다.

그의 비용 팁: API key를 쓰고 싶다면 저렴한 모델(GLM, Kimi, DeepSeek)을 고르세요 — 가격은 일부에 불과하지만 디자인 이터레이션에는 충분히 좋습니다.

팁

• 처음부터 쓰지 말고 콘텐츠를 넣으세요 — 자막이나 글 → 완성된 덱.
• 무료 ChatGPT 계정으로 Codex를 연결(주간 크레딧)해 무료로 실행하세요.
• 두 개의 디자인 시스템을 섞어 맞춤 룩을 만드세요; 레이아웃이 머릿속에 있을 때는 스케치 도구를 쓰세요.
• Claude Design ZIP을 가져와 기존 디자인 시스템을 재사용하세요.
• 크레딧 잔액을 주시하고 저렴한 API 모델(GLM/Kimi/DeepSeek)로 전환해 규모를 키우세요.

FAQ

Open Design이 웹 페이지뿐 아니라 프레젠테이션도 만들 수 있나요? 네 — 슬라이드 덱 모드는 prompt(또는 붙여넣은 자막/글)를, 전체 화면으로 발표하거나 PowerPoint/PDF로 내보낼 수 있는 세련된 애니메이션 HTML 덱으로 바꿉니다.

완전히 무료로 실행할 수 있나요? 네 — 무료 ChatGPT 계정으로 Codex를 연결하세요(또는 Gemini의 무료 등급). Eli는 돈을 내지 않고 페이지와 덱을 만들며, 주간 크레딧 잔액만 살핍니다.

어떤 입력으로 시작할 수 있나요? 텍스트 prompt, 손으로 그린 스케치, 레퍼런스 이미지/스크린샷/폴더, 또는 가져온 Claude Design ZIP.

무료이고 오픈소스인가요? 네 — Apache-2.0. 로컬에서 무료로 실행하세요; 연결한 모델/미디어의 사용량에 대해서만 비용을 냅니다.

---

이 글 가이드는 Eli Rigobeli의 심층 워크스루를 바탕으로 합니다. 위의 전체 영상을 보고, 더 많은 AI 빌드 콘텐츠를 위해 Eli Rigobeli를 구독하세요.