Visual Design

从内容、注意力和行动设计真实视觉系统，而不是套用固定风格。

源文件边界

本页为人类读者重排 skills/visual-design/SKILL.md 中的关键判断，不替代可安装的完整 prompt；事实、修改权和未展示的运行说明仍属于源文件。

安装与日常使用

npx skills add lidessen/rossovia --skill visual-design

Treat operation names as internal routing controls, not vocabulary the user must learn. Accept an ordinary request such as “redesign this page” or “review why these docs feel inconsistent” and infer the smallest path.
When the user asks for a change, inspect and modify the real artifact, then verify the affected experience. When the user asks only for critique or review, return evidence and a smallest revision without editing unless they also authorize a change.
Inherit an existing project direction or design system without requiring a setup exercise. Use cultivate only when a continuing project lacks one and forming it is part of the requested outcome.
Once the designated human or owning project source has selected a direction, do not ask them to choose it again for each page, component, or polish pass. Compile and apply the inherited direction. Ask another aesthetic question only when the available choices would materially revise the shared direction and project evidence cannot distinguish them.
Ask only for a decision that materially blocks safe progress. Present the relevant options, tradeoff, and recommendation rather than asking the user to discover the choice space.
Use the production, browser, rendering, accessibility, and image capabilities supplied by the host agent. State a missing capability instead of replacing real inspection or implementation with prose.

它负责的判断

Own one recurring judgment: how should an agent organize content and action into coherent visual form for a real audience, while inheriting or cultivating the project direction needed to keep related artifacts recognizable?

Visual design is not surface styling. It makes content relations and intended actions perceptible through hierarchy, layout, type, color, imagery, motion, and interaction. Cultivate judgment rather than imposing a house style: no treatment becomes a portable default merely because one project accepted it.

Use a project-declared visual direction or design system when one exists. This skill may interpret and extend it for the present case; it does not replace it.

原则脉络

Primary: P16 Supporting: P07, P05, P09

如何工作

Whichever operation is selected:

Begin with owning content, the actual audience action, inherited direction, and material constraints; distinguish observed facts from inferred taste.
Allocate attention before choosing layout or treatment. Balance means unequal emphasis proportional to the user’s current decision, not equal visual weight.
When the direction remains unresolved, treat a named style as a cue to expand, compare, and situate. When an accepted direction exists, inherit it without reopening style formation merely because treatment is incomplete.
When forming or reopening a direction, use visual seeds to expose choices and process sources to understand how a relation was formed or tested. State the decision each source changes and what must not be copied. Prefer host sources; built-in references are fallback context. Do not retrieve them for implementation inside an accepted direction.
Compile an accepted direction into the smallest project visual contract needed by the current artifact. Map its expression responsibilities and negative boundary to actual roles, owners, and consumers before editing. This is a conformance judgment, not another direction workshop.
Translate that contract into the relevant details of recurring components and states. Let those details support content, attention, and identity; do not let a checklist of radii, shadows, spacing, or icons become the design. Compare rendered candidates only when the contract and evidence leave a material treatment choice unresolved; do not make candidate selection a routine user interaction or turn serial value tuning into a design method.
Derive tokens from repeated semantic roles. Admit one only when it has at least two independent consumers or a declared theme/context substitution; otherwise keep the value local. Raw values, trends, and component kits cannot establish content priority.
Inspect the real artifact across representative content, states, themes, and viewports. Mechanical checks admit work to human aesthetic review but cannot accept it.

交给 Agent 使用

启动信息

Establish only enough state to select the operation:

Object and artifact state:
Audience and intended action:
Existing direction or design system:
Named style cue or supplied references, if any:
Requested outcome: establish | direction-only | design | refine | review
Available production and inspection capabilities:

If the request and artifact state already identify the operation, proceed without asking the user to choose an internal stage. A small local adjustment inside a clear system remains ordinary development work.

调度入口

Select exactly one operation before loading a command; operations are not phases to combine. Once refine fits, treat the accepted direction and main structure as inputs and load only commands/refine.md plus references/component-expression.md. A discovered structural defect ends that path and is reported for rerouting rather than loading a sibling command.

Common:

design — read commands/design.md for a real create, redesign, or visual-system task.
refine — read commands/refine.md when the direction and main structure are sound but recurring components and interface details do not yet embody it.
review — read commands/review.md for an existing rendered artifact.

Less frequent:

cultivate — read commands/cultivate.md to establish a continuing project’s provisional direction.
shape — read commands/shape.md when a direction or Aesthetic Case is required without implementation, including when a named style cue must be expanded into guidance for later agents.

With no argument, infer the smallest matching operation. Default to design for a requested change and review for critique.

边界与完成

职责与边界

Do not infer brand authority, product claims, or factual content from visual work. Route naming and articulation to its owning method.
Do not prescribe a universal palette, font stack, grid, component language, motion system, or named visual trend.
Do not copy an external design system’s surface or treat the built-in seed and source indexes as a canon.
Do not claim image generation, browser operation, rendering, or accessibility verification unless the runtime supplies it.
Do not turn taste into deterministic lint; the designated human owns aesthetic acceptance.
Do not make cultivate → shape → design → review mandatory. Enter at the unresolved judgment and stop when its acceptance condition is met.

术语

Direction: a generative stance with contrasts and a negative boundary, not a palette preset.
Style cue: a person’s provisional phrase for a desired perceptual family, such as “hand-drawn” or “editorial”; it opens inquiry and is not yet a direction, preset, or specification.
Visual language: a provisional project-local relation between direction and formal tendencies—gesture, shape, rhythm, material, type, imagery, and motion—plus how strongly they appear across different surfaces.
Project visual contract: an accepted direction compiled into project-local expression responsibilities, invariants, negative boundaries, and established formal decisions that downstream agents can test without reopening taste. It belongs in the project’s existing design source, not a portable preset or a mandatory new schema.
Conformance map: a temporary trace from an in-scope visual role and its contract relation to current evidence, implementation owner, affected consumers, required change, and verification.
Attention path: the intended order and relative force of orientation, primary action, supporting judgment, context, and recovery signals.
System: the smallest shared invariants that keep related surfaces recognizable while their functions differ.
Token: a named repeated semantic decision with at least two independent consumers or a declared theme/context substitution.
Treatment: the local color, type, spacing, imagery, depth, motion, and component choices that embody the direction.
Detail grammar: the project-local relations among component anatomy, edges, spacing, depth, marks, states, and motion that let ordinary elements support the direction without becoming its primary source.

完成标准

cultivate: source field, comparative readings, human preference evidence, provisional direction, negative boundary, and disconfirming cases are clear.
shape: content, attention path, relation, contrasts, direction, unknowns, negative boundary, and review question can guide production.
design: a coherent real slice preserves the intended content hierarchy and attention path, carries the direction through its relevant component details, uses justified semantic roles, passes relevant checks, and is ready for human review.
refine: the leading detail mismatch is corrected across representative components and states without disguising a structural defect or making supporting details compete with the content.
review: observations, contract-conformance mismatch, owning layer, smallest revision or no-change case, and human acceptance question are explicit.

阅读完整技能

本页有意省略 prompt 的内部装配说明。需要安装、审查或修改这个技能时，请回到完整源文件。