102.7K+다운로드
DeepSeek Harness OpenDesign

OpenDesign에서
DeepSeek Harness(으)로
디자인하기.

OpenDesign에서 DeepSeek Harness로 인터페이스를 디자인하는 방법: 재사용 가능한 콘솔 프로필, 스킬과 제공업체 선택, 브리프부터 리뷰 완료 파일까지 이어지는 관리자 사용자 테이블, 시작 전 알아야 할 제한 사항입니다.

OpenDesign 다운로드 설정으로 이동

세 가지 DeepSeek Harness 시작점

DeepSeek Harness 진입점 선택

이 가이드 · UI 디자인

DeepSeek Harness로 인터페이스 만들기

여기서의 경로는 브리프와 참고 자료에서 시작해 디자인 규칙을 거쳐, 검토할 HTML 결과물로 이어집니다.

이 가이드 읽기 설정

사전 요구 사항 없이 DeepSeek Harness 설치하기

Node.js, pnpm 또는 dsh를 미리 설치할 필요가 없습니다. 운영 체제에 맞는 한 줄 설치 프로그램을 실행하세요. 그러면 DeepSeek Harness가 설치됩니다…

설정으로 이동 비교

DeepSeek Harness가 어떻게 다른지 보기

디자인 작업에서 DeepSeek Harness가 DeepSeek TUI(`deepseek` / `codewhale`), OpenCode, Claude Code와 다른 점, 그리고 다른 워크플로가 더 나은 선택인 경우를 살펴보세요.

비교 보기
이 페이지에서 예시
  1. 예시
  2. 적합성
  3. 호환성
  4. 설정
  5. 워크플로
  6. 참고 자료
  7. 한계
  8. FAQ

DeepSeek Harness 디자인 작업 전체

DeepSeek Harness에서 브리프에서 인터페이스까지

브리프와 제약 조건을 넘겨주면 반환되는 아티팩트까지, 그리고 완료라고 부르기 전에 여전히 실행하는 점검까지 추적한 하나의 디자인 작업입니다. 아래 인터페이스는 설명용으로 이 페이지를 위해 만든 것이며, 기록된 DeepSeek Harness 실행이 아닙니다.

1디자인 브리프와 제약 조건

브리프

관리자 콘솔의 사용자 페이지를 만들어 주세요. 역할, 팀, 상태, 마지막 활동을 포괄하는 검색 가능한 표와 일괄 작업 및 페이지네이션을 포함합니다. 재사용 가능한 프로필을 통해 console 스킬을 사용하세요. 데스크톱과 휴대폰.

  • 디자인 시스템OpenDesign 페이퍼 캔버스, Albert Sans 사용, 단일 녹색 강조 색상
  • 브레이크포인트가로 스크롤 없이 1440px 데스크톱 및 390px 모바일
  • 인터랙션검색, 필터, 행 선택, 일괄 작업, 페이지네이션
  • 출력물안정적인 data-od-id 훅을 사용하는 단일 자체 포함 HTML 파일

2누가 무엇을 하나: 사용자, DeepSeek Harness, OpenDesign

  • 사용자

    사용자는 브리프를 작성하고, 디자인 시스템을 선택하며, 수용 기준을 설정합니다.

  • DeepSeek Harness

    DeepSeek Harness는 레이아웃을 계획하고 HTML, CSS, JavaScript를 작성한 뒤 요청에 따라 수정합니다.

  • OpenDesign

    OpenDesign은 디자인 시스템과 스킬을 제공하고, 미리보기를 렌더링하며, 각 버전을 프로젝트 파일로 보관합니다.

  • 검토

    인계 전에 시각적 계층 구조, 8px 그리드 간격, 두 브레이크포인트, 모든 상호 작용을 확인하세요.

3DeepSeek Harness 아티팩트: 1440px 및 390px의 관리자 표

DeepSeek Harness 아티팩트: 1440px 및 390px의 관리자 표 — 데스크톱
예시

4인수인계 전 검토

레이아웃

그리드와 여백

툴바, 표, 페이저가 8px 그리드에 정렬됩니다. 고정된 열 너비가 행이 튀지 않게 합니다.

계층 구조

시각적 계층 구조

이름과 역할이 앞서고, 강조 색상은 소유자 역할에만 나타납니다.

반응형

모바일 레이아웃

표는 이름, 이메일, 역할을 보여주는 목록으로 바뀌고, 필터는 시트로 이동합니다.

인터랙션

인터랙션 점검

검색하고, 역할로 필터링하고, 두 행을 선택하고, 일괄 작업을 실행한 다음, 다음 페이지로 넘기세요.

적합성

DeepSeek Harness가 적합한 경우—그리고 그렇지 않은 경우

DeepSeek Harness가 적합한 경우

  • 프로젝트 지침. AGENTS.md 또는 CLAUDE.md에서 브랜드 및 컴포넌트 규칙을 가져오세요.
  • 재사용 가능한 스킬. 프런트엔드 구현과 검증을 `.dsh/skills` 또는 `.agents/skills` 아래에 두세요.
  • 프로바이더 선택. 코드/명세 작업은 텍스트 전용 DeepSeek로, 스크린샷은 이미지 지원 경로로 라우팅하세요.
  • 조합 가능한 프로필. 워크플로에 필요한 도구, 정책, UI 플러그인으로 집중된 런타임을 구성하세요.

