agentleFS
wpgauravwpgaurav/WordPress-skills/skills/design/cinematic-editorial-graphics/SKILL.md

cinematic-editorial-graphics

Skill19 starsChanged 22 days agoMITView on GitHub

Create cinematic editorial hero images with photorealistic subjects, dramatic typography, and magazine-quality composition. Use for blog hero images, announcement graphics, feature stories, newsletter headers, and social media covers. Optimized prompts for Gemini and ChatGPT/DALL-E image generation.

The file

We split this skill into the rules it gives an agent

7 rules. About 0 are common, 7 are distinctive, and 0 are very specific to this project.

  • ≈0

    Common · estimate

    Many files like this have a rule of this kind.

  • ≈7

    Distinctive · estimate

    This author's own choices. Worth a look.

  • 0

    Very specific

    Tied to their project's names, files or tools. Probably skip.

  • Common
  • Distinctive
  • Very specific
  1. Distinctive:

    Create dramatic, magazine-quality hero images combining photorealistic subjects with elegant editorial typography.

    line 9
  2. Distinctive:

    Rule of thirds: Place text in top or bottom third

    line 239
  3. Distinctive:

    Contrast: Ensure text area has sufficient contrast (dark bg = light text)

    line 240
  4. Distinctive:

    Breathing room: Don't crowd text against image edges

    line 241
  5. Distinctive:

    Use Figma, Photoshop, or Canva

    line 329
  6. Distinctive:

    Consider subtle text shadow for readability

    line 332
  7. Distinctive:

    No clear focal point

    line 368

≈ “Common” is an estimate: at least 1 in 5 of the 350,495 skill files we read have a rule of the same kind, not the same words. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.

Keep what fits and drop the rest. Your version, ready for your agents.
Files
SKILL.md

Cinematic Editorial Graphics

Create dramatic, magazine-quality hero images combining photorealistic subjects with elegant editorial typography. Think National Geographic covers, Apple keynote slides, or NYT feature stories.

Key principle: Cinematic drama meets editorial elegance. The image tells a story; the typography frames it.

When to Use

  • Blog post hero images
  • Newsletter feature headers
  • Product announcement graphics
  • Milestone/achievement announcements
  • Event promotion graphics
  • Social media covers (LinkedIn, Twitter)
  • Presentation title slides
  • Annual report covers
  • Case study headers
  • Feature story illustrations

Best for announcements, achievements, and stories that deserve dramatic visual treatment.

Quick Reference

PatternUse CaseKey Elements
Cosmic/SpaceTech announcements, AI milestonesPlanets, stars, nebulae + serif typography
Nature EpicEnvironmental, scale, journeyMountains, oceans, landscapes + minimal text
Product HeroLaunch announcementsProduct floating in dramatic lighting
Abstract TechAI/ML, data, innovationGeometric forms, light trails, particles
Portrait EditorialPeople stories, interviewsDramatic portrait + overlaid text
ArchitecturalBusiness, enterpriseBuildings, structures + clean typography

Visual Style Guidelines

Composition

  • Subject dominant: 60-80% of frame
  • Typography placement: Top third or bottom third (rule of thirds)
  • Negative space: Intentional areas for text
  • Depth: Foreground interest, mid-ground subject, background atmosphere
  • Lighting: Dramatic, directional, cinematic

Typography Style

ElementStyle
HeadlinesSerif (Playfair, Times, Georgia) or elegant sans-serif
CaseTitle case or ALL CAPS for impact
WeightLight to regular (not bold) for elegance
ColorWhite, cream, or subtle color that contrasts with image
AlignmentCentered for symmetry, left-aligned for editorial
SpecialMix serif + italic for emphasis (e.g., "on Mars")

Color Palette

MoodBackgroundAccentsText
CosmicDeep black, navyWarm planet tones, star whitesCream, white
NatureDeep greens, earth tonesGolden hour, misty bluesWhite, cream
TechDark gradientsNeon accents, light trailsWhite, electric blue
CorporateDeep blue, charcoalGold, silver accentsWhite, gold
WarmSunset oranges, redsGolden highlightsWhite, cream

Prompt Templates for AI Image Generation

For Gemini (Google)

Gemini excels at photorealistic imagery with good understanding of composition and lighting.

Base Template

Create a cinematic editorial image:

SUBJECT: [Detailed description of main subject]
COMPOSITION: [Framing, rule of thirds, where subject sits]
LIGHTING: [Dramatic, golden hour, rim light, etc.]
MOOD: [Atmospheric, epic, contemplative, etc.]
STYLE: National Geographic cover quality, 8K resolution
SPACE FOR TEXT: Leave [top/bottom] third relatively clean for typography overlay

Technical: Photorealistic, shallow depth of field where appropriate, cinematic color grading

Space/Cosmic Template (like the Mars example)

Create a cinematic space photograph:

