워크스페이스 & 프리뷰

dsh-web-preview

워크스페이스를 미리 보고, 프로젝트를 실행하고, 요소에 주석을 다는 글래스 사이드 패널.

무엇인가

하네스 웹 UI를 위한 사이드 웹 프리뷰 패널. 워크스페이스 파일을 프리뷰로 서빙하고(Markdown은 렌더링, 코드는 줄 번호와 함께, 이미지와 HTML은 그대로), 프로젝트는 Cargo, package.json, go.mod, Python을 자동 감지해 라이브 로그와 함께 실행되며, 마킹 모드가 요소 주석을 대화로 되돌려 보냅니다.

DeepSeek Harness(DSH)侧边网页预览面板 —— 一个标准 Cordis 插件包(Host + Client 双半),把工作区目录托管成 iframe 预览,并支持项目运行、元素标记批注与链接点击接管。
업스트림 README에서

디자인에 왜 중요한가

  • 에이전트가 방금 작성한 프로토타입이 채팅 옆에서 열립니다. 주소창은 동기화되고 패널 너비는 드래그로 조절됩니다.
  • 마킹 모드가 요소를 호버로 강조하고, 셀렉터와 HTML 스냅샷을 수집해 메모와 함께 대화로 보냅니다.
  • 링크, 파일 경로, 드롭한 파일이 모두 패널에서 열려 리뷰가 세션을 떠나지 않습니다.

다루는 내용

  • 功能
  • 安装
  • 开发
  • 协议

설치 방법

dsh-web-preview

  1. 터미널에서 실행하세요.

    cd ~/.dsh/profiles/web && npm install dsh-web-preview-panel
  2. 플러그인을 인식하도록 dsh web을 다시 시작하세요.

  3. 그다음 원하는 디자인을 설명하세요. 하네스가 플러그인의 도구를 알아서 집어 듭니다.

DeepSeek Harness로 실행하는 법

  1. 웹 프로필 디렉터리에 패키지를 설치한 뒤, 해당 프로필의 cordis.patch.yml에 dsh-web-preview-panel이라는 이름의 insert 항목을 추가해 마운트하세요.

  2. dsh web을 다시 시작하고 대화 우측 상단의 ▶ 프리뷰 버튼을 여세요.

  3. 패널에서 프로젝트를 실행하고, 요소에 주석을 달고, 로그와 메모를 곧장 에이전트에게 보내세요.

여기 모인 플러그인은 모두 무료로 설치할 수 있으며, 실제 업스트림 출처로 연결됩니다.

DeepSeek Harness 저장소에서 더 보기 ↗

다음 단계

세팅 없이, OpenDesign으로 디자인하기

이 플러그인을 직접 설치해도 되고, OpenDesign으로 DeepSeek Harness 주위에 잘 정돈된 디자인 레이어를 통째로 두를 수도 있습니다. 키는 직접 가져오고, 산출물도 직접 소유하세요.

OpenDesign 데스크톱

하나의 디자인 시스템으로 모든 결과물에 브랜드 일관성을

완전한 Vibe Design Workspace에서 하나의 브랜드 규칙을 웹사이트, 슬라이드, 인터랙티브 프로토타입, 대시보드, 이미지, HTML 영상에 적용하세요. 로컬 Codex, Claude Code, Cursor 등을 연결해 무료로 제작할 수 있습니다.

  • 웹, 슬라이드, 프로토타입, 대시보드, 이미지, 영상
  • 140개+ 디자인 시스템과 전체 템플릿·스킬 라이브러리
  • 로컬 Codex 및 21개+ 코딩 에이전트 연결 · 무료
무료 다운로드

macOS, Windows 지원