Marp Slides¶
Generate presentation slides from PRD documents using Marp.
Overview¶
The slides package converts PRD documents into Marp-compatible markdown that can be rendered as presentation slides. Three renderers are available:
| Renderer | Description | Use Case |
|---|---|---|
PRDRenderer | Basic PRD slides | Standard PRD presentations |
PRDGoalsRenderer | PRD with expanded goals | PRDs with V2MOM/OKR alignment |
OKRRenderer | Standalone OKR slides | Goal-focused presentations |
Quick Start¶
PRD Slides¶
import (
"github.com/grokify/structured-plan/prd"
"github.com/grokify/structured-plan/prd/render"
"github.com/grokify/structured-plan/prd/render/marp"
)
// Load PRD
doc, _ := prd.Load("my-prd.json")
// Create renderer
renderer := marp.NewPRDRenderer()
// Generate slides
slides, err := renderer.Render(doc, nil)
if err != nil {
log.Fatal(err)
}
// Write to file
os.WriteFile("presentation.md", slides, 0600)
PRD with Goals Alignment¶
// Create PRD+Goals renderer
renderer := marp.NewPRDGoalsRenderer()
// Generate slides with V2MOM and OKR sections
slides, err := renderer.Render(doc, nil)
OKR Slides (from structured-goals)¶
import (
"github.com/grokify/structured-goals/okr"
"github.com/grokify/structured-goals/okr/render"
okrmarp "github.com/grokify/structured-goals/okr/render/marp"
)
// Load OKR
doc, _ := okr.ReadFile("okr.json")
// Create renderer
renderer := okrmarp.New()
// Generate slides
slides, _ := renderer.Render(doc, nil)
Render Options¶
PRD Options¶
opts := &render.Options{
Theme: "corporate", // "default", "corporate", "minimal"
IncludeGoals: true, // Include goals alignment section
IncludeRoadmap: true, // Include roadmap slide
IncludeRisks: true, // Include risks slide
IncludeRequirements: true, // Include requirements slide
MaxPersonas: 5, // Limit personas shown
MaxRequirements: 10, // Limit requirements shown
}
slides, _ := renderer.Render(doc, opts)
OKR Options¶
import okrrender "github.com/grokify/structured-goals/okr/render"
opts := &okrrender.Options{
Theme: "default", // "default", "corporate", "minimal"
IncludeRisks: true, // Include risks slide
IncludeStatus: true, // Show status indicators
ShowScoreGrades: true, // Show letter grades (A, B, C)
ShowProgressBars: true, // Show visual progress bars
MaxObjectives: 0, // Limit objectives (0 = all)
MaxKeyResults: 0, // Limit KRs per objective
}
Themes¶
Three built-in themes are available:
Default¶
- Primary: Indigo (#4c51bf / #5a67d8)
- Best for: General presentations
Corporate¶
- Primary: Navy blue (#1a365d)
- Best for: Executive presentations
Minimal¶
- Primary: Dark gray (#2d3748)
- Best for: Developer presentations
Slide Structure¶
PRD Slides¶
- Title Slide - PRD title, author, version, status
- Problem Slide - Problem statement and impact
- Solution Slide - Proposed solution and outcomes
- Personas Slide - Target users and their pain points
- Objectives Slide - Business and product objectives
- Metrics Slide - Success metrics with targets
- Requirements Slide - Key functional/non-functional requirements
- Roadmap Slide - Implementation phases
- Risks Slide - Risk assessment and mitigations
- Goals Slide - V2MOM/OKR alignment (if present)
- Summary Slide - Key takeaways
PRD+Goals Slides (Additional)¶
- Agenda Slide - Overview of presentation sections
- V2MOM Vision Slide - Vision and values
- V2MOM Methods Slide - Methods and obstacles
- OKR Overview Slide - Objectives summary
- OKR Key Results Slide - All key results
- Alignment Summary Slide - How PRD maps to goals
OKR Slides¶
- Title Slide - OKR name, owner, period
- Overview Slide - Theme and overall progress
- Objective Slides - One per objective with KRs
- Key Results Summary - All KRs in table format
- Risks Slide - Challenges and mitigations
- Summary Slide - Final overview
Converting to PDF/PPTX¶
The generated markdown can be converted using Marp CLI:
# Install Marp CLI
npm install -g @marp-team/marp-cli
# Convert to PDF
marp presentation.md -o presentation.pdf
# Convert to PowerPoint
marp presentation.md -o presentation.pptx
# Convert to HTML
marp presentation.md -o presentation.html
Custom CSS¶
Add custom styling via the CustomCSS option:
opts := &render.Options{
CustomCSS: `
section {
background-color: #f0f0f0;
}
h1 {
color: #2563eb;
}
`,
}
Example: Complete Workflow¶
package main
import (
"log"
"os"
"github.com/grokify/structured-plan/prd"
"github.com/grokify/structured-plan/prd/render"
"github.com/grokify/structured-plan/prd/render/marp"
)
func main() {
// Load PRD
doc, err := prd.Load("customer-portal.prd.json")
if err != nil {
log.Fatal(err)
}
// Configure rendering
opts := &render.Options{
Theme: "corporate",
IncludeGoals: true,
IncludeRoadmap: true,
IncludeRisks: true,
IncludeRequirements: true,
}
// Choose renderer based on content
var slides []byte
if doc.Goals != nil && (doc.Goals.V2MOM != nil || doc.Goals.OKR != nil) {
// Use PRD+Goals renderer for PRDs with goals
renderer := marp.NewPRDGoalsRenderer()
slides, err = renderer.Render(doc, opts)
} else {
// Use basic PRD renderer
renderer := marp.NewPRDRenderer()
slides, err = renderer.Render(doc, opts)
}
if err != nil {
log.Fatal(err)
}
// Save markdown
if err := os.WriteFile("presentation.md", slides, 0600); err != nil {
log.Fatal(err)
}
log.Println("Slides generated: presentation.md")
log.Println("Convert to PDF: marp presentation.md -o presentation.pdf")
}