PPTX Research Posters (HTML-Based)

Overview

⚠️ USE THIS SKILL ONLY WHEN USER EXPLICITLY REQUESTS PPTX/POWERPOINT POSTER FORMAT.

For standard research posters, use the latex-posters skill instead, which provides better typographic control and is the default for academic conferences.

This skill creates research posters using HTML/CSS, which can then be exported to PDF or converted to PowerPoint format. The web-based approach offers:

Modern, responsive layouts
Easy integration of AI-generated visuals
Quick iteration and preview in browser
Export to PDF via browser print function
Conversion to PPTX if specifically needed

When to Use This Skill

ONLY use this skill when:

User explicitly requests "PPTX poster", "PowerPoint poster", or "PPT poster"
User specifically asks for HTML-based poster
User needs to edit poster in PowerPoint after creation
LaTeX is not available or user requests non-LaTeX solution

DO NOT use this skill when:

User asks for a "poster" without specifying format → Use latex-posters
User asks for "research poster" or "conference poster" → Use latex-posters
User mentions LaTeX, tikzposter, beamerposter, or baposter → Use latex-posters

AI-Powered Visual Element Generation

STANDARD WORKFLOW: Generate ALL major visual elements using AI before creating the HTML poster.

This is the recommended approach for creating visually compelling posters:

Plan all visual elements needed (hero image, intro, methods, results, conclusions)
Generate each element using scientific-schematics or Nano Banana Pro
Assemble generated images in the HTML template
Add text content around the visuals

Target: 60-70% of poster area should be AI-generated visuals, 30-40% text.

CRITICAL: Poster-Size Font Requirements

⚠️ ALL text within AI-generated visualizations MUST be poster-readable.

When generating graphics for posters, you MUST include font size specifications in EVERY prompt. Poster graphics are viewed from 4-6 feet away, so text must be LARGE.

MANDATORY prompt requirements for EVERY poster graphic:

POSTER FORMAT REQUIREMENTS (STRICTLY ENFORCE):

ABSOLUTE MAXIMUM 3-4 elements per graphic (3 is ideal)
ABSOLUTE MAXIMUM 10 words total in the entire graphic
NO complex workflows with 5+ steps (split into 2-3 simple graphics instead)
NO multi-level nested diagrams (flatten to single level)
NO case studies with multiple sub-sections (one key point per case)
ALL text GIANT BOLD (80pt+ for labels, 120pt+ for key numbers)
High contrast ONLY (dark on white OR white on dark, NO gradients with text)
MANDATORY 50% white space minimum (half the graphic should be empty)
Thick lines only (5px+ minimum), large icons (200px+ minimum)
ONE SINGLE MESSAGE per graphic (not 3 related messages)

⚠️ BEFORE GENERATING: Review your prompt and count elements

If your description has 5+ items → STOP. Split into multiple graphics
If your workflow has 5+ stages → STOP. Show only 3-4 high-level steps
If your comparison has 4+ methods → STOP. Show only top 3 or Our vs Best Baseline

Example - WRONG (7-stage workflow):

❌ Creates tiny unreadable text

python scripts/generate_schematic.py "Drug discovery workflow: Stage 1 Target ID, Stage 2 Synthesis, Stage 3 Screening, Stage 4 Lead Opt, Stage 5 Validation, Stage 6 Clinical Trial, Stage 7 FDA Approval with metrics." -o figures/workflow.png

Example - CORRECT (3 mega-stages):

✅ Same content, simplified to readable poster format

python scripts/generate_schematic.py "POSTER FORMAT for A0. ULTRA-SIMPLE 3-box workflow: 'DISCOVER' → 'VALIDATE' → 'APPROVE'. Each word in GIANT bold (120pt+). Thick arrows (10px). 60% white space. ONLY these 3 words. NO substeps. Readable from 12 feet." -o figures/workflow_simple.png

CRITICAL: Preventing Content Overflow

⚠️ POSTERS MUST NOT HAVE TEXT OR CONTENT CUT OFF AT EDGES.

Prevention Rules:

Limit Content Sections (MAXIMUM 5-6 sections):

✅ GOOD - 5 sections with room to breathe:

Title/Header
Introduction/Problem
Methods
Results (1-2 key findings)
Conclusions

❌ BAD - 8+ sections crammed together

Word Count Limits:

