Components / Design exploration skill
Variate
Compare four coded directions for one component.
Understand the resource
What it is.
Variate’s repository describes a compact skill for generating four design variations through coding agents. The value is a structured comparison of alternatives before choosing a direction, rather than accumulating competing styles.
When it is useful
The team cannot agree on the hierarchy or composition of a component.
A proposed application
Put it to work.
This example illustrates a possible use. The proposed workflow and expected result are separate from the bounded checks recorded below.
Try this
Generate four synthetic dashboard-header proposals within the same tokens, then compare legibility and task priority.
Result to aim for
A selected direction with a reason for the choice.
Before you start
What you need.
- A supported coding agent, a controlled project and a narrow design brief.
The practical boundaries
What to watch for.
- The skill can cause an agent to edit project files; review its instructions and scope before running it.
- No skill was installed or executed in this catalog review, and variation quality was not scored.
Review record
What we could establish.
- Public primary documentation and the bounded account-free checks below were reviewed. Seven pinned CLI fixture checks passed: baseline preservation, switching, manual-edit adoption, unknown-position refusal, warning output and status. No model generated designs and no sidecar or hooks ran.
The source-review notes describe documentation and identity. The account-free evaluation below records exactly which public interaction or local fixture was checked, what happened, and what remains untested.
Check current access, terms, licensing and data handling before using a resource with your own material.
Runtime and security evaluation
What the evaluation covers.
Seven pinned CLI fixture checks passed: baseline preservation, switching, manual-edit adoption, unknown-position refusal, warning output and status. No model generated designs and no sidecar or hooks ran.
Methods: Public HTTP response · Public browser sample · Local package fixture · Source review. A completed check covers the stated sample; it is not a safety certification.
- Target
- Nutlope/variate
- Version or capture
- 3a82377d2e13160d879de18b40b323287f1636d9
- Integrity scope
- cb108762649907a649eb56852dc1797311b0d402074fffaa8b081e7330180e5a
Test conditions
- Chromium 155.0.8059.82 on Windows; fresh temporary profile and fresh account-free contexts.
- Public HTTPS GET/HEAD requests only; telemetry/auth routes and WebSockets blocked. No account storage or credential environment variables.
- Synthetic local inputs only. Package/skill source inspected before execution; no install lifecycle scripts run.
- Local package/CSS browser fixtures block real network. Variate additionally uses Node filesystem permissions and a no-network preload.
Individual checks and observations
Public document and DOM
passPublic browser sample: Fresh Chromium GET, then inspect rendered controls after hydration delay
Observed: HTTP 200; 25 captured button labels; 1 inputs; 0 canvases.
Preserved baseline
passLocal package fixture: Register synthetic existing file with four positions
Observed: Variant1 bytes equal the original synthetic file.
Variant switch
passLocal package fixture: Select authored variant2 and read target bytes
Observed: Target file matches variant2.
Manual edit preservation
passLocal package fixture: Change target fixture, then switch to baseline
Observed: Unmatched manual edit retained as variant5 before baseline restored.
Unknown variant refusal
passLocal package fixture: Request absent position99
Observed: Exit3; target unchanged.
Export contract warning
passLocal package fixture: Check a variant missing the baseline Button export
Observed: Missing export is reported; checker exit remains0 even with warnings.
Parser boundary
passLocal package fixture: Check syntactically invalid variant without a project parser
Observed: CLI explicitly reports NOT parsed and returns0; this is not a successful build.
Derived status
passLocal package fixture: Read JSON status after restore
Observed: {"positions": 5, "live": 1, "port": null}
Security findings and boundaries
Passive inspection of the public response headers, requested hosts and the named browser sample. Also inspected pinned source and the specified synthetic fixture outputs. No active exploitation, authenticated permissions test or complete security audit.
Observed · caution
Checker success is not build success
The CLI returned exit code 0 while reporting a missing export. Without a project parser it explicitly reported NOT parsed, including for the invalid-syntax fixture. Read warnings and run the project build.
Documented · caution
The full workflow can rewrite project files and run a local server
The inspected skill describes variant replacement, a sidecar and host hooks. The fixture exercised file operations only; it did not evaluate sidecar authorization, host hooks or generated design quality.
Practical caveats
- Use a disposable branch and explicit project root. Keep ordinary backups, run the actual compiler and review each generated variant before choosing it.
- Pin and recheck the selected version or sample before adoption; the observations apply only to the scope and date shown.
What remains untested
- No model-quality comparison, live sidecar, token/origin enforcement, hooks, framework injection, path-link/junction behavior or cleanup command test.
- Fresh-browser restrictions can affect external assets and hydration. Initial failed selectors and limited probes remain in the evidence; they are not blanket product failures.
Security limits
- No authenticated workspace, private content, production backend permissions or data-retention verification.
- No model-quality comparison, live sidecar, token/origin enforcement, hooks, framework injection, path-link/junction behavior or cleanup command test.
Evaluation sources
Follow the evidence
Sources and further reading.
Keep exploring