What Is the Default Design Flow of Hallmark? A 9-Step Anti-AI-Slop Pipeline

Hallmark's default design flow is a deterministic, rule-driven pipeline that transforms a creative brief into a production-ready web page through nine sequential stages, from repository pre-flight scanning to automated slop-testing.

The Nutlope/hallmark repository implements a disciplined alternative to generic AI-generated UIs. Understanding the default design flow of Hallmark reveals how it enforces architectural decisions that prevent "default AI" patterns while producing diverse, high-quality web pages based on the specifications in skills/hallmark/SKILL.md.

Overview of the Deterministic Pipeline

Unlike typical AI coding assistants that generate code immediately, Hallmark executes a strict protocol that prioritizes context gathering and diversification over speed. The entire orchestration is defined in skills/hallmark/SKILL.md and follows this sequence:

Pre-flight → Design-context → Macrostructure → Project memory → Theme route →
Load rules → Hero enrichment → Preview → Build → Slop-test → Log

Each step is deterministic and heavily guarded against generic outputs.

The 9 Steps of Hallmark's Default Design Flow

Step 0 – Pre-Flight Repository Scan

Hallmark first inspects package.json, Tailwind configuration, existing CSS, and token files to discover the current font stack, color palette, motion libraries, and framework. These findings are cached in .hallmark/preflight.json for subsequent steps.

Step 1 – Design-Context Gate

Before generating code, Hallmark establishes three constraints: Audience, Use case, and Tone. This gate prevents the model from guessing blindly and ensures the output aligns with explicit strategic requirements.

Step 2 – Macrostructure Selection

Hallmark consults references/macrostructures.md, which indexes 21 named macrostructures. The system selects one that does not duplicate the macrostructure used in any existing page or previous run. The Specimen macrostructure is explicitly banned from default selection to encourage variety.

Step 2.5 – Project Memory Check

If .hallmark/log.json exists, Hallmark loads recent entries to enforce diversification. The new macrostructure, theme, and enrichment must differ from recent outputs on at least one axis, preventing repetitive designs across multiple runs.

Step 2.6 – Theme Route Decision

Hallmark chooses between three distinct paths:

• Studied-DNA: Used when a previous hallmark study command supplied design DNA (skips catalog selection).
• Custom: Triggered only by explicit brand signals, custom color specifications, or "custom theme" requests.
• Catalog: The default route, selecting one of 21 catalog themes while obeying genre-based rotation rules.

Step 3 – Visual Ruleset Loading

Based on the selected genre, theme, macrostructure, and component archetypes, Hallmark lazily loads only required reference files (e.g., genres/modern-minimal.md, themes/cobalt.md, selected macrostructure files). This selective loading minimizes token usage while maintaining context.

Step 4 – Hero Enrichment Decision

Consulting references/hero-enrichment.md, Hallmark runs the "image-need" table. By default, it builds a typography-only hero. Richer enrichments like CSS art, hand-built SVG, or Lottie animations are added only when the brief signals explicit imagery requirements.

Step 5 – Preview Generation

Hallmark emits a concise markdown summary displaying the forthcoming page's macrostructure, theme, enrichment type, sections, motion approach, and diversification status. Users can abort or redirect before code generation begins, ensuring alignment with expectations.

Step 6 – Build and Stamp

Hallmark generates HTML, CSS, and optional JavaScript, stamping the output with a machine-readable comment that records design decisions:

/* Hallmark · macrostructure: Marquee Hero · genre: modern-minimal · theme: Coral
 * nav: N5 · footer: Ft5 · pre-emit critique: P5 H4 E5 S4 R5 V5 */

This stamp enables downstream runs to read the design system and enforce further diversification.

Step 7 – Slop-Test Validation

The generated code undergoes a 58-gate checklist defined in references/slop-test.md. Any failure triggers an automatic revision pass until the page passes all gates, ensuring production quality without "AI slop."

Step 8 – Persistence

The successful run appends to .hallmark/log.json, recording the macrostructure, theme, enrichment, and brief. This log drives diversification logic for future invocations, creating a project memory that prevents repetitive outputs.

Executing the Default Design Flow

To initiate the pipeline in your repository:

npx skills add nutlope/hallmark
hallmark

The interaction proceeds through the design-context questions, displays pre-flight findings, and requires confirmation of the preview before emitting final code.

Diversification Through Project Memory

When re-running hallmark in the same repository, the system reads .hallmark/log.json to ensure new outputs differ from previous runs. This automatic diversification selects alternative macrostructures, theme axes, and nav/footer archetypes without manual intervention, as enforced in Step 2.5.

Key Reference Files

• skills/hallmark/SKILL.md: Master skill definition containing the complete default design flow and discipline rules.
• references/macrostructures.md: Index of 21 layout architectures used in Step 2.
• references/slop-test.md: 58-gate quality checklist applied in Step 7.
• references/hero-enrichment.md: Rules for visual asset inclusion used in Step 4.
• references/component-cookbook.md: Nav and footer archetypes referenced during the build phase.
• .hallmark/log.json: Runtime-generated diversification log created in Step 8.
• .hallmark/preflight.json: Cached repository analysis generated in Step 0.

Summary

• Hallmark's default design flow consists of nine deterministic steps defined in SKILL.md.
• The pipeline begins with repository analysis (Step 0) and ends with slop-testing (Step 7) and logging (Step 8).
• Diversification is enforced through .hallmark/log.json to prevent repetitive outputs across multiple runs.
• By default, Hallmark selects typography-only heroes and avoids the Specimen macrostructure to ensure architectural variety.
• The 58-gate slop-test automatically revises code until quality standards are met.

Frequently Asked Questions

Can I customize the default design flow of Hallmark?

While the nine-step sequence is fixed in SKILL.md, you can influence outcomes through the design-context gate answers (Step 1), explicit theme requests, or by providing Studied-DNA from a previous hallmark study command. Direct modification of the pipeline steps requires forking the repository and editing the skill definition.

What happens if the slop-test fails during the design flow?

Hallmark automatically enters a revision loop, regenerating the affected code sections until all 58 gates in references/slop-test.md pass. This ensures no "AI slop" reaches production without explicit human intervention to override the quality gates.

How does Hallmark prevent generating the same page twice?

The project memory system in .hallmark/log.json tracks recent macrostructures, themes, and enrichments. Step 2.5 enforces diversification by requiring new outputs to differ from the log on at least one axis, ensuring consecutive runs produce visually distinct pages.

Why is the Specimen macrostructure banned by default?

The Specimen macrostructure is reserved for explicit opt-in only, as per the diversification rules in SKILL.md. This prevents overuse of common portfolio-style layouts and encourages architectural variety across generated pages, aligning with Hallmark's anti-AI-slop philosophy.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}