product_design_dongh

Plugin product_design_dongh from marketplace product_design_dongh in dongdongdongdongding/product_design_dongh. Commands read from the repo's manifest — 12 days ago.

Skills (11)

• artifact-qa

  플로우 맵 · 화면설계서 · 디자인 캔버스를 로컬에서 띄워 자동 검수하고 최종 검증한다 — 번호 마커가 잘리거나 가려짐, 번호 원 겹침, 원이 글자를 가림, 영역 겹침, 화면 넘침, 보드 밖 잘림, 빈 공간, 지도 높이, 연결선이 화면을 가로지름, 플로우 맵 대비 누락, 금지 표기(시연 등), 요구 추적 · 기능 · 입력 필드 · 예외 연결. "검수", "잘린 부분", "빈 부분", "가려졌다", "요구사항에 맞는지 검증", "마지막으로 확인"을 요청하면 쓴다. English (QA the output, check clipping

• design-brief

  화면 디자인 방향을 글로 묻지 않고 그림으로 정한다 — 외부 레퍼런스를 찾아 핵심 화면 하나를 서로 다른 방향의 시안 2~4개로 그려 Claude Design 캔버스(편집 가능한 디자인 Artifact)에 나란히 올리고, 사용자가 고르거나 섞거나 캔버스에서 직접 고친 결과로 디자인 브리프 · 토큰 · theme.css를 정한다. "디자인은 어떻게", "톤앤매너", "기존 사이트처럼", "화면 스타일 정해줘", "시안 몇 개 보여줘", "디자인 방향", "A안 B안"이라고 하거나 screen-spec-kit 디자인 방향 작업에 들어가

• design-canvas

  프로젝트 화면을 Claude Design 캔버스(Design 타입 Artifact, 보드별 .dc.html)로 만들고, 같은 URL에 시안 비교 · 초안 · 전체 화면 · 디자인 시스템 보드를 쌓아 게시하고, 사용자가 캔버스에서 직접 고친 보드를 받아 시안으로 되가져온다. "디자인 캔버스", "클로드 디자인으로", "편집 가능한 디자인", "디자인 아티팩트", "디자인에서 고쳤어", "캔버스 수정 반영", "스크린샷 말고 실제 디자인"을 요청하거나, 시안 비교 · 초안을 보여 줄 때, 캔버스 보드의 잘림 · 빈 공간 · 지도 여백을

• design-system

  화면 시안의 디자인 품질을 맡는 내부 스킬. 외부 레퍼런스 검색(비슷한 서비스 · 공개 디자인 시스템 · 패턴 사례), Apple HIG(Human Interface Guidelines) · Material · KRDS 같은 플랫폼 원칙, 닐슨 휴리스틱 평가, 디자인 토큰(W3C DTCG) 정리, 컴포넌트 목록 · 상태 정리, 접근성 대비 검사, 기획 밀도 기준을 다룬다. "디자인 시스템", "디자인 토큰", "컴포넌트 정리", "HIG", "iOS 느낌", "휴리스틱", "사용성 평가", "UX 검토", "레퍼런스 찾아줘", "비

• draft-review

  전체를 다 만들기 전에 핵심 화면 2~4개를 기획 밀도를 갖춘 초안으로 그려 Claude Design 캔버스(편집 가능한 디자인 Artifact)와 플로우 맵 초안으로 함께 보여 주고, 사용자가 말로 준 피드백이나 캔버스에서 직접 고친 내용을 가져와 반영하는 일을 반복한 뒤 나머지 화면으로 확장한다. "초안 먼저 보여줘", "시안 몇 개만", "이거 고쳐줘", "디자인에서 고쳤어", "캔버스 수정 반영", "이 방향 맞아?", "피드백 반영"이라고 하거나 초안 · 검토 작업에 들어가면 쓴다. English (show me a dra

• flowmap-artifact

  화면 시안(1440×900 HTML)과 화면 · 흐름 · 검토 이슈 정의(project.js)를 쓰고 공통 엔진과 합쳐 플로우 맵 아티팩트(무한 캔버스 · 우회 연결선 · 기능정의 카드 · 검토 이슈 핀 · 인스펙터 · 문서 패널 · 프로토타입 · 화면설계서 탭)를 만들어 게시한다. "플로우 맵", "화면 흐름도", "화면 연결 정리", "프로토타입처럼 이어지게", "아티팩트로 정리"를 요청하거나 시안 화면을 새로 그리거나 고칠 때 쓴다. English (flow map, screen flow, clickable prototype,

• plan-decompose

  기획서 · 요구사항 정의서는 물론 한두 문장 아이디어만 받아도, 그것을 앱 · 웹 서비스의 사용자 · 역할 → 메뉴 트리(menuCode) → 화면 목록(SCR, 형태 · 진입) → 기능(기능 ID · 구현 구분 · 완료 기준) → 화면별 컴포넌트와 동작(이벤트 → 결과 · 상태 · 이동 · 데이터) → 화면 연결(출발 → 도착 · 넘기는 값) → 데이터 객체 · 상태 전이 · 권한 → 예외 후보 → 기본 결정 · 미결까지 끝까지 분해해 해석한다. "아이디어만 있어", "이런 앱 만들고 싶어", "기획 정리해줘", "메뉴 구성",

• sb-screen-spec

  플로우 맵 안의 화면설계서(SB) 탭을 쓴다 — 화면마다 빨간 번호 마커와 Description(구성 · 입력 규칙 · 동작 · [예외] 문구 · 저장/서버 처리), 하위 번호 상태 예시(팝업 · 오류), 조합이 많은 규칙의 판정표 페이지, 메뉴 · 업무 흐름, 상태값 · 공통 문구 사전, 지도 기준, 최종 검증. 사용자가 참고 화면설계서(예를 들어 기관 SB PDF)를 주며 "이런 식으로", "화면설계서 탭", "SB", "스토리보드", "Description"을 말하면 쓴다. English (storyboard pages, nu

• screen-spec-kit

  어떤 웹 · 앱 서비스든 기획서 · 요구사항 정의서(요청서 · RFP · HWP/PPT/PDF) · 운영 사이트 · 한두 문장 아이디어를 받아 → 메뉴 · 기능 · 컴포넌트 · 동작 · 연결까지 기획 분해 → 레퍼런스 조사와 시안 비교(Claude Design 캔버스)로 디자인 방향 → 기획 밀도를 갖춘 화면 초안 → 캔버스 · 말 피드백 반영 → 개발 문서 3종 · 플로우 맵 · 화면설계서(SB) · 디자인 시스템 → 검수까지 만드는 작업의 진입점. "화면설계서 만들어줘", "SB 정리", "기획서 보고 화면 설계", "아이디어로

• source-intake

  화면 설계 전에 기획서 · 요구사항 정의서(요청서 · RFP · 과업지시서) 등 원본 자료와 배포 사이트를 받아 읽고 근거 노트와 디자인 기준 값을 만든다. HWP · PPTX · PDF · XLSX · DOCX · 이미지 · 참고 화면설계서 · 이전 대화(Codex 등) 기록 · 운영 중인 웹 사이트를 근거로 요구 항목 · 메뉴 · 실제 옵션 · 디자인 토큰을 뽑아야 할 때 쓴다. "기획서 보고", "요청 사항 다시 보고", "실제 서비스 링크 확인", "기존 사이트 톤 맞춰"라는 말이 나오면 이 스킬로 시작한다. English

• spec-docs

  추가 개발용 기능정의서 · 상세명세(예외 · 검수 · 입력/서버/DB · 지도 표현) · WBS 3종을 원본 요구와 배포 사이트에 대조해 작성 · 보완 · 검증한다. 기능 ID · 화면 ID · 예외 EX · 검수 AT · 요구 추적표 · 공수 합계를 다루거나 "문서 검토하고 보완", "요구사항 추적", "WBS 공수", "입력값 · DB 명세", "지도 명세"를 요청하면 쓴다. English (functional spec, detailed spec, exceptions, test scenarios, WBS, traceability

Slash commands (6)

• /product_design_dongh:audit

  플로우 맵 · 화면설계서 · 디자인 캔버스를 로컬 서버와 Chrome으로 자동 검수하고 최종 검증 결과를 보고한다

• /product_design_dongh:build

  문서 정합 검사 후 플로우 맵(화면설계서 탭 포함)과 디자인 캔버스 보드를 다시 만든다

• /product_design_dongh:new

  새 프로젝트의 화면 설계 폴더(spec-kit)를 시작 틀로 만들고 원본 자료 읽기부터 시작한다

• /product_design_dongh:publish

  검수가 끝난 플로우 맵과 디자인 캔버스를 Artifact로 게시(또는 갱신)한다

• /product_design_dongh:start

  시작한다 — 기획서 · 요구사항 정의서 · 아이디어를 받아 기획 분해 → 레퍼런스 · 시안 비교(디자인 캔버스) → 초안 → 검토 → 문서 · 플로우 맵 · SB까지 이어서 진행한다(결정이 필요한 곳에서만 멈춤)

• /product_design_dongh:status

  무엇이 만들어졌고 무엇이 남았는지, 다음에 추천하는 일을 보여 준다

Similar plugins