다른 워크플로를 선택해야 하는 경우

  • 편집 가능한 벡터 파일이 필요합니다. 출력은 HTML이며 편집 가능한 디자인 문서가 아닙니다. 필요한 자산 형식에 대해서는 별도의 벡터 워크플로를 찾아보세요.
  • 참고 자료도 제약 조건도 없습니다. 디자인 시스템이나 예시가 없으면 결과가 일반적인 모습으로 흐르기 쉽습니다. 생성하기 전에 브리프를 작성하세요.
  • 이 에이전트에 필요한 자격 증명이 없습니다. DeepSeek API 키 또는 구성된 다른 프로바이더 자격 증명이 필요합니다. OpenDesign은 자격 증명을 제공하거나 프록시하지 않습니다.
  • 팀이 DeepSeek 또는 Reasonix에서 작업합니다. 해당 에이전트에는 전용 페이지가 있습니다. 디자인 작업 공간은 일관되게 유지되지만 설정은 에이전트마다 달라집니다. 관련 에이전트를 참조하세요.

호환성

시작하기 전 DeepSeek Harness 요구 사항

이 페이지는 OpenDesign의 데스크톱 앱이 연결 지점일 때의 DeepSeek Harness를 다룹니다. 2026년 9월 6일 기준으로 게시된 참고 자료를 참조했습니다.

도구 범위DeepSeek Harness, by DeepSeek AI

DeepSeek Harness(`dsh`)는 DeepSeek AI의 공식 오픈 소스 에이전트 하네스입니다. 모델, 도구, 세션, 권한, 파일 시스템, 스킬, 서브에이전트, UI는 로컬 웹 UI와 헤드리스 러너에 의해 Cordis 플러그인으로 조립됩니다. 여기서 초점은 DeepSeek Harness 자체 인터페이스를 운영하는 것이 아니라 OpenDesign 내부에서 DeepSeek Harness로 인터페이스를 디자인하는 것입니다. OpenDesign이 사용할 수 있는 에이전트는 해당 설정 노트에 기록되어 있습니다.

계정 및 인증DeepSeek API key 또는 다른 구성된

DeepSeek API 키 또는 이미 구성된 다른 프로바이더 자격 증명. OpenDesign에서 설정 → Models & providers → Local CLI로 이동하여 다시 스캔하세요. 이 페이지에서는 할당량이나 가격을 약속하지 않습니다.

시스템 및 버전데스크톱 앱 또는 소스

데스크톱 빌드는 다운로드 페이지에 나열되어 있습니다. 소스 퀵스타트의 Node.js 및 pnpm 요구 사항은 소스에서 실행할 때 중요하며, 데스크톱 패키지 설치에는 적용되지 않습니다. 여기서 호환되는 최소 DeepSeek Harness 버전은 확인되지 않았습니다.

연결 확인성공 신호

설치한 버전에 표시되는 연결 단계를 사용한 다음, DeepSeek Harness에 작은 작업 하나를 맡기세요. DeepSeek Harness가 이를 수행했는지와 아티팩트를 열 수 있는지 확인하세요. 단순히 다운로드하는 것만으로는 연결이 작동한다는 것을 증명하지 않습니다.

데스크톱 앱으로 시작하기

DeepSeek Harness 설정을 위한 세 단계

다운로드로 시작하고, 설치한 버전에 맞는 DeepSeek Harness 설정을 마친 다음, 작은 결과 하나를 확인하세요. 이 경로를 따르는 데 OpenDesign을 소스에서 빌드할 필요는 없습니다.

  1. 1

    OpenDesign 데스크톱 앱 다운로드

    사용 중인 컴퓨터에 맞게 빌드된 설치 프로그램을 선택하고, 설치한 뒤 앱을 실행하세요.

    OpenDesign 다운로드
    체크포인트
    데스크톱 앱이 열리는 것을 확인해야 합니다. 이미 설치되어 있다면 다시 다운로드하지 말고 다음 단계로 넘어가세요.
  2. 2

    DeepSeek Harness 연결 준비하기

    설치한 버전과 함께 제공되는 DeepSeek Harness 지침을 사용하세요. OpenDesign에서 설정 → Models & providers → Local CLI를 열고 다시 스캔을 선택하세요.

    deepseek-ai/deepseek-harness 
    curl -fsSL 'https://open-design.ai/install-dsh.sh?version=1' | sh

    게시된 가이드의 DeepSeek Harness 설정 노트에서 발췌했습니다. 현재 명령을 공급업체 문서와 대조하여 확인하세요.

    체크포인트
    사용하려던 에이전트와 계정을 확인하세요. 사용할 수 없다면 더 큰 작업으로 넘어가기보다 먼저 호환성을 검토하세요.
  3. 3

    작은 DeepSeek Harness 작업 하나 실행하기

    브리프를 작게 유지하세요. 그러면 수정 한 번을 포함한 전체 루프를 판단할 수 있습니다.

    시작 브리프

    프로필 양식과 저장 확인을 포함하는 설정 화면을 만들어 주세요. 내 디자인 규칙을 적용하세요. 데스크톱 및 모바일 너비에서 확인하세요.

    체크포인트
    결과를 열고, 저장 상태를 확인한 뒤, 특정 변경 하나를 요청하세요. 생성된 파일은 검토의 시작일 뿐이며 결승선이 아닙니다.

