Files
agent-skills/skills/hallmark/references/macrostructures/15-split-studio.md
T
MalinandClaude Sonnet 5 65c01ddb43 feat: add hallmark design skill
Anti-AI-slop design skill (greenfield pages, audits, redesigns, design
extraction from URLs/screenshots) -- installed and validated in an
earlier session, was sitting untracked. Full reference library:
components, macrostructures, themes, genres, verbs (audit/redesign).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-08-15 14:29:38 +02:00

1.3 KiB

15 · Split Studio

Diptych. Every major content block divides the screen — text on one side, proof on the other. The pairing alternates direction down the page.

  • Heading: half-screen wide; the other half holds a screenshot or a quote.
  • Body: alternating left-text/right-image and right-text/left-image modules.
  • Divider: a clear gutter between halves; no rules.
  • Button: outlined chip below the text half.
  • Image: anchored to the opposite half from the text in each row.
  • Reveal: opposite halves cross-fade in slightly staggered.

Reach for it for SaaS feature pages, dev tools that pair explanation with code, anything where every claim wants a visual proof.

Avoid for narrative or photographic brands. Split halves the attention; some pages need single focus.

Reference: Vercel feature pages, Stripe Sessions program pages, many dev-tool homepages.

Sample opening lines (imitate the specificity — Split Studio openings pair a positioning statement with a proof column):

"A studio for what's next." — italic display + selected-work column on the right "Print discipline, on screen." — Hallmark Newsprint — two-phrase headline, masthead-style "We design and build distinctive products for ambitious teams." — names the verb (design and build), names the audience