feat(claude-design): add frontier-design preset (labelled experimental)
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
parent
6b10b96077
commit
4b5e8551b0
1 changed files with 149 additions and 0 deletions
|
|
@ -0,0 +1,149 @@
|
|||
# Preset: frontier-design
|
||||
|
||||
**Last updated:** 2026-05-17 | **Verified:** research/03-prompt-patterns-intent-presets.md
|
||||
|
||||
Evidence grade: Experimental — no validated practitioner pattern as of 2026-05-16. Frontier design is currently marketing language for "elaborate variants of the other presets," not a distinguishable generation mode practitioners can reliably invoke today.
|
||||
|
||||
This file documents what Anthropic publishes about the `frontier-design` preset, what practitioners have shipped (nothing verified), what adjacent material exists, and the single experimental pattern the plugin offers — clearly labelled as unverified speculation. The honest position the plugin takes is in Section (e).
|
||||
|
||||
---
|
||||
|
||||
## (a) What Anthropic says
|
||||
|
||||
Anthropic's launch post `https://anthropic.com/news/claude-design-anthropic-labs` describes `frontier-design` in a single sentence (verbatim):
|
||||
|
||||
> code-powered prototypes with voice, video, shaders, 3D and built-in AI
|
||||
|
||||
This is the entirety of Anthropic's per-preset documentation as of the 2026-05-16 captured-on date. There is no dedicated tutorial, no support article, no canonical prompt set, no Anthropic-published example artifact.
|
||||
|
||||
The launch sentence implies the preset targets:
|
||||
|
||||
- Code-powered prototypes (not static designs) — implying interactive elements at minimum
|
||||
- Voice (audio playback, speech recognition, voice UI)
|
||||
- Video (embedded video playback, possibly video-driven UI)
|
||||
- Shaders (WebGL, custom GLSL shaders, GPU-driven visual effects)
|
||||
- 3D (WebGL 3D scenes, possibly Three.js or similar)
|
||||
- Built-in AI (LLM-driven interactions inside the artifact)
|
||||
|
||||
Anthropic's framing suggests `frontier-design` is the preset for showpiece artifacts demonstrating Claude Design's outer-edge capabilities — not a workhorse preset like `designs`, `prototypes`, or `slides`.
|
||||
|
||||
---
|
||||
|
||||
## (b) What practitioners have shipped
|
||||
|
||||
Verifiable practitioner outputs as of 2026-05-16: **NONE that we could verify.**
|
||||
|
||||
The most explicit acknowledgment of this gap comes from `https://llmx.tech/blog/claude-design-hands-on-review-2026` (cited in `research/03`):
|
||||
|
||||
> ...no frontier design assessment provided. The hands-on review covers designs, prototypes, slides, and one-pagers. Frontier design is named in the preset list but received zero hands-on evaluation, because no practitioner artifact has been published demonstrating what the preset produces in practice.
|
||||
|
||||
Across the community sources surveyed in `research/03` (Substack walkthroughs, awesome-claude-design lists, Twitter / X threads, MindStudio walkthroughs, sagnikbhattacharya, victordibia, theadpharm, claudefa.st, etc.), no practitioner has published a verifiable frontier-design artifact with prompt, output, and reproduction steps. The preset is named, occasionally referenced, but not demonstrated.
|
||||
|
||||
This may change. The preset is new (April 2026 launch); practitioner adoption lags. The `.coverage.md` re-research trigger explicitly flags "first verified frontier-design practitioner artifact ships publicly" as a refresh trigger for this file.
|
||||
|
||||
---
|
||||
|
||||
## (c) Adjacent material
|
||||
|
||||
While no `frontier-design`-specific Anthropic or practitioner material exists, two adjacent sources cover the underlying capabilities Anthropic names.
|
||||
|
||||
### Motion and spatial composition — `frontend-design/SKILL.md`
|
||||
|
||||
`https://github.com/anthropics/skills/skills/frontend-design/SKILL.md` publishes Anthropic's guidance on motion (easing curves, timing tiers, what to animate and what not to) and spatial composition (typography hierarchy, surface depth, layered backgrounds). These are the building blocks the `frontier-design` preset would extend with voice / video / shaders / 3D, but the building blocks themselves are general-purpose.
|
||||
|
||||
### Animated and 3D websites — MindStudio walkthrough
|
||||
|
||||
MindStudio's 2026-04-28 walkthrough (cited in `research/03`) covers prompting Claude for animated and 3D websites — but the walkthrough is set in adjacent Anthropic surfaces (Claude.com chat with an HTML artifact), not in `claude.ai/design` with the `frontier-design` preset specifically. The walkthrough is useful for the prompt-engineering pattern (naming GLSL fragment shader constraints, polygon-count budgets, voice-prompt structuring) but is not a frontier-design-preset artifact.
|
||||
|
||||
---
|
||||
|
||||
## (d) Single experimental pattern (unverified speculation)
|
||||
|
||||
One experimental pattern, clearly labelled as unverified, that an operator could try if they want to engage with the preset despite the gap.
|
||||
|
||||
The pattern comes from Google's Gemini deep-research output (cited in `research/03`) and carries low confidence. It is a constraint-language pattern for shader and physics elements, adapted from broader frontend-design practice:
|
||||
|
||||
```
|
||||
[layers 1 through 5 of the standard prompt stack from
|
||||
../01-prompt-fundamentals.md]
|
||||
|
||||
Frontier capabilities to engage:
|
||||
|
||||
Shaders:
|
||||
- One custom GLSL fragment shader applied to the hero region
|
||||
- Shader pattern: [name the visual character — e.g.,
|
||||
"subtle gradient flow with imperceptible noise" or
|
||||
"iridescent surface reacting to cursor position"]
|
||||
- Frame budget: 60fps target on Apple M1 / equivalent
|
||||
- No fullscreen shader-bombs (battery / heat / accessibility)
|
||||
|
||||
3D:
|
||||
- One 3D element in the hero region, scene-bounded (no fullscreen)
|
||||
- Polygon count budget: <50,000 triangles
|
||||
- Lighting: 2-3 light sources max
|
||||
- Camera: fixed or single-axis orbit; no free-camera
|
||||
|
||||
Voice:
|
||||
- [if voice UI relevant] one voice-driven interaction, with
|
||||
visible text-transcript fallback
|
||||
- Speech-recognition language and accent assumptions named
|
||||
explicitly
|
||||
|
||||
Video:
|
||||
- [if video element relevant] embedded video with explicit
|
||||
autoplay/no-autoplay decision; explicit captions decision
|
||||
|
||||
Built-in AI:
|
||||
- [if applicable] one LLM-driven interaction in the artifact
|
||||
- Explicit fallback for when the LLM call fails
|
||||
|
||||
Test in target browsers (Chrome, Safari, Firefox) at the target device
|
||||
class (M1 / M2 desktop, mid-range mobile). Expect aesthetic drift
|
||||
across runs; non-monotonic improvement applies amplified for frontier
|
||||
capabilities.
|
||||
```
|
||||
|
||||
Confidence rating on this pattern: **low**. It is a reasoned extrapolation from frontend-design principles, not a tested frontier-design prompt. If you try it, document what works and what does not — there is a community gap to fill.
|
||||
|
||||
---
|
||||
|
||||
## (e) The plugin's honest position
|
||||
|
||||
The plugin's stance on `frontier-design`:
|
||||
|
||||
If you want to attempt frontier design, treat it as a high-fidelity prototype (`prototypes` preset) with extra constraint language for shaders, polygons, voice, video, and built-in AI. Expect aesthetic drift on first generations. Verify that your output works in target browsers before committing chat-turn budget to refinement. Expect that the model's prior on what "frontier design" means may differ from yours — over-specify everything that matters.
|
||||
|
||||
Do not assume `frontier-design` produces a categorically different artifact from `prototypes` + extra capability constraints. The launch sentence is suggestive; the practitioner evidence is absent. The preset is marketing language for elaborate prototype variants until proven otherwise.
|
||||
|
||||
When the operator names `frontier-design` specifically:
|
||||
|
||||
1. Read this file with them
|
||||
2. Confirm they have understood the practitioner-evidence gap
|
||||
3. Offer the experimental pattern in Section (d) as a starting point, clearly labelled as unverified
|
||||
4. Treat the resulting artifact as exploratory — surface what worked and what did not, contribute back to the community gap
|
||||
5. Plan for amplified non-monotonic-improvement (`../03-iteration-and-session.md`) — frontier capabilities compound the standard non-monotonic risk
|
||||
|
||||
---
|
||||
|
||||
## (f) Re-research trigger
|
||||
|
||||
This file refreshes when any of the following happens:
|
||||
|
||||
- Anthropic publishes a dedicated tutorial, support article, or canonical prompt set for `frontier-design`
|
||||
- A verified practitioner artifact appears publicly with prompt + output + reproduction steps
|
||||
- The launch-post one-sentence description changes materially
|
||||
- A community pattern reaches enough adoption to be cited (not speculation) — the `awesome-claude-design` lists and adjacent practitioner blogs are the primary surfaces to watch
|
||||
|
||||
When any of these triggers, update Section (b) to reflect verified material, replace Section (d) with the verified pattern, and re-grade the evidence label from "Experimental" to "Community-only" or "Anthropic-documented + community-validated" as appropriate.
|
||||
|
||||
---
|
||||
|
||||
## Sources
|
||||
|
||||
- `https://anthropic.com/news/claude-design-anthropic-labs` — Anthropic's verbatim one-sentence description (the entirety of Anthropic-published material on this preset)
|
||||
- `https://llmx.tech/blog/claude-design-hands-on-review-2026` — community practitioner explicitly noting the frontier-design evaluation gap
|
||||
- `https://github.com/anthropics/skills/skills/frontend-design/SKILL.md` — adjacent material on motion and spatial composition
|
||||
- `https://anthropic.com/engineering/harness-design-long-running-apps` — non-monotonic-improvement framing (amplified here)
|
||||
- `https://claude.com/blog/improving-frontend-design-through-skills` — AI-slop avoid-list (composed for frontier prompts)
|
||||
|
||||
Re-research trigger: see Section (f). The preset is the most volatile in this plugin's coverage; expect this file to refresh first when Anthropic ships material or practitioners publish artifacts.
|
||||
Loading…
Add table
Add a link
Reference in a new issue