OpenDesign을 소스에서 실행할 예정이라면 대신 기술 퀵스타트를 사용하세요.

DeepSeek Harness 디자인 워크플로

DeepSeek Harness 디자인 워크플로: 다섯 단계

이 연습 과정은 관리자 사용자 표를 브리프에서 검토된 파일까지 따라갑니다. 각 단계에서는 사용자의 입력, DeepSeek Harness의 작업, OpenDesign의 기여, 그리고 사용자가 확인할 내용을 제시합니다.

  1. 1

    디자인 브리프

    쉬운 언어로 된 짧은 브리프 — 세 줄에서 여섯 줄. 화면을 누가 사용하는지, 무엇을 달성해야 하는지, 어떤 플랫폼이 중요한지 명시하세요.

    • 사용자브리프를 작성하세요. 참고 스크린샷이 있다면 첨부하세요.
    • DeepSeek Harness브리프와 프로젝트의 지침 파일을 분석합니다. 요구 사항이 모호하면 진행하기 전에 질문합니다.
    • OpenDesign프로젝트와 프롬프트 환경을 호스팅하고, 아티팩트 유형에 맞는 스킬을 제공합니다.
    • 확인브리프에 수용 기준이 명시되어 있는지 확인하세요. 생성 전에 이를 확정하는 것이 나중에 수정하는 것보다 비용이 적게 듭니다.
  2. 2

    디자인 제약 조건

    디자인 시스템과 몇 가지 양보할 수 없는 사항. 그 조합이 결과를 일반적이지 않고 브랜드에 맞게 유지합니다.

    • 사용자디자인 시스템을 선택한 다음, 브레이크포인트와 반드시 나타나야 하는 컴포넌트를 명시하세요.
    • DeepSeek Harness코드를 작성하기 전에 DESIGN.md 토큰과 디자인 태도 규칙을 컨텍스트에 로드합니다.
    • OpenDesign디자인 시스템 라이브러리를 제공하고, 선택한 시스템을 스킬 템플릿에 바인딩합니다.
    • 확인토큰이 브랜드와 일치하는지 확인하세요: 단일 액센트, 올바른 글꼴, 올바른 모서리 반경.
  3. 3

    인터페이스 생성

    DeepSeek Harness는 레이아웃, 스타일, 상호작용 및 안정적인 훅을 포함한 하나의 자체 완결형 HTML 파일을 생성합니다.

    • 사용자기다리거나, 명확히 하는 질문 하나에 답하세요. 구성할 것은 없습니다.
    • DeepSeek Harness섹션을 계획하고 HTML, CSS, JavaScript를 작성한 뒤 파일을 실행하고 실패한 부분을 수정합니다.
    • OpenDesign아티팩트를 프로젝트 폴더에 저장하고 미리보기가 찾을 수 있도록 인덱싱합니다.
    • 확인잠시 기다리세요. 소스를 읽는 것이 아니라 파일이 렌더링된 후에 판단하세요.
  4. 4

    미리보기

    OpenDesign 내부에서 파일은 요청한 너비로 렌더링됩니다. 이 시점에서 디자인이 평가됩니다.

    • You너비를 변경하고, 상호작용을 클릭해 보며, 개별 요소에 댓글을 남기세요.
    • DeepSeek Harness미리보기 댓글을 읽고 다음 리비전을 준비합니다.
    • OpenDesign미리보기를 렌더링하고 data-od-id 대상 요소를 노출하여 댓글과 편집이 요소에 연결될 수 있게 합니다.
    • Check계층 구조, 대비, 390px에서의 오버플로, 포커스 상태, 액센트 사용의 절제를 확인하세요.
  5. 5

    수정 및 검증

    미리보기에서 요소를 가리켜 변경을 요청하세요. 각 리비전은 새 파일로 도착하며, 아무 흔적 없이 덮어쓰이지 않습니다.

    • You댓글을 요청으로 변환하고 작업이 언제 끝났는지 결정합니다.
    • DeepSeek Harness변경 사항을 제자리에서 적용하고 파일을 다시 실행합니다.
    • OpenDesign버전을 나란히 유지하고, 완료하면 이미지나 HTML을 내보냅니다.
    • Check변경된 영역만 다시 확인한 다음, 각 브레이크포인트에서 전체 페이지를 한 번씩 확인하세요.

리소스

DeepSeek Harness 디자인 리소스

스킬

디자인 스킬

DeepSeek Harness가 OpenDesign에서 생성할 수 있는 아티팩트 유형으로, 유형마다 하나의 스킬이 있습니다.

