초보자 가이드 — 내 PC에 Open Design을 설치하고 첫 페이지 만들기

이 가이드는 완전 초보자를 위한 것입니다: 터미널도, 전문 용어도 없습니다. Open Design을 평범한 앱으로 다운로드하고, 한 번의 클릭으로 모델을 연결하고, 첫 번째 실제 웹 페이지를 만들게 됩니다 — 모두 여러분 자신의 PC에서 실행되며, 구독은 필요 없습니다. 이 글은 Where Do I Click이 자신들의 영상에서 보여주는 친절한 실습을 현재 릴리스에 맞춰 다시 쓰고 최신화한 것입니다. 실제 시연은 위의 영상을 보거나, 텍스트 버전을 계속 읽어 보세요.

Open Design 작업 공간: 만들고 싶은 것을 설명하고, 모드를 고르면, 나머지는 에이전트가 해냅니다.

Open Design이란 (쉽게 말하면)?

Open Design은 여러분 자신의 컴퓨터에서 실행하는 무료 오픈소스 디자인 앱입니다. 원하는 것 — 랜딩 페이지, 앱 화면, 슬라이드 덱 — 을 설명하면 AI가 실제로 편집 가능한 버전을 만들어 줍니다. 유료 클라우드 도구와의 큰 차이는 이렇습니다: 무료이고, 로컬에서 실행되며(파일이 여러분의 기기에 남습니다), 하나에 묶이지 않고 여러분이 선택한 어떤 AI 모델이든 함께 작동합니다. Where Do I Click의 표현을 빌리자면, 유료 클라우드 도구는 인상적이지만 제약이 많습니다 — 구독이 필요하고, 프로젝트를 한두 개 하면 크레딧을 다 써 버립니다. Open Design은 그 두 벽을 모두 없앱니다.

1단계 — 설치하기 (쉬운 방법: 그냥 앱을 다운로드)

터미널에 익숙할 필요는 없습니다. 가장 간단한 경로는 다음과 같습니다:

1. open-design.ai/download 로 이동합니다.
2. Download 를 클릭하고 운영체제를 선택합니다 — Windows 와 macOS 용 빌드가 있습니다.
3. 다른 평범한 앱처럼 설치 프로그램을 실행합니다. (Windows에서는 “Windows에서 PC를 보호했습니다”라는 알림이 보일 수 있습니다 — 추가 정보 → 실행 을 클릭하세요. 단지 서명되지 않은 인디 빌드일 뿐입니다.)
4. 항상 최신 버전을 받으세요 — 이 프로젝트는 자주 업데이트되며, 최신 빌드일수록 버그가 더 많이 수정되어 있습니다.

(혹시 개발자 경로를 원한다면, GitHub 저장소의 Quick Start에 복사해 붙여넣을 수 있는 명령들이 있습니다 — 하지만 대부분의 사람에게는 다운로드만으로 충분합니다.)

2단계 — 한 번의 클릭으로 모델 연결하기

처음 열면 Open Design은 컴퓨터에 이미 있는 AI 도구를 자동으로 감지합니다 — Claude Code, Codex, Gemini, Qwen 같은 것들 — 그리고 목록으로 보여줍니다. 하나를 클릭하고 Get started 를 누르세요.

코딩 도구가 하나도 설치되어 있지 않다고요? 문제없습니다: 대신 API provider 를 선택하고 Anthropic, OpenAI, Azure 또는 Google Gemini의 키를 붙여넣으세요. 어느 쪽이든 몇 초 만에 준비됩니다. 모델은 나중에 같은 버튼에서 바꿀 수 있고, 설정에서는 미디어 제공자를 추가하고, 언어를 바꾸고, 라이트/다크 모드를 고르고, 심지어 구석에 머무는 작은 데스크톱 펫을 들일 수도 있습니다.

플러그인 라이브러리: 레지스트리에서 바로 스킬을 설치하세요 — 안티슬롭 디자인 스킬도 포함됩니다.

3단계 — 둘러보기 (예시와 템플릿)

만들기 시작하기 전에, Examples 를 클릭해 이 도구로 만든 실제 디자인들을 미리 보세요 — 애니메이션과 효과가 있는 복잡한 인터페이스들입니다. 마음에 드는 것이 있나요? use this prompt 를 눌러 거기서 시작하세요. Design systems, image, video 템플릿 탭도 같은 방식으로 작동합니다: 미리 보고, 다시 사용하세요. 빈 페이지를 마주하지 않고도 무엇이 가능한지 볼 수 있는 친절한 방법입니다.

4단계 — 첫 페이지 만들기

1. Prototype 을 선택하고 이름을 지정합니다 (Where Do I Click은 부동산 중개 페이지를 만듭니다).
2. 디자인 시스템을 고르고(또는 free로 두고) 고품질(high fidelity)을 선택합니다.
3. Create 를 클릭하고 프롬프트를 붙여넣은 뒤 전송합니다.
4. Open Design은 몇 가지 디스커버리 질문을 합니다 (데스크톱인가요 모바일인가요? 톤은? 사실적인 이미지를 원하나요?) — 처음부터 올바른 것을 만들기 위해서입니다 — 답하고 전송하세요.
5. 비주얼 방향을 고르면 페이지가 만들어집니다: AI가 생성한 이미지, 실제 카피, 애니메이션이 있는 깔끔한 인터페이스로 — 유료 도구의 품질에 정말 가깝습니다.

슬라이드 덱 모드: 덱 카테고리를 선택하고, 예시를 출발점으로 포크합니다.

5단계 — 코드 없이 수정하기

조정 컨트롤을 켜고 바꾸고 싶은 것을 클릭하세요 — 예를 들어 중개 회사의 이름이요. 프롬프트 상자가 열립니다; 쉬운 말로 바꿀 내용을 입력하면 적용됩니다. 전체 흐름은 이렇습니다: 설명하고, 생성하고, 가리켜 다듬기. 만족스러우면 내보내거나 계속 반복할 수 있습니다 — 그러는 동안 주간 크레딧의 벽에 부딪히는 일은 결코 없습니다.

팁

• 앱을 다운로드하세요 — 터미널이 필요 없는 경로이며, Windows와 macOS에서 가능합니다.
• 코딩 도구가 없나요? API provider 옵션을 사용하세요 — Anthropic/OpenAI/Azure/Gemini 키와 함께.
• 먼저 Examples를 둘러보세요 — 프롬프트를 재사용해 빈 페이지를 건너뛰세요.
• 디스커버리 질문에 답하세요 — 그것이 첫 시도에서 원하는 것을 정확히 잡아내는 방법입니다.
• 조정 컨트롤을 사용하세요 — 코드 없이 쉬운 말로 텍스트와 요소를 바꾸세요.

자주 묻는 질문

코딩을 할 줄 알아야 하나요? 아니요. 앱을 다운로드하고, 모델을 클릭하거나(또는 API 키를 붙여넣고) 쉬운 말 프롬프트와 가리켜 클릭하는 조정으로 만드세요.

정말 제 PC에서 실행되나요? 네 — Windows나 macOS에 로컬로 설치되며, 프로젝트는 여러분의 기기에 남습니다.

구독이 필요한가요? 아니요. Open Design은 무료입니다; 여러분이 연결한 에이전트나 API 키의 AI 모델 사용량에 대해서만 비용을 냅니다 — 그리고 별도의 주간 디자인 한도도 없습니다.

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

---

이 텍스트 가이드는 Where Do I Click의 실습 영상을 바탕으로 합니다. 위의 전체 영상을 보고, 더 많은 초보자 친화적인 AI 도구 가이드를 원한다면 Where Do I Click을 구독하세요.