跳到正文
cccskills
免费在 GitHub 公开

workshop-project-design

Produce or refine a project-level mockup illustrating a section of the PRD

中文简介正在准备中。当前显示原文说明。

查看安装方法

包含的文件(1)

  • SKILL.md3.0 KB

SKILL.md(原文)

安装前可以查看交给 AI 代理的指令内容。

Your task: Workshop design (project surface)

Produce or refine a project-level mockup. Project mockups live at .workhorse/projects/{hash}-{slug}/mockups/{slug}.html on the project branch — they sit alongside the PRD until a card carries them forward at card-creation time.

Pick the section first

Project PRDs often contain more than one logical section (component-led or mixed shapes). If the PRD has more than one section that could plausibly be the target, ask which section the mockup is for before generating. If there's only one section, or the user has already named it, skip the question and proceed.

Source the visual language before authoring

Follow the Design sourcing process from your system prompt — do not skip steps:

  1. Read the actual implementation of the section being mocked in the target repo. The shipped code is the baseline — components, layout, spacing, copy
  2. Read implementations of similar components elsewhere in the target repo for any new elements not yet present
  3. Cross-check against .workhorse/design/ — design system, component docs, philosophy notes. The design library wins on clash
  4. Do not reference mockups from other cards or other projects as inspiration — they are point-in-time artefacts

Author and preserve

  • Standalone HTML with inline CSS, like card-level mockups
  • Author fresh markup only for the feature or area being explored. For every other region of the screen, be visually faithful to the current implementation — same layout, components, copy, spacing, styling
  • Do not let stale styling from earlier mockups leak into unchanged regions
  • Include an HTML comment header at the top linking to the PRD section being illustrated, e.g. <!-- prd: components/registration -->

How to run

  1. Identify the section (asking only when the PRD genuinely has multiple plausible targets)
  2. Source the visual language as above
  3. Write the file at .workhorse/projects/{hash}-{slug}/mockups/{slug}.html
  4. Briefly summarise what you produced

Restrictions on this surface

You are working on the project surface, not a card workspace. Edits in this conversation may only touch the project's artefacts, all on the project branch:

  • .workhorse/projects/{hash}-{slug}/prd.md
  • .workhorse/projects/{hash}-{slug}/mockups/
  • .workhorse/projects/{hash}-{slug}/breakdown.md

Do not edit specs, per-card plans, test cases, card working docs, or any code. If the user asks for any of those, explain that the work belongs at card level — the user can either spawn a card via the breakdown and continue there, or open an existing card and work on it.

You may read anything from the workspace's main branch for context.

评价

还没有评价。欢迎分享你的使用感受。

评论

无需登录即可发表。欢迎分享使用感受、提问,或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

提交后会立即公开。请勿填写邮箱、电话等个人信息。URL 最多 2 个。

0 / 1000 字

此表单受 reCAPTCHA 保护,适用 Google 的隐私权政策和服务条款。

同一仓库的技能

Check whether this card's code meets the acceptance criteria

中文简介正在准备中。当前显示原文说明。

beyondessential/tamanu92026年10月19日 更新

Summarise the unit and e2e tests a branch/PR adds, run only those, and produce a paste-ready report (e.g. for a Linear card). Use when asked to 'summarise added tests', 'run the new tests', 'what tests did this PR add', or to prove a card's test coverage.

中文简介正在准备中。当前显示原文说明。

beyondessential/tamanu92026年10月19日 更新

Run a quick UX/UI workshop using ASCII-art sketches

中文简介正在准备中。当前显示原文说明。

beyondessential/tamanu92026年10月19日 更新

Write automated tests for unticked scenarios in this card's test cases

中文简介正在准备中。当前显示原文说明。

beyondessential/tamanu92026年10月19日 更新

Review code changes on this card for likely bugs, regressions, and missed edges

中文简介正在准备中。当前显示原文说明。

beyondessential/tamanu92026年10月19日 更新

Maintain a support docs pack — dedup, length budgets, and no splintering — and land changes as a reviewed pull request. Use when a support thread, or a hand-off from Support assist, surfaces a new resolution, a correction to an existing one, or a deployment quirk worth recording. Not for ordinary code changes.

中文简介正在准备中。当前显示原文说明。

beyondessential/tamanu92026年10月19日 更新

查看 beyondessential 的全部技能

报告此技能的问题