Per section: 50-100 words maximum
Total poster: 300-800 words MAXIMUM
If you have more content: Cut it or make a handout

Core Capabilities

HTML/CSS Poster Design

The HTML template (assets/poster_html_template.html ) provides:

Fixed poster dimensions (36×48 inches = 2592×3456 pt)
Professional header with gradient styling
Three-column content layout
Block-based sections with modern styling
Footer with references and contact info

Poster Structure

Standard Layout:

┌─────────────────────────────────────────┐ │ HEADER: Title, Authors, Hero Image │ ├─────────────┬─────────────┬─────────────┤ │ Introduction│ Results │ Discussion │ │ │ │ │ │ Methods │ (charts) │ Conclusions │ │ │ │ │ │ (diagram) │ (data) │ (summary) │ ├─────────────┴─────────────┴─────────────┤ │ FOOTER: References & Contact Info │ └─────────────────────────────────────────┘

Visual Integration

Each section should prominently feature AI-generated visuals:

Hero Image (Header):

Section Graphics:

<div class="block"> <h2 class="block-title">Methods</h2> <div class="block-content"> <img src="figures/workflow.png" class="block-image"> <ul> <li>Brief methodology point</li> </ul> </div> </div>

Generating Visual Elements

Before creating the HTML, generate all visual elements:

Create figures directory

mkdir -p figures

Hero image - SIMPLE, impactful

python scripts/generate_schematic.py "POSTER FORMAT for A0. Hero banner: '[TOPIC]' in HUGE text (120pt+). Dark blue gradient background. ONE iconic visual. Minimal text. Readable from 15 feet." -o figures/hero.png

Introduction visual - ONLY 3 elements

python scripts/generate_schematic.py "POSTER FORMAT for A0. SIMPLE visual with ONLY 3 icons: [icon1] → [icon2] → [icon3]. ONE word labels (80pt+). 50% white space. Readable from 8 feet." -o figures/intro.png

Methods flowchart - ONLY 4 steps

python scripts/generate_schematic.py "POSTER FORMAT for A0. SIMPLE flowchart with ONLY 4 boxes: STEP1 → STEP2 → STEP3 → STEP4. GIANT labels (100pt+). Thick arrows. 50% white space. NO sub-steps." -o figures/workflow.png

Results visualization - ONLY 3 bars

python scripts/generate_schematic.py "POSTER FORMAT for A0. SIMPLE bar chart with ONLY 3 bars: BASELINE (70%), EXISTING (85%), OURS (95%). GIANT percentages ON bars (120pt+). NO axis, NO legend. 50% white space." -o figures/results.png

Conclusions - EXACTLY 3 key findings

python scripts/generate_schematic.py "POSTER FORMAT for A0. EXACTLY 3 cards: '95%' (150pt) 'ACCURACY' (60pt), '2X' (150pt) 'FASTER' (60pt), checkmark 'READY' (60pt). 50% white space. NO other text." -o figures/conclusions.png

Workflow for PPTX Poster Creation

Stage 1: Planning

Confirm PPTX is explicitly requested
Determine poster requirements:
Size: 36×48 inches (most common) or A0
Orientation: Portrait (most common)
Develop content outline:
Identify 1-3 core messages
Plan 3-5 visual elements
Draft minimal text (300-800 words total)

Stage 2: Generate Visual Elements (AI-Powered)

CRITICAL: Generate SIMPLE figures with MINIMAL content.

mkdir -p figures

Generate each element with POSTER FORMAT specifications

(See examples in Section 4 above)

Stage 3: Create HTML Poster

Copy the template:

cp skills/pptx-posters/assets/poster_html_template.html poster.html

Update content:

Replace placeholder title and authors
Insert AI-generated images
Add minimal supporting text
Update references and contact info

Preview in browser:

open poster.html # macOS

or

xdg-open poster.html # Linux

Stage 4: Export to PDF

Browser Print Method:

Open poster.html in Chrome or Firefox
Print (Cmd/Ctrl + P)
Select "Save as PDF"
Set paper size to match poster dimensions
Remove margins
Enable "Background graphics"

Command Line (if Chrome available):

Chrome headless PDF export

google-chrome --headless --print-to-pdf=poster.pdf
--print-to-pdf-no-header
--no-margins
poster.html

Stage 5: Convert to PPTX (If Required)

Option 1: PDF to PPTX conversion

Using LibreOffice

libreoffice --headless --convert-to pptx poster.pdf