스킬 둘러보기 디자인 시스템

디자인 시스템

DeepSeek Harness가 어떤 출력을 생성하기 전에 바인딩하는 브랜드 토큰과 구성 요소.

시스템 둘러보기 템플릿

템플릿

덱, 랜딩 페이지, 제품 화면을 위한 시작점입니다.

템플릿 둘러보기 플러그인

DeepSeek Harness 디자인 플러그인

Harness용으로 만들어진 디자인 플러그인으로, 각각 자체 설정 노트가 있습니다.

플러그인 둘러보기

제한 사항

DeepSeek Harness 제한 사항, 수동 확인 및 폴백

  • 범위이 페이지는 OpenDesign에 연결된 에이전트로서의 DeepSeek Harness에 관한 것이며, DeepSeek Harness의 모든 기능에 관한 것이 아닙니다.
  • 사용 제한사용 한도와 비용은 사용하는 자격 증명(DeepSeek API 키 또는 구성된 다른 제공자 자격 증명)에 따라 달라집니다. 여기서 무료 할당량에 대한 주장은 하지 않습니다.
  • 네트워크로컬 프로젝트 파일이 오프라인 추론을 의미하지는 않습니다. 민감한 입력을 공유하기 전에 에이전트의 제공자 설정과 데이터 정책을 확인하세요.
  • 출력물은 HTML입니다아티팩트는 벡터 디자인 파일이 아니라 HTML 파일로 제공됩니다.
  • 수동 검토미리보기에서 접근성, 실제 콘텐츠, 브랜드 적합성, 상호작용 정확성을 검토합니다. 에이전트의 자체 점검은 1차 점검일 뿐입니다.
  • 대체 방법에이전트를 사용할 수 없거나 작업이 실패하면 설치된 버전의 연결 지침과 인증을 참조하세요. 구성을 변경하기 전에 오류와 마지막으로 작동한 아티팩트를 보존하세요.

자주 묻는 질문

DeepSeek Harness와 OpenDesign에 대해 자주 묻는 질문

DeepSeek Harness란 무엇입니까?
DeepSeek Harness(`dsh`)는 DeepSeek AI의 공식 오픈소스 에이전트 하니스입니다. Cordis 플러그인 트리를 통해 모델, 도구, 컨텍스트, 세션, 정책, 오케스트레이션, UI를 결합합니다. 공개 릴리스는 현재 MIT 라이선스 하의 개발자 프리뷰 단계입니다.
DeepSeek Harness를 설치하고 실행하는 방법은 무엇입니까?
사용 중인 OS에 맞는 한 줄 설치 명령을 실행하십시오 — macOS/Linux: `curl -fsSL 'https://open-design.ai/install-dsh.sh?version=1' | sh` (PowerShell 및 CMD 한 줄 명령은 위의 설정 섹션에 있습니다). 사전에 설치된 Node.js, pnpm, dsh가 필요하지 않으며 `sudo`도 필요하지 않습니다. 설치가 끝나면 설치 프로그램이 `dsh web`을 엽니다. 프리뷰 안내를 지나쳐 Settings → Models → DeepSeek → API Key에 API 키만 저장하십시오. 제공자와 모델이 정상 작동하는지 확인한 뒤 `Ctrl+C`로 Web UI를 중지하고, OpenDesign 0.19.1 이상을 설치하고, Local CLI 에이전트를 다시 스캔하고, Harness 카드를 연결한 다음 Test를 클릭하십시오.
설치 프로그램이 기존 Node.js를 덮어씁니까?
아닙니다. 필요한 환경이 없는 경우 사용자 디렉터리 내부에 독립된 Node.js와 DeepSeek Harness 툴체인을 설치하며, 시스템 Node.js를 수정하거나 다른 프로젝트가 사용하는 버전을 교체하지 않습니다. 호환되는 Node.js, pnpm, dsh가 이미 있다면 설치 프로그램이 이를 감지하여 다시 내려받지 않고 재사용합니다.
터미널이 설치 후 Dsh를 찾지 못한다면 어떻게 해야 합니까?
먼저 새 터미널 창을 여십시오. OpenDesign은 일반적인 사용자 수준 도구 디렉터리를 자체적으로 스캔하므로 보통 PATH를 편집할 필요가 없습니다. OpenDesign이 이미 열려 있다면 Local Agent 페이지로 이동하여 Rescan을 클릭하십시오. 감지가 계속 실패하면 설치 프로그램의 마지막 화면에서 DeepSeek Harness가 준비되었다고 표시했는지 확인한 다음, 지원을 요청할 때 해당 출력을 OpenDesign의 테스트 메시지와 함께 공유하십시오.
DeepSeek Harness는 공식 DeepSeek 프로젝트입니까?
예. 이 저장소는 `deepseek-ai` GitHub 조직 아래에 게시되어 있으며, dsh를 DeepSeek AI가 개발한 에이전트 하니스로 설명합니다. MIT 라이선스이며 개발자 프리뷰로 명시되어 있습니다.
하네스가 디자인에 기여하는 것
DeepSeek Harness(`dsh`)는 DeepSeek AI가 개발한 MIT 라이선스 에이전트 하네스입니다. 공식 제품 페이지에서 프로젝트를 소개합니다; GitHub 저장소에는 소스, 릴리스 기록, 유지 관리되는 가이드가 있습니다. 공개 개발자 프리뷰는 로컬 Web UI와 헤드리스 프로필을 제공합니다.

