BAM
Guide · BAM + Claude Code

Claude is brilliant... until it makes your project bland.
BAM keeps the intent. Claude materializes it.

Generative tools like Claude Design and Claude Code can produce convincing screens. What they cannot do spontaneously is hold the intent that connects the first screen to the last. This guide tells a real case: a web experience designed as a visit, not as a website with sections, where BAM built the intent upstream and passed it on to the production tools.

BAM guide · Real case, adapted from Lydie Catalano's Medium article · 7 min.

Create my marketing system Browse the finished experience (in French) opens in a new tab

Generative tools normalize, by nature

The mechanism of generative tools is almost always the same: one interaction = one answer. Without persistent context, the model optimizes for the most probable, and it normalizes: menu at the top, smooth scroll, "Home / About / Contact" sections. In many projects that is fine. But when the goal is not to be standard, every new generation pulls the project toward the generic.

And it gets worse with several people involved: contradictory versions of the intent, UI rules that change with each generated screen, an art direction that dilutes because every prompt re-explains the world. The familiar result: the more you generate, the more you rework. And often, you rework to get back to what you had decided in the first place.

The real lever is not writing better prompts, nor stacking instructions at every generation. It is having a system that prevents what is singular from becoming generic again.

The method in three steps

In this project, BAM did not "make mockups". It served three very concrete purposes, before opening the production tool:

1. Co-build the project memory

Intent, information architecture, interface rules, content models, deliberate exceptions: everything is decided and documented upstream.

2. Connect the decisions to each other

Journey, content, interface rules and visual direction are not separate lists: every decision knows what it serves.

3. Pass on and activate the stance

Claude Design and Claude Code receive a clear direction and materialize it. The human approves every step.

The dividing line

BAM does not replace Claude Design or Claude Code. BAM makes sure Claude does not fall into normality, and follows the project's intent at every step.

Real case: a visit, not a website

The "je suis tous" experience (in French) is organized like an exhibition: rooms numbered 0 to 4, a fixed progress bar at the bottom, a corridor that deliberately sequences the reading, Notes as a permanent panel (label / audioguide logic) and a color code that carries the thesis (red = access to the role, blue = right to opacity). All decisions a generator, left to itself, would have "fixed". Here is what the project memory preserved:

The hall of the "je suis tous" experience: "Entrez dans le cadre" title, three numbered rooms and the fixed progress bar at the bottom
The hall: no classic menu, numbered rooms and the fixed bottom progress. The journey rule, materialized by Claude Code.
The generic reflex
The decision preserved by the BAM memory
Classic top menu, Home / About / Contact sections
Rooms 0 to 4, fixed bottom progress, "Next room" and "Back to the map" banners
Restore smooth scrolling everywhere
A 3-screen corridor with "Previous / Next": deliberate friction, an assumed and documented anti-pattern
Notes as tooltips or pushed to an "About" page
Notes as a persistent panel: a glossary promoted to interface element
The label reduced to a caption under the image
The label as a content model: repurposed line, critical reading, keyboard shortcuts, ethical guarantees displayed at the moment of interpretation
A palette re-harmonized "to look nice"
A stable semantic two-color system: red = access to the role, blue = right to opacity, on every screen

What these five rows have in common: none is a detail to repeat in every prompt. They are stable decisions, documented in the project memory, passed on once and verifiable screen by screen. The full story is in the original Medium article (in French).

The Monstration room: editorial title, introduction text and the blue label "Ici, l'opacité n'est pas un défaut : c'est un droit"
Room 2 and its label: a content model in its own right, not a caption under the image.
Room 1 with the works: numbered sections, label and pieces hung on a dark background
The hanging: works as pieces to contextualize, not a product grid.

Why the human keeps the final say

Even with a source of truth, a model can propose conventional solutions, smooth out a creative exception, fall back on standard web reflexes. The difference is that the rules are no longer "in someone's head" or "in last month's prompt": they are documented, verifiable, reusable and above all open to arbitration.

  • Some imperfections are reading choices. The corridor that breaks scrolling is not an anomaly to fix: it is meaning.
  • Every exception is justified in writing. An assumed, documented anti-pattern will not be "repaired" at the next generation.
  • Validation points are set in advance. What the human must review, arbitrate and confirm is part of the method, not improvisation.

The prompts that bridge the two

The handover from BAM to Claude Code happens through deliverables you ask JOHANNES for. Four prompts to get them, to adapt to your project:

  • "Taking into account the brand's key success factors and our strategy, propose a simple, understandable design system for Claude Code."
  • "Summarize our project memory (intent, journey rules, deliberate exceptions, content models) into a framing document I can hand to Claude Code as is."
  • "Write the charter of our semantic colors: for each color, its meaning and its usage rule, valid on every screen."
  • "Here is a screen generated by Claude, attached. Check it against our project rules: what got normalized?"

The first prompt is the one from the real case: it produced the design system handed to Claude Code. Note the logic shared by all four: you do not ask for a screen, you ask for the document that will frame every screen.

Before generating: the checklist

This method works on any project produced with a generative tool: website, experience, identity, presentation. We condensed it into a checklist to fill in before opening Claude: intent, rules, exceptions, content models, visual language, validation points.

Keep it close: the checklist Intent before generation, in the Academy templates.

Build the memory, then generate.

Create your BAM project: intent, rules and content models first, production second.

Create my marketing system Open the checklist