Or use online converters for simple cases

Option 2: Direct PPTX creation with python-pptx

from pptx import Presentation from pptx.util import Inches, Pt

prs = Presentation() prs.slide_width = Inches(48) prs.slide_height = Inches(36)

slide = prs.slides.add_slide(prs.slide_layouts[6]) # Blank

Add images from figures/

slide.shapes.add_picture("figures/hero.png", Inches(0), Inches(0), width=Inches(48))

... add other elements

prs.save("poster.pptx")

HTML Template Structure

The provided template (assets/poster_html_template.html ) includes:

CSS Variables for Customization

/* Poster dimensions / body { width: 2592pt; / 36 inches / height: 3456pt; / 48 inches */ }

/* Color scheme - customize these */ .header { background: linear-gradient(135deg, #1a365d 0%, #2b6cb0 50%, #3182ce 100%); }

/* Typography */ .poster-title { font-size: 108pt; } .authors { font-size: 48pt; } .block-title { font-size: 52pt; } .block-content { font-size: 34pt; }

Key Classes

Class Purpose Font Size

.poster-title

Main title 108pt

.authors

Author names 48pt

.affiliations

Institutions 38pt

.block-title

Section headers 52pt

.block-content

Body text 34pt

.key-finding

Highlight box 36pt

Quality Checklist

Step 0: Pre-Generation Review (MANDATORY)

For EACH planned graphic, verify:

Can describe in 3-4 items or less? (NOT 5+)
Is it a simple workflow (3-4 steps, NOT 7+)?
Can describe all text in 10 words or less?
Does it convey ONE message (not multiple)?

Reject these patterns:

❌ "7-stage workflow" → Simplify to "3 mega-stages"
❌ "Multiple case studies" → One case per graphic
❌ "Timeline 2015-2024 annual" → "ONLY 3 key years"
❌ "Compare 6 methods" → "ONLY 2: ours vs best"

Step 2b: Post-Generation Review (MANDATORY)

For EACH generated figure at 25% zoom:

✅ PASS criteria (ALL must be true):

Can read ALL text clearly
Count: 3-4 elements or fewer
White space: 50%+ empty
Understand in 2 seconds
NOT a complex 5+ stage workflow
NOT multiple nested sections

❌ FAIL criteria (regenerate if ANY true):

Text small/hard to read → Regenerate with "150pt+"
More than 4 elements → Regenerate "ONLY 3 elements"
Less than 50% white space → Regenerate "60% white space"
Complex multi-stage → SPLIT into 2-3 graphics
Multiple cases cramped → SPLIT into separate graphics

After Export

NO content cut off at ANY of the 4 edges (check carefully)
All images display correctly
Colors render as expected
Text readable at 25% scale
Graphics look SIMPLE (not like complex 7-stage workflows)

Common Pitfalls to Avoid

AI-Generated Graphics Mistakes:

❌ Too many elements (10+ items) → Keep to 3-5 max
❌ Text too small → Specify "GIANT (100pt+)" in prompts
❌ No white space → Add "50% white space" to every prompt
❌ Complex flowcharts (8+ steps) → Limit to 4-5 steps

HTML/Export Mistakes:

❌ Content exceeding poster dimensions → Check overflow in browser
❌ Missing background graphics in PDF → Enable in print settings
❌ Wrong paper size in PDF → Match poster dimensions exactly
❌ Low-resolution images → Use 300 DPI minimum

Content Mistakes:

❌ Too much text (over 1000 words) → Cut to 300-800 words
❌ Too many sections (7+) → Consolidate to 5-6
❌ No clear visual hierarchy → Make key findings prominent

Integration with Other Skills

This skill works with:

Scientific Schematics: Generate all poster diagrams and flowcharts
Generate Image / Nano Banana Pro: Create stylized graphics and hero images
LaTeX Posters: DEFAULT skill for poster creation (use this instead unless PPTX explicitly requested)

Template Assets

Available in assets/ directory:

poster_html_template.html : Main HTML poster template (36×48 inches)
poster_quality_checklist.md : Pre-submission validation checklist

References

Available in references/ directory:

poster_content_guide.md : Content organization and writing guidelines
poster_design_principles.md : Typography, color theory, and visual hierarchy
poster_layout_design.md : Layout principles and grid systems

pptx-posters

Safety Notice

Copy this and send it to your AI assistant to learn