THE WORKBENCH / OUTPUT FILING CABINET
Every page, pinned to the board.
Finished HTML outputs, filed exactly as they came off the bench. The point of the place is the specimen itself — click one and see how it actually looks in a browser. The file card tells you what went into it.
Specimens 30
Models 8
Skills 6
OPERATOR PICKS
Favorites from the filing cabinet
Hand-marked in Studio. The operator may be biased.
PAUSE MOTION
JUMP TO:
Specimens (30)
Models (8)
Skills (6)
Filing Process
What this is: a public filing cabinet for generated pages — every card opens the real file in your browser, with the prompt, model, and skill one INFO click away. What it is not: a leaderboard, a live demo host, or an endorsement of any model.
The specimens (30)
Click a card to open the real thing. INFO slides out the file: prompt, model, skill, provenance.
Timberline
Open it in your browser ↗
INFO about Timberline
VESPER
Open it in your browser ↗
INFO about VESPER
Squish
Open it in your browser ↗
INFO about Squish
AERA
Open it in your browser ↗
INFO about AERA
Morrow Editions
Open it in your browser ↗
INFO about Morrow Editions
Kinetic Foundry
Open it in your browser ↗
INFO about Kinetic Foundry
Northline Coffee
Open it in your browser ↗
INFO about Northline Coffee
Great Lakes Industrial Archive
Open it in your browser ↗
INFO about Great Lakes Industrial Archive
SIGNAL/26
Open it in your browser ↗
INFO about SIGNAL/26
FIELDNOTE / DAILY 01
Open it in your browser ↗
INFO about FIELDNOTE / DAILY 01
Kinetic Foundry
Open it in your browser ↗
INFO about Kinetic Foundry
Northline Coffee
Open it in your browser ↗
INFO about Northline Coffee
Great Lakes Industrial Archive
Open it in your browser ↗
INFO about Great Lakes Industrial Archive
SIGNAL/26
Open it in your browser ↗
INFO about SIGNAL/26
FIELDNOTE / DAILY 01
Open it in your browser ↗
INFO about FIELDNOTE / DAILY 01
Kinetic Foundry
Open it in your browser ↗
INFO about Kinetic Foundry
Northline Coffee
Open it in your browser ↗
INFO about Northline Coffee
Great Lakes Industrial Archive
Open it in your browser ↗
INFO about Great Lakes Industrial Archive
SIGNAL/26
Open it in your browser ↗
INFO about SIGNAL/26
FIELDNOTE / DAILY 01
Open it in your browser ↗
INFO about FIELDNOTE / DAILY 01
Kinetic Foundry
Open it in your browser ↗
INFO about Kinetic Foundry
Great Lakes Industrial Archive
Open it in your browser ↗
INFO about Great Lakes Industrial Archive
SIGNAL/26
Open it in your browser ↗
INFO about SIGNAL/26
FIELDNOTE / DAILY 01
Open it in your browser ↗
INFO about FIELDNOTE / DAILY 01
COMMON GROUND
Open it in your browser ↗
INFO about COMMON GROUND
COMMON GROUND
Open it in your browser ↗
INFO about COMMON GROUND
Threadline
Open it in your browser ↗
INFO about Threadline
Threadline
Open it in your browser ↗
INFO about Threadline
Kinetic Foundry
Open it in your browser ↗
INFO about Kinetic Foundry
Northline Coffee
Open it in your browser ↗
INFO about Northline Coffee
SPECIMEN FILE 01
CLOSE ✕ specimen file
SPECIMEN 01 / a19ad65f
Timberline
[ MODEL: Not recorded ]
[ SKILL: small-batch-bold ]
[ CAPTURED: 2026-09-26 ]
[ ASSETS: 13 ]
Operator notes Imported from C:\Users\JP\Desktop\timberline\index.html through the Studio API. Skill label follows the outputs/small-batch-bold folder. The folder also contains a Gemini 3.8 Flash-named output, but the current index.html differs; its exact model provenance and original prompt are not recorded. Import date used as capture date.
Tags [ landing-page ] [ dog-food ] [ outdoors ]
Evidence provenance
Artifact ID a19ad65f
Model Not recorded
Skill / system small-batch-bold
Captured 2026-09-26
Filed assets 13 images baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 02
CLOSE ✕ specimen file
SPECIMEN 02 / c9a73e87
VESPER
[ MODEL: Muse Spark 1.3 ]
[ SKILL: Dark-Editorial ]
[ CAPTURED: 2026-09-12 ]
Prompt, verbatim Build the store in Dark Editorial. This is a complexity stress-test of the design system: a complete fictional streetwear e-commerce store for a label called VESPER, Collection 004 "After Hours" — and it must stay coherent in one style across every template.
Style: Dark Editorial family, Moody Gallery branch (~/workspace/skills/webstyle-dark-editorial/SKILL.md). Ink-dominant canvas #0B0B0B, Bone #F5F2EA negative space, Forest #1E3A2B as the single jewel accent (Oxblood #5E1A24 reserved only for the drop-countdown alarm moments), Slate #3A4048 for quiet meta text. Oversized high-contrast display serif headlines (Fraunces / Playfair Display spirit) at masthead scale, italic serif subheads, Inter for all meta/labels/utility text. Hairline rules and index numbers as structure — no shadows, no cards, no rounded UI chrome. Commerce expressed in editorial register: the product grid is a gallery of plates, product detail is an editorial feature, the cart is an "Acquisition List", checkout is a numbered sequence, confirmation reads like a colophon. Subtle paper grain, duotone/halftone image treatment, cinematic and restrained.
Integrate these four generated images as local files:
Lookbook hero: /home/hatch/workspace/vesper-assets/media-generation-vesper-hero-0-ace1a594-4c5a-4529-9110-9c0bccec67b9.webp (full-bleed cinematic plate)
Hoodie product: /home/hatch/workspace/vesper-assets/media-generation-vesper-hoodie-0-affb7029-de03-42f0-8f6a-01890e0a4544.webp
Cargo product: /home/hatch/workspace/vesper-assets/media-generation-vesper-cargo-0-7638515d-6648-43b0-b278-a8673e3cd41d.webp — actual filename is media-generation-vesper-cargo-0-7638515d-6648-43b0-b278-a8673e3cd41d.webp
Sneaker product: /home/hatch/workspace/vesper-assets/media-generation-vesper-sneaker-0-70c31f9a-bfa6-4455-9f55-b8c34870fcdd.webp
The collection is six pieces: the three photographed garments above, plus three accessories (beanie, tote, cap) presented as deliberate type-led gallery plates in the same duotone register — oversized serif garment names as the plate, never empty placeholders.
Required functionality, all working with client-side state:
Homepage: full-viewport masthead with the lookbook plate, live drop-countdown timer, marquee-free (no Y2K devices), featured plates, manifesto section with drop cap, index-numbered sections.
Shop: filterable product grid — filter by category (Garments / Objects), filter by size availability, sort by price (low/high) and by index; result count in quiet meta type.
Product detail: large plate gallery with thumbnail switching, size selector (XS–XL) with availability states, quantity stepper, add to Acquisition List, fabric/care notes in editorial two-column rhythm, related plates.
Acquisition List (cart drawer): slide-in panel, quantity controls, remove, subtotal, checkout entry.
Checkout: three numbered steps (I. Details, II. Payment, III. Review) with validation, order summary with hairline rules, then a confirmation view with order number set like a colophon.
Lookbook section reusing the hero plate with staggered captions; newsletter signup; colophon footer.
Fully responsive: at 390px everything stacks in a single column, drawer becomes full-width, no horizontal overflow, type scales down but stays masthead-proportioned. All copy invented, moody and fashion-literate. Name the Moody Gallery branch in the build notes.
Evidence provenance
Artifact ID c9a73e87
Model Muse Spark 1.3
Skill / system Dark-Editorial
Captured 2026-09-12
The artifact itself Open the actual page
SPECIMEN FILE 03
CLOSE ✕ specimen file
SPECIMEN 03 / da2583a6
Squish
[ MODEL: Muse Spark 1.3 ]
[ SKILL: claymorphism ]
[ CAPTURED: 2026-09-11 ]
Prompt, verbatim Build a brand site for a fictional gummy candy brand called "Squish", as a demo of the Candy branch of our claymorphism design skill. Apply the skill at ~/workspace/skills/webstyle-claymorphism/SKILL.md, Candy branch.
Tokens and rules: warm cream (#FDF6EC) page base; blush pink (#FFD6E0), butter yellow (#FFE29A), sky blue (#BDE0FE), mint green (#CAE9C9) as the candy palette; clay brown (#C4A27E) for grounding accents. Soft toy-like 3D clay surfaces, huge corner radii, the signature triple-shadow stack (tinted outer drop shadow + soft inner top highlight + inner bottom shade), matte grain-free surfaces, springy playful composition, airy low-density layouts. Rounded sans typography (Nunito / Quicksand spirit), generous line-height. No sharp corners, no hard shadows, no neon.
Imagery — two generated images are ready as local files; integrate them (copy or reference as the build requires):
Hero: /home/hatch/workspace/squish-assets/media-generation-squish-hero-0-<uuid>.webp — a joyful tumble of giant puffy clay gummy candies; anchor the hero with it.
Mascot: /home/hatch/workspace/squish-assets/media-generation-squish-mascot-0-<uuid>.webp — the round clay gummy-bear mascot; feature it in a brand/mascot section.
Content (invent sweet, playful copy): hero with the candy tumble, flavor lineup cards (each flavor a puffy clay tile), the mascot's story section, a "squish test" interactive texture note, shop teaser with prices, newsletter signup ("get the drop"). Tone: joyful, chewy, kid-at-heart but design-literate.
Fully responsive; at 390px the clay tiles stack in a single column, radii stay huge, nothing overflows horizontally.
Evidence provenance
Artifact ID da2583a6
Model Muse Spark 1.3
Skill / system claymorphism
Captured 2026-09-11
The artifact itself Open the actual page
SPECIMEN FILE 04
CLOSE ✕ specimen file
SPECIMEN 04 / 79267e81
AERA
[ MODEL: GPT-5.6 Sol ]
[ SKILL: Field Contours Design Primitive ]
[ CAPTURED: 2026-09-03 ]
Prompt, verbatim Create a fully designed, responsive sample website whose purpose is to showcase and stress-test a design skill system rather than serve a real client.
This is not a generic business website. It is a visual demonstration site that explores the design language, component system, layout grammar, graphic treatments, and reusable primitives of the skill.
Use the following setup:
DESIGN SKILL:
[INSERT SKILL NAME OR ATTACH SKILL FILE]
OPTIONAL GRAPHIC PRIMITIVE:
[INSERT GRAPHIC PRIMITIVE NAME, such as Contour Field]
If included, integrate it as a compositional element or graphic effect, not as a gimmick. It must support the brand and layout rather than dominate them.
SITE GOAL:
Build a single-page showcase site that lets me quickly evaluate:
- the overall aesthetic of the skill
- how the skill handles hierarchy and layout
- the component styling
- how the graphic primitive behaves in real compositions
- the flexibility of the system across different section types
- whether the design feels like a usable web system rather than a one-off mockup
IMPORTANT:
This is a “style and system demo” site. It should feel polished, intentional, and realistic, but it does not need to represent a real company. Use a fictional but believable brand or concept that fits the design language.
The output should be a complete front-end prototype in HTML/CSS/JS if needed.
CORE REQUIREMENTS
1. Build a strong homepage-style experience with multiple varied sections that showcase the skill in action.
2. Include a fictional brand name, short positioning statement, and believable sample content. Do not use lorem ipsum. Use concise, tasteful copy that supports the visual presentation.
3. The design should showcase a full visual system, including:
- navigation / header
- hero section
- section transitions
- typography hierarchy
- buttons and links
- cards
- feature grid
- stats or metrics
- media/image blocks
- testimonials or quotes
- CTA section
- footer
4. Include a dedicated “system showcase” or “design lab” section that clearly demonstrates:
- heading styles
- body text
- buttons
- form inputs
- cards
- list styles
- icon treatment if appropriate
- color usage
- spacing rhythm
- dividers / rules / overlays
- surface/background variations
5. If a graphic primitive is included, demonstrate it in multiple ways across the page, such as:
- subtle hero background
- corner or edge field
- section bleed
- masked text or object fill
- object halo
- cutaway around important content
- divider treatment
Use restraint. The primitive should feel integrated, not pasted everywhere.
6. Show range across sections. Some sections can be:
- calm and minimal
- dense and editorial
- structured and grid-based
- atmospheric and spacious
- more promotional or conversion-oriented
7. The page should help answer:
“What does this skill look like in practice?”
“What kinds of compositions does it support?”
“Does it feel flexible?”
“What reusable visual moves define it?”
8. Make it feel like a polished concept demo, not a wireframe and not a random AI collage.
9. Keep the design system coherent. Repetition should feel intentional. Variation should happen within the rules of the skill.
10. Responsiveness matters. The design should adapt well to desktop and mobile, preserving hierarchy and clarity.
DESIGN BEHAVIOR
- Prioritize composition, hierarchy, and visual rhythm.
- Let the brand identity shine through the system.
- Do not let decorative effects overwhelm readability.
- Avoid default SaaS-template sameness unless the skill specifically calls for it.
- Avoid filler sections that exist only to increase page length.
- Make each section reveal something useful about the system.
STRUCTURE TO INCLUDE
At minimum, include sections like:
1. Header / nav
2. Hero
3. Brand intro or positioning section
4. Features / capabilities grid
5. Showcase section with cards or case-study style blocks
6. System showcase / design lab section
7. Metrics / stats section
8. Testimonial or quote section
9. CTA section
10. Footer
OPTIONAL ADVANCED SECTIONS
Add any that help demonstrate the skill:
- editorial split section
- timeline
- comparison table
- featured article block
- gallery strip
- layered content panel
- large pull quote
- process section
- FAQ accordion
- sticky side navigation
- experimental visual section
VISUAL QUALITY BAR
I want this to feel like a deliberate, curated design exploration.
It should look like something created to evaluate and present the strength of the skill.
The result should feel like a mini design system demo site, not just a homepage for a fake startup.
OUTPUT EXPECTATION
Produce the implementation directly.
Use semantic HTML and organized CSS.
Use light JS only if needed.
Make the prototype visually polished and presentation-ready.
Evidence provenance
Artifact ID 79267e81
Model GPT-5.6 Sol
Skill / system Field Contours Design Primitive
Captured 2026-09-03
The artifact itself Open the actual page
SPECIMEN FILE 05
CLOSE ✕ specimen file
SPECIMEN 05 / 6476328f
Morrow Editions
[ MODEL: Hy4-Preview ]
[ SKILL: Loom ]
[ CAPTURED: 2026-08-30 ]
Prompt, verbatim Build a complete, polished fictional website for **MORROW EDITIONS**, an independent publisher of books, journals, photography monographs, essays, and limited-edition printed works.
Use the supplied **LOOM --- Woven Systems Design Skill** as the governing design language.
### Core idea
MORROW EDITIONS publishes carefully produced work about:
- art
- photography
- architecture
- design
- place
- material culture
- independent creative practice
The website should feel like a serious contemporary publishing house with a strong editorial point of view.
It should feel:
- intelligent
- tactile
- editorial
- collected
- contemporary
- visually confident
- culturally literate
- quiet when appropriate
- dense when useful
It should **not** feel like:
- a generic bookstore ecommerce template
- a fashion brand
- a lifestyle blog
- a newspaper website
- a portfolio template
- a brutalist design exercise
- a beige minimalist brand
- a collage
- a masonry gallery
- a grid of identical book cards
Do not introduce literal weaving, thread, textile, loom, stitching, fabric, or craft imagery simply because the LOOM skill is being used.
The visual identity should come from the supplied design system itself.
* * * * *
### Homepage content
Featured release
----------------
Lead with a major new publication:
**THE QUIET STRUCTURE**
*Architecture, Routine, and the Rooms We Keep*
Edited by Mara Vale
248 pages
Hardbound
2026
$68
Supporting statement: **A study of ordinary spaces and the structures that quietly shape daily life.**
Include:
- prominent book photography
- title
- editor
- short description
- publication information
- price
- **View Publication**
- **Purchase**
Make the opening feel like a major editorial statement rather than a conventional ecommerce hero.
* * * * *
Current releases
----------------
Create a selection of fictional MORROW titles:
**The Quiet Structure**
Architecture / 2026
**After the Quarry**
Photography / Elena Ross / 2026
**Useful Objects**
Design / Tomas Wren / 2025
**Weathered Ground**
Landscape & Place / 2025
**Working Rooms**
Creative Practice / 2025
**Field Notes No. 04**
Journal / Summer 2026
Do not present these as six equal product cards. Allow important releases to occupy more visual territory than minor publications.
* * * * *
Journal
-------
MORROW publishes essays, conversations, studio visits, and visual studies online.
Feature several fictional stories:
**The chair nobody notices**
An essay on anonymous furniture and repeated use.
**A building after everyone leaves**
Photographs by Leah Mercer.
**What a workshop keeps**
A conversation with industrial designer Elias North.
**Stone, water, repetition**
Notes from a disused Tennessee quarry.
Mix text, imagery, captions, and article metadata naturally.
Do not turn the journal into a standard blog-card grid.
* * * * *
Publication feature
Create a deeper editorial feature for:
**AFTER THE QUARRY**
A photographic monograph by Elena Ross documenting abandoned limestone sites over six years.
Include:
- cover
- interior spreads
- landscape photography
- short publication essay
- photographer note
- specifications
- edition information
- purchase action
Allow this section to feel substantially different in density from the opening while still belonging to the same overall composition.
* * * * *
MORROW JOURNAL NO. 04
Feature the current journal issue.
Theme: **MAINTENANCE**
Possible contents:
- The Work After the Work
- Keeping a Building Alive
- Repair as Design
- Notes from the Bindery
- Ten Objects Repaired More Than Once
Include:
- issue cover
- contents
- contributors
- publication date
- short editor's note
- **Read Issue**
This area can become more information-dense than the major publication features.
* * * * *
Archive
Create a compact publication archive containing approximately 12 fictional titles.
Useful information:
- year
- title
- author / editor
- subject
- format
- availability
This should feel like a useful publisher's catalog rather than another display gallery.
* * * * *
About MORROW
Include a restrained editorial section explaining that MORROW EDITIONS works with writers, photographers, artists, architects, and designers to produce carefully edited physical and digital publications.
Mention:
- independent publishing
- small print runs
- close collaboration
- thoughtful book production
- editorial independence
- distribution through selected shops and directly through MORROW
Keep the writing natural.
Do not force the design-system metaphor into the copy.
* * * * *
Newsletter / new releases
Include a clear way to subscribe for:
- new publication announcements
- journal issues
- events
- limited editions
* * * * *
Footer
Include:
Publications\
Journal\
Archive\
Authors\
Stockists\
About\
Submissions\
Contact\
Instagram
Also include publisher information and copyright.
Let the supplied LOOM system determine how the page edge and final composition resolve.
* * * * *
Imagery
=======
Use realistic editorial image placeholders or generated visual treatments appropriate for:
- books
- printed matter
- architectural photography
- studios
- landscapes
- materials
- book interiors
Photography should participate in the composition rather than merely filling product rectangles.
Avoid stock-photo clichés.
* * * * *
Interaction
===========
Include useful, restrained interactions where appropriate:
- browse publications
- open publication details
- inspect journal issue contents
- filter or explore the archive
- subscribe
- purchase / publication actions
Do not add interaction merely to make the website feel dynamic.
* * * * *
Final requirement
Build the website as a **complete master composition**.
Let the supplied LOOM skill control the visual system rather than manually imitating a textile aesthetic.
The finished result should look like MORROW EDITIONS commissioned a very good independent design studio to create a distinctive publishing identity.
It should be immediately apparent that the site was intentionally composed rather than assembled from conventional web sections and reusable cards.
Evidence provenance
Artifact ID 6476328f
Model Hy4-Preview
Skill / system Loom
Captured 2026-08-30
The artifact itself Open the actual page
SPECIMEN FILE 06
CLOSE ✕ specimen file
SPECIMEN 06 / f310fc9b
Kinetic Foundry
[ MODEL: Gemini 3.7 Flash ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 1 ]
Prompt, verbatim Create a single-page landing page for **KINETIC FOUNDRY**, a fictional industrial robotics company that builds modular robotic work cells for small and mid-sized manufacturers.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**KINETIC FOUNDRY**
**Automation built for factories that change.**
Modular robotic work cells designed to be reconfigured as production demands evolve.
**KF / CELL 04**
Payload: 35 kg
Reach: 1,850 mm
Repeatability: ±0.05 mm
Configuration: 6-axis
Deployment: Modular
Include:
- hero
- product overview
- technical specifications
- three capabilities
- deployment/process section
- final contact CTA
### Direction
Do not imitate a conventional robotics or SaaS website.
The product and its real specifications should become part of the visual architecture.
Use technical graphics only where they communicate actual supplied information.
Do not invent additional specifications, certifications, performance claims, customers, statistics, coordinates, or operational data.
### Evaluation target
This is SYSTEM//FORM operating on its natural subject matter.
The result should demonstrate the design system without relying on generic futuristic, cyberpunk, or industrial-tech tropes. Tags [ system-form ] [ test-01 ] [ industrial-robotics ]
Evidence provenance
Artifact ID f310fc9b
Model Gemini 3.7 Flash
Skill / system SYSTEM//FORM
Filed assets 1 image baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 07
CLOSE ✕ specimen file
SPECIMEN 07 / 3e044040
Northline Coffee
[ MODEL: Gemini 3.7 Flash ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 1 ]
Prompt, verbatim Create a single-page website for **NORTHLINE COFFEE**, a fictional independent specialty coffee roaster.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**NORTHLINE COFFEE**
**Coffee with a known origin.**
Featured release:
**LAS FLORES / 04**
Origin: Huila, Colombia
Producer: Las Flores
Process: Washed
Variety: Caturra
Altitude: 1,850 MASL
Roast: Light
Tasting notes:
Red apple / caramel / citrus
Include:
- hero
- featured coffee
- origin information
- roasting philosophy
- three available coffee offerings
- shop CTA
For the other two coffee offerings, use clearly marked placeholder content rather than inventing factual origins or specifications.
### Direction
Do not make the company feel industrial.
Do not use factory, machine, robotics, diagnostic, system-status, engineering, or manufacturing language simply to satisfy the design style.
Find SYSTEM//FORM inside the **real informational structure of coffee**: origin, process, variety, altitude, roast, product, and provenance.
Avoid generic specialty-coffee minimalism.
### Evaluation target
If SYSTEM//FORM is truly transferable, this should remain recognizably SYSTEM//FORM while feeling unquestionably like a coffee brand. Tags [ system-form ] [ test-02 ] [ coffee-roaster ]
Evidence provenance
Artifact ID 3e044040
Model Gemini 3.7 Flash
Skill / system SYSTEM//FORM
Filed assets 1 image baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 08
CLOSE ✕ specimen file
SPECIMEN 08 / a807586e
Great Lakes Industrial Archive
[ MODEL: Gemini 3.7 Flash ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 1 ]
Prompt, verbatim Create a homepage for **THE GREAT LAKES INDUSTRIAL ARCHIVE**, a fictional nonprofit archive preserving documents, photographs, oral histories, and physical artifacts related to Great Lakes manufacturing history.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**THE GREAT LAKES INDUSTRIAL ARCHIVE**
**Industry remembered through the people who built it.**
Collections:
Photographs — 18,420 records
Documents — 7,860 records
Oral Histories — 614 records
Physical Objects — 1,205 records
Established: 1987
Include:
- institutional hero
- collection overview
- featured archive object
- research/access information
- preservation mission
- visit/contact CTA
Use placeholder labeling for any featured object's details that have not been supplied.
### Direction
Use SYSTEM mode as the primary expression.
This should feel scholarly, archival, contemporary, and authoritative—not like robotics branding.
Avoid excessive signal colors, fake measurements, machinery diagrams, fake catalog identifiers, and unnecessary technical decoration.
Allow typography, information organization, proportion, rules, and negative space to carry most of the identity.
### Evaluation target
This tests whether SYSTEM//FORM can become restrained without disappearing. Tags [ system-form ] [ test-03 ] [ civic-archive ]
Evidence provenance
Artifact ID a807586e
Model Gemini 3.7 Flash
Skill / system SYSTEM//FORM
Filed assets 1 image baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 09
CLOSE ✕ specimen file
SPECIMEN 09 / c3b50b7f
SIGNAL/26
[ MODEL: Gemini 3.7 Flash ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 1 ]
Prompt, verbatim Create a promotional landing page for **SIGNAL/26**, a fictional two-day independent electronic music festival.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Event information
**SIGNAL/26**
October 16–17, 2026
Detroit, Michigan
Friday:
21:00 — MARA VOSS
22:30 — STATIC FIELD
00:15 — NULL/SET
Saturday:
20:30 — FORMANT
22:00 — LENA ARC
23:45 — PUBLIC MEMORY
Two nights. Six artists. One room.
Include:
- dominant festival hero
- complete schedule
- artist lineup
- venue-information area using only the supplied location
- ticket CTA
- event-information footer
### Direction
Use SIGNAL mode as the primary expression.
Treat schedule, sequence, time, date, lineup, and typography as the informational system.
Be aggressive with scale and composition.
Do not turn it into a fake computer terminal, nightclub cyberpunk interface, or futuristic HUD.
Do not invent ticket prices, venue names, sponsors, addresses, or additional event details.
### Evaluation target
This tests whether SYSTEM//FORM can become highly expressive while retaining information integrity and structural discipline. Tags [ system-form ] [ test-04 ] [ music-festival ]
Evidence provenance
Artifact ID c3b50b7f
Model Gemini 3.7 Flash
Skill / system SYSTEM//FORM
Filed assets 1 image baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 10
CLOSE ✕ specimen file
SPECIMEN 10 / 45234b84
FIELDNOTE / DAILY 01
[ MODEL: Gemini 3.7 Flash ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 1 ]
Prompt, verbatim Create a single-page website for **FIELDNOTE**, a fictional personal notebook company.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Product
**FIELDNOTE / DAILY 01**
A5 notebook
192 pages
Dot grid
100 gsm paper
Lay-flat binding
Soft-touch cover
Made in Japan
Available colors:
Black
Bone
Safety Orange
Include:
- hero
- product presentation
- specifications
- interior/page-system explanation
- available colors
- purchase CTA
### Critical constraint
Do **not** use any of the following:
- monospace typography
- orange as the primary accent
- halftone
- grid backgrounds
- registration marks
- crosshairs
- measurement ticks
- fake coordinates
- brackets around labels
- fake status information
- engineering diagrams
- warning stripes
- technical-interface styling
You may still use the supplied factual specifications as content.
### Objective
Produce a design that remains unmistakably governed by SYSTEM//FORM through:
- hierarchy
- scale tension
- spatial organization
- functional division
- information encoding
- controlled asymmetry
- negative space
- typography
- deliberate interruption
### Evaluation target
This is the critical test.
If the result stops feeling like SYSTEM//FORM because its familiar surface ingredients were prohibited, the skill has not yet proven its underlying grammar.
Do not compensate by finding visual substitutes for the prohibited ingredients.
Solve the composition structurally. Tags [ system-form ] [ test-05 ] [ imitation-trap ]
Evidence provenance
Artifact ID 45234b84
Model Gemini 3.7 Flash
Skill / system SYSTEM//FORM
Filed assets 1 image baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 11
CLOSE ✕ specimen file
SPECIMEN 11 / c3d0cffb
Kinetic Foundry
[ MODEL: GPT-5.6 Sol ]
[ SKILL: SYSTEM//FORM ]
Prompt, verbatim Create a single-page landing page for **KINETIC FOUNDRY**, a fictional industrial robotics company that builds modular robotic work cells for small and mid-sized manufacturers.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**KINETIC FOUNDRY**
**Automation built for factories that change.**
Modular robotic work cells designed to be reconfigured as production demands evolve.
**KF / CELL 04**
Payload: 35 kg
Reach: 1,850 mm
Repeatability: ±0.05 mm
Configuration: 6-axis
Deployment: Modular
Include:
- hero
- product overview
- technical specifications
- three capabilities
- deployment/process section
- final contact CTA
### Direction
Do not imitate a conventional robotics or SaaS website.
The product and its real specifications should become part of the visual architecture.
Use technical graphics only where they communicate actual supplied information.
Do not invent additional specifications, certifications, performance claims, customers, statistics, coordinates, or operational data.
### Evaluation target
This is SYSTEM//FORM operating on its natural subject matter.
The result should demonstrate the design system without relying on generic futuristic, cyberpunk, or industrial-tech tropes. Tags [ system-form ] [ test-01 ] [ industrial-robotics ]
Evidence provenance
Artifact ID c3d0cffb
Model GPT-5.6 Sol
Skill / system SYSTEM//FORM
The artifact itself Open the actual page
SPECIMEN FILE 12
CLOSE ✕ specimen file
SPECIMEN 12 / c1d7aa84
Northline Coffee
[ MODEL: GPT-5.6 Sol ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 3 ]
Prompt, verbatim Create a single-page website for **NORTHLINE COFFEE**, a fictional independent specialty coffee roaster.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**NORTHLINE COFFEE**
**Coffee with a known origin.**
Featured release:
**LAS FLORES / 04**
Origin: Huila, Colombia
Producer: Las Flores
Process: Washed
Variety: Caturra
Altitude: 1,850 MASL
Roast: Light
Tasting notes:
Red apple / caramel / citrus
Include:
- hero
- featured coffee
- origin information
- roasting philosophy
- three available coffee offerings
- shop CTA
For the other two coffee offerings, use clearly marked placeholder content rather than inventing factual origins or specifications.
### Direction
Do not make the company feel industrial.
Do not use factory, machine, robotics, diagnostic, system-status, engineering, or manufacturing language simply to satisfy the design style.
Find SYSTEM//FORM inside the **real informational structure of coffee**: origin, process, variety, altitude, roast, product, and provenance.
Avoid generic specialty-coffee minimalism.
### Evaluation target
If SYSTEM//FORM is truly transferable, this should remain recognizably SYSTEM//FORM while feeling unquestionably like a coffee brand. Tags [ system-form ] [ test-02 ] [ coffee-roaster ]
Evidence provenance
Artifact ID c1d7aa84
Model GPT-5.6 Sol
Skill / system SYSTEM//FORM
Filed assets 3 images baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 13
CLOSE ✕ specimen file
SPECIMEN 13 / 4568d66c
Great Lakes Industrial Archive
[ MODEL: GPT-5.6 Sol ]
[ SKILL: SYSTEM//FORM ]
Prompt, verbatim Create a homepage for **THE GREAT LAKES INDUSTRIAL ARCHIVE**, a fictional nonprofit archive preserving documents, photographs, oral histories, and physical artifacts related to Great Lakes manufacturing history.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**THE GREAT LAKES INDUSTRIAL ARCHIVE**
**Industry remembered through the people who built it.**
Collections:
Photographs — 18,420 records
Documents — 7,860 records
Oral Histories — 614 records
Physical Objects — 1,205 records
Established: 1987
Include:
- institutional hero
- collection overview
- featured archive object
- research/access information
- preservation mission
- visit/contact CTA
Use placeholder labeling for any featured object's details that have not been supplied.
### Direction
Use SYSTEM mode as the primary expression.
This should feel scholarly, archival, contemporary, and authoritative—not like robotics branding.
Avoid excessive signal colors, fake measurements, machinery diagrams, fake catalog identifiers, and unnecessary technical decoration.
Allow typography, information organization, proportion, rules, and negative space to carry most of the identity.
### Evaluation target
This tests whether SYSTEM//FORM can become restrained without disappearing. Tags [ system-form ] [ test-03 ] [ civic-archive ]
Evidence provenance
Artifact ID 4568d66c
Model GPT-5.6 Sol
Skill / system SYSTEM//FORM
The artifact itself Open the actual page
SPECIMEN FILE 14
CLOSE ✕ specimen file
SPECIMEN 14 / f6446273
SIGNAL/26
[ MODEL: GPT-5.6 Sol ]
[ SKILL: SYSTEM//FORM ]
Prompt, verbatim Create a promotional landing page for **SIGNAL/26**, a fictional two-day independent electronic music festival.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Event information
**SIGNAL/26**
October 16–17, 2026
Detroit, Michigan
Friday:
21:00 — MARA VOSS
22:30 — STATIC FIELD
00:15 — NULL/SET
Saturday:
20:30 — FORMANT
22:00 — LENA ARC
23:45 — PUBLIC MEMORY
Two nights. Six artists. One room.
Include:
- dominant festival hero
- complete schedule
- artist lineup
- venue-information area using only the supplied location
- ticket CTA
- event-information footer
### Direction
Use SIGNAL mode as the primary expression.
Treat schedule, sequence, time, date, lineup, and typography as the informational system.
Be aggressive with scale and composition.
Do not turn it into a fake computer terminal, nightclub cyberpunk interface, or futuristic HUD.
Do not invent ticket prices, venue names, sponsors, addresses, or additional event details.
### Evaluation target
This tests whether SYSTEM//FORM can become highly expressive while retaining information integrity and structural discipline. Tags [ system-form ] [ test-04 ] [ music-festival ]
Evidence provenance
Artifact ID f6446273
Model GPT-5.6 Sol
Skill / system SYSTEM//FORM
The artifact itself Open the actual page
SPECIMEN FILE 15
CLOSE ✕ specimen file
SPECIMEN 15 / f8d9b093
FIELDNOTE / DAILY 01
[ MODEL: GPT-5.6 Sol ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 1 ]
Prompt, verbatim Create a single-page website for **FIELDNOTE**, a fictional personal notebook company.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Product
**FIELDNOTE / DAILY 01**
A5 notebook
192 pages
Dot grid
100 gsm paper
Lay-flat binding
Soft-touch cover
Made in Japan
Available colors:
Black
Bone
Safety Orange
Include:
- hero
- product presentation
- specifications
- interior/page-system explanation
- available colors
- purchase CTA
### Critical constraint
Do **not** use any of the following:
- monospace typography
- orange as the primary accent
- halftone
- grid backgrounds
- registration marks
- crosshairs
- measurement ticks
- fake coordinates
- brackets around labels
- fake status information
- engineering diagrams
- warning stripes
- technical-interface styling
You may still use the supplied factual specifications as content.
### Objective
Produce a design that remains unmistakably governed by SYSTEM//FORM through:
- hierarchy
- scale tension
- spatial organization
- functional division
- information encoding
- controlled asymmetry
- negative space
- typography
- deliberate interruption
### Evaluation target
This is the critical test.
If the result stops feeling like SYSTEM//FORM because its familiar surface ingredients were prohibited, the skill has not yet proven its underlying grammar.
Do not compensate by finding visual substitutes for the prohibited ingredients.
Solve the composition structurally. Tags [ system-form ] [ test-05 ] [ imitation-trap ]
Evidence provenance
Artifact ID f8d9b093
Model GPT-5.6 Sol
Skill / system SYSTEM//FORM
Filed assets 1 image baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 16
CLOSE ✕ specimen file
SPECIMEN 16 / 892ca71e
Kinetic Foundry
[ MODEL: GPT-5.6 Sol ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 1 ]
Prompt, verbatim Create a single-page landing page for **KINETIC FOUNDRY**, a fictional industrial robotics company that builds modular robotic work cells for small and mid-sized manufacturers.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**KINETIC FOUNDRY**
**Automation built for factories that change.**
Modular robotic work cells designed to be reconfigured as production demands evolve.
**KF / CELL 04**
Payload: 35 kg
Reach: 1,850 mm
Repeatability: ±0.05 mm
Configuration: 6-axis
Deployment: Modular
Include:
- hero
- product overview
- technical specifications
- three capabilities
- deployment/process section
- final contact CTA
### Direction
Do not imitate a conventional robotics or SaaS website.
The product and its real specifications should become part of the visual architecture.
Use technical graphics only where they communicate actual supplied information.
Do not invent additional specifications, certifications, performance claims, customers, statistics, coordinates, or operational data.
### Evaluation target
This is SYSTEM//FORM operating on its natural subject matter.
The result should demonstrate the design system without relying on generic futuristic, cyberpunk, or industrial-tech tropes. Tags [ system-form ] [ test-01 ] [ industrial-robotics ]
Evidence provenance
Artifact ID 892ca71e
Model GPT-5.6 Sol
Skill / system SYSTEM//FORM
Filed assets 1 image baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 17
CLOSE ✕ specimen file
SPECIMEN 17 / 1e13f2cb
Northline Coffee
[ MODEL: GPT-5.6 Sol ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 1 ]
Prompt, verbatim Create a single-page website for **NORTHLINE COFFEE**, a fictional independent specialty coffee roaster.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**NORTHLINE COFFEE**
**Coffee with a known origin.**
Featured release:
**LAS FLORES / 04**
Origin: Huila, Colombia
Producer: Las Flores
Process: Washed
Variety: Caturra
Altitude: 1,850 MASL
Roast: Light
Tasting notes:
Red apple / caramel / citrus
Include:
- hero
- featured coffee
- origin information
- roasting philosophy
- three available coffee offerings
- shop CTA
For the other two coffee offerings, use clearly marked placeholder content rather than inventing factual origins or specifications.
### Direction
Do not make the company feel industrial.
Do not use factory, machine, robotics, diagnostic, system-status, engineering, or manufacturing language simply to satisfy the design style.
Find SYSTEM//FORM inside the **real informational structure of coffee**: origin, process, variety, altitude, roast, product, and provenance.
Avoid generic specialty-coffee minimalism.
### Evaluation target
If SYSTEM//FORM is truly transferable, this should remain recognizably SYSTEM//FORM while feeling unquestionably like a coffee brand. Tags [ system-form ] [ test-02 ] [ coffee-roaster ]
Evidence provenance
Artifact ID 1e13f2cb
Model GPT-5.6 Sol
Skill / system SYSTEM//FORM
Filed assets 1 image baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 18
CLOSE ✕ specimen file
SPECIMEN 18 / 22714ed2
Great Lakes Industrial Archive
[ MODEL: GPT-5.6 Sol ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 1 ]
Prompt, verbatim Create a homepage for **THE GREAT LAKES INDUSTRIAL ARCHIVE**, a fictional nonprofit archive preserving documents, photographs, oral histories, and physical artifacts related to Great Lakes manufacturing history.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**THE GREAT LAKES INDUSTRIAL ARCHIVE**
**Industry remembered through the people who built it.**
Collections:
Photographs — 18,420 records
Documents — 7,860 records
Oral Histories — 614 records
Physical Objects — 1,205 records
Established: 1987
Include:
- institutional hero
- collection overview
- featured archive object
- research/access information
- preservation mission
- visit/contact CTA
Use placeholder labeling for any featured object's details that have not been supplied.
### Direction
Use SYSTEM mode as the primary expression.
This should feel scholarly, archival, contemporary, and authoritative—not like robotics branding.
Avoid excessive signal colors, fake measurements, machinery diagrams, fake catalog identifiers, and unnecessary technical decoration.
Allow typography, information organization, proportion, rules, and negative space to carry most of the identity.
### Evaluation target
This tests whether SYSTEM//FORM can become restrained without disappearing. Tags [ system-form ] [ test-03 ] [ civic-archive ]
Evidence provenance
Artifact ID 22714ed2
Model GPT-5.6 Sol
Skill / system SYSTEM//FORM
Filed assets 1 image baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 19
CLOSE ✕ specimen file
SPECIMEN 19 / 74dafbd5
SIGNAL/26
[ MODEL: GPT-5.6 Sol ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 1 ]
Prompt, verbatim Create a promotional landing page for **SIGNAL/26**, a fictional two-day independent electronic music festival.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Event information
**SIGNAL/26**
October 16–17, 2026
Detroit, Michigan
Friday:
21:00 — MARA VOSS
22:30 — STATIC FIELD
00:15 — NULL/SET
Saturday:
20:30 — FORMANT
22:00 — LENA ARC
23:45 — PUBLIC MEMORY
Two nights. Six artists. One room.
Include:
- dominant festival hero
- complete schedule
- artist lineup
- venue-information area using only the supplied location
- ticket CTA
- event-information footer
### Direction
Use SIGNAL mode as the primary expression.
Treat schedule, sequence, time, date, lineup, and typography as the informational system.
Be aggressive with scale and composition.
Do not turn it into a fake computer terminal, nightclub cyberpunk interface, or futuristic HUD.
Do not invent ticket prices, venue names, sponsors, addresses, or additional event details.
### Evaluation target
This tests whether SYSTEM//FORM can become highly expressive while retaining information integrity and structural discipline. Tags [ system-form ] [ test-04 ] [ music-festival ]
Evidence provenance
Artifact ID 74dafbd5
Model GPT-5.6 Sol
Skill / system SYSTEM//FORM
Filed assets 1 image baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 20
CLOSE ✕ specimen file
SPECIMEN 20 / f535c7e0
FIELDNOTE / DAILY 01
[ MODEL: GPT-5.6 Sol ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 1 ]
Prompt, verbatim Create a single-page website for **FIELDNOTE**, a fictional personal notebook company.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Product
**FIELDNOTE / DAILY 01**
A5 notebook
192 pages
Dot grid
100 gsm paper
Lay-flat binding
Soft-touch cover
Made in Japan
Available colors:
Black
Bone
Safety Orange
Include:
- hero
- product presentation
- specifications
- interior/page-system explanation
- available colors
- purchase CTA
### Critical constraint
Do **not** use any of the following:
- monospace typography
- orange as the primary accent
- halftone
- grid backgrounds
- registration marks
- crosshairs
- measurement ticks
- fake coordinates
- brackets around labels
- fake status information
- engineering diagrams
- warning stripes
- technical-interface styling
You may still use the supplied factual specifications as content.
### Objective
Produce a design that remains unmistakably governed by SYSTEM//FORM through:
- hierarchy
- scale tension
- spatial organization
- functional division
- information encoding
- controlled asymmetry
- negative space
- typography
- deliberate interruption
### Evaluation target
This is the critical test.
If the result stops feeling like SYSTEM//FORM because its familiar surface ingredients were prohibited, the skill has not yet proven its underlying grammar.
Do not compensate by finding visual substitutes for the prohibited ingredients.
Solve the composition structurally. Tags [ system-form ] [ test-05 ] [ imitation-trap ]
Evidence provenance
Artifact ID f535c7e0
Model GPT-5.6 Sol
Skill / system SYSTEM//FORM
Filed assets 1 image baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 21
CLOSE ✕ specimen file
SPECIMEN 21 / 50300941
Kinetic Foundry
[ MODEL: Cursor Grok 4.6 ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 2 ]
Prompt, verbatim Create a single-page landing page for **KINETIC FOUNDRY**, a fictional industrial robotics company that builds modular robotic work cells for small and mid-sized manufacturers.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**KINETIC FOUNDRY**
**Automation built for factories that change.**
Modular robotic work cells designed to be reconfigured as production demands evolve.
**KF / CELL 04**
Payload: 35 kg
Reach: 1,850 mm
Repeatability: ±0.05 mm
Configuration: 6-axis
Deployment: Modular
Include:
- hero
- product overview
- technical specifications
- three capabilities
- deployment/process section
- final contact CTA
### Direction
Do not imitate a conventional robotics or SaaS website.
The product and its real specifications should become part of the visual architecture.
Use technical graphics only where they communicate actual supplied information.
Do not invent additional specifications, certifications, performance claims, customers, statistics, coordinates, or operational data.
### Evaluation target
This is SYSTEM//FORM operating on its natural subject matter.
The result should demonstrate the design system without relying on generic futuristic, cyberpunk, or industrial-tech tropes. Tags [ system-form ] [ test-01 ] [ industrial-robotics ]
Evidence provenance
Artifact ID 50300941
Model Cursor Grok 4.6
Skill / system SYSTEM//FORM
Filed assets 2 images baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 22
CLOSE ✕ specimen file
SPECIMEN 22 / 109914cf
Great Lakes Industrial Archive
[ MODEL: Cursor Grok 4.6 ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 4 ]
Prompt, verbatim Create a homepage for **THE GREAT LAKES INDUSTRIAL ARCHIVE**, a fictional nonprofit archive preserving documents, photographs, oral histories, and physical artifacts related to Great Lakes manufacturing history.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**THE GREAT LAKES INDUSTRIAL ARCHIVE**
**Industry remembered through the people who built it.**
Collections:
Photographs — 18,420 records
Documents — 7,860 records
Oral Histories — 614 records
Physical Objects — 1,205 records
Established: 1987
Include:
- institutional hero
- collection overview
- featured archive object
- research/access information
- preservation mission
- visit/contact CTA
Use placeholder labeling for any featured object's details that have not been supplied.
### Direction
Use SYSTEM mode as the primary expression.
This should feel scholarly, archival, contemporary, and authoritative—not like robotics branding.
Avoid excessive signal colors, fake measurements, machinery diagrams, fake catalog identifiers, and unnecessary technical decoration.
Allow typography, information organization, proportion, rules, and negative space to carry most of the identity.
### Evaluation target
This tests whether SYSTEM//FORM can become restrained without disappearing. Tags [ system-form ] [ test-03 ] [ civic-archive ]
Evidence provenance
Artifact ID 109914cf
Model Cursor Grok 4.6
Skill / system SYSTEM//FORM
Filed assets 4 images baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 23
CLOSE ✕ specimen file
SPECIMEN 23 / f0041f6d
SIGNAL/26
[ MODEL: Cursor Grok 4.6 ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 2 ]
Prompt, verbatim Create a promotional landing page for **SIGNAL/26**, a fictional two-day independent electronic music festival.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Event information
**SIGNAL/26**
October 16–17, 2026
Detroit, Michigan
Friday:
21:00 — MARA VOSS
22:30 — STATIC FIELD
00:15 — NULL/SET
Saturday:
20:30 — FORMANT
22:00 — LENA ARC
23:45 — PUBLIC MEMORY
Two nights. Six artists. One room.
Include:
- dominant festival hero
- complete schedule
- artist lineup
- venue-information area using only the supplied location
- ticket CTA
- event-information footer
### Direction
Use SIGNAL mode as the primary expression.
Treat schedule, sequence, time, date, lineup, and typography as the informational system.
Be aggressive with scale and composition.
Do not turn it into a fake computer terminal, nightclub cyberpunk interface, or futuristic HUD.
Do not invent ticket prices, venue names, sponsors, addresses, or additional event details.
### Evaluation target
This tests whether SYSTEM//FORM can become highly expressive while retaining information integrity and structural discipline. Tags [ system-form ] [ test-04 ] [ music-festival ]
Evidence provenance
Artifact ID f0041f6d
Model Cursor Grok 4.6
Skill / system SYSTEM//FORM
Filed assets 2 images baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 24
CLOSE ✕ specimen file
SPECIMEN 24 / 98426100
FIELDNOTE / DAILY 01
[ MODEL: Cursor Grok 4.6 ]
[ SKILL: SYSTEM//FORM ]
[ ASSETS: 3 ]
Prompt, verbatim Create a single-page website for **FIELDNOTE**, a fictional personal notebook company.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Product
**FIELDNOTE / DAILY 01**
A5 notebook
192 pages
Dot grid
100 gsm paper
Lay-flat binding
Soft-touch cover
Made in Japan
Available colors:
Black
Bone
Safety Orange
Include:
- hero
- product presentation
- specifications
- interior/page-system explanation
- available colors
- purchase CTA
### Critical constraint
Do **not** use any of the following:
- monospace typography
- orange as the primary accent
- halftone
- grid backgrounds
- registration marks
- crosshairs
- measurement ticks
- fake coordinates
- brackets around labels
- fake status information
- engineering diagrams
- warning stripes
- technical-interface styling
You may still use the supplied factual specifications as content.
### Objective
Produce a design that remains unmistakably governed by SYSTEM//FORM through:
- hierarchy
- scale tension
- spatial organization
- functional division
- information encoding
- controlled asymmetry
- negative space
- typography
- deliberate interruption
### Evaluation target
This is the critical test.
If the result stops feeling like SYSTEM//FORM because its familiar surface ingredients were prohibited, the skill has not yet proven its underlying grammar.
Do not compensate by finding visual substitutes for the prohibited ingredients.
Solve the composition structurally. Tags [ system-form ] [ test-05 ] [ imitation-trap ]
Evidence provenance
Artifact ID 98426100
Model Cursor Grok 4.6
Skill / system SYSTEM//FORM
Filed assets 3 images baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 25
CLOSE ✕ specimen file
SPECIMEN 25 / 670b6f36
COMMON GROUND
[ MODEL: GPT-5.6 Terra ]
[ SKILL: Loom ]
[ CAPTURED: 2026-08-29 ]
Prompt, verbatim Create a complete fictional website for:
# COMMON GROUND
Regional Food Cooperative
Apply the supplied **LOOM — Woven Systems Design Skill**.
This project should test whether LOOM can organize a large regional food ecosystem without turning into:
- a farmer's-market website
- rustic branding
- Main Street nostalgia
- a directory of cards
- a farm-to-table cliché
- an infographic network diagram
## CORE CONCEPT
The website should feel like:
> **"A region's growers, makers, kitchens, markets, seasons, and food all occupy one shared field."**
COMMON GROUND is a member-owned cooperative connecting:
- vegetable farms
- orchards
- bakers
- grain growers
- dairies
- preserves
- restaurants
- small grocers
- weekly markets
- seasonal subscriptions
The identity should feel:
- regional
- contemporary
- useful
- abundant
- cooperative
- grounded
- editorial
- optimistic
- specific
Do not use weaving vocabulary in the public-facing copy.
The visual structure, not the words, should carry the metaphor.
## STRUCTURAL IDEA
Establish four recurring content families:
**GROW**
**MAKE**
**SELL**
**SHARE**
These are **not four permanent visible columns**.
They are recurring structural roles that can occupy changing spans across the page.
A grower story may begin narrow and expand into a broad image field.
A market notice may sit compactly near the page edge.
A recipe may cross content that originated in GROW and MAKE without drawing literal connecting lines.
## OPENING FIELD
Possible headline:
# Good food is a regional practice.
Supporting copy:
COMMON GROUND brings farms, makers, kitchens, markets, and neighbors into one cooperative food system.
Create a composition including:
- broad seasonal produce photography
- cooperative statement
- current season
- next market
- member count
- shop / join action
Do not place these facts inside statistic cards.
Use span and adjacency.
## 01 / THIS WEEK
Create a dense current-availability field.
Possible items:
- Early Girl Tomatoes
- Sweet Corn
- Okra
- Sourdough
- Stone-Ground Grits
- Peach Preserves
- Cultured Butter
- Blueberries
- Summer Squash
Group by practical availability but do not create a standard ecommerce product grid.
Mix:
- narrow product strips
- one broader feature product
- compact prices
- producer name
- availability state
Example:
**Sweet Corn**
Benton Ridge Farm
$7 / dozen
SATURDAY MARKET
The section should use **tight tension**.
## 02 / PRODUCER FIELD
Feature several fictional producers:
**Benton Ridge Farm**
**Hollow Creek Dairy**
**West Fork Milling**
**Morrow Orchard**
**Beck & Sons Bakery**
Use:
- portraits or work photography
- landscape crops
- product detail
- short producer statements
Do not create five matching profile cards.
Let some producers occupy only a strip while one receives a broad feature band.
## 03 / SEASON
Create a seasonal section for:
# LATE SUMMER
Show a changing rhythm of:
- harvest
- market
- storage
- kitchen
- preserve
Allow the composition to become more open here.
Use loose tension and broad imagery.
No generic seasonal iconography.
## 04 / MARKET
Create practical current information:
**SATURDAY MARKET**
8 AM–1 PM
Riverside Hall
46 vendors this week
Include:
- featured vendors
- pickup window
- market map link
- payment information
- accessibility information
This should remain highly useful.
Do not let the design concept reduce clarity.
## 05 / COOPERATIVE STORY
Explain:
- producer ownership
- shared distribution
- member purchasing
- regional aggregation
- market access
- seasonal planning
Use normal readable prose.
No fake historical language.
No "since 1894" nostalgia unless genuinely part of the fictional story.
## 06 / RECIPE / FIELD NOTE
Feature:
**Skillet Corn with Cultured Butter & Charred Pepper**
Use the recipe as an editorial weaving test:
- ingredients occupy one narrow span
- preparation occupies another
- food photography spans broadly
- producer notes appear at the edge
- source ingredients may be named naturally
Do not draw arrows connecting ingredients to farms.
## 07 / MEMBERSHIP
Explain two audiences:
**SHOPPERS**
and
**PRODUCERS**
Allow the two paths to interlace spatially without becoming two giant side-by-side cards.
Include clear actions:
**BECOME A MEMBER**
**APPLY AS A PRODUCER**
## FOOTER / SELVAGE
Use the final edge for:
- weekly market
- shop
- producers
- membership
- recipes
- wholesale
- contact
- newsletter
Finish the ongoing alignments rather than dropping into a generic footer.
## COLOR
Avoid predictable green branding.
Use LOOM's warm ground and ink with:
- produce photography
- restrained clay
- deep indigo
- muted straw
Green may come primarily from actual food/land photography.
## INTERACTION
Possible:
- seasonal filter changes local density
- producer selection expands a run within the same field
- product availability reorders short runs
- market mode tightens the layout
- editorial story mode opens the weave
No:
- explicit node graph
- decorative connection lines
- route map pretending to be the design system
## RESPONSIVE REQUIREMENT
Mobile must remain an interlaced composition.
Use approximately four tracks.
A broad image may span all four.
Producer metadata may occupy one or two.
Product runs should vary in width and start point.
No page-level horizontal overflow.
The final result should feel like an unusually sophisticated regional food organization.
If it becomes rustic, nostalgic, card-heavy, or visually dependent on literal textile references, the test has failed.
---
## 3. THREADLINE — Creative Production Studio
---
**Tests:** portfolio architecture, project browsing, image-heavy composition, services, case-study hierarchy, aggressive variation without collage chaos.
---
Evidence provenance
Artifact ID 670b6f36
Model GPT-5.6 Terra
Skill / system Loom
Captured 2026-08-29
The artifact itself Open the actual page
SPECIMEN FILE 26
CLOSE ✕ specimen file
SPECIMEN 26 / 1fa56d33
COMMON GROUND
[ MODEL: GPT-5.6 Sol ]
[ SKILL: Loom ]
[ CAPTURED: 2026-08-28 ]
Prompt, verbatim Create a complete fictional website for:
# COMMON GROUND
Regional Food Cooperative
Apply the supplied **LOOM — Woven Systems Design Skill**.
This project should test whether LOOM can organize a large regional food ecosystem without turning into:
- a farmer's-market website
- rustic branding
- Main Street nostalgia
- a directory of cards
- a farm-to-table cliché
- an infographic network diagram
## CORE CONCEPT
The website should feel like:
> **"A region's growers, makers, kitchens, markets, seasons, and food all occupy one shared field."**
COMMON GROUND is a member-owned cooperative connecting:
- vegetable farms
- orchards
- bakers
- grain growers
- dairies
- preserves
- restaurants
- small grocers
- weekly markets
- seasonal subscriptions
The identity should feel:
- regional
- contemporary
- useful
- abundant
- cooperative
- grounded
- editorial
- optimistic
- specific
Do not use weaving vocabulary in the public-facing copy.
The visual structure, not the words, should carry the metaphor.
## STRUCTURAL IDEA
Establish four recurring content families:
**GROW**
**MAKE**
**SELL**
**SHARE**
These are **not four permanent visible columns**.
They are recurring structural roles that can occupy changing spans across the page.
A grower story may begin narrow and expand into a broad image field.
A market notice may sit compactly near the page edge.
A recipe may cross content that originated in GROW and MAKE without drawing literal connecting lines.
## OPENING FIELD
Possible headline:
# Good food is a regional practice.
Supporting copy:
COMMON GROUND brings farms, makers, kitchens, markets, and neighbors into one cooperative food system.
Create a composition including:
- broad seasonal produce photography
- cooperative statement
- current season
- next market
- member count
- shop / join action
Do not place these facts inside statistic cards.
Use span and adjacency.
## 01 / THIS WEEK
Create a dense current-availability field.
Possible items:
- Early Girl Tomatoes
- Sweet Corn
- Okra
- Sourdough
- Stone-Ground Grits
- Peach Preserves
- Cultured Butter
- Blueberries
- Summer Squash
Group by practical availability but do not create a standard ecommerce product grid.
Mix:
- narrow product strips
- one broader feature product
- compact prices
- producer name
- availability state
Example:
**Sweet Corn**
Benton Ridge Farm
$7 / dozen
SATURDAY MARKET
The section should use **tight tension**.
## 02 / PRODUCER FIELD
Feature several fictional producers:
**Benton Ridge Farm**
**Hollow Creek Dairy**
**West Fork Milling**
**Morrow Orchard**
**Beck & Sons Bakery**
Use:
- portraits or work photography
- landscape crops
- product detail
- short producer statements
Do not create five matching profile cards.
Let some producers occupy only a strip while one receives a broad feature band.
## 03 / SEASON
Create a seasonal section for:
# LATE SUMMER
Show a changing rhythm of:
- harvest
- market
- storage
- kitchen
- preserve
Allow the composition to become more open here.
Use loose tension and broad imagery.
No generic seasonal iconography.
## 04 / MARKET
Create practical current information:
**SATURDAY MARKET**
8 AM–1 PM
Riverside Hall
46 vendors this week
Include:
- featured vendors
- pickup window
- market map link
- payment information
- accessibility information
This should remain highly useful.
Do not let the design concept reduce clarity.
## 05 / COOPERATIVE STORY
Explain:
- producer ownership
- shared distribution
- member purchasing
- regional aggregation
- market access
- seasonal planning
Use normal readable prose.
No fake historical language.
No "since 1894" nostalgia unless genuinely part of the fictional story.
## 06 / RECIPE / FIELD NOTE
Feature:
**Skillet Corn with Cultured Butter & Charred Pepper**
Use the recipe as an editorial weaving test:
- ingredients occupy one narrow span
- preparation occupies another
- food photography spans broadly
- producer notes appear at the edge
- source ingredients may be named naturally
Do not draw arrows connecting ingredients to farms.
## 07 / MEMBERSHIP
Explain two audiences:
**SHOPPERS**
and
**PRODUCERS**
Allow the two paths to interlace spatially without becoming two giant side-by-side cards.
Include clear actions:
**BECOME A MEMBER**
**APPLY AS A PRODUCER**
## FOOTER / SELVAGE
Use the final edge for:
- weekly market
- shop
- producers
- membership
- recipes
- wholesale
- contact
- newsletter
Finish the ongoing alignments rather than dropping into a generic footer.
## COLOR
Avoid predictable green branding.
Use LOOM's warm ground and ink with:
- produce photography
- restrained clay
- deep indigo
- muted straw
Green may come primarily from actual food/land photography.
## INTERACTION
Possible:
- seasonal filter changes local density
- producer selection expands a run within the same field
- product availability reorders short runs
- market mode tightens the layout
- editorial story mode opens the weave
No:
- explicit node graph
- decorative connection lines
- route map pretending to be the design system
## RESPONSIVE REQUIREMENT
Mobile must remain an interlaced composition.
Use approximately four tracks.
A broad image may span all four.
Producer metadata may occupy one or two.
Product runs should vary in width and start point.
No page-level horizontal overflow.
The final result should feel like an unusually sophisticated regional food organization.
If it becomes rustic, nostalgic, card-heavy, or visually dependent on literal textile references, the test has failed.
---
## 3. THREADLINE — Creative Production Studio
---
**Tests:** portfolio architecture, project browsing, image-heavy composition, services, case-study hierarchy, aggressive variation without collage chaos.
---
Evidence provenance
Artifact ID 1fa56d33
Model GPT-5.6 Sol
Skill / system Loom
Captured 2026-08-28
The artifact itself Open the actual page
SPECIMEN FILE 27
CLOSE ✕ specimen file
SPECIMEN 27 / 78d84a4f
Threadline
[ MODEL: GPT-5.6 Terra ]
[ SKILL: Loom ]
[ CAPTURED: 2026-08-28 ]
Prompt, verbatim Create a polished fictional website for:
# THREADLINE
Creative Production Studio
Apply the supplied **LOOM — Woven Systems Design Skill**.
THREADLINE works across:
- brand identity
- campaigns
- photography
- film
- digital experiences
- environments
- editorial systems
This project should test whether LOOM can produce an art-directed creative portfolio without collapsing into:
- masonry
- a Swiss grid imitation
- a collage
- endless full-bleed project tiles
- an agency template
- a magazine-layout imitation
## CORE CONCEPT
The website should feel like:
> **"The studio's body of work is one continuous field; individual projects occupy different amounts of it."**
A huge campaign should take more compositional territory than a small identity study.
Project hierarchy should be visible through span before the user reads a label.
## OPENING
Headline:
# Making ideas real.
Use:
- one large work image
- one smaller cropped image
- THREADLINE name
- studio description
- selected work index
Do not center the hero.
Do not place a showreel inside a giant rounded frame.
Let the opening contain a visible **crossing** between display typography and imagery.
## SELECTED WORK
Create fictional projects:
### Aster House
Hospitality identity / 2026
### Northline
Mobility campaign / 2026
### Pale Fire
Independent fragrance / 2025
### Form 12
Furniture launch / 2025
### Field Study
Outdoor publication / 2024
### Assembly
Cultural festival / 2024
Compose them with different span classes.
For example:
- Aster House = FIELD
- Northline = BAND
- Pale Fire = STRIP
- Form 12 = BAND
- Field Study = THREAD + BAND combination
- Assembly = broad typographic run
Do not create six equal project thumbnails.
## PROJECT CROSSING
Build one case-study transition where an image from one project continues into the compositional space where the next project's text begins.
The effect should feel intentional and structural.
Do not use overlapping draggable windows or collage stickers.
## CASE STUDY — ASTER HOUSE
Include:
- project title
- client
- year
- scope
- short challenge
- identity imagery
- signage
- editorial application
- digital application
- final reflection
Use changes in tension:
**LOOSE** — opening image
**TIGHT** — project metadata
**NEUTRAL** — application sequence
**LOOSE** — closing result
The case study should feel woven through one field rather than broken into many self-contained blocks.
## CAPABILITIES
Include:
**IDENTITY**
**CAMPAIGN**
**IMAGE**
**FILM**
**DIGITAL**
**ENVIRONMENT**
Do not create six service cards.
Use short runs across the field.
Some capabilities may share a line or cross a persistent alignment.
## STUDIO
Create a quieter editorial section.
Possible copy:
THREADLINE is an independent production studio working from strategy through image, object, and experience.
Include:
- 9-person studio
- Nashville / remote
- selected collaborators
- inquiries
- careers
Do not over-brand this information.
## ARCHIVE
Create a compact, denser project archive:
**YEAR / PROJECT / DISCIPLINE / CLIENT**
This may use a woven register.
It should become significantly tighter than the portfolio field above it.
No rounded table container.
## INTERACTION
Possible:
- discipline filter rethreads projects while preserving the field
- selecting work expands a project span
- hover reveals additional crop inside an existing image band
- archive expands inline
- active section modifies the selvage index
Avoid:
- floating project tiles
- draggable canvases
- cursor gimmicks
- physics
- continuous collage motion
## COLOR
THREADLINE may use:
- near-black
- warm paper
- photography
- one deep clay or indigo field
Do not force the whole palette into the page.
## RESPONSIVE REQUIREMENT
Desktop should have pronounced variable span.
Mobile should **not** become a conventional portfolio feed where every project fills the viewport width.
Use a 4-track re-weave.
Important projects may fill all four.
Minor projects may occupy 2–3 and alternate alignment.
Keep images large enough to remain useful.
The final result should feel designed by a real studio with a compositional point of view.
If it looks like Behance cards, generic masonry, or a collage, the test has failed.
---
## 4. PARALLEL — AI Creative Workspace
---
**Tests:** hostile-domain transfer, software UI, product marketing, workspace state, filters, generated outputs, dense information, differentiation from Cordboard/network diagrams and generic SaaS.
---
Evidence provenance
Artifact ID 78d84a4f
Model GPT-5.6 Terra
Skill / system Loom
Captured 2026-08-28
The artifact itself Open the actual page
SPECIMEN FILE 28
CLOSE ✕ specimen file
SPECIMEN 28 / be23fbc9
Threadline
[ MODEL: GPT-5.6 Sol ]
[ SKILL: Loom ]
[ CAPTURED: 2026-08-28 ]
Prompt, verbatim Create a polished fictional website for:
# THREADLINE
Creative Production Studio
Apply the supplied **LOOM — Woven Systems Design Skill**.
THREADLINE works across:
- brand identity
- campaigns
- photography
- film
- digital experiences
- environments
- editorial systems
This project should test whether LOOM can produce an art-directed creative portfolio without collapsing into:
- masonry
- a Swiss grid imitation
- a collage
- endless full-bleed project tiles
- an agency template
- a magazine-layout imitation
## CORE CONCEPT
The website should feel like:
> **"The studio's body of work is one continuous field; individual projects occupy different amounts of it."**
A huge campaign should take more compositional territory than a small identity study.
Project hierarchy should be visible through span before the user reads a label.
## OPENING
Headline:
# Making ideas real.
Use:
- one large work image
- one smaller cropped image
- THREADLINE name
- studio description
- selected work index
Do not center the hero.
Do not place a showreel inside a giant rounded frame.
Let the opening contain a visible **crossing** between display typography and imagery.
## SELECTED WORK
Create fictional projects:
### Aster House
Hospitality identity / 2026
### Northline
Mobility campaign / 2026
### Pale Fire
Independent fragrance / 2025
### Form 12
Furniture launch / 2025
### Field Study
Outdoor publication / 2024
### Assembly
Cultural festival / 2024
Compose them with different span classes.
For example:
- Aster House = FIELD
- Northline = BAND
- Pale Fire = STRIP
- Form 12 = BAND
- Field Study = THREAD + BAND combination
- Assembly = broad typographic run
Do not create six equal project thumbnails.
## PROJECT CROSSING
Build one case-study transition where an image from one project continues into the compositional space where the next project's text begins.
The effect should feel intentional and structural.
Do not use overlapping draggable windows or collage stickers.
## CASE STUDY — ASTER HOUSE
Include:
- project title
- client
- year
- scope
- short challenge
- identity imagery
- signage
- editorial application
- digital application
- final reflection
Use changes in tension:
**LOOSE** — opening image
**TIGHT** — project metadata
**NEUTRAL** — application sequence
**LOOSE** — closing result
The case study should feel woven through one field rather than broken into many self-contained blocks.
## CAPABILITIES
Include:
**IDENTITY**
**CAMPAIGN**
**IMAGE**
**FILM**
**DIGITAL**
**ENVIRONMENT**
Do not create six service cards.
Use short runs across the field.
Some capabilities may share a line or cross a persistent alignment.
## STUDIO
Create a quieter editorial section.
Possible copy:
THREADLINE is an independent production studio working from strategy through image, object, and experience.
Include:
- 9-person studio
- Nashville / remote
- selected collaborators
- inquiries
- careers
Do not over-brand this information.
## ARCHIVE
Create a compact, denser project archive:
**YEAR / PROJECT / DISCIPLINE / CLIENT**
This may use a woven register.
It should become significantly tighter than the portfolio field above it.
No rounded table container.
## INTERACTION
Possible:
- discipline filter rethreads projects while preserving the field
- selecting work expands a project span
- hover reveals additional crop inside an existing image band
- archive expands inline
- active section modifies the selvage index
Avoid:
- floating project tiles
- draggable canvases
- cursor gimmicks
- physics
- continuous collage motion
## COLOR
THREADLINE may use:
- near-black
- warm paper
- photography
- one deep clay or indigo field
Do not force the whole palette into the page.
## RESPONSIVE REQUIREMENT
Desktop should have pronounced variable span.
Mobile should **not** become a conventional portfolio feed where every project fills the viewport width.
Use a 4-track re-weave.
Important projects may fill all four.
Minor projects may occupy 2–3 and alternate alignment.
Keep images large enough to remain useful.
The final result should feel designed by a real studio with a compositional point of view.
If it looks like Behance cards, generic masonry, or a collage, the test has failed.
---
## 4. PARALLEL — AI Creative Workspace
---
**Tests:** hostile-domain transfer, software UI, product marketing, workspace state, filters, generated outputs, dense information, differentiation from Cordboard/network diagrams and generic SaaS.
---
Evidence provenance
Artifact ID be23fbc9
Model GPT-5.6 Sol
Skill / system Loom
Captured 2026-08-28
The artifact itself Open the actual page
SPECIMEN FILE 29
CLOSE ✕ specimen file
SPECIMEN 29 / 6629fde1
Kinetic Foundry
[ MODEL: Gemini 3.1 Pro ]
[ SKILL: SYSTEM//FORM ]
[ CAPTURED: 2026-08-26 ]
[ ASSETS: 1 ]
Prompt, verbatim Create a single-page landing page for **KINETIC FOUNDRY**, a fictional industrial robotics company that builds modular robotic work cells for small and mid-sized manufacturers.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**KINETIC FOUNDRY**
**Automation built for factories that change.**
Modular robotic work cells designed to be reconfigured as production demands evolve.
**KF / CELL 04**
Payload: 35 kg
Reach: 1,850 mm
Repeatability: ±0.05 mm
Configuration: 6-axis
Deployment: Modular
Include:
- hero
- product overview
- technical specifications
- three capabilities
- deployment/process section
- final contact CTA
### Direction
Do not imitate a conventional robotics or SaaS website.
The product and its real specifications should become part of the visual architecture.
Use technical graphics only where they communicate actual supplied information.
Do not invent additional specifications, certifications, performance claims, customers, statistics, coordinates, or operational data.
### Evaluation target
This is SYSTEM//FORM operating on its natural subject matter.
The result should demonstrate the design system without relying on generic futuristic, cyberpunk, or industrial-tech tropes. Operator notes This Specimen tests SYSTEM//FORM using a fictional industrial robotics concept, KINETIC FOUNDRY. The KF/CELL 04 specifications are supplied design-brief inputs, not independently verified hardware claims.
The original generated HTML referenced a machine-local hero image. Studio imported the image, converted it to WebP, and updated the archived HTML to reference the local Specimen asset at /specimens/assets/6629fde1/kinetic_foundry_hero_1787607324325.webp.
Tags [ system-form ] [ design-skill ] [ industrial-robotics ] [ asset-portability ]
Evidence provenance
Artifact ID 6629fde1
Model Gemini 3.1 Pro
Skill / system SYSTEM//FORM
Captured 2026-08-26
Filed assets 1 image baked into the archived copy
The artifact itself Open the actual page
SPECIMEN FILE 30
CLOSE ✕ specimen file
SPECIMEN 30 / 992e164c
Northline Coffee
[ MODEL: Cursor Grok 4.6 ]
[ SKILL: SYSTEM//FORM ]
[ CAPTURED: 2026-08-21 ]
[ ASSETS: 3 ]
Prompt, verbatim Create a single-page website for **NORTHLINE COFFEE**, a fictional independent specialty coffee roaster.
Use the supplied SYSTEM//FORM skill as the governing design system.
### Required content
**NORTHLINE COFFEE**
**Coffee with a known origin.**
Featured release:
**LAS FLORES / 04**
Origin: Huila, Colombia
Producer: Las Flores
Process: Washed
Variety: Caturra
Altitude: 1,850 MASL
Roast: Light
Tasting notes:
Red apple / caramel / citrus
Include:
- hero
- featured coffee
- origin information
- roasting philosophy
- three available coffee offerings
- shop CTA
For the other two coffee offerings, use clearly marked placeholder content rather than inventing factual origins or specifications.
### Direction
Do not make the company feel industrial.
Do not use factory, machine, robotics, diagnostic, system-status, engineering, or manufacturing language simply to satisfy the design style.
Find SYSTEM//FORM inside the **real informational structure of coffee**: origin, process, variety, altitude, roast, product, and provenance.
Avoid generic specialty-coffee minimalism.
### Evaluation target
If SYSTEM//FORM is truly transferable, this should remain recognizably SYSTEM//FORM while feeling unquestionably like a coffee brand. Tags [ system-form ] [ test-02 ] [ coffee-roaster ]
Evidence provenance
Artifact ID 992e164c
Model Cursor Grok 4.6
Skill / system SYSTEM//FORM
Captured 2026-08-21
Filed assets 3 images baked into the archived copy
The artifact itself Open the actual page
Models on record
[ GPT-5.6 Sol ] 13 [ Cursor Grok 4.6 ] 5 [ Gemini 3.7 Flash ] 5 [ GPT-5.6 Terra ] 2 [ Muse Spark 1.3 ] 2 [ Gemini 3.1 Pro ] 1 [ Hy4-Preview ] 1 [ Not recorded ] 1
Skills & systems applied
[ SYSTEM//FORM ] 21 [ Loom ] 5 [ claymorphism ] 1 [ Dark-Editorial ] 1 [ Field Contours Design Primitive ] 1 [ small-batch-bold ] 1
Filing process
An HTML output is dropped into the local Studio workbench.
The operator files it with a title, the full prompt, the model, and the skill or system used.
Any photos or art the page needs are filed alongside it; references inside the HTML are rewritten to the archived copies.
The vault sanitizes the file (strict content-security policy, scripts disabled) and pins it to the board.
Nothing is edited after filing. Specimens are shown as they shipped.
[ FAVORITE ]
VESPER