이 프로젝트의 핵심 아이디어는 “모든 것이 플러그인”입니다. Cordis는 모델 어댑터, 도구 레지스트리, 에이전트 루프, 파일시스템, 셸, 샌드박스, 스킬, 서브에이전트, 영속성, UI를 프로필과 번들을 통해 마운트, 교체, 패치할 수 있는 트리를 구성합니다. 제공되는 `web` 및 `headless` 프로필은 고정 제품이라기보다 시작점입니다.

로컬 Web UI: `npx @deepseek-ai/dsh web`는 기본적으로 `127.0.0.1:3080`에서 브라우저 작업 공간을 시작합니다. 모델을 추가하고, 작업 공간을 선택한 뒤 대화 UI에서 작업을 실행하세요.

헤드리스 모드: `headless` 프로필은 새로 지속되는 세션 하나를 실행하고, 최종 답변을 출력한 뒤 종료합니다 — 스크립트 기반 감사, 빌드, 반복 가능한 디자인 검사에 유용합니다.

구성 가능한 런타임: 프로필은 플러그인 번들과 자체 패치를 쌓습니다. 이를 통해 팀은 에이전트 루프를 포크하지 않고도 제공자, 도구, 정책, UI 동작을 변경할 수 있습니다.

상태: 개발자 프리뷰; 호환성을 깨뜨리는 변경이 예상됨

개발자: DeepSeek AI(공식 프로젝트)

라이선스: MIT

기본 명령: `npx @deepseek-ai/dsh web`
DeepSeek Harness는 디자인을 할 수 있나요?
DeepSeek Harness는 랜딩 페이지, 제품 인터페이스, 대시보드, 프런트엔드 프로토타입을 구축할 수 있습니다. 저장소를 읽고, 실제 UI 코드를 편집하고, 명령을 실행하고, 프로젝트 지침을 로드하고, 반복 전반에 걸쳐 세션을 유지할 수 있기 때문입니다. 단독으로 제공하지 않는 것은 시각적 취향입니다: 유용한 디자인 작업에는 여전히 브랜드 규칙, 참고 자료, 도구, 권한, 그리고 결과를 렌더링하고 확인하는 루프가 필요합니다.

지속적 디자인 컨텍스트: 기본 지침 로더는 프로젝트 계층에서 `AGENTS.md`와 `CLAUDE.md`를 읽습니다. 토큰, 컴포넌트 규칙, 반응형 브레이크포인트, 검토 기준을 모든 실행이 볼 수 있는 곳에 두세요.

재사용 가능한 스킬: 로컬 스킬은 `.dsh/skills` 또는 `.agents/skills` 아래에 둘 수 있습니다. 프런트엔드 스킬은 각 UI 작업이 제로에서 시작하지 않도록 하는 정확한 브리프, 체크리스트, 예시, 스크립트를 패키징할 수 있습니다.

작업별 제공자 선택: Web UI는 DeepSeek, Anthropic 또는 OpenAI 같은 카탈로그 제공자, 그리고 사용자 지정 OpenAI 호환 엔드포인트를 구성할 수 있습니다. 스크린샷 입력에는 선언된 이미지 지원 경로를 사용하세요; 텍스트, 코드, DOM, 스펙 기반 작업에는 네이티브 DeepSeek 경로를 사용하세요.

하네스는 입력을 운반합니다; 취향은 여전히 디자인 시스템, 집중된 스킬, 구체적인 참고 자료에서 나옵니다.

중요한 한계는 모든 에이전트에게 동일합니다: 구성 가능성은 취향이 아닙니다. 의도적인 타이포그래피, 간격, 컴포넌트, 상호작용 제약이 없으면 런타임은 일반적인 결과를 충실히 자동화할 것입니다. OpenDesign의 역할은 그러한 디자인 입력을 제공하고 조직하는 것입니다.
1단계: DeepSeek Harness 설치 및 구성
Node.js, pnpm 또는 dsh를 미리 설치할 필요가 없습니다. 운영 체제에 맞는 한 줄 설치 프로그램을 실행하세요. 그러면 OpenDesign이 검증한 DeepSeek Harness 도구 체인을 설치한 다음 API 키 설정 페이지를 엽니다. 설치 프로그램은 시스템 Node.js를 절대 건드리지 않으며 `sudo`나 관리자 권한이 필요하지 않습니다. 기존의 호환 환경은 자동으로 재사용됩니다.

macOS / Linux — 터미널을 열고 이 줄을 붙여 넣은 다음 Enter를 누르세요(Apple Silicon, Intel Mac, 그리고 주류 x64/arm64 Linux 배포판이 지원됩니다. Alpine Linux는 아직 지원되지 않습니다):

