3 months ago•

Design a social media post template system that scales across formats without losing identity

Views

9.3K

Copies

3.1K

Likes

1.3K

Comments

Copy rate

34.0%

Prompt

You are a senior design lead who has shipped social systems for [brand_reference]. Design a social media template system for a [brand_type] brand posting across [platforms].

Deliver:

1. **Identity Lock-up Rules** — how the logo, wordmark, and handle appear across formats, with exact safe-area percentages
2. **Grid Primitives** — the 3 underlying grids (single-focus, split, editorial) every post must inherit from
3. **Type Template Patterns** — 5 named patterns (quote, stat, carousel-cover, product-launch, recap) with anatomy diagrams in words
4. **Color Mode Logic** — when a post uses the light, dark, or accent mode, with a decision tree
5. **Image Treatment Rules** — crop behavior, overlay rules, photo vs illustration policy
6. **Motion Hooks** — which templates animate on export and how (looping GIF, 3-second MP4, static)
7. **File Export Matrix** — size and format per platform, with a quick-reference table
8. **Governance** — who can deviate, what requires approval, how exceptions are logged

Tone: practical, opinionated, built for a 2-person design team to enforce without constant back-and-forth.

Customise this prompt

Fill in 3 variables to personalise this prompt

Brand Reference

Brand Type

Platforms

Preview

You are a senior design lead who has shipped social systems for [brand_reference]. Design a social media template system for a [brand_type] brand posting across [platforms]. Deliver: 1. **Identity Lock-up Rules** — how the logo, wordmark, and handle appear across formats, with exact safe-area percentages 2. **Grid Primitives** — the 3 underlying grids (single-focus, split, editorial) every post must inherit from 3. **Type Template Patterns** — 5 named patterns (quote, stat, carousel-cover, product-launch, recap) with anatomy diagrams in words 4. **Color Mode Logic** — when a post uses the light, dark, or accent mode, with a decision tree 5. **Image Treatment Rules** — crop behavior, overlay rules, photo vs illustration policy 6. **Motion Hooks** — which templates animate on export and how (looping GIF, 3-second MP4, static) 7. **File Export Matrix** — size and format per platform, with a quick-reference table 8. **Governance** — who can deviate, what requires approval, how exceptions are logged Tone: practical, opinionated, built for a 2-person design team to enforce without constant back-and-forth.

Example output

# Social Template System — Fieldnote Studio ## Identity Lock-up Rules The wordmark lives in a consistent anchor zone across every format: top-left on square and portrait, bottom-left on landscape and 9:16 story. Safe area: the wordmark never enters the outer 6% margin on any edge, and the handle (@fieldnote.studio) always appears in the opposite diagonal corner, half the wordmark size, same color. No decorative lockups. No stacked versions. If the post has a campaign tag, it sits in the third corner in sans-serif caps at 10pt equivalent. ## Grid Primitives Every Fieldnote post inherits from exactly one of three grids. 1. **Single-focus** — one dominant element centered on a 12-column grid, with the remaining space doing the work of silence. Used for quotes, product hero shots, announcements. 2. **Split** — a 60/40 vertical or horizontal division: image on one side, text on the other. Used for articles, interviews, features. 3. **Editorial** — a 2-column text-heavy grid with a baseline grid of 8px, used for carousel interiors and long captions rendered as images. ## Type Template Patterns - **Quote:** large serif at 56-72pt centered, attribution at 14pt sans in light gray beneath, pulled back by 20% in weight. - **Stat:** oversized numeral (120-180pt) in accent color, one-line descriptor in 18pt sans below, optional source line in 11pt at bottom. - **Carousel-cover:** ghosted page number in outlined numeral top-right, title in medium serif, 3-word teaser in italic, arrow glyph bottom-right hinting at swipe. - **Product-launch:** product photography taking 70% of frame, one-word descriptor in caps along bottom edge, launch date in small monospace top-right. - **Recap:** numbered vertical list in sans-serif with alternating row shading at 4% opacity, used for "the week in" and roundup posts. ## Color Mode Logic - Default: light mode (bone #F4EFE7 background, ink #1B1E1C text). - Dark mode: used only for quotes, stats, and end-of-year recaps (deep moss #1F2A26 background, bone text). - Accent mode: single campaign posts only, requires creative lead sign-off. Accent is always the current season's assigned color, never stacked. Decision tree: Is it a campaign moment? Accent. Is it emotional/reflective content? Dark. Everything else? Light. ## Image Treatment Rules Photography is always warm-toned, grain preserved at original capture, never over-sharpened. Illustrations must be single-line or limited-palette (max 3 colors). No stock photography ever. Crops must respect the subject's breathing room: minimum 8% headroom on portraits, minimum 12% on products. Overlays are permitted only as a 0-to-30% gradient wash from bottom, never a full-frame darken. ## Motion Hooks Carousel-covers animate on export as a 3-second MP4 with a subtle 2% scale pulse on the title. Stat posts loop a 1.2-second counting-up GIF on the numeral. Quote and recap templates remain static. No more than one motion element per post. ## File Export Matrix | Platform | Format | Dimensions | File | |---|---|---|---| | Instagram Feed | Square | 1080x1080 | JPG 85% | | Instagram Portrait | Portrait | 1080x1350 | JPG 85% | | Instagram Story/Reel | 9:16 | 1080x1920 | MP4 or JPG | | LinkedIn | Landscape | 1200x627 | PNG | | Twitter/X | Landscape | 1600x900 | PNG | | Pinterest | Tall | 1000x1500 | PNG | ## Governance The creative lead owns the system. Designers may deviate within the grid primitives without approval. Any new typographic pattern, color mode exception, or motion treatment requires a single written Slack thread with before/after mockups and creative lead sign-off. All exceptions are logged in a quarterly "variance review" so patterns that keep reappearing get promoted into the system — or retired from it.

Prompt

Customise this prompt

Example output

Related prompts