본문으로 건너뛰기
cccskills
무료GitHub에 공개

breadboarding-workflow

Map UI elements and code relationships (affordances).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

설치 방법 보기

포함된 파일(1)

  • SKILL.md1.5 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

Breadboarding Workflow

Role Constraints: Lead (Write/Bash access allowed). File Access: Do NOT use literal placeholders for file paths. Use the glob tool to search for the active feature directory under .jonggrang/.output/features/.

Methodology

Transform a workflow description or shaped pitch into affordance tables showing UI and Code affordances with their wiring.

1. Locate Context

Use the glob tool to find the active feature directory inside .jonggrang/.output/features/. Use the read tool to read the pitch.md or requirements document located there.

2. Identify Affordances

Break down the shaped solution into three components:

  1. Places: Where the user is (e.g., "Dashboard", "Settings Page").
  2. Affordances: What the user can act on (buttons, fields, readable data).
  3. Connection Lines: Where an action takes the user next.

3. Draft the Breadboard

Create a text-based breadboard representation. Use a simple format mapping Places to their Affordances and Connections. Example: Place: Invoice View

  • Read: Invoice details, status
  • Action: Click "Pay Now" -> takes to Place: Payment Gateway

4. Save the Artifact

Use the write tool to save the breadboarding artifact as breadboard.md inside the active feature directory.

Completion Signal

When the breadboarding is saved and the workflow is mapped, output exactly:

BREADBOARDING_COMPLETE

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

anoa

무료

Drive a real browser from the command line — open pages, snapshot the interactive elements as refs, click and fill by ref, read text, run JS, screenshot. Use when a task needs a live browser: checking a page renders, walking a login or checkout flow, scraping something that only exists after JavaScript runs, or reproducing a UI bug.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

porcupine-md/jonggrang162026년 9월 15일 업데이트

Run linters/typecheckers to calculate health score.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

porcupine-md/jonggrang162026년 9월 15일 업데이트

Comprehensive UI/UX compliance check (A11y, performance, responsive).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

porcupine-md/jonggrang162026년 9월 15일 업데이트

Infrastructure-first security audit (OWASP, secrets, dependencies).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

porcupine-md/jonggrang162026년 9월 15일 업데이트

auth

무료

Setup authentication flow (register, login, session/JWT, middleware)

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

porcupine-md/jonggrang162026년 9월 15일 업데이트

Deep knowledge about deploying applications to AWS (EC2, ECS, S3, CloudFront, Cloud Run).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

porcupine-md/jonggrang162026년 9월 15일 업데이트

porcupine-md의 스킬 모두 보기

이 스킬의 문제 신고