Editorial Magazine

Systems Folio — Design-Research Feature

A two-pane design-research spread modeled on IDEO journal aesthetics: a hairline-framed system diagram anchors the left half while a 24pt italic pull quote with em-dash attribution anchors the right. Pale paper stock, charcoal body type, and a single tomato-red accent reserved exclusively for the diagram keep the page arguing, not decorating.

This template exists for the researcher who needs the layout to carry an argument, not perform one. It refuses decorative fills, photographic texture, and typographic novelty — the hairline frame around the diagram is the only structural ornament permitted. The single accent color belongs to the diagram alone, so the reader's eye is trained to read system before sentiment. It is made for internal essays, process retrospectives, and the kind of journal spread that gets pinned above a studio whiteboard.

Palette — Bauhaus Primary

Prompt — Preview 1

You are designing a single presentation slide.

CATEGORY: Editorial Magazine
TEMPLATE: Systems Folio — Design-Research Feature
DESCRIPTION: A two-pane design-research spread modeled on IDEO journal aesthetics: a hairline-framed system diagram anchors the left half while a 24pt italic pull quote with em-dash attribution anchors the right. Pale paper stock, charcoal body type, and a single tomato-red accent reserved exclusively for the diagram keep the page arguing, not decorating.

DESIGN PHILOSOPHY:
This template exists for the researcher who needs the layout to carry an argument, not perform one. It refuses decorative fills, photographic texture, and typographic novelty — the hairline frame around the diagram is the only structural ornament permitted. The single accent color belongs to the diagram alone, so the reader's eye is trained to read system before sentiment. It is made for internal essays, process retrospectives, and the kind of journal spread that gets pinned above a studio whiteboard.

DESIGN INTENT FOR THIS SLIDE:
The slide opens like the recto of a printed design-research folio — restrained, deliberate, slightly austere. The left zone is structured silence: a precise hairline rectangle with generous interior breathing room signals 'diagram lives here' without filling it decoratively. The right zone carries the argument — title stacked tightly above a thin horizontal rule, subtitle set smaller beneath, and an attribution or studio name anchoring the lower third. The single accent color appears only as the hairline frame stroke, training the eye to read structure before sentiment. Avoid centered symmetry, gradient washes, photographic overlays, and any decorative fill that would make the slide perform rather than argue.

PALETTE — "Bauhaus Primary":
- Primary (background or dominant): #f4f1ea
- Secondary (text or supporting): #1a1a1a
- Accent (emphasis, rules, callouts): #d83a2f
- Neutral (muted text, borders): #3a4d8a

LAYOUT:
12-column grid with a strict two-pane split: cols 1–5 hold a hairline-bordered rectangular zone acting as the system-diagram placeholder, left-bled to the 7% outer margin; cols 6–12 carry the deck title (stacked over a thin rule), subtitle, and a researcher or studio credit line flush-left at mid-height. No header band; a folio slug and date sit bottom-right in cols 11–12. The hairline frame on the left is the sole structural ornament — everything else is text on pale ground.

CONTENT TO PLACE:
[Replace this with your slide content: title, bullet points, stats, image descriptions, etc. If left empty, ASK the user what content they want before drawing.]

OUTPUT: Describe the slide visually in detail, then provide HTML/CSS or SVG code that renders it at 1920x1080.

Open in:Claude ChatGPT Gemini

Good for

· Design research retrospectives and methodology essays
· 3-line italic pull quotes with named researcher attribution
· System-diagram explainers paired with dense analytical prose
· Internal studio journals and design-sprint post-mortems

Avoid for

· Chart-heavy quarterly financial reviews
· Customer-facing sales or product marketing decks
· Photography-led editorial spreads requiring full-bleed imagery
· Large-room presentations where hairline rules and 24pt type lose legibility

More in Editorial Magazine

Bone Folio — Drift-Style Serif Opener

A type-only opener in the lineage of The Drift and n+1: a long titular phrase in transitional serif anchored asymmetrically to the upper-left, paired with a hairline Roman numeral in the opposing corner. No imagery, no colour blocks — the page is the entire argument.

Editorial Magazine

Candid Rooms — Apartamento Home Tour Opener

A full-bleed candid interior photograph carries the entire canvas while all type pools quietly at the lower quarter: an italic serif caption, a bullet-separated issue-and-city tag in 9pt small caps, and the homeowner's name as a near-invisible typographic inset. Nothing here is staged for the camera.

Editorial Magazine

Eye on the Page — Asymmetric Editorial Spread

A bold, asymmetric opening spread that borrows its authority from print editorial — one hero image commands the canvas while an oversized display serif headline crashes into its edge, letting a designer or photographer's taste announce itself before the work even loads.

Editorial Magazine

Systems Folio — Design-Research Feature

Palette — Bauhaus Primary

Prompt — Preview 1

Good for

Avoid for

Tags

More in Editorial Magazine

Bone Folio — Drift-Style Serif Opener

Candid Rooms — Apartamento Home Tour Opener

Eye on the Page — Asymmetric Editorial Spread