Windows PowerShell — PowerShell을 열고 이 줄을 붙여 넣은 다음 Enter를 누르세요:

Windows CMD — 명령 프롬프트를 열고 이 줄을 붙여 넣은 다음 Enter를 누르세요:

호환되는 Node.js, pnpm 및 DeepSeek Harness 버전을 확인하고, 있으면 재사용합니다. 아무것도 두 번 다운로드되지 않습니다.

환경이 없으면 사용자 디렉터리 안에 격리된 Node.js 및 DeepSeek Harness 도구 체인을 설치합니다.

OpenDesign이 검증한 릴리스를 고정하므로 자동 업그레이드가 호환성을 깨뜨릴 수 없습니다.

Node.js 다운로드의 SHA-256을 검증하고 불일치 시 설치를 중지합니다.

전역 Node.js를 덮어쓰지 않으면서 OpenDesign이 검색할 수 있는 `dsh` 항목을 만듭니다.

OpenDesign 설치 엔드포인트, nodejs.org 및 npm 레지스트리와만 통신합니다. 프로젝트 파일이나 API 키를 업로드하지 않습니다.

Harness Web UI 열기: 설치 프로그램이 끝나면 자동으로 `dsh web`을 실행합니다. 일반적으로 `http://127.0.0.1:3080`을 엽니다. 브라우저가 열리지 않으면 터미널에 출력된 주소를 복사하여 그 정확한 주소를 사용하세요. 나중에 다시 구성해야 할 때마다 `dsh web`을 다시 실행하세요.

DeepSeek API 키 추가: 미리 보기 알림을 지나 계속한 다음, 메시지가 표시되면 키를 저장하거나 적용하세요. 프롬프트가 나타나지 않으면 Settings → Models → DeepSeek → API Key를 여세요. 키만 붙여 넣으세요. `DEEPSEEK_API_KEY=...`도, 따옴표도 아닙니다. 변경 사항은 즉시 적용됩니다. `dsh web`을 다시 시작할 필요가 없습니다. 필요하면 DeepSeek Platform에서 하나를 만드세요.

모델을 확인한 다음 설정 UI를 닫으세요. DeepSeek 제공자가 구성됨으로 표시되고 해당 모델이 선택기에 나타나야 합니다. `MISSING_CREDENTIAL`이 표시되면 DeepSeek 카드를 다시 열고 키를 다시 저장하세요. 테스트 프롬프트가 작동하면 `Ctrl+C`를 누르세요. OpenDesign을 사용하는 동안 `dsh web`이 열려 있을 필요는 없습니다.

DeepSeek Harness는 제공자 자격 증명을 쓰기 전용 비밀로 저장합니다. UI는 키가 구성되었는지 보고할 수 있지만 평문 키를 읽거나 표시할 수는 없습니다. OpenDesign은 키를 OpenDesign으로 복사하지 않고 사용자가 설치한 이 dsh와 모델 구성을 재사용합니다. 설치 프로그램은 이미 OpenDesign이 검증한 릴리스를 고정하므로 수동 버전 관리가 필요하지 않습니다. 업스트림 자격 증명 동작에 대해서는 공식 제공자 가이드를 참조하세요.

명령과 버전별 세부 정보에는 현재 설정 섹션을 사용하세요. 이는 변경될 수 있습니다.

& ([scriptblock]::Create((irm 'https://open-design.ai/install-dsh.ps1?version=1')))
이전 가이드의 과거 명령 예시입니다. 링크된 공급업체 문서에서 현재 구문을 확인하세요.

curl -fsSL "https://open-design.ai/install-dsh.cmd?version=1" -o "%TEMP%\install-dsh.cmd" && call "%TEMP%\install-dsh.cmd"
이전 가이드의 과거 명령 예시입니다. 링크된 공급업체 문서에서 현재 구문을 확인하세요.
UI 빌드 및 검토 루프 실행
인터페이스 작업에서는 브리프와 승인 루프를 명확히 하세요. 기본 DeepSeek 경로는 텍스트 전용이므로 가장 신뢰할 수 있는 기준은 코드와 명세 워크플로입니다. 이미지 입력을 선언하는 모델 경로를 선택한 뒤에만 스크린샷을 첨부하세요.

저장소에서 dsh를 시작하고, 해당 디렉터리를 작업 공간으로 선택한 다음, 이 작업에 사용할 모델 경로를 선택하세요.

브랜드 계약을 `AGENTS.md`, `CLAUDE.md` 또는 참조된 `DESIGN.md`에 넣으세요: 토큰, 프리미티브, 간격, 타입, 브레이크포인트, 상태, 금지 패턴.

`.dsh/skills` 또는 `.agents/skills`에서 집중된 프런트엔드 스킬을 로드하세요. 예제와 검증 스크립트를 지침 옆에 두세요.

에이전트에게 기존 컴포넌트를 재사용하고, 애플리케이션을 실행하며, 프로젝트 자체 테스트나 브라우저 도구로 반응형 상태를 검증하도록 요청하세요.