SUBJECT: [Planet/celestial body] shown in stunning detail with visible surface features - craters, valleys, atmospheric layers
COMPOSITION: Planet positioned [center-right/center-left], filling approximately 70% of frame
BACKGROUND: Pure black space, minimal stars to keep focus on subject
LIGHTING: Dramatic side lighting creating a visible terminator line (day/night boundary)
QUALITY: NASA/ESA quality photograph, 8K resolution, photorealistic
SPACE FOR TEXT: Clean black space at top and bottom for editorial typography

The image should feel like a National Geographic or NASA official photograph - awe-inspiring and scientifically accurate.

Nature Epic Template

Create a dramatic landscape photograph:

SUBJECT: [Mountain range/ocean/forest] at [time of day]
SCALE: Include [small human figure/vehicle/structure] for scale reference
COMPOSITION: [Leading lines/rule of thirds/symmetry]
ATMOSPHERE: [Mist/fog/clouds/rain] adding depth and drama
LIGHTING: [Golden hour/blue hour/storm light/dramatic shadows]
QUALITY: National Geographic cover quality, ultra high resolution
SPACE FOR TEXT: [Top/bottom] of frame has atmospheric negative space for typography

Style: Epic, cinematic, awe-inspiring

Product Hero Template

Create a dramatic product photograph:

SUBJECT: [Product description] floating/positioned against [background]
LIGHTING: Dramatic studio lighting with [rim light/soft box/spot]
BACKGROUND: [Gradient/solid/subtle texture] in [color]
SHADOWS: [Soft/dramatic/none]
REFLECTIONS: [Subtle surface reflection if appropriate]
QUALITY: Apple-quality product photography, 8K
SPACE FOR TEXT: Clean area at [top/bottom] for headline

Style: Premium, minimal, sophisticated

For ChatGPT (DALL-E 3)

DALL-E 3 excels at following detailed instructions and integrating text (though text overlay is usually better done separately).

Base Template

Cinematic editorial photograph in the style of a National Geographic cover or Apple keynote slide.

Subject: [Detailed description]

Composition details:
- [Subject] positioned using rule of thirds
- Dramatic [lighting type] creating depth and dimension
- [Atmospheric element] adding mood
- Clean negative space in the [top/bottom] third for text overlay

Visual style:
- Photorealistic, ultra high resolution
- Cinematic color grading
- Professional photography quality
- Magazine cover worthy

Do NOT include any text in the image.

Space/Cosmic Template (Mars example style)

Photorealistic image of [planet/celestial body] against the void of space.

The [planet] dominates the frame, positioned slightly [right/left] of center, showing incredible surface detail - [specific features like craters, canyons, ice caps, storms].

Lighting: Dramatic sunlight from the [left/right] creating a sharp terminator line between the illuminated surface and shadow. The lit portion shows [color] tones with visible [terrain features].

Background: Pure black void of space. Minimal to no visible stars to maintain focus on the planet.

Quality: NASA/Hubble telescope quality photograph, hyper-realistic, scientifically accurate proportions.

Composition: Leave clean black space at the top and bottom of the frame for editorial text overlay.

Style: Awe-inspiring, epic scale, documentary photography.

Do NOT include any text, labels, or watermarks.

Abstract Tech Template

Abstract technological visualization representing [concept: AI, data, neural networks, etc.].

Visual elements:
- [Geometric forms/particle systems/light trails/network nodes]
- [Color palette: deep blues, electric accents, etc.]
- Sense of depth and dimension
- Dynamic movement suggested through [blur/trails/patterns]

Composition:
- Central focal point with radiating elements
- Dark background ([color]) with luminous elements
- Clean areas at [top/bottom] for text overlay

Style: Futuristic, sophisticated, premium tech aesthetic
Quality: 8K resolution, ultra sharp details

Do NOT include any text.

Typography Guidelines (for overlay)

Since AI-generated images shouldn't include text (it often renders poorly), add typography as a post-processing step.

Recommended Fonts

StylePrimaryAlternative
Heading SansGTReallySans, Really Sans Largesystem-ui, sans-serif
Body SansInterVar, Really Sans Small, Intersystem-ui, sans-serif (use letter-spacing: -0.018em)
Editorial SerifPlayfair DisplayEB Garamond, Cormorant
Modern SerifFreight DisplayTiempos, Domaine
Statement SansBebas NeueOswald, Anton

Typography Hierarchy

HEADLINE                          (Serif, light/regular, large)
Subheadline or descriptor         (Sans or serif italic, smaller)

Example from Mars image:

FOUR HUNDRED
METERS on MARS                    (Serif, caps + italic accent)

The first AI-planned drive        (Serif italic, smaller, bottom)
on another planet.

Text Placement Rules

  1. Rule of thirds: Place text in top or bottom third
  2. Contrast: Ensure text area has sufficient contrast (dark bg = light text)
  3. Breathing room: Don't crowd text against image edges
  4. Hierarchy: One dominant headline, one supporting line max
  5. Alignment: Match the formality of the image (centered = formal, left = editorial)

