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

visual-reference-generation

Produces design reference imagery before implementation — screen concepts, layout directions, and flows for web or mobile that make a verbal brief concrete enough to argue with. Use this when a brief needs visualizing before anyone builds, when comparing layout directions, when handing a developer a target, or when stakeholders are describing different things with the same words.

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

설치 방법 보기

포함된 파일(2)

  • SKILL.md2.8 KB
  • references/sources.md867 B

SKILL.md(원문)

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

Visual reference generation

Arguing about an image costs an hour. Arguing about a build costs a sprint. Generate the picture first.

Before generating

Settle these, or the output is decoration:

  • Surface and platform — web page, native mobile screen, dashboard. These are not the same problem at different aspect ratios: touch targets, native chrome, and scroll behavior change what a good layout is.
  • What it optimizes for — one conversion, one task completion, one first impression. Stated, so the image can be judged against something.
  • Content reality — real headline lengths, real data volumes, real edge cases. A concept built on three-word labels collapses on contact with actual copy.

Generating

  • One concept per image. Tiling several ideas onto one canvas makes them impossible to compare or iterate separately.
  • Generate genuinely different directions, not variations of one. Three near-identical options is one option presented three times.
  • Include the states that will exist: a populated view and an empty one, at minimum.

Web versus mobile

Web — the fold is a real constraint but not a hard one; horizontal space allows genuine layout choices; hover exists. Design for a range of widths, and decide what the narrow case does.

Mobile — thumb reach dictates where primary actions sit; native navigation patterns are expectations, not suggestions; there is no hover, so affordance must be visible. Design the scroll, not the screenshot.

After generating

Say explicitly what in the reference is direction and what is placeholder. A developer handed a concept will otherwise implement the lorem ipsum faithfully.

Sources

references/sources.md in this skill lists the outside authorities that settle the questions here — what each one is authoritative for, and what you may do with it. Check them before answering on anything they cover, and cite what you used. Most are free to read and not free to reproduce; the use note on each is binding.

Never

  • Generate before the content, states, and constraints are settled. A reference built on placeholder copy hides every real problem.
  • Present a generated image as a working design. Say what it is.
  • Generate with filler text where real string lengths decide the layout.
  • Hand off an image as the spec. Hand off the tokens, spacing, and states behind it.

리뷰

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

댓글

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

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

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

0 / 1,000자

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

같은 저장소의 스킬

Designs and audits who can reach what — authentication, authorization models, privileged access, service credentials, and joiner-mover-leaver process. Use this to design a permissions model, run an access review, reduce standing privilege, handle offboarding, set up SSO or MFA, manage service and machine credentials, or diagnose why permissions have sprawled.

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

cbrock84/headcount2.1천2026년 10월 19일 업데이트

Concentrates marketing and sales effort on a named set of accounts rather than on volume — qualifying whether the model fits your economics at all, building the account list and the buying group inside each, tiering effort against account value, coordinating so the account experiences one campaign rather than several, and measuring account progression instead of leads. Use this to decide whether to run an account-based program, build one, or work out why an existing one produces activity and no pipeline.

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

cbrock84/headcount2.1천2026년 10월 19일 업데이트

Gets new users from signup to first real value — signup flow, onboarding, time-to-value, and the early experience that determines whether someone becomes a user or a lapsed account. Use this to design or fix signup and onboarding, diagnose why signups do not convert to active use, reduce time-to-value, or decide what a new user must accomplish first.

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

cbrock84/headcount2.1천2026년 10월 19일 업데이트

Designs orchestrator-and-subagent hierarchies for a repository — splitting agents by exclusive write surface, pairing every producer with an independent auditor, and enforcing the split with a script that runs in CI. Use this whenever the user wants to set up, expand, audit, or fix a multi-agent or subagent structure for a codebase; asks how to divide work between agents; wants agent charters, roles, or a surface map written; or is hitting agents that collide on the same files, review their own work, or drift from their remit. Also use when sizing a roster or deciding whether a new agent is justified.

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

cbrock84/headcount2.1천2026년 10월 19일 업데이트

Governs models and AI systems in production — intended use, evaluation, monitoring, human oversight, documentation, and the decision to deploy or retire. Use this before deploying a model or AI feature, when defining evaluation criteria, when a model's behavior has drifted, when assessing AI risk or regulatory exposure, or when deciding whether an AI system is fit for a consequential decision.

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

cbrock84/headcount2.1천2026년 10월 19일 업데이트

Produces executive-level research — market sizing, competitor mapping, trend analysis, and strategic intelligence — grounded in cited sources with the confidence in each claim made explicit. Use this to analyze a market or industry, map competitors, evaluate a market-entry or build-versus-buy decision, produce a research brief, or assemble evidence for a decision. Also use when comparing options that need a structured, evidence-based verdict rather than an opinion.

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

cbrock84/headcount2.1천2026년 10월 19일 업데이트

cbrock84의 스킬 모두 보기

이 스킬의 문제 신고