보이는 결과를 검토하고, 구체적인 차이를 기록하며, 작은 커밋 단위로 반복하세요. 나쁜 기반 위에 수정을 쌓는 대신 약한 결과는 되돌리세요.

유용한 프롬프트는 시각적 제약과 검증 증거를 모두 명시합니다:

스크린샷이 필수라면 먼저 이미지 지원이 가능한 제공자를 구성하세요. 선택한 경로가 이미지 지원을 선언하지 않으면 DeepSeek Harness는 이미지를 보내기 전에 거부합니다. 이는 참조가 조용히 누락되는 것을 막는 유용한 보호 장치입니다.

React + TypeScript로 계정 대시보드를 구현하세요. AGENTS.md와 DESIGN.md에 명시된 컴포넌트와 토큰을 재사용하세요. 240px 사이드바, 12열 콘텐츠 그리드, 그리고 문서화된 모바일 탐색 패턴을 사용하세요. 로딩, 비어 있음, 오류, 포커스 상태를 포함하세요. 앱과 기존 UI 검사를 실행하고, 데스크톱 및 모바일 브레이크포인트를 검사하며, 검증한 정확한 파일과 상태를 보고하세요.
이전 가이드의 과거 명령 예시입니다. 링크된 공급업체 문서에서 현재 구문을 확인하세요.
플러그인과 스킬로 워크플로를 재사용 가능하게 만들기
DeepSeek Harness는 채팅 표면 아래에서 가장 차별화된다. 플러그인 트리를 통해 팀은 디자인 워크플로를 모든 세션에 붙여 넣는 프롬프트가 아니라 런타임의 일부로 만들 수 있다.

AGENTS.md 및 CLAUDE.md: 지침 플러그인은 사용자 전역 파일과 프로젝트 계층을 로드한 다음, 퍼스트파티 파일 작업 후 관련 중첩 지침 파일을 인식한다. 일회성 요청이 아니라 지속적인 디자인 규칙에 사용하라.

파일시스템 스킬: 스킬 레지스트리는 프로젝트 및 사용자 루트를 탐색하고, 중복 항목의 순위를 정하며, 모델 대상 `skill` 도구를 노출한다. 이는 프런트엔드 제작 기술, 접근성, 반응형 QA, 디자인 시스템 절차에 자연스러운 위치다.

프로필과 번들: 프로필은 순서가 지정된 플러그인 번들과 사용자 패치를 쌓는다. 팀은 실제로 필요한 프로바이더, 도구, 권한 정책, 스킬 소스로 디자인 중심 구성을 유지할 수 있다.

MCP 및 외부 기능: 소스 트리에는 MCP 클라이언트 기능이 포함되어 있지만, 사용자 대상 구성은 여전히 개발자 지향적이다. 미리보기 동안 통합을 안정적인 체크박스 워크플로가 아니라 버전 관리되는 플러그인 작업으로 취급하라.

장기적으로 유지할 내부 워크플로를 구축하기 전에 `dsh --profile web --dump-config`로 유효 트리를 검사하라. 그 출력은 실제로 마운트되고 패치 가능한 것을 보여준다. 이는 저장소의 모든 패키지가 배포된 프로필에서 활성화되어 있다고 가정하는 것보다 더 신뢰할 수 있다.
DeepSeek Harness, DeepSeek TUI, 그리고 OpenDesign
DeepSeek Harness와 DeepSeek TUI는 실행 파일이 서로 다른 별도 프로젝트다. OpenDesign는 이제 둘 모두를 로컬 에이전트로 지원하므로, 선택은 어느 런타임을 원하는지에 관한 것이지 둘 중 하나가 디자인 워크스페이스에 들어갈 수 있는지 여부가 아니다.

DeepSeek Harness (`dsh`) — 로컬 Web UI와 헤드리스 프로필을 갖춘 공식 DeepSeek AI 플러그인 우선 Harness; 퍼스트파티 OpenDesign 어댑터 — OpenDesign의 아티팩트 워크플로 안에서 Harness 세션, 프로바이더, 플러그인 구성을 사용

DeepSeek TUI (`deepseek` / `codewhale`) — 자체 OpenDesign 어댑터를 갖춘 별도의 터미널 코딩 에이전트 — Harness 프로필 아키텍처가 없는 터미널 우선 DeepSeek 워크플로

OpenCode — 성숙한 오픈 소스, 프로바이더 독립적 터미널 에이전트 — AGENTS.md와 MCP를 사용하는 안정적인 TUI 워크플로 안에서 모델 전환

Claude Code — 터미널, IDE, 데스크톱, 웹 표면 전반에 걸친 성숙한 코딩 에이전트 — 프런트엔드 추론, 이미지가 많은 참조, 확립된 디자인 통합

OpenDesign — 지원되는 코딩 에이전트를 둘러싼 에이전트 네이티브 디자인 워크스페이스 및 라이브러리 — 큐레이션된 디자인 시스템, 스킬, 시각적 아티팩트, 그리고 단일 모델 벤더에 독립적인 로컬 워크플로