Example Prompts

Mars/Space Announcement (like the example)

For Gemini:
Create a photorealistic image of Mars as seen from space. The planet should fill approximately 70% of the frame, positioned center-right. Show the planet in stunning detail with Valles Marineris (the great canyon system) clearly visible, along with various craters and the reddish-orange surface coloring.

Lighting comes from the left side, creating a dramatic terminator line between day and night sides. The illuminated portion shows warm rust and ochre tones.

Background is pure black space with no visible stars to maintain focus on Mars.

Quality should match NASA/ESA official photographs - scientifically accurate, hyper-realistic, 8K resolution.

Leave clean black space at the top (for headline) and bottom (for subhead) of the frame for editorial text overlay.

Do not include any text in the image.

Product Launch

For ChatGPT/DALL-E:
Photorealistic product photograph of a sleek wireless earbuds case floating against a gradient background that transitions from deep navy blue at top to black at bottom.

The case is positioned in the center-lower portion of the frame, with one earbud floating slightly above it at an angle, as if it just lifted out.

Dramatic rim lighting creates a subtle glow around the edges of the products. A soft reflection appears on the surface below.

The overall mood is premium, minimal, and sophisticated - like an Apple product announcement.

Clean gradient space at the top third for headline text overlay.

8K resolution, ultra sharp product details, studio quality lighting.

Do not include any text or brand logos.

AI/Tech Milestone

For Gemini:
Create an abstract visualization representing artificial intelligence and neural networks.

Central composition shows an intricate network of interconnected luminous nodes and pathways, forming a brain-like or constellation-like structure. The nodes glow with soft blue and white light, with occasional warm accent nodes in gold.

The background is a deep gradient from dark purple-blue at edges to near-black at center, creating depth.

Subtle particle effects and light trails suggest data flowing through the network.

The overall mood is futuristic, sophisticated, and awe-inspiring - representing the frontier of AI capability.

Leave clean dark space at top and bottom for editorial text overlay.

8K resolution, ultra detailed, cinematic lighting.

No text in the image.

Environmental/Nature Story

For ChatGPT/DALL-E:
Cinematic landscape photograph of a massive glacier meeting the ocean.

Dramatic composition showing towering blue-white ice cliffs with a tiny expedition boat in the foreground for scale. The ice has incredible texture and depth, with varying shades of blue, white, and hints of ancient compressed ice.

Moody overcast sky with dramatic storm clouds, but a break in the clouds allows a shaft of golden light to illuminate part of the glacier.

Misty atmosphere adds depth and mystery. The ocean surface is calm with small ice fragments floating.

National Geographic cover quality, epic scale, environmental documentary style.

Clean sky area at top for headline, clean water/ice area at bottom for subhead.

No text, labels, or watermarks.

Post-Processing Workflow

  1. Generate base image using prompts above
  2. Review composition - does it have space for text?
  3. Color grade if needed - enhance contrast, mood
  4. Add typography overlay:
    • Use Figma, Photoshop, or Canva
    • Apply fonts per guidelines above
    • Ensure sufficient contrast
    • Consider subtle text shadow for readability
  5. Export at appropriate size for platform

Recommended Export Sizes

PlatformSizeAspect
Blog hero1920x108016:9
OG image1200x630~1.9:1
Twitter1600x90016:9
LinkedIn1200x627~1.9:1
Newsletter1200x6002:1
Presentation1920x108016:9
Instagram1080x10801:1
Pinterest1000x15002:3

Quality Checklist

Before finalizing:

  • Subject is dramatically lit and composed
  • Image has clear negative space for text
  • Color palette supports the mood
  • Resolution is sufficient for intended use
  • No AI artifacts or distortions
  • Typography is elegant and readable
  • Text contrast is sufficient
  • Overall composition is balanced
  • Image tells a story even without text

Red flags to regenerate:

  • Awkward AI-generated text in image
  • Distorted proportions or anatomy
  • Muddy or flat lighting
  • No clear focal point
  • Text areas have too much visual noise
  • Scientific inaccuracies (for space/nature)

Platform-Specific Notes

Gemini Strengths

  • Excellent photorealism
  • Good at scientific accuracy
  • Strong understanding of lighting terms
  • Follows composition instructions well

ChatGPT/DALL-E 3 Strengths

  • Very good at following detailed prompts
  • Excellent at mood and atmosphere
  • Strong product photography capability
  • Good at abstract/conceptual imagery

Tips for Both

  • Be specific about what you DON'T want (no text, no watermarks)
  • Describe lighting in detail
  • Specify where negative space should be
  • Reference real-world photography styles
  • Request specific resolution/quality
  • Iterate with refinements if first generation isn't right

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

No reviews yet

People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.

  • It worked
  • Partly
  • It didn't
What did you use it for? e.g. Reviewing pull requests in a Rails app

Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.