{
  "id": "atoll-market-atelier",
  "name": "The Atelier",
  "theme": "atoll-market",
  "category": "Marketing",
  "description": "An about page that leads with what the brand refuses to do, laid out as a run of full-bleed images with the refusals set between them in serif.",
  "layout": "Alternating full-bleed images and 48ch serif statements, each statement occupying a different column so the page never settles into a rhythm.",
  "modules": [
    {
      "key": "open",
      "name": "Opening statement",
      "html": "\n<header class=\"os\"><span class=\"k\">The atelier</span><h1>We Make Eighteen<br>Things A Year</h1><p>And then we stop, which is the only part of this that is genuinely difficult.</p></header>"
    },
    {
      "key": "run",
      "name": "Statement run",
      "html": "\n<section class=\"sr\">\n  <figure class=\"f1\"><img src=\"{{ART water}}\" alt=\"{{ARTALT water}}\"></figure>\n  <div class=\"s1\"><h2>No seasons</h2><p>One collection a year, released when it is finished. There is no spring drop and no pre-fall, because those are calendar events rather than design ones and they exist to keep a factory busy.</p></div>\n  <figure class=\"f2\"><img src=\"{{ART fabric}}\" alt=\"{{ARTALT fabric}}\"></figure>\n  <div class=\"s2\"><h2>No sales</h2><p>Pieces are made in the quantity we expect to sell and then they are gone. If something does not sell it goes to the studio shop at the same price and stays there until it does.</p></div>\n  <figure class=\"f3\"><img src=\"{{ART model}}\" alt=\"{{ARTALT model}}\"></figure>\n  <div class=\"s3\"><h2>No third colour</h2><p>Aqua, bone and crimson. Every collection since 2019 has been made from those three, and the constraint has produced more ideas than it has cost us.</p></div>\n</section>"
    },
    {
      "key": "facts",
      "name": "Studio facts",
      "html": "\n<footer class=\"sf\">\n  <div><b class=\"n\">18</b><span class=\"k\">Pieces a year</span></div>\n  <div><b class=\"n\">2019</b><span class=\"k\">Founded</span></div>\n  <div><b class=\"n\">3</b><span class=\"k\">Colours, ever</span></div>\n  <div><b class=\"n\">0</b><span class=\"k\">Sales, ever</span></div>\n</footer>"
    }
  ],
  "moduleCount": 3,
  "reorderable": true,
  "meta": {
    "id": "atoll-market-atelier",
    "model": "Claude Opus 5",
    "author": "Claude Code",
    "createdAt": "2026-09-02T00:13:22+09:00",
    "updatedAt": "2026-09-02T00:13:22+09:00",
    "version": "1.0.0",
    "isNew": false
  },
  "link": "/api/v1/designs/atoll-market-atelier.json",
  "structure": "Alternating full-bleed images and 48ch serif statements, each statement occupying a different column so the page never settles into a rhythm.",
  "html": "<div class=\"dz dz-atoll-market-atelier\" data-design=\"atoll-market-atelier\" data-theme=\"atoll-market\">\n<section class=\"dz-mod\" data-mod=\"open\" aria-label=\"Opening statement\">\n<header class=\"os\"><span class=\"k\">The atelier</span><h1>We Make Eighteen<br>Things A Year</h1><p>And then we stop, which is the only part of this that is genuinely difficult.</p></header></section>\n<section class=\"dz-mod\" data-mod=\"run\" aria-label=\"Statement run\">\n<section class=\"sr\">\n  <figure class=\"f1\"><img src=\"https://designlookbook.dev/assets/img/atoll-market-water.webp\" alt=\"Shallow turquoise water over pale sand\"></figure>\n  <div class=\"s1\"><h2>No seasons</h2><p>One collection a year, released when it is finished. There is no spring drop and no pre-fall, because those are calendar events rather than design ones and they exist to keep a factory busy.</p></div>\n  <figure class=\"f2\"><img src=\"https://designlookbook.dev/assets/img/atoll-market-fabric.webp\" alt=\"Crimson fabric folded against an aqua ground\"></figure>\n  <div class=\"s2\"><h2>No sales</h2><p>Pieces are made in the quantity we expect to sell and then they are gone. If something does not sell it goes to the studio shop at the same price and stays there until it does.</p></div>\n  <figure class=\"f3\"><img src=\"https://designlookbook.dev/assets/img/atoll-market-model.webp\" alt=\"A figure in crimson against a bright aqua backdrop\"></figure>\n  <div class=\"s3\"><h2>No third colour</h2><p>Aqua, bone and crimson. Every collection since 2019 has been made from those three, and the constraint has produced more ideas than it has cost us.</p></div>\n</section></section>\n<section class=\"dz-mod\" data-mod=\"facts\" aria-label=\"Studio facts\">\n<footer class=\"sf\">\n  <div><b class=\"n\">18</b><span class=\"k\">Pieces a year</span></div>\n  <div><b class=\"n\">2019</b><span class=\"k\">Founded</span></div>\n  <div><b class=\"n\">3</b><span class=\"k\">Colours, ever</span></div>\n  <div><b class=\"n\">0</b><span class=\"k\">Sales, ever</span></div>\n</footer></section>\n</div>",
  "css": "\n.dz-atoll-market-atelier { background: var(--background); color: var(--foreground); font-family: var(--pv-body); padding: 30px 0 72px; overflow: hidden; }\n.dz-atoll-market-atelier .k { text-transform: uppercase; letter-spacing: .18em; font-size: 10.5px; font-weight: 600; color: var(--muted-foreground); display: block; }\n.dz-atoll-market-atelier .os { padding: 0 38px; margin-bottom: 72px; }\n.dz-atoll-market-atelier h1 { font-family: var(--pv-display); font-weight: 400; font-size: 72px; line-height: 1.02; margin: 10px 0 16px; letter-spacing: -.02em; }\n.dz-atoll-market-atelier .os p { margin: 0; font-size: 17px; line-height: 1.56; max-width: 44ch; color: var(--muted-foreground); }\n.dz-atoll-market-atelier .sr { display: grid; grid-template-columns: repeat(12, 1fr); gap: 26px; padding: 0 38px; }\n.dz-atoll-market-atelier .sr figure { margin: 0 0 72px; }\n.dz-atoll-market-atelier .sr img { width: 100%; object-fit: cover; display: block; filter: var(--img-filter); box-shadow: 0 20px 50px -22px color-mix(in oklab, var(--foreground) 40%, transparent); }\n.dz-atoll-market-atelier .f1 { grid-column: 1 / span 7; margin-left: -60px; }\n.dz-atoll-market-atelier .f1 img { height: 380px; }\n.dz-atoll-market-atelier .s1 { grid-column: 9 / -1; align-self: center; margin-bottom: 72px; }\n.dz-atoll-market-atelier .f2 { grid-column: 7 / -1; margin-right: -60px; }\n.dz-atoll-market-atelier .f2 img { height: 320px; }\n.dz-atoll-market-atelier .s2 { grid-column: 1 / span 4; align-self: center; margin-bottom: 72px; }\n.dz-atoll-market-atelier .f3 { grid-column: 3 / span 6; }\n.dz-atoll-market-atelier .f3 img { height: 420px; }\n.dz-atoll-market-atelier .s3 { grid-column: 10 / -1; align-self: end; margin-bottom: 72px; }\n.dz-atoll-market-atelier h2 { font-family: var(--pv-display); font-weight: 400; font-size: 30px; margin: 0 0 10px; }\n.dz-atoll-market-atelier .sr p { margin: 0; font-size: 15px; line-height: 1.62; }\n.dz-atoll-market-atelier .sf { display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px; padding: 30px 38px 0; border-top: 1px solid var(--border); margin: 0 38px; }\n.dz-atoll-market-atelier .n { font-family: var(--pv-mono); font-size: 44px; letter-spacing: -.02em; display: block; margin-bottom: 6px; }\n",
  "requiredTheme": "/api/v1/themes/atoll-market.json",
  "googleFontsHref": "https://fonts.googleapis.com/css2?family=Prata:wght@400;500;600;700&family=Instrument+Sans:wght@400;500;600;700&family=Geist+Mono:wght@400;500;600;700&display=swap"
}