공식 Web UI, 프로필 시스템, 모델 카탈로그, 재개 가능한 Harness 세션을 원할 때 DeepSeek Harness를 선택하라. 해당 에이전트의 터미널 우선 워크플로를 선호할 때 OpenDesign 내부의 DeepSeek TUI를 선택하라. OpenDesign가 이제 둘 중 어느 것이든 동일한 디자인 프로세스로 감쌀 수 있더라도, 이들은 서로 다른 런타임으로 남는다.

도구 — 무엇인지 — 최적의 디자인 활용
시각적 결과물을 망치는 실패를 피하세요
가장 큰 실수는 미리보기를 안정적인 제품처럼 취급하거나, 텍스트 전용 경로를 비전 모델처럼 취급하거나, 유연한 하네스를 시각적 취향의 원천처럼 취급하는 데서 비롯됩니다.

사용자 정의하기 전에 고정하세요: 호환성을 깨는 변경은 명시적인 미리보기 정책입니다. npm 버전을 고정하고 프로필 패치를 업그레이드 후 검토할 수 있을 만큼 작게 유지하세요.

선택한 모델의 모달리티를 확인하세요: 네이티브 DeepSeek chat-completions 경로는 텍스트 전용입니다. 스크린샷-투-코드의 경우 첨부 파일이 이해될 것이라고 가정하지 말고 이미지 지원 제공자 경로를 선택하고 선언하세요.

취향을 데이터로 제공하세요: 에이전트에게 토큰, 표준 컴포넌트, 참조 상태, 금지된 패턴을 제공하세요. 디자인 계약이 없는 모듈식 런타임은 여전히 일반적인 UI를 생성합니다.

프로필이 실제로 마운트하는 것을 확인하세요: 저장소 패키지는 기능이지, 기본 프로필이 이를 활성화했다는 증거가 아닙니다. 통합을 문서화하거나 의존하기 전에 구성된 설정을 검사하세요.

각 완화 조치는 컨텍스트와 검증 결정입니다. 바로 이것이 디자인 계층이 모든 프로젝트가 재발견하도록 내버려 두는 대신 반복 가능하게 만들어야 하는 작업입니다.
2단계: OpenDesign 0.19.1 이상 다운로드
dsh가 로컬에서 작동하면 나머지는 OpenDesign에서 진행됩니다. DeepSeek Harness 통합은 OpenDesign 0.19.1 이상에서 사용할 수 있습니다.

현재 데스크톱 빌드를 OpenDesign 다운로드 페이지에서 받아 설치하고 앱을 실행하세요.
3단계: DeepSeek Harness 감지
설정 열기 → 모델 및 공급자 → 로컬 CLI로 이동한 다음 다시 검사를 선택하세요. 설치 중에 이미 열려 있었다면 OpenDesign을 다시 시작하거나 다시 검사하세요. DeepSeek Harness 카드는 OpenDesign이 1단계의 `dsh` 실행 파일을 찾으면 나타납니다.
4단계: OpenDesign 프로필 연결
DeepSeek Harness 카드를 선택합니다. “Connection setup required”라고 표시되면 “Install and select”를 확인합니다. OpenDesign은 자체 구성 요소를 확인하고, dsh에 `open-design` 프로필에 설치하도록 요청하고, 다시 검사한 후 연결을 테스트합니다.

이것이 체크포인트입니다: 감지된 Harness 버전, “Synced from CLI”, 그리고 작동하는 Test 작업.

이로써 연결이 완료됩니다. UI와 `od agent setup deepseek-harness --json`은 동일한 로컬 설정 경로를 사용하며, 각 실행은 `dsh --profile open-design --stdio`를 시작하고, Harness는 이후 턴을 위해 세션 ID를 유지합니다.
5단계: 디자인 작업 시작
카드에 Harness 버전과 “CLI에서 동기화됨”이 표시되는지 확인한 다음 Test를 클릭하세요. 테스트가 통과되면 프로젝트를 열거나 만들고 DeepSeek Harness와 동기화된 모델을 선택한 뒤 디자인 요청을 보내세요.

DeepSeek Harness는 실제 작업 공간을 편집하고, OpenDesign은 요청, 진행 상황, 미리보기, 최종 아티팩트를 함께 보관합니다.

경계는 단순하게 유지됩니다. Harness는 dsh, 자격 증명, 모델, 세션을 소유하고, OpenDesign은 검증된 연결 프로필과 디자인 작업 공간을 소유합니다. OpenDesign은 DeepSeek AI와 독립적이며, DeepSeek과 DeepSeek Harness는 각 소유자의 상표입니다.

Create a polished product landing page in this workspace. Use DESIGN.md, AGENTS.md, and the installed frontend skill as the visual contract. Reuse the project tokens and components; include desktop and mobile states. Run the app, inspect the rendered result, fix visible spacing and hierarchy issues, and leave the final HTML and assets in the project for OpenDesign to preview.
이전 가이드에 있던 과거 명령 예시이며, 현재 구문은 링크된 공급업체 문서에서 확인하세요.
DeepSeek Harness는 공식인가요?
예. DeepSeek AI가 개발했으며 MIT 라이선스로 배포됩니다.