PromptMarketing
Find a name with a point of view
Generate naming directions tied to an audience and identity, with a practical shortlist.
✳Claude◎ChatGPT✦Gemini
By Dave AIDave AI original
MIT · FreeView prompt
Installable skillMIT
Content & Creative Super-Skill
Comprehensive creative studio skill merging Perplexity Computer's video production, speech synthesis, image generation, and website building with Claude Code's canvas design, algorithmic art, brand guidelines, frontend design, artifacts builder, content frameworks, content calendar, and prompt en...
instructions.md
---
name: content-creative-super-skill
description: Comprehensive creative studio skill merging Perplexity Computer's video production, speech synthesis, image generation, and website building with Claude Code's canvas design, algorithmic art, brand guidelines, frontend design, artifacts builder, content frameworks, content calendar, and prompt engineering. Use when creating visual content, designing interfaces, building brands, generating videos/images/audio, writing content, planning content calendars, or doing any creative production work.
license: MIT
metadata:
author: get-zeked
version: '1.0'
---
# Content & Creative Super-Skill
A complete creative production manual merging the best of Perplexity Computer's AI-native creative tools with Claude Code's battle-tested design, content, and engineering frameworks. Use this skill whenever any creative, brand, design, content, audio, or video task is on the table.
---
## Table of Contents
1. [Gap Analysis: Perplexity Computer vs Claude Code](#section-1-gap-analysis-table)
2. [Visual Design & Canvas](#section-2-visual-design--canvas)
3. [Brand Identity & Guidelines](#section-3-brand-identity--guidelines)
4. [Frontend Design & Web Artifacts](#section-4-frontend-design--web-artifacts)
5. [Generative Art & Animation](#section-5-generative-art--animation)
6. [Audio & Speech](#section-6-audio--speech)
7. [Content Creation & Copywriting](#section-7-content-creation--copywriting)
8. [Content Calendar & Planning](#section-8-content-calendar--planning)
9. [Prompt Engineering for Creative Work](#section-9-prompt-engineering-for-creative-work)
10. [Unique Perplexity Computer Capabilities](#section-10-unique-perplexity-computer-capabilities)
---
## Section 1: Gap Analysis Table
Understanding what each ecosystem brings — and where the merged super-skill adds new power.
### Capability Comparison Matrix
| Capability | Perplexity Computer | Claude Code | Merged Super-Skill Addition |
|---|---|---|---|
| AI image generation | ✅ nano_banana_2, nano_banana_pro; photorealistic, illustration, artistic; img2img; 1:1, 16:9, 9:16, 4:3, 3:4 | ❌ No native image gen tool | Design-prompt templates optimized for nano_banana models; img2img reference workflows |
| AI video generation | ✅ Sora 2, Sora 2 Pro, Veo 3.1, Veo 3.1 Fast; 4–12 sec clips; landscape/portrait | ❌ No native video gen | Storyboarding framework; frame-chain scripts; clip-stitching pipelines |
| Text-to-speech | ✅ Gemini 2.5 Pro TTS, ElevenLabs TTS v3; multi-speaker JSON dialogue; 99 languages; diarization | ❌ No native TTS | Voice casting guide; podcast production workflow; diarization labeling conventions |
| Audio transcription | ✅ 99 languages, speaker diarization, word/character timestamps | ❌ | Transcription QA checklist; speaker labeling guide |
| Layout-based visual design | ❌ No programmatic canvas | ✅ Canvas Design skill (PNG/PDF via Python/reportlab) | Philosophy-first design workflow; multi-page coffee-table layout pattern |
| Generative/algorithmic art | ❌ | ✅ Algorithmic Art skill (p5.js, seeded randomness, particle systems) | Seeded-art variation explorer; Art Blocks–style collection workflow |
| Animated GIFs | ❌ | ✅ Slack GIF Creator (PIL, easing, validators) | Slack GIF cheat-sheet; animation concept library |
| Website/web app building | ✅ website-building skill (design system, Tailwind, motion, quality standards) | ✅ Frontend Design + Web Artifacts Builder (React, TypeScript, shadcn/ui) | Unified quality checklist; stack-selection decision tree |
| Brand voice framework | ✅ marketing-brand-voice (5 dimensions, tone adaptation, consistency audits) | ✅ Brand Guidelines (Anthropic colors/fonts) + alirezarezvani brand voice (Jung's archetypes) | Combined 12-archetype brand identity system; multi-channel consistency matrix |
| Content frameworks | ❌ | ✅ Content Creator (blog, social, email templates); Content Frameworks (how-to, listicle, case study, thought leadership) | Extended with video scripts, landing page copy, press release frameworks |
| SEO optimization | ❌ | ✅ SEO Optimizer tool (keyword density, heading structure, meta tags) | SEO workflow integrated with Perplexity's live web research for keyword discovery |
| Content calendar | ❌ | ✅ Monthly calendar template + pillar strategy | Extended with platform-timing data and repurposing matrix |
| Prompt engineering | ❌ Prompts inferred from tool parameters | ✅ Prompt Engineer Toolkit (zero-shot → meta-prompting; A/B testing; version control) + Senior Prompt Engineer (RAG, agent orchestration) | Creative-specific prompt templates: image gen, video gen, voiceover, brand copywriting |
| Live web research | ✅ search_web, fetch_url, search_social | ❌ | Content ideation workflow: trend research → brief → content → distribution |
| Social media monitoring | ✅ search_social (X/Twitter operators) | ❌ | Trend-to-content pipeline; competitor content audit protocol |
| 400+ app integrations | ✅ External tool connectors (Gmail, Notion, Slack, CRM, etc.) | ❌ | Content distribution automation; cross-platform publishing workflow |
| Scheduled monitoring | ✅ Scheduled tasks | ❌ | Content performance monitoring cadence |
### What Only Perplexity Computer Can Do (Native Differentiators)
- Generate actual video clips with Sora/Veo models (not storyboards — actual MP4s)
- Generate actual images with nano_banana models (not Python drawings — real AI images)
- Synthesize speech audio (Gemini TTS, ElevenLabs)
- Transcribe audio/video files with speaker diarization
- Deploy live websites accessible via public URL
- Search X/Twitter for real-time creative trends
- Connect to 400+ external services for content distribution
- Schedule recurring content monitoring and reporting
### What Only Claude Code Brings (Complementary Strengths)
- Algorithmic/generative art via p5.js with seeded randomness
- Programmatic canvas design outputting museum-quality PNG/PDF
- Animated GIF production with PIL + easing functions
- Complex multi-component React/TypeScript/shadcn web artifacts
- Deep SEO analysis tooling
- Systematic prompt engineering with regression testing and version control
- RAG evaluation and agent orchestration frameworks
### Merged Additions (New in Super-Skill)
- Unified creative brief template applicable across all output modalities
- Cross-platform content repurposing matrix (1 idea → 10 assets)
- Platform-specific image and video dimension cheat sheet
- Creative direction frameworks (aesthetic movement naming, mood board vocabulary)
- Brand-to-production pipeline: brand identity → content strategy → production → distribution
- Voice casting guide for multi-speaker productions
---
## Section 2: Visual Design & Canvas
**Sources merged:** Canvas Design (anthropics/skills) + generate_image tool (Perplexity Computer) + design principles
### 2.1 Choosing Your Visual Production Method
| Need | Tool | Output |
|---|---|---|
| Museum/poster quality static design | Canvas Design workflow (Python/reportlab/matplotlib) | PNG or PDF |
| AI photorealistic image | generate_image (nano_banana_2) | PNG |
| AI illustration/artistic | generate_image (nano_banana_pro for complex) | PNG |
| Animate from an existing image | generate_image with image_path reference (img2img) | PNG |
| Multi-page design/coffee table book | Canvas Design multi-page workflow | PDF |
| Generative art (interactive, animated) | Algorithmic Art workflow (p5.js) | HTML artifact |
### 2.2 Design Philosophy Creation Workflow
Before producing any visual output, establish a **Visual Philosophy** — an aesthetic movement that guides all creative decisions.
#### Step 1: Name the Movement (1–2 words)
Examples: "Brutalist Joy" / "Chromatic Silence" / "Metabolist Dreams" / "Concrete Poetry" / "Analog Meditation"
#### Step 2: Write the Philosophy Manifesto (4–6 paragraphs)
Address each dimension once, without repetition:
- **Form and space**: How do forms relate to negative space? Monumental or intimate?
- **Color and material**: What palette governs? What textures or material qualities?
- **Scale and rhythm**: What is the relationship of large to small, fast to slow?
- **Composition and balance**: Symmetry, asymmetry, diagonal flow, grid-breaking?
- **Visual hierarchy**: Where does the eye go first, second, last?
**Critical requirement:** Emphasize craftsmanship repeatedly — the final work must look "meticulously crafted," "the product of deep expertise," "painstaking attention," "master-level execution."
#### Step 3: Identify the Conceptual Seed
Extract the subtle, niche reference embedded in the user's request. This is the soul woven invisibly into the art — like a jazz musician quoting another song. Only those who know will catch it; everyone else experiences a masterful composition.
#### Step 4: Execute on Canvas
Rules for canvas execution:
- 90% visual, 10% essential text (text as visual accent, not explanation)
- Nothing overlaps or falls off canvas boundaries — proper margins always
- Typography is design-forward: search `./canvas-fonts` for unique fonts; pair a distinctive display font with a refined body font
- Never use generic fonts (Arial, Inter, Roboto, system fonts)
- Aim for work that looks like it took countless hours by someone at the top of their field
- For refinement passes: make existing elements more cohesive rather than adding new elements
#### Step 5: Refinement Pass
When refining, ask: "How can I make what's already here more of a piece of art?" Avoid adding more shapes or graphics. Instead: tighten spacing, improve color harmony, strengthen typographic choices, deepen compositional balance.
### 2.3 AI Image Generation (Perplexity Computer)
#### Models
- **nano_banana_2** — Default. Photorealistic photos, clean illustrations, decorative graphics. Fast.
- **nano_banana_pro** — Higher quality/detail for complex artistic work.
#### Aspect Ratios
| Ratio | Use Case |
|---|---|
| 1:1 | Social media posts, avatars, thumbnails |
| 16:9 | Blog headers, YouTube thumbnails, presentation slides |
| 9:16 | Instagram Stories, TikTok, vertical social |
| 4:3 | Standard landscape, website banners |
| 3:4 | Standard portrait, Pinterest, editorial |
#### Effective Image Prompt Structure
```
[Style descriptor] [Subject/scene] [Composition notes] [Color palette] [Lighting/mood] [Technical quality notes]
```
**Example — Photorealistic:**
```
Photorealistic professional product photo of a sleek black leather wallet on a marble surface,
centered composition with shallow depth of field, warm amber and cream tones, soft natural
window light from the left, studio-quality with subtle shadow, no text
```
**Example — Illustration:**
```
Flat vector illustration of a mountain landscape at dusk, geometric shapes,
layered silhouettes in deep navy, burnt orange, and dusty rose,
minimal and modern, suitable for app background, no text
```
**Example — Artistic:**
```
Oil painting style portrait of a woman reading in a library,
Renaissance lighting, rich chestnut and gold palette,
painterly brushstrokes, museum-quality composition, moody and contemplative
```
#### img2img Workflow (Reference Images)
When animating or transforming an existing image:
1. Provide up to 10 reference images via `images` parameter
2. Describe the style transfer or edit clearly
3. Specify what to preserve vs. what to change
```
Transform this product photo to match the visual style of the reference images:
muted warm tones, slight grain texture, editorial magazine aesthetic.
Preserve the product placement and composition.
```
### 2.4 Design Principles Quick Reference
#### Color Theory
- **Analogous**: Adjacent on color wheel — harmonious, low contrast (e.g., blue + blue-green + teal)
- **Complementary**: Opposite — high contrast, vibrant tension (e.g., orange + blue)
- **Triadic**: Three evenly spaced — balanced, energetic (e.g., red + yellow + blue)
- **Split-complementary**: One color + two adjacent to its complement — softer than complementary
- **Monochromatic**: One hue, varying saturation/value — sophisticated, cohesive
#### Dominant Color Systems
- Set a **dominant color** (60%), a **secondary color** (30%), and an **accent** (10%)
- Dominant colors with sharp accents outperform timid, evenly-distributed palettes
- Use CSS custom properties / design tokens for consistency across components
#### Typography Pairing Rules
- Pair a distinctive **display font** (headings, large text) with a refined **body font** (readable at small sizes)
- Never use: Inter, Roboto, Arial as primary display fonts
- Strong pairing examples: Playfair Display + Source Serif Pro / Clash Grotesk + Instrument Serif / Bebas Neue + DM Sans
- Weight contrast: bold display vs. regular body creates visual hierarchy without color
#### Composition Principles
- **Rule of thirds**: Place key elements at grid intersections
- **Visual weight**: Larger, darker, and more saturated elements carry more weight
- **Negative space**: Intentional emptiness creates breathing room and focus
- **Alignment**: Every element should align to a grid or another element — never float arbitrarily
- **Hierarchy**: One dominant element, one secondary, everything else subordinate
### 2.5 Creative Brief Template (Visual Projects)
```markdown
## Visual Creative Brief
**Project name:**
**Deliverable format:** [ ] PNG [ ] PDF [ ] HTML [ ] Video [ ] GIF
**Dimensions/aspect ratio:**
**Brand context:** (existing brand OR new brand OR no brand constraints)
**Objective:** What does this piece need to accomplish?
**Target audience:** Who will see it and what should they feel?
**Key message:** The single most important thing to communicate
**Visual direction:**
- Aesthetic movement/philosophy name:
- Mood reference (3 adjectives):
- Color palette constraint (if any):
- Typography constraint (if any):
- Elements to include:
- Elements to avoid:
**Conceptual seed/reference:** (subtle, niche — not literal)
**Delivery deadline:**
**Approval contacts:**
```
---
## Section 3: Brand Identity & Guidelines
**Sources merged:** Brand Guidelines (anthropics/skills) + Brand Voice Framework (alirezarezvani/claude-skills) + marketing-brand-voice (Perplexity Computer built-in skill)
### 3.1 Brand Architecture Overview
A complete brand identity has five layers:
1. **Foundation**: Mission, vision, values, purpose
2. **Personality**: Archetype + tone attributes
3. **Voice System**: Voice dimensions, writing principles, language guidelines
4. **Visual Identity**: Color system, typography, iconography, photography style
5. **Application**: Channel-specific guidelines, consistency audits
### 3.2 Jung's 12 Brand Personality Archetypes
Select one **primary** and one **secondary** archetype. The primary dominates; the secondary adds nuance.
| Archetype | Core Desire | Brand Tone | Content Style | Example Brands |
|---|---|---|---|---|
| **The Innocent** | Safety, happiness | Optimistic, sincere, honest | Simple, wholesome, nostalgic | Dove, Coca-Cola |
| **The Everyman** | Belonging, connection | Friendly, humble, unpretentious | Relatable, inclusive, casual | IKEA, Target |
| **The Hero** | Mastery, courage | Bold, inspiring, competent | Achievement-focused, empowering | Nike, FedEx |
| **The Outlaw** | Liberation, revolution | Edgy, disruptive, provocative | Rule-breaking, anti-establishment | Harley-Davidson, Virgin |
| **The Explorer** | Freedom, discovery | Adventurous, restless, authentic | Journey-focused, expansive | REI, Jeep |
| **The Creator** | Innovation, expression | Imaginative, visionary, original | Craft-focused, detail-oriented | Apple, Adobe |
| **The Ruler** | Control, order, quality | Authoritative, commanding, refined | Premium, exclusive, prestigious | Mercedes-Benz, Rolex |
| **The Magician** | Transformation, wonder | Mystical, visionary, charismatic | Transformation narratives, possibility | Disney, Dyson |
| **The Lover** | Intimacy, pleasure | Passionate, sensual, warm | Desire-driven, emotionally resonant | Chanel, Häagen-Dazs |
| **The Caregiver** | Service, nurturing | Compassionate, patient, supportive | Helping, protective, community | Johnson & Johnson, UNICEF |
| **The Jester** | Enjoyment, humor | Playful, humorous, irreverent | Entertainment-first, self-aware | Old Spice, Dollar Shave Club |
| **The Sage** | Knowledge, truth | Knowledgeable, confident, analytical | Data-driven, educational, authoritative | Google, Harvard |
### 3.3 Brand Voice Framework — 5 Dimensions
For each dimension, place the brand on the spectrum:
#### Dimension 1: Formality
```
Formal ←————————————————→ Casual
| | | |
Legal Professional Conversational Casual
```
- **Formal**: Investor comms, legal docs, crisis responses
- **Professional**: B2B whitepapers, case studies, press releases
- **Conversational**: Blog posts, social media, email newsletters
- **Casual**: Community posts, behind-the-scenes content
#### Dimension 2: Expertise Expression
```
Expert ←————————————————→ Peer
| | | |
Authority Guide Knowledgeable Peer
```
#### Dimension 3: Energy Level
```
High Energy ←————————————→ Calm
| | | |
Energetic Motivating Measured Serene
```
#### Dimension 4: Emotional Warmth
```
Warm ←———————————————————→ Cool
| | | |
Nurturing Friendly Professional Clinical
```
#### Dimension 5: Directness
```
Direct ←—————————————————→ Suggestive
| | | |
Imperative Clear Inviting Narrative
```
### 3.4 Tone Attributes Selection
Choose 3–5 primary tone attributes:
| Attribute | Description | Sample Phrase |
|---|---|---|
| **Authoritative** | Industry expert positioning | "Our research shows that 87% of businesses..." |
| **Friendly** | Approachable and warm | "We get it — this can be overwhelming..." |
| **Innovative** | Forward-thinking, visionary | "The future of X is already here..." |
| **Trustworthy** | Reliable, transparent | "Here's exactly what happened and why..." |
| **Inspiring** | Motivational, uplifting | "You have the power to transform..." |
| **Educational** | Informative, helpful | "Here's how to think about this step by step..." |
| **Witty** | Clever, entertaining (use sparingly) | "Plot twist: the data actually says..." |
| **Empathetic** | Understanding, validating | "We know you've been frustrated by this..." |
### 3.5 Language System
#### Words to Use (by archetype)
- **Action verbs**: Transform, accelerate, optimize, unlock, elevate, pioneer, craft, build, shape
- **Positive descriptors**: Seamless, powerful, intuitive, strategic, intentional, thoughtful
- **Outcome-focused**: Results, growth, impact, clarity, momentum, trust, confidence
#### Words to Avoid (universal)
- **Jargon**: Synergy, leverage (as verb), bandwidth (for availability), circle back, move the needle
- **Overused claims**: Innovative, disruptive, cutting-edge (unless genuinely applicable)
- **Weak qualifiers**: Very, really, just, maybe, hopefully, kind of, sort of
- **Negative framing**: Can't, won't, impossible — replace with challenge, opportunity, working on
### 3.6 Anthropic Brand Color System (Reference)
For outputs that should carry Anthropic brand identity:
| Color Role | Hex | Usage |
|---|---|---|
| Dark (primary text, dark backgrounds) | `#141413` | Headings, primary text, dark mode background |
| Light (light backgrounds, text on dark) | `#faf9f5` | Page backgrounds, text on dark |
| Mid Gray (secondary elements) | `#b0aea5` | Subheadings, captions, metadata |
| Light Gray (subtle backgrounds) | `#e8e6dc` | Cards, dividers, subtle sections |
| Orange (primary accent) | `#d97757` | CTAs, highlights, links |
| Blue (secondary accent) | `#6a9bcc` | Secondary actions, info states |
| Green (tertiary accent) | `#788c5d` | Success states, tags, supporting accents |
**Typography:**
- Headings (24pt+): **Poppins** (Arial fallback)
- Body text: **Lora** (Georgia fallback)
### 3.7 Brand Voice Consistency Audit Checklist
Run this audit before publishing any content:
**Voice Alignment**
- [ ] Matches selected archetype(s) — does it feel like the brand?
- [ ] Tone attributes are present (3–5 you selected)
- [ ] Formality level appropriate for the channel
- [ ] Perspective (we/you/third person) consistent with brand choice
**Language Quality**
- [ ] No jargon or banned words
- [ ] Active voice ≥80% of sentences
- [ ] Benefits emphasized over features
- [ ] "You" appears more than "we"
**Structure**
- [ ] Clear value proposition in first paragraph
- [ ] Appropriate call to action for the piece
- [ ] Mobile-friendly formatting (short paragraphs, scannable)
- [ ] Oxford commas used consistently
**Inclusivity**
- [ ] Gender-neutral language throughout
- [ ] No idioms that don't translate globally
- [ ] Diverse perspectives represented where relevant
- [ ] Accessible formatting (proper heading hierarchy, alt text for images)
### 3.8 Channel-Specific Voice Adaptations
| Channel | Formality | Length | Key Principle |
|---|---|---|---|
| Website homepage | Professional | Scannable, short | Benefit-first headlines, 6–12 words |
| Blog post | Conversational | 1,500–2,500 words | Hook in first 50 words; value every section |
| LinkedIn | Professional–Conversational | 150–300 words | Insight + story + question |
| Twitter/X | Casual | 280 chars | Bold opener that stops the scroll |
| Instagram | Casual–Conversational | 100–200 words + hashtags | Story first; hashtags in a block below |
| Email newsletter | Conversational | Scannable | One main message; personal observation opener |
| Promotional email | Conversational | Short | Pain point → benefit → CTA → urgency |
| Press release | Formal | 400–600 words | Inverted pyramid; data-led |
| Case study | Professional | 800–1,200 words | Challenge → solution → measurable results |
### 3.9 Brand Identity Creative Brief Template
```markdown
## Brand Identity Brief
**Brand name:**
**Industry/sector:**
**Founded/launch date:**
**Tagline (current or proposed):**
**Mission statement:** (why do we exist?)
**Vision statement:** (what future are we building?)
**Core values:** (3–5 principles that guide decisions)
**Primary archetype:** (from Jung's 12)
**Secondary archetype:**
**Voice dimensions:**
- Formality: [1=Formal → 5=Casual]:
- Energy: [1=High → 5=Calm]:
- Warmth: [1=Warm → 5=Cool]:
**3 tone attributes:**
**3 words we always use:**
**3 words we never use:**
**Visual direction:**
- Color palette (3–5 hex codes):
- Primary typeface:
- Body typeface:
- Visual style (photographic/illustrative/abstract/typographic):
**Audience personas:** (describe 2–3 primary audiences)
**Competitors to differentiate from:**
**Brand DNA statement:** (one sentence: "We are the only brand that ___")
```
---
## Section 4: Frontend Design & Web Artifacts
**Sources merged:** Frontend Design (anthropics/skills) + Web Artifacts Builder (anthropics/skills) + website-building (Perplexity Computer built-in skill)
### 4.1 Stack Selection Decision Tree
```
What are you building?
│
├─ Simple single-page HTML experience (no framework needed)
│ → Plain HTML/CSS/JS artifact
│ → Focus on CSS animations, custom properties, vanilla JS
│
├─ Component-rich interactive app (state management, routing)
│ → React 18 + TypeScript + Vite + Tailwind CSS + shadcn/ui
│ → Use Web Artifacts Builder workflow
│
├─ Full website requiring live deployment and public URL
│ → website-building skill (HTML/CSS/JS + Tailwind)
│ → Deploy via Perplexity Computer sandbox
│
└─ Generative/algorithmic interactive art
→ p5.js single HTML artifact
→ See Section 5 (Generative Art)
```
### 4.2 Design Thinking Before Coding
Before writing a single line of code, answer:
1. **Purpose**: What problem does this interface solve? Who uses it?
2. **Tone**: Commit to an aesthetic extreme — don't default to "clean and modern"
- Brutally minimal / Maximalist chaos / Retro-futuristic / Organic/natural
- Luxury/refined / Playful/toy-like / Editorial/magazine / Brutalist/raw
- Art deco/geometric / Soft/pastel / Industrial/utilitarian / Cyberpunk
3. **Differentiation**: What is the one thing someone will remember?
4. **Typography anchor**: Which font pair defines the visual identity?
**Critical rule:** Bold maximalism and refined minimalism both succeed — what fails is timidity. Execute your chosen aesthetic with full commitment and precision.
### 4.3 Frontend Aesthetics Guidelines
#### Typography
- Choose fonts that are **beautiful, unique, and interesting**
- Never default to: Inter, Roboto, Arial, system-ui as display fonts
- Strong display choices: Clash Grotesk, Playfair Display, Bebas Neue, Canela, Fraunces, Syne, General Sans
- Strong body choices: Source Serif Pro, DM Sans, Instrument Sans, Literata, Spectral
- Pair a distinctive display font with a refined, readable body font
#### Color & Theme
- Commit to a **cohesive aesthetic** — use CSS custom properties for consistency
- Set a dominant color (60%), secondary (30%), accent (10%)
- Dominant + sharp accent outperforms timid, evenly distributed palettes
- Never default to purple gradients on white backgrounds
#### Motion & Animation
- CSS-only for HTML projects; Motion library for React
- **One well-orchestrated page load** with staggered reveals creates more delight than scattered micro-interactions
- Use `animation-delay` for staggered entry sequences
- Scroll-triggering and hover states that genuinely surprise
- Avoid: janky transitions, gratuitous spinning, motion for motion's sake
#### Spatial Composition
- Unexpected layouts: asymmetry, overlap, diagonal flow, grid-breaking elements
- Generous negative space **or** controlled density — commit to one
- No default centered-column layouts unless the content demands it
#### Backgrounds & Visual Details
- Create atmosphere with: gradient meshes, noise textures, geometric patterns, layered transparencies
- Dramatic shadows, decorative borders, custom cursors, grain overlays when appropriate to the aesthetic
- Never default to `background: #ffffff` without intentional reasoning
### 4.4 Web Artifacts Builder Workflow (React + shadcn/ui)
For complex multi-component artifacts:
```bash
# Step 1: Initialize project
bash scripts/init-artifact.sh <project-name>
cd <project-name>
# Stack auto-configured:
# React 18 + TypeScript + Vite + Tailwind CSS 3.4.1
# 40+ shadcn/ui components pre-installed
# All Radix UI dependencies included
# Path aliases (@/) configured
# Parcel bundler configured
# Step 2: Develop
# Edit src/ files, build components in src/components/
# Step 3: Bundle to single HTML
bash scripts/bundle-artifact.sh
# Creates bundle.html — self-contained, all JS/CSS inlined
# Step 4: Share artifact with user
```
**shadcn/ui component reference:** https://ui.shadcn.com/docs/components
### 4.5 Tailwind CSS Patterns for Creative UIs
```css
/* Mesh gradient background */
.bg-mesh {
background: radial-gradient(at 40% 20%, hsla(28,100%,74%,1) 0px, transparent 50%),
radial-gradient(at 80% 0%, hsla(189,100%,56%,1) 0px, transparent 50%),
radial-gradient(at 0% 50%, hsla(355,100%,93%,1) 0px, transparent 50%);
}
/* Noise texture overlay */
.texture-noise::before {
content: '';
position: absolute;
inset: 0;
background-image: url("data:image/svg+xml,...");
opacity: 0.04;
mix-blend-mode: multiply;
}
/* Staggered reveal animation */
.stagger-reveal > * {
opacity: 0;
transform: translateY(20px);
animation: reveal 0.6s ease forwards;
}
.stagger-reveal > *:nth-child(1) { animation-delay: 0ms; }
.stagger-reveal > *:nth-child(2) { animation-delay: 100ms; }
.stagger-reveal > *:nth-child(3) { animation-delay: 200ms; }
```
### 4.6 Quality Standards Checklist
Before shipping any frontend work:
**Functionality**
- [ ] All interactive elements work correctly
- [ ] No console errors
- [ ] Forms validate and handle errors gracefully
- [ ] Links and navigation function
**Visual Quality**
- [ ] Typography is distinctive and readable at all sizes
- [ ] Color contrast meets WCAG AA (4.5:1 for body text, 3:1 for large text)
- [ ] No generic AI aesthetics (purple gradients, overused fonts, predictable layouts)
- [ ] Committed to a clear aesthetic direction — not trying to be everything
**Responsive Design**
- [ ] Looks good at 320px, 768px, 1280px, 1920px
- [ ] Touch targets ≥44px on mobile
- [ ] Images don't overflow containers
- [ ] No horizontal scroll on mobile
**Performance**
- [ ] No blocking resources in `<head>`
- [ ] Images have `loading="lazy"` where appropriate
- [ ] Animations use `transform` and `opacity` (GPU-composited)
- [ ] No unnecessary re-renders (React)
**Accessibility**
- [ ] Semantic HTML (proper heading hierarchy, landmarks)
- [ ] All images have meaningful `alt` text
- [ ] Keyboard navigation works
- [ ] Focus indicators visible
### 4.7 Landing Page Design System
A high-converting landing page follows this section hierarchy:
```
1. Hero
- Headline: 6–12 words, benefit-focused, above the fold
- Subheadline: 1–2 sentences expanding the headline
- Primary CTA: high contrast, action verb + outcome ("Start free trial")
- Social proof: logos, user count, or rating
- Hero visual: product screenshot, illustration, or video
2. Problem / Agitate
- Describe the pain point the audience knows
- Make them feel understood before offering the solution
3. Solution Introduction
- What the product/service does in plain language
- 3–4 key benefits (not features)
4. Feature Showcase
- Visual demonstration
- Feature-benefit pairs
- Each feature answers: "So what? What can I do with this?"
5. Social Proof
- Testimonials (with real names, photos, company)
- Case study results
- Logos of recognizable customers
6. Pricing / Comparison
- 3 tiers is the standard (good–better–best)
- Highlight the recommended tier
- Annual vs. monthly toggle
7. FAQ
- Address the top 5 objections
- Keep answers short and direct
8. Final CTA
- Repeat the primary CTA
- Add urgency or risk reversal (free trial, money-back guarantee)
```
---
## Section 5: Generative Art & Animation
**Sources merged:** Algorithmic Art (anthropics/skills) + Slack GIF Creator (anthropics/skills) + video-production (Perplexity Computer built-in skill)
### 5.1 Choosing Your Animation Method
| Need | Method | Output |
|---|---|---|
| Generative/algorithmic interactive art | p5.js (Algorithmic Art workflow) | HTML artifact (interactive) |
| Slack emoji or reaction GIF | PIL + GIFBuilder (Slack GIF workflow) | .gif (128×128 or 480×480) |
| Short AI video clip (4–12 sec) | generate_video tool (Sora/Veo) | .mp4 |
| Longer AI video (>12 sec) | Frame chaining + clip stitching | Multiple .mp4s → stitched |
| Product/demo animation | CSS/JS animation (Frontend workflow) | HTML |
| Motion graphics for web | CSS animation + SVG | HTML/CSS |
### 5.2 Algorithmic Art Workflow (p5.js)
#### Algorithmic Philosophy Creation
Like visual design, start with a computational philosophy — an aesthetic movement expressed through code.
**Name the movement:** "Organic Turbulence" / "Quantum Harmonics" / "Recursive Whispers" / "Field Dynamics" / "Stochastic Crystallization"
**Philosophy dimensions to address:**
- Computational processes and mathematical relationships
- Noise functions and randomness patterns
- Particle behaviors and field dynamics
- Temporal evolution and system states
- Parametric variation and emergent complexity
**Essential technical requirements:**
```javascript
// ALWAYS use seeded randomness (Art Blocks pattern)
let seed = 12345;
randomSeed(seed);
noiseSeed(seed);
// Parameter structure
let params = {
seed: 12345,
// Quantities: how many?
// Scales: how big, how fast?
// Probabilities: how likely?
// Ratios: what proportions?
// Angles: what direction?
// Thresholds: when does behavior change?
};
// Standard canvas
function setup() {
createCanvas(1200, 1200);
}
function draw() {
// Your generative algorithm
}
```
#### Required Features for Interactive Viewers
1. **Parameter Controls**: Sliders for numeric params, color pickers, real-time updates, reset button
2. **Seed Navigation**: Current seed display, Prev/Next buttons, Random button, seed input field
3. **Single Artifact**: All p5.js code inline — no external files except p5.js CDN
#### Algorithmic Philosophy Library
**"Organic Turbulence"**
Flow fields driven by layered Perlin noise. Thousands of particles following vector forces, trails accumulating into organic density maps. Multiple noise octaves create turbulent and calm zones. Color emerges from velocity and density.
**"Quantum Harmonics"**
Grid-initialized particles carrying phase values evolving through sine waves. Constructive interference creates bright nodes; destructive creates voids. Simple harmonic motion generates complex emergent mandalas.
**"Recursive Whispers"**
Branching structures subdividing recursively. Each branch constrained by golden ratios, slightly randomized. L-systems generate tree-like forms that feel both mathematical and organic.
**"Field Dynamics"**
Vector fields from mathematical functions. Particles born at edges, flowing along field lines, dying at equilibrium. Visualization shows only ghost-like traces of invisible forces.
**"Stochastic Crystallization"**
Circle packing or Voronoi tessellation. Random points evolving through relaxation until equilibrium. Cells push apart; color based on size, neighbor count, distance from center.
### 5.3 Slack GIF Creator Workflow
#### Slack Requirements
| Format | Dimensions | FPS | Colors | Max Duration |
|---|---|---|---|---|
| Emoji GIF | 128×128 (recommended) | 10–15 | 48 | 3 seconds |
| Message GIF | 480×480 | 10–30 | 48–128 | Any |
#### Core Workflow
```python
from core.gif_builder import GIFBuilder
from PIL import Image, ImageDraw
# 1. Create builder
builder = GIFBuilder(width=128, height=128, fps=10)
# 2. Generate frames
for i in range(12):
frame = Image.new('RGB', (128, 128), (240, 248, 255))
draw = ImageDraw.Draw(frame)
# Draw using PIL primitives (ellipse, polygon, line, rectangle)
builder.add_frame(frame)
# 3. Save with optimization
builder.save('output.gif', num_colors=48, optimize_for_emoji=True)
```
#### Animation Concept Library
| Concept | Technique | Best For |
|---|---|---|
| **Shake/Vibrate** | `math.sin()` offset applied to x and/or y | Alarm, alert, emphasis |
| **Pulse/Heartbeat** | `math.sin(t * freq * 2π)` scaling between 0.8–1.2 | Notifications, likes |
| **Bounce** | `interpolate()` with `easing='bounce_out'` | Celebrations, success |
| **Spin/Rotate** | `image.rotate(angle)` — linear or sine-wave wobble | Loading, processing |
| **Fade In/Out** | RGBA alpha 0→1 or 1→0 | Transitions, reveals |
| **Slide** | Off-screen start, `easing='ease_out'` stop | Appearing messages |
| **Zoom** | Scale 0.1→2.0 or 2.0→1.0, crop center | Impact, focus |
| **Explode** | Particles with random angles/velocities, fade out | Celebrations |
#### Easing Functions Available
```python
from core.easing import interpolate
t = i / (num_frames - 1) # Progress 0.0 → 1.0
y = interpolate(start=0, end=400, t=t, easing='ease_out')
# Available: linear, ease_in, ease_out, ease_in_out,
# bounce_out, elastic_out, back_out
```
#### Graphics Quality Rules
- Always use `width=2` or higher for outlines — thin lines look amateurish
- Add visual depth with gradients, layered shapes, highlights
- Use vibrant, complementary colors with contrast
- For complex shapes: combine polygons + ellipses; calculate points carefully for symmetry
### 5.4 AI Video Generation (Perplexity Computer)
#### Model Selection
| Model | Best For | Clip Length | Cost |
|---|---|---|---|
| **sora_2** | Default. High-quality cinematic footage | 4, 8, 12 sec | Standard |
| **sora_2_pro** | Maximum quality, complex scenes | 4, 8, 12 sec | Premium |
| **veo_3_1** | Fast, photorealistic, diverse styles | 4, 6, 8 sec | Standard |
| **veo_3_1_fast** | Quick iterations, prototyping | 4, 6, 8 sec | Lower |
#### Aspect Ratios
- **16:9** — Landscape/widescreen (YouTube, presentations, TV)
- **9:16** — Portrait/vertical (TikTok, Instagram Stories, Reels)
#### Effective Video Prompt Structure
```
[Camera movement] [Scene description] [Subject action] [Visual style] [Lighting/mood] [Audio cues if any]
```
**Example — Cinematic product:**
```
Slow push-in shot of a glass perfume bottle on a dark marble surface,
amber liquid catching the light as a single drop of water falls onto the marble beside it,
hyper-realistic CGI product commercial style, dramatic chiaroscuro lighting,
cinematic color grade, no text
```
**Example — Lifestyle:**
```
Handheld follow shot of a woman walking through a sun-drenched farmers market,
dappled golden hour light, shallow depth of field,
contemporary lifestyle brand aesthetic, warm analog film look, natural ambient sound
```
**Example — Abstract/artistic:**
```
Fluid simulation of metallic liquid mercury morphing into geometric shapes,
macro lens, mirror-like surface reflections catching colored light,
seamless loop, minimal electronic ambient soundtrack
```
#### Multi-Clip Video Production Workflow
For videos longer than 12 seconds:
```
Step 1: Storyboarding
- Define key scenes and transitions
- Estimate clip count (1 clip per scene/shot)
- Write a prompt for each clip
Step 2: Frame Anchoring (for continuity)
- Generate clip 1 (opening shot)
- Screenshot the final frame of clip 1
- Use that screenshot as image_path for clip 2
→ This creates visual continuity between clips
Step 3: Generate All Clips
- Generate each clip with model, duration, and prompt
- Download all .mp4 files to workspace
Step 4: Stitch Clips
ffmpeg -i clip1.mp4 -i clip2.mp4 -i clip3.mp4 \
-filter_complex "[0:v][1:v][2:v]concat=n=3:v=1:a=0[outv]" \
-map "[outv]" output_final.mp4
Step 5: Add Audio (if needed)
ffmpeg -i output_final.mp4 -i voiceover.mp3 \
-c:v copy -c:a aac -shortest final_with_audio.mp4
```
### 5.5 Video Storyboard Template
```markdown
## Video Storyboard: [Project Name]
**Total duration target:**
**Aspect ratio:** [ ] 16:9 [ ] 9:16
**Style reference:**
**Music/audio brief:**
---
### Clip 1 (Opening)
**Duration:**
**Camera:**
**Scene:**
**Action:**
**Model:**
**Prompt:**
```
[Full video prompt here]
```
**Notes:**
### Clip 2
**Duration:**
**Camera:**
**Scene:**
**Action:**
**Transition from Clip 1:** (describe how they connect)
**Model:**
**Prompt:**
```
[Full video prompt here]
```
[Continue for all clips...]
---
### Audio Track
**Voiceover:** [ ] Yes [ ] No
**Script:**
**Voice:**
**Background music:**
**SFX:**
```
---
## Section 6: Audio & Speech
**Source merged:** speech skill (Perplexity Computer built-in skill) — text-to-speech and transcription
### 6.1 Text-to-Speech System
#### Model Selection
| Model | Best For |
|---|---|
| **gemini_2_5_pro_tts** | Default. High quality, natural prosody, all standard use cases |
| **elevenlabs_tts_v3** | 3+ distinct speakers required, or user explicitly requests ElevenLabs |
**Rule:** Use Gemini (default) unless: (a) user explicitly requests ElevenLabs, or (b) dialogue requires 3+ distinct speakers.
#### Single-Speaker Production
Create a `.txt` file, then call `text_to_speech` with the desired voice.
**Available Gemini Voices (sample):**
| Voice | Character |
|---|---|
| `kore` | Default. Neutral, professional |
| `charon` | Deep, authoritative |
| `fenrir` | Dynamic, energetic |
| `aoede` | Warm, conversational |
| `puck` | Bright, upbeat |
#### Multi-Speaker Dialogue Production
Create a `.json` file with speaker assignments:
```json
[
{"speaker": "aoede", "text": "Welcome to the show. I'm your host, and today we're diving into brand strategy."},
{"speaker": "charon", "text": "Thanks for having me. Brand strategy is something most founders get completely wrong."},
{"speaker": "aoede", "text": "What's the biggest mistake you see?"},
{"speaker": "charon", "text": "They confuse logo design with brand identity. The logo is maybe five percent of the picture."}
]
```
Then call `text_to_speech` with the `.json` file path. Voices are automatically assigned per speaker.
#### 99 Language Support
TTS supports 99 languages. Specify the language in your text content — no separate parameter needed. The model detects and matches language to appropriate phonology.
Common ISO codes for reference:
- English: `en` | Spanish: `es` | French: `fr` | German: `de` | Portuguese: `pt`
- Japanese: `ja` | Korean: `ko` | Chinese: `zh` | Arabic: `ar` | Hindi: `hi`
- Italian: `it` | Dutch: `nl` | Russian: `ru` | Turkish: `tr` | Polish: `pl`
### 6.2 Audio Transcription System
#### Configuration Options
| Parameter | Options | Notes |
|---|---|---|
| `diarize` | true / false | Enable speaker identification |
| `num_speakers` | 1–32 | Hint for diarization accuracy (leave null for auto-detect) |
| `timestamps` | `none` / `word` / `character` | `none` → plain .txt; others → .json with timing |
| `language_code` | ISO 639-1 | Auto-detected if not specified |
#### Supported Formats
`.mp3`, `.wav`, `.mp4`, `.webm`, `.m4a`, `.ogg`, `.flac`
#### Speaker Diarization Labeling Convention
When diarizing multi-speaker content, label consistently:
```
SPEAKER_00: [first speaker heard]
SPEAKER_01: [second speaker heard]
SPEAKER_02: [third speaker heard]
```
For named interviews/podcasts, rename speakers post-transcription:
```python
transcript = transcript.replace("SPEAKER_00:", "HOST:")
transcript = transcript.replace("SPEAKER_01:", "GUEST:")
```
### 6.3 Podcast / Voiceover Production Workflow
```
Step 1: Script Preparation
- Write script as multi-speaker JSON (for 2 speakers) or .txt (single voice)
- Mark pronunciation notes in brackets: [EMPH: strategy] [PAUSE: 1s]
- Review for natural speech patterns — written language ≠ spoken language
Step 2: Voice Selection
- Match voice character to brand archetype (see Section 3.2)
- Test with a 50-word sample before committing to full script
- For multi-speaker: assign voices by character (e.g., aoede=host, charon=expert guest)
Step 3: Generation
- Generate audio with text_to_speech tool
- Review output MP3
Step 4: Post-Processing (if needed)
- Trim silence: ffmpeg -i input.mp3 -af silenceremove=1:0:-50dB output.mp3
- Normalize levels: ffmpeg -i input.mp3 -filter:a loudnorm output_normalized.mp3
- Add background music: ffmpeg -i voice.mp3 -i music.mp3 -filter_complex "[1:a]volume=0.1[bg];[0:a][bg]amix=inputs=2:duration=first" final.mp3
Step 5: Final Export
- Deliver as MP3 for most platforms
- WAV for professional audio editing
- Specific podcast platforms may require specific bitrates (Spotify: 128kbps minimum)
```
### 6.4 Transcription QA Checklist
After transcribing audio, verify:
- [ ] Speaker labels correctly assigned (spot-check 3+ transitions)
- [ ] Timestamps align with audio (test word-level timestamps at minutes 0, 5, mid, end)
- [ ] Technical terms and proper nouns spelled correctly — auto-transcription often errors on brand names, product names, acronyms
- [ ] Filler words handled consistently (`um`, `uh` — decide to keep or remove)
- [ ] Sentence boundaries make sense (auto-transcription rarely includes punctuation)
- [ ] Confidence check on ambiguous segments — listen back to any flagged sections
---
## Section 7: Content Creation & Copywriting
**Sources merged:** Content Creator (alirezarezvani) + Content Frameworks & Templates (alirezarezvani) + marketing-content-creation (Perplexity Computer) + Brand Voice Framework
### 7.1 Content Creation Master Workflow
```
1. Audience & Intent
→ Who is this for? What do they need to feel, know, or do after reading?
2. Keyword & Topic Research (for SEO content)
→ Primary keyword: 500–5,000 searches/month (sweet spot)
→ 3–5 secondary keywords
→ 10–15 LSI (latent semantic indexing) keywords
→ Use Perplexity search_web for live keyword intelligence
3. Content Type Selection
→ Match format to intent: How-to (informational) / Listicle (inspiration) /
Case study (consideration) / Thought leadership (awareness) /
Landing page (conversion) / Press release (PR)
4. Outline using Template
→ Pull appropriate template from Section 7.3 below
5. Draft (no editing)
→ Write first draft without self-censoring
→ Target word count by type:
Blog: 1,500–2,500 | Social: see platform guides | Email: scannable
Landing page: value-driven, not word-count-driven
6. SEO Optimization Pass
→ Keyword in title, first paragraph, 2–3 H2 headings
→ Keyword density: 1–3%
→ Heading structure: one H1, logical H2/H3 hierarchy
→ Meta description: 150–160 characters
7. Brand Voice Edit
→ Run Brand Voice Consistency Audit (Section 3.7)
→ Ensure active voice ≥80%
→ Check for banned words
8. Platform Optimization
→ Apply platform-specific formatting (Section 7.6)
→ Adjust length, hashtags, visual requirements
9. CTA + Distribution
→ Every piece has one clear CTA
→ Schedule per content calendar (Section 8)
```
### 7.2 Hook & Headline Formulas
#### AIDA Framework
- **Attention**: Grab with surprising fact, bold claim, or provocative question
- **Interest**: Explain why this matters specifically to them
- **Desire**: Paint the picture of their improved state
- **Action**: Tell them exactly what to do next
#### PAS Framework
- **Problem**: State the pain point bluntly
- **Agitate**: Make them feel the weight of the problem
- **Solution**: Introduce the answer
#### Headline Formulas
| Formula | Template | Example |
|---|---|---|
| How-to | How to [Achieve X] Without [Pain Point] | How to Double Email Opens Without A/B Testing |
| Number List | [N] [Adjective] Ways to [Achieve Goal] | 7 Counterintuitive Ways to Beat Creative Block |
| Question | [Challenging Question Your Audience Has]? | Are You Making These 5 Brand Mistakes? |
| Contrarian | Why [Common Belief] Is [Wrong/Backwards/Costing You] | Why "Best Practices" Are Killing Your Brand |
| Specificity | How [Specific Person] Achieved [Specific Result] in [Timeframe] | How a 3-Person Team Grew to 50K Subscribers in 90 Days |
| Secret/Insider | The [Counterintuitive] Truth About [Topic] | The Uncomfortable Truth About Content Calendars |
| Fear of Missing | [N] Things You're Missing If You're Not [Doing X] | 6 Revenue Streams You're Ignoring in Your Content |
#### Hook Formulas for Social Media
```
Type 1: Contrarian
"Unpopular opinion: [industry belief] is completely wrong."
Type 2: Specificity
"[Specific result] in [timeframe] with [unusual method]."
Type 3: Story opener
"Two years ago, [dramatic situation]. Today, [transformation]."
Type 4: Question
"What if [assumed truth] was actually [reframed truth]?"
Type 5: List promise
"[N] things I wish someone told me before [doing X]:"
Type 6: Direct address
"If you're a [specific audience] and you're not doing [X], read this."
```
### 7.3 Blog Post Template Library
#### How-To Guide Template
```markdown
# How to [Achieve Desired Outcome] in [Timeframe]
## Introduction
[Hook: surprising fact, challenging question, or bold statement — 1–2 sentences]
[Problem statement: what pain this solves]
[Promise: what reader will learn and why it matters now]
## Prerequisites/What You'll Need
- [Tool/Resource 1]
- [Tool/Resource 2]
- [Estimated time to complete]
## Step 1: [Action Verb + Object]
[Clear instruction]
[Why this step matters]
[Common mistake to avoid]
[Visual aid or example if helpful]
## Step 2: [Action Verb + Object]
[Repeat structure above]
[Continue for all steps...]
## Troubleshooting Common Issues
### [Issue 1 Label]
**Symptom:** [What they'll observe]
**Cause:** [Why it happens]
**Fix:** [Exact solution]
## Results You Can Expect
- [Immediate outcome 1]
- [Long-term benefit]
- [Success metric to track]
## Next Steps
- [Advanced technique or related guide]
- [Relevant tool or resource]
- [CTA for product/service — soft sell]
## Conclusion
[Recap: 2–3 key points from the guide]
[Reinforce the value of what they've learned]
[Encouragement + final CTA]
```
#### Listicle Template
```markdown
# [Number] [Adjective] [Things/Ways/Tips] to [Achieve Goal] [in Year/Context]
## Introduction
[Context: trend or insight driving the topic]
[Promise: what they gain from reading]
[Credibility signal: why you can speak to this]
## 1. [First Item — Lead with Most Important or Most Surprising]
**Why it matters:** [Brief explanation — 1–2 sentences]
**How to implement:** [2–3 specific, actionable steps]
**Pro tip:** [Expert insight that elevates the advice]
**Example:** [Real-world application]
[Continue for all N items...]
## Bringing It All Together
[How these items work synergistically]
[Priority order for implementation]
[Expected timeline for results]
## Your Action Plan
1. Start with [easiest/most impactful item]
2. Next, tackle [second priority]
3. Measure [specific metric] after [timeframe]
## Conclusion & CTA
[2–3 sentence summary]
[CTA — specific action to take next]
```
#### Case Study Template
```markdown
# How [Company/Person] Achieved [Specific Result] Using [Your Solution/Method]
## Executive Summary
[Company overview — 1 sentence]
[Challenge faced — 1 sentence]
[Solution implemented — 1 sentence]
**Key results:** [Metric 1] | [Metric 2] | [Metric 3]
## The Challenge
[Industry context — why this challenge is common]
[Specific pain points — 2–3 concrete problems]
[Stakes — what was at risk if they didn't solve it]
## The Solution
[How they found/chose the solution]
[Implementation approach — phases if applicable]
[Timeline from start to results]
## The Results
### Quantitative Outcomes
- [Metric 1]: [Before] → [After] ([% change])
- [Metric 2]: $[Amount] saved/gained
- [Metric 3]: [Time reduction/increase]
### Qualitative Benefits
[Quote from key stakeholder]
[Team or customer experience improvement]
## Key Takeaways
1. [Lesson that applies broadly]
2. [Best practice discovered]
3. [Unexpected finding]
## Ready to Get These Results?
[CTA — book a demo, start a trial, contact us]
```
#### Thought Leadership Template
```markdown
# [Provocative Statement About the Future of Your Industry]
## The Current State
[Where the industry is right now — establish common ground]
## The Seismic Shift
[The emerging trend, technology, or behavior changing everything]
[Data point or example that makes it concrete]
## Why [Conventional Approach] Will Fall Short
[Specific critique of the status quo]
[What companies doing X are missing]
## A New Framework for [Challenge]
[Your proposed model — give it a name if possible]
[How it works — 3–5 principles]
[What changes when you apply it]
## What This Means for [Your Audience's Role]
[Specific implications for their day-to-day]
[Skills to develop / things to stop doing]
[Timeline — when does this shift become irreversible?]
## The Path Forward
[Your prediction for the next 12–24 months]
[The companies/people who will win and why]
[What action to take now, before it's obvious]
## Join the Conversation
[Engage readers: What do you think? Comment/share]
[CTA: read more, subscribe, follow]
```
### 7.4 Social Media Template Library
#### LinkedIn Post Framework
```
[🎯 OR bold statement — Pattern interrupt line that stops the scroll]
[Context paragraph: the situation, challenge, or observation — 3–5 sentences]
[Key insight or lesson you're sharing:]
• [Specific, actionable point 1]
• [Measurable outcome or evidence]
• [Unexpected finding or contrarian take]
[Brief story or example that makes the point real — 2–3 sentences]
[Takeaway: the single most important thing to remember]
[Engagement question: genuinely curious, not rhetorical?]
#[Industry] #[Topic] #[Audience]
```
**LinkedIn Optimization:**
- Optimal length: 150–300 words
- Post images or carousels for 3× the impressions
- Best times: Tue–Thu, 8–10am and 12–2pm in audience's timezone
- End with a question to drive comments
#### Twitter/X Thread Template
```
1/ [Bold opening statement that stops the scroll — make a claim worth reading 10 tweets for]
2/ [Context: why this matters right now — data point or trend]
3/ [The problem most people face — specific, not vague]
4/ [Conventional solution — acknowledge what people try]
5/ [Why the conventional solution falls short — the gap]
6/ [Better approach — introduce it]
7/ [Step/element 1 of better approach]
8/ [Step/element 2]
9/ [Step/element 3]
10/ [Step/element 4 — if needed]
11/ [Real-world example or proof]
12/ Recap in 3 points:
→ [Point 1]
→ [Point 2]
→ [Point 3]
13/ [CTA: If this was useful, [follow/retweet/share]. Here's where to learn more: [link]]
14/ P.S. [Bonus insight or resource that rewards people who read to the end]
```
**Twitter/X Optimization:**
- Threads under 15 tweets perform better than longer ones
- First tweet must work standalone (it gets surfaced without context)
- Images increase engagement 150%
- Best times: Weekdays 9am–3pm; avoid Friday afternoons
#### Instagram Caption Template
```
[Attention-grabbing first line — appears in preview before "more"]
[Story or relatable scenario — 2–3 sentences that create emotional connection]
Here's what I learned:
[The key insight — make it specific and actionable]
[N] things that changed everything:
1️⃣ [First point — concrete, not vague]
2️⃣ [Second point — surprising or counterintuitive]
3️⃣ [Third point — actionable]
[Engagement prompt: "Drop a ❤️ if you've been here!" or a direct question]
—
[Hashtags in a block below the dash — 10–30, mix of popular and niche]
#[hashtag1] #[hashtag2] #[hashtag3]
```
**Instagram Optimization:**
- First line is make-or-break — must hook before "more"
- Carousels get 3× the reach of single images
- Video Reels: 7–15 seconds for maximum reach
- Best times: Weekdays 11am–1pm; Wed 11am is peak
- 20–30 hashtags: mix broad (1M+), medium (100K–1M), niche (<100K)
#### Facebook Post Template
```
[Question or bold statement — community-oriented]
[Narrative or context — 2–4 paragraphs, more conversational than LinkedIn]
[Value delivery: tips, insights, or resource]
[Community CTA: "Have you experienced this? Tell us in the comments" OR "Tag someone who needs to see this"]
[Link if applicable — Facebook reduces reach for link posts; consider posting link in comments]
```
#### TikTok / Short-Form Video Script Template
```
[0–3 sec: HOOK — Visual + text overlay that answers "Why should I watch this?"]
Script: "[Bold claim or surprising statement]"
[3–10 sec: CONTEXT — Establish who this is for]
Script: "If you're a [audience] who [challenge], this is for you."
[10–45 sec: VALUE DELIVERY]
"[Step 1 / Point 1]"
"[Step 2 / Point 2]"
"[Step 3 / Point 3]"
[Keep each step to 1–2 sentences max]
[45–60 sec: CTA]
Script: "Follow for more [topic] tips. Save this for when you need it."
[Caption: First line = hook. Hashtags: 3–5 niche + 2 broad]
```
### 7.5 Email Marketing Templates
#### Newsletter Template
```
Subject: [Benefit or insight] — [curiosity/specificity element]
Preview text: [Complements subject, doesn't repeat it — adds urgency or context]
Hi [Name / Hey there],
[Personal observation or timely hook — 1–2 sentences that feel human, not broadcast]
---
## [Main Content Section Title]
[2–3 key points in scannable format]
• **[Point 1]:** [Benefit-focused explanation]
• **[Point 2]:** [Specific example or stat]
• **[Point 3]:** [Actionable tip they can use today]
---
## Resource of the Week
**[Title]** — [One sentence on why it's worth their time]
→ [Link]
---
## Quick Win You Can Implement Today
[Specific, actionable — 2–3 steps, under 100 words]
---
[Sign-off with personality]
P.S. [Bonus: additional value, soft CTA, or teaser for next issue]
```
#### Promotional Email Template
```
Subject: [Specific, concrete benefit] by [deadline/timeframe]
Preview text: [Scarcity or exclusivity signal]
Hi [Name],
[Open by acknowledging their pain point or aspiration — 2–3 sentences]
[Transition: "That's why we built/created/launched X"]
Here's what you get:
✓ [Benefit 1 — outcome, not feature]
✓ [Benefit 2 — outcome, not feature]
✓ [Benefit 3 — outcome, not feature]
[Social proof: testimonial with name + company, or specific result data]
[Primary CTA button: "Get Started Free" / "Claim Your Spot" / "Start Today"]
[Urgency element: deadline, limited availability, or bonus that expires]
P.S. [Reinforce urgency OR add bonus not mentioned above — P.S. gets read almost as often as the subject line]
```
### 7.6 Platform Image & Video Dimension Reference
| Platform | Image Type | Dimensions | Notes |
|---|---|---|---|
| Instagram | Feed square | 1080×1080 | 1:1 ratio |
| Instagram | Feed landscape | 1080×566 | 1.91:1 ratio |
| Instagram | Feed portrait | 1080×1350 | 4:5 ratio (recommended) |
| Instagram | Story/Reel | 1080×1920 | 9:16 ratio |
| Twitter/X | Tweet image | 1200×675 | 16:9 ratio |
| Twitter/X | Profile banner | 1500×500 | 3:1 ratio |
| LinkedIn | Share image | 1200×627 | 1.91:1 ratio |
| LinkedIn | Banner | 1584×396 | 4:1 ratio |
| Facebook | Feed post | 1200×630 | 1.91:1 ratio |
| Facebook | Stories | 1080×1920 | 9:16 ratio |
| YouTube | Thumbnail | 1280×720 | 16:9 ratio |
| YouTube | Banner | 2560×1440 | Channel art |
| TikTok | Video | 1080×1920 | 9:16 ratio |
| Pinterest | Pin | 1000×1500 | 2:3 ratio |
| Blog/Web | Hero image | 1600×900 | 16:9 ratio |
| Open Graph | Social preview | 1200×630 | OG standard |
### 7.7 SEO Content Framework
#### Keyword Targeting Hierarchy
```
Primary keyword (1):
→ Include in: title, first paragraph, 1–2 H2 headings, meta description, URL slug
→ Density: 1–2%
Secondary keywords (3–5):
→ Include in: H2/H3 headings, body paragraphs
→ Density: 0.5–1%
LSI keywords (10–15):
→ Include naturally throughout content
→ Don't force — use semantic variations
```
#### On-Page SEO Checklist
- [ ] Title: Primary keyword near the front, under 60 characters, click-worthy
- [ ] URL slug: Short, keyword-based, hyphens not underscores
- [ ] Meta description: Primary keyword, 150–160 characters, includes CTA
- [ ] H1: One only, matches or closely mirrors title
- [ ] H2–H6: Logical hierarchy, secondary keywords woven in naturally
- [ ] First 100 words: Primary keyword appears in first paragraph
- [ ] Image alt text: Descriptive, includes keyword where natural
- [ ] Internal links: 2–4 links to relevant pages on same domain
- [ ] External links: 1–2 links to authoritative sources
- [ ] Reading level: Flesch-Kincaid Grade 7–9 for most B2C; higher for B2B/technical
### 7.8 Press Release Template
```
FOR IMMEDIATE RELEASE
[OR: EMBARGOED UNTIL: DATE/TIME]
[COMPANY NAME] [ANNOUNCES/LAUNCHES/PARTNERS/ACHIEVES] [SPECIFIC THING]
[Subtitle: Supporting detail or secondary benefit]
[CITY, STATE] — [Month Day, Year] — [Company name], [brief company description], today announced [specific news]. [One sentence expanding on the news and its significance].
"[Quote from senior executive — forward-looking, human, and substantive]," said [Full Name], [Title], [Company]. "[Second sentence of quote that adds emotional or strategic color]."
[Paragraph 2: Expanded context — why this matters, what problem it solves, market context]
[Paragraph 3: Product/program/partnership details — specifics, features, availability, pricing if relevant]
[Optional Paragraph 4: Supporting quote from partner, customer, or investor]
[Paragraph 5: Availability and next steps — when, where, how to access, pricing]
###
About [Company Name]
[2–3 sentence boilerplate: what the company does, founded when, key customers/metrics]
Media Contact:
[Name]
[Title]
[Email]
[Phone]
[Website]
```
---
## Section 8: Content Calendar & Planning
**Source merged:** Content Calendar Template (alirezarezvani) + Content Planning Frameworks
### 8.1 Content Pillar Strategy (40/25/25/10 Rule)
```
Pillar 1: Educational (40%)
Formats: How-to guides, tutorials, explainers, tips & tricks, data analysis
Goal: Establish authority; drive SEO traffic; build trust
Pillar 2: Inspirational (25%)
Formats: Success stories, case studies, transformations, vision pieces, behind the brand
Goal: Build aspiration; create emotional connection; show what's possible
Pillar 3: Conversational (25%)
Formats: Behind-the-scenes, team spotlights, Q&As, polls, questions, hot takes
Goal: Build community; increase engagement; humanize the brand
Pillar 4: Promotional (10%)
Formats: Product announcements, offers, event invites, features highlights, CTAs
Goal: Convert interest to action; drive revenue; announce news
```
**Why this ratio works:** Audiences follow brands for value, not ads. The 40/25/25/10 ratio ensures the account is worth following first — then promotional content lands in a receptive audience.
### 8.2 Monthly Planning Framework
#### Month Setup (Do This First)
```markdown
## [Month] [Year] Content Plan
### Monthly Goals
- Traffic target:
- Lead generation target:
- Engagement target:
- Subscribers/followers target:
- Key campaign/theme:
### Key Dates This Month
- Product launch:
- Industry event:
- Holiday/awareness day:
- Content deadline:
### Monthly Theme
[One unifying topic or narrative thread that ties the month together]
### Primary Content Asset
[The one big piece — long-form blog, video, webinar, guide — that other content repurposes from]
```
#### Weekly Distribution Template
```
Week 1: Foundation
Monday — Blog post (primary keyword: [X])
Tuesday — LinkedIn insight post
Wednesday — Email newsletter
Thursday — Twitter/X thread
Friday — Instagram carousel
Week 2: Inspiration
Monday — Case study or success story
Tuesday — LinkedIn thought leadership
Wednesday — Product highlight or promo
Thursday — Community question or poll
Friday — Behind-the-scenes content
Week 3: Education
Monday — Tutorial or how-to (video or blog)
Wednesday — Infographic or data visual
Friday — Q&A or myth-busting post
Week 4: Conversion
Monday — In-depth guide or whitepaper tease
Wednesday — Testimonial or case study
Friday — Newsletter recap + CTA
```
### 8.3 Full Monthly Content Calendar Template
```markdown
# Content Calendar — [Month Year]
## Monthly Goals
- **Traffic Goal**:
- **Lead Generation Goal**:
- **Engagement Goal**:
- **Key Campaign**:
---
## Week 1: [Date Range]
### Monday [Date]
**Platform**: Blog
**Topic**:
**Primary Keyword**:
**Secondary Keywords**:
**Target Length**:
**Status**: [ ] Planned [ ] Written [ ] Reviewed [ ] Published
**Owner**:
**Notes**:
**Platform**: LinkedIn
**Type**: Article Share / Original Post
**Caption snippet**:
**Hashtags**:
**Optimal Post Time**: 9:00 AM
### Tuesday [Date]
**Platform**: Instagram
**Type**: [ ] Single image [ ] Carousel [ ] Reel
**Topic**:
**Visual brief**:
**Caption**:
**Hashtags**:
**Optimal Post Time**: 11:00 AM
**Visuals status**: [ ] Briefed [ ] Created [ ] Approved
### Wednesday [Date]
**Platform**: Email Newsletter
**Subject line (A)**:
**Subject line (B)**:
**Preview text**:
**Audience segment**:
**Primary CTA**:
**Status**: [ ] Drafted [ ] Designed [ ] Tested [ ] Scheduled
### Thursday [Date]
**Platform**: Twitter/X
**Type**: [ ] Single tweet [ ] Thread
**Topic**:
**Thread length (if thread)**:
**Media**: [ ] Images [ ] GIFs [ ] Video [ ] None
**Optimal Post Time**: 12:00 PM
### Friday [Date]
**Platform**: Multi-channel
**Campaign**:
**Assets needed**:
- [ ] Blog post
- [ ] Social graphics
- [ ] Email
- [ ] Video
---
## Week 2: [Date Range]
[Repeat structure]
## Week 3: [Date Range]
[Repeat structure]
## Week 4: [Date Range]
[Repeat structure]
---
## Content Bank (Ideas for Future)
1.
2.
3.
4.
5.
---
## Performance Review (End of Month)
### Top Performing Content
1. **Title/Topic**:
**Platform**:
**Key metric**:
**Why it worked**:
2. **Title/Topic**:
**Platform**:
**Key metric**:
**Why it worked**:
### Underperforming Content
1. **Title/Topic**:
**Why it underperformed**:
**Adjustment for next month**:
### Lessons Learned
-
-
-
### Adjustments for Next Month
-
-
-
## Resource Links
- Brand Guidelines: [Link]
- Asset Library: [Link]
- Analytics Dashboard: [Link]
- Team Calendar: [Link]
```
### 8.4 Platform-Specific Posting Time Reference
| Platform | Best Days | Best Times | Notes |
|---|---|---|---|
| LinkedIn | Tue–Thu | 8–10am, 12–2pm | Avoid weekends; business hours rule |
| Instagram | Mon, Wed, Fri | 11am–1pm | Wed 11am is peak; 7–9pm for lifestyle |
| Twitter/X | Weekdays | 9am–3pm | Lunch hour (12–1pm) is peak for B2C |
| Facebook | Wed–Fri | 1–4pm | Organic reach is low; boost important posts |
| TikTok | Any | 7–9pm local time | Evening audience is largest |
| YouTube | Fri–Sun | 2–4pm | Subscribers notified; Sunday afternoon peaks |
| Email | Tue–Thu | 10am–2pm | Tuesday 10am historically highest open rate |
| Pinterest | Sat–Sun | 8–11pm | Weekend inspiration browsing behavior |
*All times are in the audience's local timezone, not the sender's.*
### 8.5 Content Repurposing Matrix
One piece of primary content → multiple assets:
| Primary Asset | Repurposed Into |
|---|---|
| Long-form blog post (2,000+ words) | 5 LinkedIn posts (one per section), 1 Twitter thread, 1 email newsletter, 3 Instagram carousels, 1 YouTube video script |
| Podcast episode (30–60 min) | Audiogram clips (3×), quote graphics (5×), blog post transcript, Twitter thread (top insights), LinkedIn article |
| Case study | LinkedIn post, Instagram carousel, sales deck slide, blog feature, video testimonial script |
| Data/research report | Infographic, 10 data-point social posts, press release, webinar outline, email nurture sequence |
| Webinar/video | Blog summary post, highlight clips (3–5×), transcript, email follow-up series, slides deck |
| Tutorial/how-to | Short-form video (TikTok/Reel), Twitter thread (steps), Pinterest pin, email mini-course |
### 8.6 Content Ideation Workflow (Perplexity-Enhanced)
Leverage Perplexity Computer's live research capabilities for trend-driven ideation:
```
Step 1: Trend Discovery
→ search_web for "[industry] trends [current month/year]"
→ search_social for "#[industry] OR [topic]" (recent posts only)
→ Look for: high engagement posts, recurring questions, emerging terminology
Step 2: Competitive Content Audit
→ fetch_url on 3–5 competitor blog/social pages
→ Identify: their top-performing content types, topics they haven't covered, angles they miss
Step 3: Keyword Opportunity Research
→ search_web for "[topic] frequently asked questions"
→ search_web for "how to [topic] site:reddit.com OR site:quora.com"
→ Extract: recurring pain points = content opportunities
Step 4: Brief Creation
→ For each content idea, complete the Content Brief Template (Section 8.7)
Step 5: Batch Scheduling
→ Fill the monthly calendar template
→ Assign to content pillars (40/25/25/10)
→ Assign to platforms with platform-specific notes
```
### 8.7 Content Brief Template
```markdown
## Content Brief
**Title (working):**
**Content type:** [ ] Blog [ ] Social [ ] Email [ ] Video [ ] Podcast [ ] Infographic
**Platform(s):**
**Pillar:** [ ] Educational (40%) [ ] Inspirational (25%) [ ] Conversational (25%) [ ] Promotional (10%)
**Publish date:**
**Author/Owner:**
**Objective:**
What should the audience feel, know, or do after consuming this piece?
**Target audience:**
Which persona is this primarily for? What stage of awareness are they at?
**Primary keyword (if SEO):**
**Secondary keywords:**
**Hook/angle:**
What is the surprising, specific, or counterintuitive angle that makes this piece worth reading?
**Key points to cover:**
1.
2.
3.
**Key points to avoid:**
(What competing content covers that we want to differentiate from)
**Call to action:**
What is the single action the reader should take?
**Visual requirements:**
- Feature image: [ ] AI generated [ ] Stock [ ] Custom design
- In-article visuals:
- Social cut-down assets needed:
**Sources/references to include:**
**Internal links (2–4):**
**Word count target:**
**Deadline:**
```
---
## Section 9: Prompt Engineering for Creative Work
**Sources merged:** Prompt Engineer Toolkit (alirezarezvani/marketing-skill) + Senior Prompt Engineer (alirezarezvani/engineering-team)
### 9.1 Technique Selection Guide
| Situation | Technique | Why |
|---|---|---|
| Clear, simple, well-defined task | **Zero-shot** | Fastest; works well when format is unambiguous |
| Complex task needing consistent format | **Few-shot** | Examples anchor the model's output style |
| Multi-step reasoning, logic, diagnosis | **Chain-of-Thought (CoT)** | Explicit step-by-step reduces errors |
| Open-ended problem with multiple paths | **Tree-of-Thought (ToT)** | Forces exploration before committing |
| API integration, downstream processing | **Structured Output (JSON)** | Guarantees parseable responses |
| Persistent persona, rules, constraints | **System Prompt Design** | Separates static instructions from dynamic input |
| Improving prompts themselves | **Meta-Prompting** | Turns the model into a prompt optimizer |
### 9.2 Creative-Specific Prompt Templates
#### Image Generation Prompts
**Photorealistic product:**
```
Professional product photography of [product description], [surface/setting],
[composition: centered/rule-of-thirds/dramatic angle],
[color palette: warm/cool/neutral/specific tones],
[lighting: soft natural/dramatic studio/backlit/golden hour],
no text, no watermarks, high resolution
```
**Portrait/lifestyle:**
```
[Style: photorealistic/editorial/cinematic] portrait/photo of [subject description],
[environment and context], [pose or activity],
[lighting quality and direction], [color mood: warm/cool/desaturated],
[aspect ratio use case — e.g., "suitable for Instagram portrait format"]
```
**Illustration:**
```
[Art style: flat vector/line art/watercolor/gouache/digital painting/risograph]
illustration of [subject], [composition notes],
[color palette: limit to 3–5 colors, e.g., "dusty rose, sage green, off-white, and charcoal"],
[mood: playful/minimal/bold/organic], [intended use: app icon/blog header/print]
```
**Abstract/artistic:**
```
[Medium: oil painting/acrylic/pastel/mixed media/CGI]
[style reference: impressionist/bauhaus/surrealist/contemporary],
[subject or concept expressed abstractly],
[palette], [compositional quality: layered/sparse/chaotic/geometric],
[lighting and texture notes], no text
```
**Brand asset:**
```
Brand illustration for [company type/industry],
[visual metaphor for the brand value: e.g., "growth represented as a seedling becoming a tree"],
[brand colors: hex codes], [style: clean geometric/organic/bold typographic],
suitable for [use: website hero/social media/print], no text overlay
```
#### Video Generation Prompts
**Product showcase:**
```
[Camera: slow push-in/dolly/orbit/static] of [product],
[setting and surface], [key visual action or detail],
[visual style: cinematic CGI/lifestyle/documentary/abstract],
[lighting: dramatic/natural/artificial],
[color grade: warm/cold/neutral/film emulation],
no text, seamless loop if possible
```
**Story/narrative:**
```
[Shot type: wide establishing/medium/close-up/POV] showing [character/subject]
[action and emotion] in [setting], [time of day and lighting],
[visual aesthetic: handheld documentary/smooth gimbal/fixed frame],
[color palette and mood], [optional: ambient sound description]
```
**Abstract/motion graphic:**
```
Abstract [material/concept: liquid metal/fluid simulation/particle field/geometry]
[motion description: morphing/flowing/exploding/crystallizing],
[color palette], [lighting: dramatic/soft/neon/natural],
[loop quality: seamless loop], [style: CGI/hand-drawn/kinetic typography]
```
#### Voice & Audio Prompts
**Narrator/voiceover script brief:**
```
Write a [duration: 30-second/60-second/2-minute] voiceover script for [brand/product].
Tone: [tone attributes from brand voice framework]
Audience: [persona]
Key message: [single most important point]
CTA: [specific action]
Avoid: [anything to omit: technical jargon, competitor comparisons, etc.]
Voice style: [warm and conversational / authoritative and confident / playful and energetic]
```
**Podcast dialogue brief:**
```
Write a [duration] podcast segment between HOST and GUEST discussing [topic].
HOST voice: [characteristics — curious, challenging, accessible]
GUEST voice: [characteristics — expert, specific, story-driven]
The conversation should cover:
1. [Opening question/topic]
2. [Main insight or debate point]
3. [Practical takeaway for the listener]
Avoid: [lecture format, excessive agreement, abstract answers without examples]
End with a [teaser for next episode / book recommendation / listener question prompt]
```
#### Brand Copywriting Prompts
**Homepage headline:**
```
Write 5 homepage headline options for [company name], a [type of business]
that helps [target audience] achieve [outcome] without [pain point/obstacle].
Brand archetype: [archetype from Section 3.2]
Tone: [tone attributes]
Format: Each option should be under 10 words, benefit-led, and memorable.
Include one question-format option and one contrarian option.
```
**Social media post:**
```
Write a [platform: LinkedIn/Twitter/Instagram] post for [brand name] about [topic].
Brand voice: [archetype + 3 tone attributes]
Angle: [specific hook type from Section 7.2: contrarian/story/list/question]
Length: [platform-appropriate: e.g., "LinkedIn: 150–200 words"]
CTA: [desired action]
Do not: [anything to avoid]
```
**Email subject line:**
```
Write 10 email subject line options for [campaign/email purpose].
Audience: [persona and their current state of awareness]
Email goal: [open rate optimization / click optimization]
Include:
- 3 curiosity-gap options
- 3 specificity/number options
- 2 urgency/scarcity options
- 2 personalization options
Keep each under 50 characters for mobile optimization.
```
### 9.3 Prompt Optimization Methodology
#### A/B Scoring Framework (5 Dimensions)
Score each prompt version on a 1–5 scale across:
| Dimension | What to Evaluate |
|---|---|
| **Coherence** | Output is logical, well-structured, internally consistent |
| **Accuracy** | Factually correct / task-appropriate / no hallucinations |
| **Format compliance** | Matches requested format exactly |
| **Conciseness** | No padding, no redundancy, efficient delivery |
| **Usefulness** | A human would act on or use this output |
**Threshold:** Aim for ≥4.0 across all dimensions before considering a prompt production-ready.
#### Token Reduction Patterns
```python
# BEFORE: Verbose (312 tokens)
"""
You are a highly experienced and skilled assistant who specializes in sentiment analysis.
Your job is to carefully read the text that the user provides to you and then thoughtfully
determine whether the overall sentiment expressed in that text is positive, negative, or neutral.
Please make sure to only respond with one of these three labels and nothing else.
"""
# AFTER: Lean (28 tokens — same quality)
"""Classify sentiment as POSITIVE, NEGATIVE, or NEUTRAL. Reply with label only."""
# Savings at scale: 284 tokens × rate = significant cost reduction at volume
```
**Token reduction principles:**
1. Remove role descriptions that add no constraint ("You are a highly experienced...")
2. Replace verbose instructions with direct commands
3. Move examples to few-shot format rather than describing them
4. Eliminate redundant restatements ("Your job is to... please make sure to...")
#### Prompt Version Control
```markdown
# CHANGELOG.md
## [v1.3.0] — [Date]
### Changed
- Added explicit JSON schema to extraction prompt (fixes null-field regression)
- Reduced system prompt from 450 to 280 tokens (18% cost reduction)
### Fixed
- Sentiment prompt now handles mixed-language input correctly
### Regression: PASS (14/14 cases)
## [v1.2.0] — [Date]
...
```
**File structure:**
```
prompts/
├── CHANGELOG.md
├── production/ ← What's running in prod
├── staging/ ← Candidates under testing
├── archive/ ← Old versions (never delete)
├── tests/
│ ├── regression.json
│ └── edge_cases.json
└── results/
└── ab_test_[date].json
```
### 9.4 Common Prompt Engineering Pitfalls
| Pitfall | Description | Fix |
|---|---|---|
| **Prompt brittleness** | Works on test cases; breaks on edge cases | Always test with empty input, very long input, unicode, code injection |
| **Instruction conflicts** | "Be concise" + "be thorough" in same prompt | Resolve contradictions; prioritize one constraint |
| **Implicit format assumptions** | Model guesses the format | Always specify format explicitly |
| **Skipping regression tests** | Every prompt edit risks breaking prior cases | Build a regression suite before any changes |
| **Optimizing wrong metric** | Low token cost matters less than high accuracy for high-stakes | Match optimization target to task stakes |
| **System prompt bloat** | 2,000-token prompts that could be 200 | Test leaner versions — quality often holds |
| **Model-specific prompts** | GPT-4-tuned prompt degrades on Claude and vice versa | Test cross-model before deploying |
### 9.5 Creative Prompt Template Library (10 Templates)
```
1. VISUAL BRIEF → AI IMAGE PROMPT
Convert this creative brief to an optimized image prompt:
Brief: {{brief}}
Style: {{style_reference}}
Restrictions: {{what_to_avoid}}
Output a single, detailed prompt optimized for photorealistic AI image generation.
2. SCRIPT → VOICEOVER DIRECTION
Convert this script to voice direction for TTS:
Script: {{script}}
Target emotion: {{emotion}}
Pace: {{pace: slow/medium/fast}}
Emphasis points: {{where_to_stress}}
Output: Annotated script with [PAUSE] markers and [EMPH:word] emphasis tags.
3. BRIEF → VIDEO STORYBOARD
Create a 5-shot video storyboard from this brief:
Brief: {{brief}}
Duration: {{total_seconds}}
Style: {{visual_reference}}
For each shot: describe the camera angle, action, lighting, and a ready-to-use video generation prompt.
4. TOPIC → HEADLINE OPTIONS
Generate 10 headline variations for: {{topic}}
Audience: {{audience}}
Tone: {{tone_attributes}}
Include: question format, contrarian format, number list format, how-to format, and specificity format.
5. CONTENT → REPURPOSING PLAN
This is a {{content_type}} about {{topic}}:
{{content}}
Generate a repurposing plan producing 8 derivative assets for different platforms.
For each asset: platform, format, key angle, draft content.
6. BRAND → VOICE SAMPLE
Apply this brand voice to the following draft:
Brand: {{archetype}} archetype, {{tone_attributes}} tone, {{formality}} formality level
Draft: {{draft}}
Rewrite it to fully embody the brand voice. Preserve all factual content.
7. DATA → VISUAL CONTENT BRIEF
Convert this data into a visual content plan:
Data: {{data_points}}
Target platform: {{platform}}
Create: (a) key insight headline, (b) infographic outline, (c) 3 social post angles using the data.
8. PERSONA → CONTENT IDEAS
For the following audience persona:
{{persona_description}}
Generate 15 content ideas across:
- 5 educational topics they'd search for
- 5 aspirational topics they'd engage with
- 5 conversational topics they'd respond to
9. COMPETITOR ANALYSIS → CONTENT GAPS
Here are topics covered by our top 3 competitors:
{{competitor_content_list}}
Here are topics we've covered:
{{our_content_list}}
Identify: (a) topics they cover we don't, (b) angles they miss, (c) 10 content opportunities to differentiate.
10. PERFORMANCE DATA → CONTENT STRATEGY
Here is our content performance data for the last 90 days:
{{performance_data}}
Analyze: (a) patterns in top performers, (b) common traits of underperformers,
(c) 5 strategic recommendations for next quarter's content mix.
```
---
## Section 10: Unique Perplexity Computer Capabilities
These capabilities are native to Perplexity Computer and cannot be replicated through prompt engineering or code execution alone.
### 10.1 AI Video Generation
**What it does:** Generates actual MP4 video clips using Sora 2, Sora 2 Pro, Veo 3.1, and Veo 3.1 Fast models.
**When to use:**
- Brand videos, product showcases, social media content
- Visual demonstrations when screenshots/images are insufficient
- Abstract motion graphics for presentations or websites
- Longer narratives assembled from multiple clips
**Parameters:**
- `model`: sora_2 (default), sora_2_pro, veo_3_1, veo_3_1_fast
- `duration_seconds`: 4, 8, 12 (Sora); 4, 6, 8 (Veo)
- `aspect_ratio`: 16:9 or 9:16
- `image_path`: Optional starting frame for img2video
**Workflow reference:** Section 5.4 (AI Video Generation)
### 10.2 AI Image Generation
**What it does:** Generates actual PNG images using nano_banana_2 and nano_banana_pro models.
**When to use:**
- Blog headers and featured images
- Social media visuals
- Brand illustrations and graphics
- Product mockups and lifestyle imagery
- Style-transferred versions of existing images (img2img)
**Parameters:**
- `model`: nano_banana_2 (default), nano_banana_pro
- `aspect_ratio`: 1:1, 16:9, 9:16, 4:3, 3:4
- `images`: Up to 10 reference images for img2img
- `prompt`: Detailed description (see Section 2.3)
**Not for:** Charts, graphs, timelines, infographics with specific data — the model will hallucinate incorrect values.
### 10.3 Text-to-Speech & Voice Production
**What it does:** Converts text to natural-sounding speech audio using Gemini 2.5 Pro TTS and ElevenLabs TTS v3.
**When to use:**
- Voiceovers for video content
- Podcast production
- Audio versions of written content
- Product demos with narration
- Multi-speaker dialogue production
**Key differentiator:** Multi-speaker JSON format enables full podcast/dialogue production with 2+ distinct voices without needing any recording equipment.
**Workflow reference:** Section 6 (Audio & Speech)
### 10.4 Audio Transcription
**What it does:** Transcribes audio and video files with speaker diarization, word-level timestamps, and 99-language support.
**When to use:**
- Transcribing interviews, podcasts, and meetings
- Creating searchable text from audio content
- Repurposing video content into written assets
- Subtitle generation
**Key differentiator:** Speaker diarization up to 32 speakers makes it viable for large meetings and panel discussions.
### 10.5 Live Website Deployment
**What it does:** Builds and deploys websites, web apps, and web games accessible via a public URL.
**When to use:**
- Campaign landing pages
- Interactive tools or calculators
- Portfolio or showcase sites
- Event pages
- Product prototypes
**Key differentiator:** Unlike local HTML artifacts, Perplexity Computer-deployed sites are publicly accessible via a real URL — shareable with anyone without requiring the recipient to run code.
**Workflow reference:** Section 4 (Frontend Design & Web Artifacts)
### 10.6 Social Media Trend Research
**What it does:** Searches X/Twitter in real time with advanced operators for trend discovery, competitor monitoring, and audience research.
**When to use:**
- Content ideation: discover what topics are gaining traction
- Competitor monitoring: track what competitors are posting and how audiences respond
- Brand listening: find mentions, reactions, and sentiment
- Trend-to-content pipeline: identify a trending topic → create relevant content → publish before the trend peaks
**Operators available:**
```
#hashtag — posts containing hashtag
@username — posts mentioning user
from:user — posts from specific user
to:user — replies to specific user
is:retweet — include retweets
-is:retweet — exclude retweets
is:reply — include replies
is:quote — include quote tweets
```
**Content ideation workflow:**
```
1. search_social for "#[industry] -is:retweet" (recent, original posts)
2. Identify posts with high engagement or recurring themes
3. Note language patterns audiences use (use their words, not yours)
4. Find topics competitors haven't addressed yet
5. Create content that enters the existing conversation
```
### 10.7 400+ App Integrations
**What it does:** Connects to external services for content distribution, CRM updates, analytics gathering, and workflow automation.
**Relevant integrations for content work:**
- **Email platforms** (Gmail, Outlook): Distribute newsletters, track opens
- **Social schedulers** (Buffer, Hootsuite): Schedule posts across platforms
- **CMS platforms** (WordPress, Webflow, Notion): Publish content directly
- **Analytics** (Google Analytics, Mixpanel): Pull performance data
- **Design tools** (Canva, Figma — via API): Retrieve or update assets
- **CRM systems** (Salesforce, HubSpot): Segment content by customer stage
**Content distribution automation workflow:**
```
1. Write content → 2. Generate visuals → 3. Post to primary platform
→ 4. Schedule repurposed versions for other platforms
→ 5. Add to email newsletter queue
→ 6. Update CRM with content touchpoint
→ 7. Schedule performance review at D+7 and D+30
```
### 10.8 Scheduled Content Monitoring
**What it does:** Runs tasks on a schedule — daily, weekly, or custom intervals.
**Content applications:**
- Weekly performance reports: pull analytics data → summarize in email
- Trend monitoring: daily social search for brand mentions or competitor content
- Content gap alerts: weekly check if competitors published on priority topics
- Calendar reminders: flag upcoming publish dates that need assets created
- SEO rank tracking: periodic keyword position monitoring
### 10.9 Perplexity Computer Creative Production Stack
The full creative production workflow unique to Perplexity Computer:
```
RESEARCH
↓ search_web (trend research, keyword discovery)
↓ search_social (social listening, competitor content audit)
↓ fetch_url (read competitor pages, gather references)
PLANNING
↓ Create content brief (Section 8.7)
↓ Fill content calendar (Section 8.3)
↓ Build storyboard for video/audio (Section 5.5)
CREATION
↓ Write copy (Section 7 frameworks)
↓ generate_image (Section 2.3) — blog headers, social visuals
↓ generate_video (Section 5.4) — video content
↓ text_to_speech (Section 6.1) — voiceovers, podcasts
↓ Build web experience (Section 4) — landing pages, microsites
DISTRIBUTION
↓ call_external_tool (social schedulers, email platforms, CMS)
↓ Deploy live website via sandbox
MONITORING
↓ Scheduled performance tracking
↓ search_social for brand/content mentions
↓ Performance review → next cycle input
```
---
## Quick Reference: Decision Trees
### "What creative tool do I need?"
```
Making a static image?
→ Already have a reference to transform? → generate_image with images=[ref] (img2img)
→ Need photorealistic AI image? → generate_image (nano_banana_2)
→ Need programmatic design (poster, PDF)? → Canvas Design workflow (Python)
→ Need generative/algorithmic art? → Algorithmic Art workflow (p5.js)
Making a video?
→ Short clip (4–12 sec)? → generate_video (sora_2)
→ Long-form video? → Multiple clips → stitch with ffmpeg
→ Animated GIF for Slack? → Slack GIF Creator (PIL)
→ CSS animation for web? → Frontend Design workflow
Making audio?
→ Voiceover (single voice)? → text_to_speech (.txt file)
→ Podcast/dialogue (2 voices)? → text_to_speech (.json file, 2 speakers)
→ Complex production (3+ voices)? → text_to_speech (ElevenLabs) or .json with 3+ speakers
→ Transcribing audio? → transcribe_audio
Making web content?
→ Simple HTML experience? → Plain HTML/CSS/JS
→ Component-rich app? → React + shadcn/ui (Web Artifacts Builder)
→ Live public website? → website-building skill + sandbox deployment
Writing copy?
→ Blog post? → Section 7.3 templates
→ Social media? → Section 7.4 templates
→ Email? → Section 7.5 templates
→ Brand voice? → Section 3 (Voice framework)
→ SEO content? → Section 7.7 (SEO framework)
```
### "What do I need to build first?"
```
New brand from scratch?
→ Section 3.9 (Brand Identity Brief) → Section 3.2 (Archetype) → Section 3.3–3.5 (Voice)
Content strategy?
→ Section 8.1 (Pillar strategy) → Section 8.2 (Monthly framework) → Section 8.3 (Calendar)
Single piece of content?
→ Section 7.1 (Master workflow) → Section 7.3–7.5 (Templates)
Creative production?
→ Section 2.5 (Creative brief) → Choose modality → Execute
```
---
## Appendix: Dependencies Reference
### Python Libraries (Canvas Design, Generative Art, GIF Creation)
```bash
# Canvas/PDF design
pip install reportlab matplotlib pillow
# Algorithmic art (runs in HTML via p5.js CDN — no Python install needed)
# GIF creation
pip install pillow imageio numpy
# Audio post-processing
# Use ffmpeg (pre-installed in Perplexity Computer workspace)
```
### JavaScript / CDN Dependencies
```html
<!-- p5.js for generative art -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.9.0/p5.min.js"></script>
<!-- React for web artifacts -->
<!-- Handled automatically by Web Artifacts Builder scripts -->
<!-- Motion for React animations -->
<!-- npm install framer-motion -->
```
### Fonts
**Programmatic design (Canvas Design):**
- Fonts stored in `./canvas-fonts` directory within the skill
- Download from Google Fonts or system fonts for programmatic use
**Web (Frontend Design):**
- Import via Google Fonts CDN in `<head>`
- Preferred for online use: Google Fonts, Adobe Fonts, Font Share
**TTS:**
- No font dependencies — voice is determined by model and voice parameter selection
---
*Content & Creative Super-Skill v1.0 — Merged from 14 source skills across anthropics/skills, alirezarezvani/claude-skills, and Perplexity Computer built-in capabilities.*---
name: content-creative-super-skill
description: Comprehensive creative studio skill merging Perplexity Computer's video production, speech synthesis, image generation, and website building with Claude Code's canvas design, algorithmic art, brand guidelines, frontend design, artifacts builder, content frameworks, content calendar, and prompt engineering. Use when creating visual content, designing interfaces, building brands, generating videos/images/audio, writing content, planning content calendars, or doing any creative production work.
license: MIT
metadata:
author: get-zeked
version: '1.0'
---
# Content & Creative Super-Skill
A complete creative production manual merging the best of Perplexity Computer's AI-native creative tools with Claude Code's battle-tested design, content, and engineering frameworks. Use this skill whenever any creative, brand, design, content, audio, or video task is on the table.
---
## Table of Contents
1. [Gap Analysis: Perplexity Computer vs Claude Code](#section-1-gap-analysis-table)
2. [Visual Design & Canvas](#section-2-visual-design--canvas)
3. [Brand Identity & Guidelines](#section-3-brand-identity--guidelines)
4. [Frontend Design & Web Artifacts](#section-4-frontend-design--web-artifacts)
5. [Generative Art & Animation](#section-5-generative-art--animation)
6. [Audio & Speech](#section-6-audio--speech)
7. [Content Creation & Copywriting](#section-7-content-creation--copywriting)
8. [Content Calendar & Planning](#section-8-content-calendar--planning)
9. [Prompt Engineering for Creative Work](#section-9-prompt-engineering-for-creative-work)
10. [Unique Perplexity Computer Capabilities](#section-10-unique-perplexity-computer-capabilities)
---
## Section 1: Gap Analysis Table
Understanding what each ecosystem brings — and where the merged super-skill adds new power.
### Capability Comparison Matrix
| Capability | Perplexity Computer | Claude Code | Merged Super-Skill Addition |
|---|---|---|---|
| AI image generation | ✅ nano_banana_2, nano_banana_pro; photorealistic, illustration, artistic; img2img; 1:1, 16:9, 9:16, 4:3, 3:4 | ❌ No native image gen tool | Design-prompt templates optimized for nano_banana models; img2img reference workflows |
| AI video generation | ✅ Sora 2, Sora 2 Pro, Veo 3.1, Veo 3.1 Fast; 4–12 sec clips; landscape/portrait | ❌ No native video gen | Storyboarding framework; frame-chain scripts; clip-stitching pipelines |
| Text-to-speech | ✅ Gemini 2.5 Pro TTS, ElevenLabs TTS v3; multi-speaker JSON dialogue; 99 languages; diarization | ❌ No native TTS | Voice casting guide; podcast production workflow; diarization labeling conventions |
| Audio transcription | ✅ 99 languages, speaker diarization, word/character timestamps | ❌ | Transcription QA checklist; speaker labeling guide |
| Layout-based visual design | ❌ No programmatic canvas | ✅ Canvas Design skill (PNG/PDF via Python/reportlab) | Philosophy-first design workflow; multi-page coffee-table layout pattern |
| Generative/algorithmic art | ❌ | ✅ Algorithmic Art skill (p5.js, seeded randomness, particle systems) | Seeded-art variation explorer; Art Blocks–style collection workflow |
| Animated GIFs | ❌ | ✅ Slack GIF Creator (PIL, easing, validators) | Slack GIF cheat-sheet; animation concept library |
| Website/web app building | ✅ website-building skill (design system, Tailwind, motion, quality standards) | ✅ Frontend Design + Web Artifacts Builder (React, TypeScript, shadcn/ui) | Unified quality checklist; stack-selection decision tree |
| Brand voice framework | ✅ marketing-brand-voice (5 dimensions, tone adaptation, consistency audits) | ✅ Brand Guidelines (Anthropic colors/fonts) + alirezarezvani brand voice (Jung's archetypes) | Combined 12-archetype brand identity system; multi-channel consistency matrix |
| Content frameworks | ❌ | ✅ Content Creator (blog, social, email templates); Content Frameworks (how-to, listicle, case study, thought leadership) | Extended with video scripts, landing page copy, press release frameworks |
| SEO optimization | ❌ | ✅ SEO Optimizer tool (keyword density, heading structure, meta tags) | SEO workflow integrated with Perplexity's live web research for keyword discovery |
| Content calendar | ❌ | ✅ Monthly calendar template + pillar strategy | Extended with platform-timing data and repurposing matrix |
| Prompt engineering | ❌ Prompts inferred from tool parameters | ✅ Prompt Engineer Toolkit (zero-shot → meta-prompting; A/B testing; version control) + Senior Prompt Engineer (RAG, agent orchestration) | Creative-specific prompt templates: image gen, video gen, voiceover, brand copywriting |
| Live web research | ✅ search_web, fetch_url, search_social | ❌ | Content ideation workflow: trend research → brief → content → distribution |
| Social media monitoring | ✅ search_social (X/Twitter operators) | ❌ | Trend-to-content pipeline; competitor content audit protocol |
| 400+ app integrations | ✅ External tool connectors (Gmail, Notion, Slack, CRM, etc.) | ❌ | Content distribution automation; cross-platform publishing workflow |
| Scheduled monitoring | ✅ Scheduled tasks | ❌ | Content performance monitoring cadence |
### What Only Perplexity Computer Can Do (Native Differentiators)
- Generate actual video clips with Sora/Veo models (not storyboards — actual MP4s)
- Generate actual images with nano_banana models (not Python drawings — real AI images)
- Synthesize speech audio (Gemini TTS, ElevenLabs)
- Transcribe audio/video files with speaker diarization
- Deploy live websites accessible via public URL
- Search X/Twitter for real-time creative trends
- Connect to 400+ external services for content distribution
- Schedule recurring content monitoring and reporting
### What Only Claude Code Brings (Complementary Strengths)
- Algorithmic/generative art via p5.js with seeded randomness
- Programmatic canvas design outputting museum-quality PNG/PDF
- Animated GIF production with PIL + easing functions
- Complex multi-component React/TypeScript/shadcn web artifacts
- Deep SEO analysis tooling
- Systematic prompt engineering with regression testing and version control
- RAG evaluation and agent orchestration frameworks
### Merged Additions (New in Super-Skill)
- Unified creative brief template applicable across all output modalities
- Cross-platform content repurposing matrix (1 idea → 10 assets)
- Platform-specific image and video dimension cheat sheet
- Creative direction frameworks (aesthetic movement naming, mood board vocabulary)
- Brand-to-production pipeline: brand identity → content strategy → production → distribution
- Voice casting guide for multi-speaker productions
---
## Section 2: Visual Design & Canvas
**Sources merged:** Canvas Design (anthropics/skills) + generate_image tool (Perplexity Computer) + design principles
### 2.1 Choosing Your Visual Production Method
| Need | Tool | Output |
|---|---|---|
| Museum/poster quality static design | Canvas Design workflow (Python/reportlab/matplotlib) | PNG or PDF |
| AI photorealistic image | generate_image (nano_banana_2) | PNG |
| AI illustration/artistic | generate_image (nano_banana_pro for complex) | PNG |
| Animate from an existing image | generate_image with image_path reference (img2img) | PNG |
| Multi-page design/coffee table book | Canvas Design multi-page workflow | PDF |
| Generative art (interactive, animated) | Algorithmic Art workflow (p5.js) | HTML artifact |
### 2.2 Design Philosophy Creation Workflow
Before producing any visual output, establish a **Visual Philosophy** — an aesthetic movement that guides all creative decisions.
#### Step 1: Name the Movement (1–2 words)
Examples: "Brutalist Joy" / "Chromatic Silence" / "Metabolist Dreams" / "Concrete Poetry" / "Analog Meditation"
#### Step 2: Write the Philosophy Manifesto (4–6 paragraphs)
Address each dimension once, without repetition:
- **Form and space**: How do forms relate to negative space? Monumental or intimate?
- **Color and material**: What palette governs? What textures or material qualities?
- **Scale and rhythm**: What is the relationship of large to small, fast to slow?
- **Composition and balance**: Symmetry, asymmetry, diagonal flow, grid-breaking?
- **Visual hierarchy**: Where does the eye go first, second, last?
**Critical requirement:** Emphasize craftsmanship repeatedly — the final work must look "meticulously crafted," "the product of deep expertise," "painstaking attention," "master-level execution."
#### Step 3: Identify the Conceptual Seed
Extract the subtle, niche reference embedded in the user's request. This is the soul woven invisibly into the art — like a jazz musician quoting another song. Only those who know will catch it; everyone else experiences a masterful composition.
#### Step 4: Execute on Canvas
Rules for canvas execution:
- 90% visual, 10% essential text (text as visual accent, not explanation)
- Nothing overlaps or falls off canvas boundaries — proper margins always
- Typography is design-forward: search `./canvas-fonts` for unique fonts; pair a distinctive display font with a refined body font
- Never use generic fonts (Arial, Inter, Roboto, system fonts)
- Aim for work that looks like it took countless hours by someone at the top of their field
- For refinement passes: make existing elements more cohesive rather than adding new elements
#### Step 5: Refinement Pass
When refining, ask: "How can I make what's already here more of a piece of art?" Avoid adding more shapes or graphics. Instead: tighten spacing, improve color harmony, strengthen typographic choices, deepen compositional balance.
### 2.3 AI Image Generation (Perplexity Computer)
#### Models
- **nano_banana_2** — Default. Photorealistic photos, clean illustrations, decorative graphics. Fast.
- **nano_banana_pro** — Higher quality/detail for complex artistic work.
#### Aspect Ratios
| Ratio | Use Case |
|---|---|
| 1:1 | Social media posts, avatars, thumbnails |
| 16:9 | Blog headers, YouTube thumbnails, presentation slides |
| 9:16 | Instagram Stories, TikTok, vertical social |
| 4:3 | Standard landscape, website banners |
| 3:4 | Standard portrait, Pinterest, editorial |
#### Effective Image Prompt Structure
```
[Style descriptor] [Subject/scene] [Composition notes] [Color palette] [Lighting/mood] [Technical quality notes]
```
**Example — Photorealistic:**
```
Photorealistic professional product photo of a sleek black leather wallet on a marble surface,
centered composition with shallow depth of field, warm amber and cream tones, soft natural
window light from the left, studio-quality with subtle shadow, no text
```
**Example — Illustration:**
```
Flat vector illustration of a mountain landscape at dusk, geometric shapes,
layered silhouettes in deep navy, burnt orange, and dusty rose,
minimal and modern, suitable for app background, no text
```
**Example — Artistic:**
```
Oil painting style portrait of a woman reading in a library,
Renaissance lighting, rich chestnut and gold palette,
painterly brushstrokes, museum-quality composition, moody and contemplative
```
#### img2img Workflow (Reference Images)
When animating or transforming an existing image:
1. Provide up to 10 reference images via `images` parameter
2. Describe the style transfer or edit clearly
3. Specify what to preserve vs. what to change
```
Transform this product photo to match the visual style of the reference images:
muted warm tones, slight grain texture, editorial magazine aesthetic.
Preserve the product placement and composition.
```
### 2.4 Design Principles Quick Reference
#### Color Theory
- **Analogous**: Adjacent on color wheel — harmonious, low contrast (e.g., blue + blue-green + teal)
- **Complementary**: Opposite — high contrast, vibrant tension (e.g., orange + blue)
- **Triadic**: Three evenly spaced — balanced, energetic (e.g., red + yellow + blue)
- **Split-complementary**: One color + two adjacent to its complement — softer than complementary
- **Monochromatic**: One hue, varying saturation/value — sophisticated, cohesive
#### Dominant Color Systems
- Set a **dominant color** (60%), a **secondary color** (30%), and an **accent** (10%)
- Dominant colors with sharp accents outperform timid, evenly-distributed palettes
- Use CSS custom properties / design tokens for consistency across components
#### Typography Pairing Rules
- Pair a distinctive **display font** (headings, large text) with a refined **body font** (readable at small sizes)
- Never use: Inter, Roboto, Arial as primary display fonts
- Strong pairing examples: Playfair Display + Source Serif Pro / Clash Grotesk + Instrument Serif / Bebas Neue + DM Sans
- Weight contrast: bold display vs. regular body creates visual hierarchy without color
#### Composition Principles
- **Rule of thirds**: Place key elements at grid intersections
- **Visual weight**: Larger, darker, and more saturated elements carry more weight
- **Negative space**: Intentional emptiness creates breathing room and focus
- **Alignment**: Every element should align to a grid or another element — never float arbitrarily
- **Hierarchy**: One dominant element, one secondary, everything else subordinate
### 2.5 Creative Brief Template (Visual Projects)
```markdown
## Visual Creative Brief
**Project name:**
**Deliverable format:** [ ] PNG [ ] PDF [ ] HTML [ ] Video [ ] GIF
**Dimensions/aspect ratio:**
**Brand context:** (existing brand OR new brand OR no brand constraints)
**Objective:** What does this piece need to accomplish?
**Target audience:** Who will see it and what should they feel?
**Key message:** The single most important thing to communicate
**Visual direction:**
- Aesthetic movement/philosophy name:
- Mood reference (3 adjectives):
- Color palette constraint (if any):
- Typography constraint (if any):
- Elements to include:
- Elements to avoid:
**Conceptual seed/reference:** (subtle, niche — not literal)
**Delivery deadline:**
**Approval contacts:**
```
---
## Section 3: Brand Identity & Guidelines
**Sources merged:** Brand Guidelines (anthropics/skills) + Brand Voice Framework (alirezarezvani/claude-skills) + marketing-brand-voice (Perplexity Computer built-in skill)
### 3.1 Brand Architecture Overview
A complete brand identity has five layers:
1. **Foundation**: Mission, vision, values, purpose
2. **Personality**: Archetype + tone attributes
3. **Voice System**: Voice dimensions, writing principles, language guidelines
4. **Visual Identity**: Color system, typography, iconography, photography style
5. **Application**: Channel-specific guidelines, consistency audits
### 3.2 Jung's 12 Brand Personality Archetypes
Select one **primary** and one **secondary** archetype. The primary dominates; the secondary adds nuance.
| Archetype | Core Desire | Brand Tone | Content Style | Example Brands |
|---|---|---|---|---|
| **The Innocent** | Safety, happiness | Optimistic, sincere, honest | Simple, wholesome, nostalgic | Dove, Coca-Cola |
| **The Everyman** | Belonging, connection | Friendly, humble, unpretentious | Relatable, inclusive, casual | IKEA, Target |
| **The Hero** | Mastery, courage | Bold, inspiring, competent | Achievement-focused, empowering | Nike, FedEx |
| **The Outlaw** | Liberation, revolution | Edgy, disruptive, provocative | Rule-breaking, anti-establishment | Harley-Davidson, Virgin |
| **The Explorer** | Freedom, discovery | Adventurous, restless, authentic | Journey-focused, expansive | REI, Jeep |
| **The Creator** | Innovation, expression | Imaginative, visionary, original | Craft-focused, detail-oriented | Apple, Adobe |
| **The Ruler** | Control, order, quality | Authoritative, commanding, refined | Premium, exclusive, prestigious | Mercedes-Benz, Rolex |
| **The Magician** | Transformation, wonder | Mystical, visionary, charismatic | Transformation narratives, possibility | Disney, Dyson |
| **The Lover** | Intimacy, pleasure | Passionate, sensual, warm | Desire-driven, emotionally resonant | Chanel, Häagen-Dazs |
| **The Caregiver** | Service, nurturing | Compassionate, patient, supportive | Helping, protective, community | Johnson & Johnson, UNICEF |
| **The Jester** | Enjoyment, humor | Playful, humorous, irreverent | Entertainment-first, self-aware | Old Spice, Dollar Shave Club |
| **The Sage** | Knowledge, truth | Knowledgeable, confident, analytical | Data-driven, educational, authoritative | Google, Harvard |
### 3.3 Brand Voice Framework — 5 Dimensions
For each dimension, place the brand on the spectrum:
#### Dimension 1: Formality
```
Formal ←————————————————→ Casual
| | | |
Legal Professional Conversational Casual
```
- **Formal**: Investor comms, legal docs, crisis responses
- **Professional**: B2B whitepapers, case studies, press releases
- **Conversational**: Blog posts, social media, email newsletters
- **Casual**: Community posts, behind-the-scenes content
#### Dimension 2: Expertise Expression
```
Expert ←————————————————→ Peer
| | | |
Authority Guide Knowledgeable Peer
```
#### Dimension 3: Energy Level
```
High Energy ←————————————→ Calm
| | | |
Energetic Motivating Measured Serene
```
#### Dimension 4: Emotional Warmth
```
Warm ←———————————————————→ Cool
| | | |
Nurturing Friendly Professional Clinical
```
#### Dimension 5: Directness
```
Direct ←—————————————————→ Suggestive
| | | |
Imperative Clear Inviting Narrative
```
### 3.4 Tone Attributes Selection
Choose 3–5 primary tone attributes:
| Attribute | Description | Sample Phrase |
|---|---|---|
| **Authoritative** | Industry expert positioning | "Our research shows that 87% of businesses..." |
| **Friendly** | Approachable and warm | "We get it — this can be overwhelming..." |
| **Innovative** | Forward-thinking, visionary | "The future of X is already here..." |
| **Trustworthy** | Reliable, transparent | "Here's exactly what happened and why..." |
| **Inspiring** | Motivational, uplifting | "You have the power to transform..." |
| **Educational** | Informative, helpful | "Here's how to think about this step by step..." |
| **Witty** | Clever, entertaining (use sparingly) | "Plot twist: the data actually says..." |
| **Empathetic** | Understanding, validating | "We know you've been frustrated by this..." |
### 3.5 Language System
#### Words to Use (by archetype)
- **Action verbs**: Transform, accelerate, optimize, unlock, elevate, pioneer, craft, build, shape
- **Positive descriptors**: Seamless, powerful, intuitive, strategic, intentional, thoughtful
- **Outcome-focused**: Results, growth, impact, clarity, momentum, trust, confidence
#### Words to Avoid (universal)
- **Jargon**: Synergy, leverage (as verb), bandwidth (for availability), circle back, move the needle
- **Overused claims**: Innovative, disruptive, cutting-edge (unless genuinely applicable)
- **Weak qualifiers**: Very, really, just, maybe, hopefully, kind of, sort of
- **Negative framing**: Can't, won't, impossible — replace with challenge, opportunity, working on
### 3.6 Anthropic Brand Color System (Reference)
For outputs that should carry Anthropic brand identity:
| Color Role | Hex | Usage |
|---|---|---|
| Dark (primary text, dark backgrounds) | `#141413` | Headings, primary text, dark mode background |
| Light (light backgrounds, text on dark) | `#faf9f5` | Page backgrounds, text on dark |
| Mid Gray (secondary elements) | `#b0aea5` | Subheadings, captions, metadata |
| Light Gray (subtle backgrounds) | `#e8e6dc` | Cards, dividers, subtle sections |
| Orange (primary accent) | `#d97757` | CTAs, highlights, links |
| Blue (secondary accent) | `#6a9bcc` | Secondary actions, info states |
| Green (tertiary accent) | `#788c5d` | Success states, tags, supporting accents |
**Typography:**
- Headings (24pt+): **Poppins** (Arial fallback)
- Body text: **Lora** (Georgia fallback)
### 3.7 Brand Voice Consistency Audit Checklist
Run this audit before publishing any content:
**Voice Alignment**
- [ ] Matches selected archetype(s) — does it feel like the brand?
- [ ] Tone attributes are present (3–5 you selected)
- [ ] Formality level appropriate for the channel
- [ ] Perspective (we/you/third person) consistent with brand choice
**Language Quality**
- [ ] No jargon or banned words
- [ ] Active voice ≥80% of sentences
- [ ] Benefits emphasized over features
- [ ] "You" appears more than "we"
**Structure**
- [ ] Clear value proposition in first paragraph
- [ ] Appropriate call to action for the piece
- [ ] Mobile-friendly formatting (short paragraphs, scannable)
- [ ] Oxford commas used consistently
**Inclusivity**
- [ ] Gender-neutral language throughout
- [ ] No idioms that don't translate globally
- [ ] Diverse perspectives represented where relevant
- [ ] Accessible formatting (proper heading hierarchy, alt text for images)
### 3.8 Channel-Specific Voice Adaptations
| Channel | Formality | Length | Key Principle |
|---|---|---|---|
| Website homepage | Professional | Scannable, short | Benefit-first headlines, 6–12 words |
| Blog post | Conversational | 1,500–2,500 words | Hook in first 50 words; value every section |
| LinkedIn | Professional–Conversational | 150–300 words | Insight + story + question |
| Twitter/X | Casual | 280 chars | Bold opener that stops the scroll |
| Instagram | Casual–Conversational | 100–200 words + hashtags | Story first; hashtags in a block below |
| Email newsletter | Conversational | Scannable | One main message; personal observation opener |
| Promotional email | Conversational | Short | Pain point → benefit → CTA → urgency |
| Press release | Formal | 400–600 words | Inverted pyramid; data-led |
| Case study | Professional | 800–1,200 words | Challenge → solution → measurable results |
### 3.9 Brand Identity Creative Brief Template
```markdown
## Brand Identity Brief
**Brand name:**
**Industry/sector:**
**Founded/launch date:**
**Tagline (current or proposed):**
**Mission statement:** (why do we exist?)
**Vision statement:** (what future are we building?)
**Core values:** (3–5 principles that guide decisions)
**Primary archetype:** (from Jung's 12)
**Secondary archetype:**
**Voice dimensions:**
- Formality: [1=Formal → 5=Casual]:
- Energy: [1=High → 5=Calm]:
- Warmth: [1=Warm → 5=Cool]:
**3 tone attributes:**
**3 words we always use:**
**3 words we never use:**
**Visual direction:**
- Color palette (3–5 hex codes):
- Primary typeface:
- Body typeface:
- Visual style (photographic/illustrative/abstract/typographic):
**Audience personas:** (describe 2–3 primary audiences)
**Competitors to differentiate from:**
**Brand DNA statement:** (one sentence: "We are the only brand that ___")
```
---
## Section 4: Frontend Design & Web Artifacts
**Sources merged:** Frontend Design (anthropics/skills) + Web Artifacts Builder (anthropics/skills) + website-building (Perplexity Computer built-in skill)
### 4.1 Stack Selection Decision Tree
```
What are you building?
│
├─ Simple single-page HTML experience (no framework needed)
│ → Plain HTML/CSS/JS artifact
│ → Focus on CSS animations, custom properties, vanilla JS
│
├─ Component-rich interactive app (state management, routing)
│ → React 18 + TypeScript + Vite + Tailwind CSS + shadcn/ui
│ → Use Web Artifacts Builder workflow
│
├─ Full website requiring live deployment and public URL
│ → website-building skill (HTML/CSS/JS + Tailwind)
│ → Deploy via Perplexity Computer sandbox
│
└─ Generative/algorithmic interactive art
→ p5.js single HTML artifact
→ See Section 5 (Generative Art)
```
### 4.2 Design Thinking Before Coding
Before writing a single line of code, answer:
1. **Purpose**: What problem does this interface solve? Who uses it?
2. **Tone**: Commit to an aesthetic extreme — don't default to "clean and modern"
- Brutally minimal / Maximalist chaos / Retro-futuristic / Organic/natural
- Luxury/refined / Playful/toy-like / Editorial/magazine / Brutalist/raw
- Art deco/geometric / Soft/pastel / Industrial/utilitarian / Cyberpunk
3. **Differentiation**: What is the one thing someone will remember?
4. **Typography anchor**: Which font pair defines the visual identity?
**Critical rule:** Bold maximalism and refined minimalism both succeed — what fails is timidity. Execute your chosen aesthetic with full commitment and precision.
### 4.3 Frontend Aesthetics Guidelines
#### Typography
- Choose fonts that are **beautiful, unique, and interesting**
- Never default to: Inter, Roboto, Arial, system-ui as display fonts
- Strong display choices: Clash Grotesk, Playfair Display, Bebas Neue, Canela, Fraunces, Syne, General Sans
- Strong body choices: Source Serif Pro, DM Sans, Instrument Sans, Literata, Spectral
- Pair a distinctive display font with a refined, readable body font
#### Color & Theme
- Commit to a **cohesive aesthetic** — use CSS custom properties for consistency
- Set a dominant color (60%), secondary (30%), accent (10%)
- Dominant + sharp accent outperforms timid, evenly distributed palettes
- Never default to purple gradients on white backgrounds
#### Motion & Animation
- CSS-only for HTML projects; Motion library for React
- **One well-orchestrated page load** with staggered reveals creates more delight than scattered micro-interactions
- Use `animation-delay` for staggered entry sequences
- Scroll-triggering and hover states that genuinely surprise
- Avoid: janky transitions, gratuitous spinning, motion for motion's sake
#### Spatial Composition
- Unexpected layouts: asymmetry, overlap, diagonal flow, grid-breaking elements
- Generous negative space **or** controlled density — commit to one
- No default centered-column layouts unless the content demands it
#### Backgrounds & Visual Details
- Create atmosphere with: gradient meshes, noise textures, geometric patterns, layered transparencies
- Dramatic shadows, decorative borders, custom cursors, grain overlays when appropriate to the aesthetic
- Never default to `background: #ffffff` without intentional reasoning
### 4.4 Web Artifacts Builder Workflow (React + shadcn/ui)
For complex multi-component artifacts:
```bash
# Step 1: Initialize project
bash scripts/init-artifact.sh <project-name>
cd <project-name>
# Stack auto-configured:
# React 18 + TypeScript + Vite + Tailwind CSS 3.4.1
# 40+ shadcn/ui components pre-installed
# All Radix UI dependencies included
# Path aliases (@/) configured
# Parcel bundler configured
# Step 2: Develop
# Edit src/ files, build components in src/components/
# Step 3: Bundle to single HTML
bash scripts/bundle-artifact.sh
# Creates bundle.html — self-contained, all JS/CSS inlined
# Step 4: Share artifact with user
```
**shadcn/ui component reference:** https://ui.shadcn.com/docs/components
### 4.5 Tailwind CSS Patterns for Creative UIs
```css
/* Mesh gradient background */
.bg-mesh {
background: radial-gradient(at 40% 20%, hsla(28,100%,74%,1) 0px, transparent 50%),
radial-gradient(at 80% 0%, hsla(189,100%,56%,1) 0px, transparent 50%),
radial-gradient(at 0% 50%, hsla(355,100%,93%,1) 0px, transparent 50%);
}
/* Noise texture overlay */
.texture-noise::before {
content: '';
position: absolute;
inset: 0;
background-image: url("data:image/svg+xml,...");
opacity: 0.04;
mix-blend-mode: multiply;
}
/* Staggered reveal animation */
.stagger-reveal > * {
opacity: 0;
transform: translateY(20px);
animation: reveal 0.6s ease forwards;
}
.stagger-reveal > *:nth-child(1) { animation-delay: 0ms; }
.stagger-reveal > *:nth-child(2) { animation-delay: 100ms; }
.stagger-reveal > *:nth-child(3) { animation-delay: 200ms; }
```
### 4.6 Quality Standards Checklist
Before shipping any frontend work:
**Functionality**
- [ ] All interactive elements work correctly
- [ ] No console errors
- [ ] Forms validate and handle errors gracefully
- [ ] Links and navigation function
**Visual Quality**
- [ ] Typography is distinctive and readable at all sizes
- [ ] Color contrast meets WCAG AA (4.5:1 for body text, 3:1 for large text)
- [ ] No generic AI aesthetics (purple gradients, overused fonts, predictable layouts)
- [ ] Committed to a clear aesthetic direction — not trying to be everything
**Responsive Design**
- [ ] Looks good at 320px, 768px, 1280px, 1920px
- [ ] Touch targets ≥44px on mobile
- [ ] Images don't overflow containers
- [ ] No horizontal scroll on mobile
**Performance**
- [ ] No blocking resources in `<head>`
- [ ] Images have `loading="lazy"` where appropriate
- [ ] Animations use `transform` and `opacity` (GPU-composited)
- [ ] No unnecessary re-renders (React)
**Accessibility**
- [ ] Semantic HTML (proper heading hierarchy, landmarks)
- [ ] All images have meaningful `alt` text
- [ ] Keyboard navigation works
- [ ] Focus indicators visible
### 4.7 Landing Page Design System
A high-converting landing page follows this section hierarchy:
```
1. Hero
- Headline: 6–12 words, benefit-focused, above the fold
- Subheadline: 1–2 sentences expanding the headline
- Primary CTA: high contrast, action verb + outcome ("Start free trial")
- Social proof: logos, user count, or rating
- Hero visual: product screenshot, illustration, or video
2. Problem / Agitate
- Describe the pain point the audience knows
- Make them feel understood before offering the solution
3. Solution Introduction
- What the product/service does in plain language
- 3–4 key benefits (not features)
4. Feature Showcase
- Visual demonstration
- Feature-benefit pairs
- Each feature answers: "So what? What can I do with this?"
5. Social Proof
- Testimonials (with real names, photos, company)
- Case study results
- Logos of recognizable customers
6. Pricing / Comparison
- 3 tiers is the standard (good–better–best)
- Highlight the recommended tier
- Annual vs. monthly toggle
7. FAQ
- Address the top 5 objections
- Keep answers short and direct
8. Final CTA
- Repeat the primary CTA
- Add urgency or risk reversal (free trial, money-back guarantee)
```
---
## Section 5: Generative Art & Animation
**Sources merged:** Algorithmic Art (anthropics/skills) + Slack GIF Creator (anthropics/skills) + video-production (Perplexity Computer built-in skill)
### 5.1 Choosing Your Animation Method
| Need | Method | Output |
|---|---|---|
| Generative/algorithmic interactive art | p5.js (Algorithmic Art workflow) | HTML artifact (interactive) |
| Slack emoji or reaction GIF | PIL + GIFBuilder (Slack GIF workflow) | .gif (128×128 or 480×480) |
| Short AI video clip (4–12 sec) | generate_video tool (Sora/Veo) | .mp4 |
| Longer AI video (>12 sec) | Frame chaining + clip stitching | Multiple .mp4s → stitched |
| Product/demo animation | CSS/JS animation (Frontend workflow) | HTML |
| Motion graphics for web | CSS animation + SVG | HTML/CSS |
### 5.2 Algorithmic Art Workflow (p5.js)
#### Algorithmic Philosophy Creation
Like visual design, start with a computational philosophy — an aesthetic movement expressed through code.
**Name the movement:** "Organic Turbulence" / "Quantum Harmonics" / "Recursive Whispers" / "Field Dynamics" / "Stochastic Crystallization"
**Philosophy dimensions to address:**
- Computational processes and mathematical relationships
- Noise functions and randomness patterns
- Particle behaviors and field dynamics
- Temporal evolution and system states
- Parametric variation and emergent complexity
**Essential technical requirements:**
```javascript
// ALWAYS use seeded randomness (Art Blocks pattern)
let seed = 12345;
randomSeed(seed);
noiseSeed(seed);
// Parameter structure
let params = {
seed: 12345,
// Quantities: how many?
// Scales: how big, how fast?
// Probabilities: how likely?
// Ratios: what proportions?
// Angles: what direction?
// Thresholds: when does behavior change?
};
// Standard canvas
function setup() {
createCanvas(1200, 1200);
}
function draw() {
// Your generative algorithm
}
```
#### Required Features for Interactive Viewers
1. **Parameter Controls**: Sliders for numeric params, color pickers, real-time updates, reset button
2. **Seed Navigation**: Current seed display, Prev/Next buttons, Random button, seed input field
3. **Single Artifact**: All p5.js code inline — no external files except p5.js CDN
#### Algorithmic Philosophy Library
**"Organic Turbulence"**
Flow fields driven by layered Perlin noise. Thousands of particles following vector forces, trails accumulating into organic density maps. Multiple noise octaves create turbulent and calm zones. Color emerges from velocity and density.
**"Quantum Harmonics"**
Grid-initialized particles carrying phase values evolving through sine waves. Constructive interference creates bright nodes; destructive creates voids. Simple harmonic motion generates complex emergent mandalas.
**"Recursive Whispers"**
Branching structures subdividing recursively. Each branch constrained by golden ratios, slightly randomized. L-systems generate tree-like forms that feel both mathematical and organic.
**"Field Dynamics"**
Vector fields from mathematical functions. Particles born at edges, flowing along field lines, dying at equilibrium. Visualization shows only ghost-like traces of invisible forces.
**"Stochastic Crystallization"**
Circle packing or Voronoi tessellation. Random points evolving through relaxation until equilibrium. Cells push apart; color based on size, neighbor count, distance from center.
### 5.3 Slack GIF Creator Workflow
#### Slack Requirements
| Format | Dimensions | FPS | Colors | Max Duration |
|---|---|---|---|---|
| Emoji GIF | 128×128 (recommended) | 10–15 | 48 | 3 seconds |
| Message GIF | 480×480 | 10–30 | 48–128 | Any |
#### Core Workflow
```python
from core.gif_builder import GIFBuilder
from PIL import Image, ImageDraw
# 1. Create builder
builder = GIFBuilder(width=128, height=128, fps=10)
# 2. Generate frames
for i in range(12):
frame = Image.new('RGB', (128, 128), (240, 248, 255))
draw = ImageDraw.Draw(frame)
# Draw using PIL primitives (ellipse, polygon, line, rectangle)
builder.add_frame(frame)
# 3. Save with optimization
builder.save('output.gif', num_colors=48, optimize_for_emoji=True)
```
#### Animation Concept Library
| Concept | Technique | Best For |
|---|---|---|
| **Shake/Vibrate** | `math.sin()` offset applied to x and/or y | Alarm, alert, emphasis |
| **Pulse/Heartbeat** | `math.sin(t * freq * 2π)` scaling between 0.8–1.2 | Notifications, likes |
| **Bounce** | `interpolate()` with `easing='bounce_out'` | Celebrations, success |
| **Spin/Rotate** | `image.rotate(angle)` — linear or sine-wave wobble | Loading, processing |
| **Fade In/Out** | RGBA alpha 0→1 or 1→0 | Transitions, reveals |
| **Slide** | Off-screen start, `easing='ease_out'` stop | Appearing messages |
| **Zoom** | Scale 0.1→2.0 or 2.0→1.0, crop center | Impact, focus |
| **Explode** | Particles with random angles/velocities, fade out | Celebrations |
#### Easing Functions Available
```python
from core.easing import interpolate
t = i / (num_frames - 1) # Progress 0.0 → 1.0
y = interpolate(start=0, end=400, t=t, easing='ease_out')
# Available: linear, ease_in, ease_out, ease_in_out,
# bounce_out, elastic_out, back_out
```
#### Graphics Quality Rules
- Always use `width=2` or higher for outlines — thin lines look amateurish
- Add visual depth with gradients, layered shapes, highlights
- Use vibrant, complementary colors with contrast
- For complex shapes: combine polygons + ellipses; calculate points carefully for symmetry
### 5.4 AI Video Generation (Perplexity Computer)
#### Model Selection
| Model | Best For | Clip Length | Cost |
|---|---|---|---|
| **sora_2** | Default. High-quality cinematic footage | 4, 8, 12 sec | Standard |
| **sora_2_pro** | Maximum quality, complex scenes | 4, 8, 12 sec | Premium |
| **veo_3_1** | Fast, photorealistic, diverse styles | 4, 6, 8 sec | Standard |
| **veo_3_1_fast** | Quick iterations, prototyping | 4, 6, 8 sec | Lower |
#### Aspect Ratios
- **16:9** — Landscape/widescreen (YouTube, presentations, TV)
- **9:16** — Portrait/vertical (TikTok, Instagram Stories, Reels)
#### Effective Video Prompt Structure
```
[Camera movement] [Scene description] [Subject action] [Visual style] [Lighting/mood] [Audio cues if any]
```
**Example — Cinematic product:**
```
Slow push-in shot of a glass perfume bottle on a dark marble surface,
amber liquid catching the light as a single drop of water falls onto the marble beside it,
hyper-realistic CGI product commercial style, dramatic chiaroscuro lighting,
cinematic color grade, no text
```
**Example — Lifestyle:**
```
Handheld follow shot of a woman walking through a sun-drenched farmers market,
dappled golden hour light, shallow depth of field,
contemporary lifestyle brand aesthetic, warm analog film look, natural ambient sound
```
**Example — Abstract/artistic:**
```
Fluid simulation of metallic liquid mercury morphing into geometric shapes,
macro lens, mirror-like surface reflections catching colored light,
seamless loop, minimal electronic ambient soundtrack
```
#### Multi-Clip Video Production Workflow
For videos longer than 12 seconds:
```
Step 1: Storyboarding
- Define key scenes and transitions
- Estimate clip count (1 clip per scene/shot)
- Write a prompt for each clip
Step 2: Frame Anchoring (for continuity)
- Generate clip 1 (opening shot)
- Screenshot the final frame of clip 1
- Use that screenshot as image_path for clip 2
→ This creates visual continuity between clips
Step 3: Generate All Clips
- Generate each clip with model, duration, and prompt
- Download all .mp4 files to workspace
Step 4: Stitch Clips
ffmpeg -i clip1.mp4 -i clip2.mp4 -i clip3.mp4 \
-filter_complex "[0:v][1:v][2:v]concat=n=3:v=1:a=0[outv]" \
-map "[outv]" output_final.mp4
Step 5: Add Audio (if needed)
ffmpeg -i output_final.mp4 -i voiceover.mp3 \
-c:v copy -c:a aac -shortest final_with_audio.mp4
```
### 5.5 Video Storyboard Template
```markdown
## Video Storyboard: [Project Name]
**Total duration target:**
**Aspect ratio:** [ ] 16:9 [ ] 9:16
**Style reference:**
**Music/audio brief:**
---
### Clip 1 (Opening)
**Duration:**
**Camera:**
**Scene:**
**Action:**
**Model:**
**Prompt:**
```
[Full video prompt here]
```
**Notes:**
### Clip 2
**Duration:**
**Camera:**
**Scene:**
**Action:**
**Transition from Clip 1:** (describe how they connect)
**Model:**
**Prompt:**
```
[Full video prompt here]
```
[Continue for all clips...]
---
### Audio Track
**Voiceover:** [ ] Yes [ ] No
**Script:**
**Voice:**
**Background music:**
**SFX:**
```
---
## Section 6: Audio & Speech
**Source merged:** speech skill (Perplexity Computer built-in skill) — text-to-speech and transcription
### 6.1 Text-to-Speech System
#### Model Selection
| Model | Best For |
|---|---|
| **gemini_2_5_pro_tts** | Default. High quality, natural prosody, all standard use cases |
| **elevenlabs_tts_v3** | 3+ distinct speakers required, or user explicitly requests ElevenLabs |
**Rule:** Use Gemini (default) unless: (a) user explicitly requests ElevenLabs, or (b) dialogue requires 3+ distinct speakers.
#### Single-Speaker Production
Create a `.txt` file, then call `text_to_speech` with the desired voice.
**Available Gemini Voices (sample):**
| Voice | Character |
|---|---|
| `kore` | Default. Neutral, professional |
| `charon` | Deep, authoritative |
| `fenrir` | Dynamic, energetic |
| `aoede` | Warm, conversational |
| `puck` | Bright, upbeat |
#### Multi-Speaker Dialogue Production
Create a `.json` file with speaker assignments:
```json
[
{"speaker": "aoede", "text": "Welcome to the show. I'm your host, and today we're diving into brand strategy."},
{"speaker": "charon", "text": "Thanks for having me. Brand strategy is something most founders get completely wrong."},
{"speaker": "aoede", "text": "What's the biggest mistake you see?"},
{"speaker": "charon", "text": "They confuse logo design with brand identity. The logo is maybe five percent of the picture."}
]
```
Then call `text_to_speech` with the `.json` file path. Voices are automatically assigned per speaker.
#### 99 Language Support
TTS supports 99 languages. Specify the language in your text content — no separate parameter needed. The model detects and matches language to appropriate phonology.
Common ISO codes for reference:
- English: `en` | Spanish: `es` | French: `fr` | German: `de` | Portuguese: `pt`
- Japanese: `ja` | Korean: `ko` | Chinese: `zh` | Arabic: `ar` | Hindi: `hi`
- Italian: `it` | Dutch: `nl` | Russian: `ru` | Turkish: `tr` | Polish: `pl`
### 6.2 Audio Transcription System
#### Configuration Options
| Parameter | Options | Notes |
|---|---|---|
| `diarize` | true / false | Enable speaker identification |
| `num_speakers` | 1–32 | Hint for diarization accuracy (leave null for auto-detect) |
| `timestamps` | `none` / `word` / `character` | `none` → plain .txt; others → .json with timing |
| `language_code` | ISO 639-1 | Auto-detected if not specified |
#### Supported Formats
`.mp3`, `.wav`, `.mp4`, `.webm`, `.m4a`, `.ogg`, `.flac`
#### Speaker Diarization Labeling Convention
When diarizing multi-speaker content, label consistently:
```
SPEAKER_00: [first speaker heard]
SPEAKER_01: [second speaker heard]
SPEAKER_02: [third speaker heard]
```
For named interviews/podcasts, rename speakers post-transcription:
```python
transcript = transcript.replace("SPEAKER_00:", "HOST:")
transcript = transcript.replace("SPEAKER_01:", "GUEST:")
```
### 6.3 Podcast / Voiceover Production Workflow
```
Step 1: Script Preparation
- Write script as multi-speaker JSON (for 2 speakers) or .txt (single voice)
- Mark pronunciation notes in brackets: [EMPH: strategy] [PAUSE: 1s]
- Review for natural speech patterns — written language ≠ spoken language
Step 2: Voice Selection
- Match voice character to brand archetype (see Section 3.2)
- Test with a 50-word sample before committing to full script
- For multi-speaker: assign voices by character (e.g., aoede=host, charon=expert guest)
Step 3: Generation
- Generate audio with text_to_speech tool
- Review output MP3
Step 4: Post-Processing (if needed)
- Trim silence: ffmpeg -i input.mp3 -af silenceremove=1:0:-50dB output.mp3
- Normalize levels: ffmpeg -i input.mp3 -filter:a loudnorm output_normalized.mp3
- Add background music: ffmpeg -i voice.mp3 -i music.mp3 -filter_complex "[1:a]volume=0.1[bg];[0:a][bg]amix=inputs=2:duration=first" final.mp3
Step 5: Final Export
- Deliver as MP3 for most platforms
- WAV for professional audio editing
- Specific podcast platforms may require specific bitrates (Spotify: 128kbps minimum)
```
### 6.4 Transcription QA Checklist
After transcribing audio, verify:
- [ ] Speaker labels correctly assigned (spot-check 3+ transitions)
- [ ] Timestamps align with audio (test word-level timestamps at minutes 0, 5, mid, end)
- [ ] Technical terms and proper nouns spelled correctly — auto-transcription often errors on brand names, product names, acronyms
- [ ] Filler words handled consistently (`um`, `uh` — decide to keep or remove)
- [ ] Sentence boundaries make sense (auto-transcription rarely includes punctuation)
- [ ] Confidence check on ambiguous segments — listen back to any flagged sections
---
## Section 7: Content Creation & Copywriting
**Sources merged:** Content Creator (alirezarezvani) + Content Frameworks & Templates (alirezarezvani) + marketing-content-creation (Perplexity Computer) + Brand Voice Framework
### 7.1 Content Creation Master Workflow
```
1. Audience & Intent
→ Who is this for? What do they need to feel, know, or do after reading?
2. Keyword & Topic Research (for SEO content)
→ Primary keyword: 500–5,000 searches/month (sweet spot)
→ 3–5 secondary keywords
→ 10–15 LSI (latent semantic indexing) keywords
→ Use Perplexity search_web for live keyword intelligence
3. Content Type Selection
→ Match format to intent: How-to (informational) / Listicle (inspiration) /
Case study (consideration) / Thought leadership (awareness) /
Landing page (conversion) / Press release (PR)
4. Outline using Template
→ Pull appropriate template from Section 7.3 below
5. Draft (no editing)
→ Write first draft without self-censoring
→ Target word count by type:
Blog: 1,500–2,500 | Social: see platform guides | Email: scannable
Landing page: value-driven, not word-count-driven
6. SEO Optimization Pass
→ Keyword in title, first paragraph, 2–3 H2 headings
→ Keyword density: 1–3%
→ Heading structure: one H1, logical H2/H3 hierarchy
→ Meta description: 150–160 characters
7. Brand Voice Edit
→ Run Brand Voice Consistency Audit (Section 3.7)
→ Ensure active voice ≥80%
→ Check for banned words
8. Platform Optimization
→ Apply platform-specific formatting (Section 7.6)
→ Adjust length, hashtags, visual requirements
9. CTA + Distribution
→ Every piece has one clear CTA
→ Schedule per content calendar (Section 8)
```
### 7.2 Hook & Headline Formulas
#### AIDA Framework
- **Attention**: Grab with surprising fact, bold claim, or provocative question
- **Interest**: Explain why this matters specifically to them
- **Desire**: Paint the picture of their improved state
- **Action**: Tell them exactly what to do next
#### PAS Framework
- **Problem**: State the pain point bluntly
- **Agitate**: Make them feel the weight of the problem
- **Solution**: Introduce the answer
#### Headline Formulas
| Formula | Template | Example |
|---|---|---|
| How-to | How to [Achieve X] Without [Pain Point] | How to Double Email Opens Without A/B Testing |
| Number List | [N] [Adjective] Ways to [Achieve Goal] | 7 Counterintuitive Ways to Beat Creative Block |
| Question | [Challenging Question Your Audience Has]? | Are You Making These 5 Brand Mistakes? |
| Contrarian | Why [Common Belief] Is [Wrong/Backwards/Costing You] | Why "Best Practices" Are Killing Your Brand |
| Specificity | How [Specific Person] Achieved [Specific Result] in [Timeframe] | How a 3-Person Team Grew to 50K Subscribers in 90 Days |
| Secret/Insider | The [Counterintuitive] Truth About [Topic] | The Uncomfortable Truth About Content Calendars |
| Fear of Missing | [N] Things You're Missing If You're Not [Doing X] | 6 Revenue Streams You're Ignoring in Your Content |
#### Hook Formulas for Social Media
```
Type 1: Contrarian
"Unpopular opinion: [industry belief] is completely wrong."
Type 2: Specificity
"[Specific result] in [timeframe] with [unusual method]."
Type 3: Story opener
"Two years ago, [dramatic situation]. Today, [transformation]."
Type 4: Question
"What if [assumed truth] was actually [reframed truth]?"
Type 5: List promise
"[N] things I wish someone told me before [doing X]:"
Type 6: Direct address
"If you're a [specific audience] and you're not doing [X], read this."
```
### 7.3 Blog Post Template Library
#### How-To Guide Template
```markdown
# How to [Achieve Desired Outcome] in [Timeframe]
## Introduction
[Hook: surprising fact, challenging question, or bold statement — 1–2 sentences]
[Problem statement: what pain this solves]
[Promise: what reader will learn and why it matters now]
## Prerequisites/What You'll Need
- [Tool/Resource 1]
- [Tool/Resource 2]
- [Estimated time to complete]
## Step 1: [Action Verb + Object]
[Clear instruction]
[Why this step matters]
[Common mistake to avoid]
[Visual aid or example if helpful]
## Step 2: [Action Verb + Object]
[Repeat structure above]
[Continue for all steps...]
## Troubleshooting Common Issues
### [Issue 1 Label]
**Symptom:** [What they'll observe]
**Cause:** [Why it happens]
**Fix:** [Exact solution]
## Results You Can Expect
- [Immediate outcome 1]
- [Long-term benefit]
- [Success metric to track]
## Next Steps
- [Advanced technique or related guide]
- [Relevant tool or resource]
- [CTA for product/service — soft sell]
## Conclusion
[Recap: 2–3 key points from the guide]
[Reinforce the value of what they've learned]
[Encouragement + final CTA]
```
#### Listicle Template
```markdown
# [Number] [Adjective] [Things/Ways/Tips] to [Achieve Goal] [in Year/Context]
## Introduction
[Context: trend or insight driving the topic]
[Promise: what they gain from reading]
[Credibility signal: why you can speak to this]
## 1. [First Item — Lead with Most Important or Most Surprising]
**Why it matters:** [Brief explanation — 1–2 sentences]
**How to implement:** [2–3 specific, actionable steps]
**Pro tip:** [Expert insight that elevates the advice]
**Example:** [Real-world application]
[Continue for all N items...]
## Bringing It All Together
[How these items work synergistically]
[Priority order for implementation]
[Expected timeline for results]
## Your Action Plan
1. Start with [easiest/most impactful item]
2. Next, tackle [second priority]
3. Measure [specific metric] after [timeframe]
## Conclusion & CTA
[2–3 sentence summary]
[CTA — specific action to take next]
```
#### Case Study Template
```markdown
# How [Company/Person] Achieved [Specific Result] Using [Your Solution/Method]
## Executive Summary
[Company overview — 1 sentence]
[Challenge faced — 1 sentence]
[Solution implemented — 1 sentence]
**Key results:** [Metric 1] | [Metric 2] | [Metric 3]
## The Challenge
[Industry context — why this challenge is common]
[Specific pain points — 2–3 concrete problems]
[Stakes — what was at risk if they didn't solve it]
## The Solution
[How they found/chose the solution]
[Implementation approach — phases if applicable]
[Timeline from start to results]
## The Results
### Quantitative Outcomes
- [Metric 1]: [Before] → [After] ([% change])
- [Metric 2]: $[Amount] saved/gained
- [Metric 3]: [Time reduction/increase]
### Qualitative Benefits
[Quote from key stakeholder]
[Team or customer experience improvement]
## Key Takeaways
1. [Lesson that applies broadly]
2. [Best practice discovered]
3. [Unexpected finding]
## Ready to Get These Results?
[CTA — book a demo, start a trial, contact us]
```
#### Thought Leadership Template
```markdown
# [Provocative Statement About the Future of Your Industry]
## The Current State
[Where the industry is right now — establish common ground]
## The Seismic Shift
[The emerging trend, technology, or behavior changing everything]
[Data point or example that makes it concrete]
## Why [Conventional Approach] Will Fall Short
[Specific critique of the status quo]
[What companies doing X are missing]
## A New Framework for [Challenge]
[Your proposed model — give it a name if possible]
[How it works — 3–5 principles]
[What changes when you apply it]
## What This Means for [Your Audience's Role]
[Specific implications for their day-to-day]
[Skills to develop / things to stop doing]
[Timeline — when does this shift become irreversible?]
## The Path Forward
[Your prediction for the next 12–24 months]
[The companies/people who will win and why]
[What action to take now, before it's obvious]
## Join the Conversation
[Engage readers: What do you think? Comment/share]
[CTA: read more, subscribe, follow]
```
### 7.4 Social Media Template Library
#### LinkedIn Post Framework
```
[🎯 OR bold statement — Pattern interrupt line that stops the scroll]
[Context paragraph: the situation, challenge, or observation — 3–5 sentences]
[Key insight or lesson you're sharing:]
• [Specific, actionable point 1]
• [Measurable outcome or evidence]
• [Unexpected finding or contrarian take]
[Brief story or example that makes the point real — 2–3 sentences]
[Takeaway: the single most important thing to remember]
[Engagement question: genuinely curious, not rhetorical?]
#[Industry] #[Topic] #[Audience]
```
**LinkedIn Optimization:**
- Optimal length: 150–300 words
- Post images or carousels for 3× the impressions
- Best times: Tue–Thu, 8–10am and 12–2pm in audience's timezone
- End with a question to drive comments
#### Twitter/X Thread Template
```
1/ [Bold opening statement that stops the scroll — make a claim worth reading 10 tweets for]
2/ [Context: why this matters right now — data point or trend]
3/ [The problem most people face — specific, not vague]
4/ [Conventional solution — acknowledge what people try]
5/ [Why the conventional solution falls short — the gap]
6/ [Better approach — introduce it]
7/ [Step/element 1 of better approach]
8/ [Step/element 2]
9/ [Step/element 3]
10/ [Step/element 4 — if needed]
11/ [Real-world example or proof]
12/ Recap in 3 points:
→ [Point 1]
→ [Point 2]
→ [Point 3]
13/ [CTA: If this was useful, [follow/retweet/share]. Here's where to learn more: [link]]
14/ P.S. [Bonus insight or resource that rewards people who read to the end]
```
**Twitter/X Optimization:**
- Threads under 15 tweets perform better than longer ones
- First tweet must work standalone (it gets surfaced without context)
- Images increase engagement 150%
- Best times: Weekdays 9am–3pm; avoid Friday afternoons
#### Instagram Caption Template
```
[Attention-grabbing first line — appears in preview before "more"]
[Story or relatable scenario — 2–3 sentences that create emotional connection]
Here's what I learned:
[The key insight — make it specific and actionable]
[N] things that changed everything:
1️⃣ [First point — concrete, not vague]
2️⃣ [Second point — surprising or counterintuitive]
3️⃣ [Third point — actionable]
[Engagement prompt: "Drop a ❤️ if you've been here!" or a direct question]
—
[Hashtags in a block below the dash — 10–30, mix of popular and niche]
#[hashtag1] #[hashtag2] #[hashtag3]
```
**Instagram Optimization:**
- First line is make-or-break — must hook before "more"
- Carousels get 3× the reach of single images
- Video Reels: 7–15 seconds for maximum reach
- Best times: Weekdays 11am–1pm; Wed 11am is peak
- 20–30 hashtags: mix broad (1M+), medium (100K–1M), niche (<100K)
#### Facebook Post Template
```
[Question or bold statement — community-oriented]
[Narrative or context — 2–4 paragraphs, more conversational than LinkedIn]
[Value delivery: tips, insights, or resource]
[Community CTA: "Have you experienced this? Tell us in the comments" OR "Tag someone who needs to see this"]
[Link if applicable — Facebook reduces reach for link posts; consider posting link in comments]
```
#### TikTok / Short-Form Video Script Template
```
[0–3 sec: HOOK — Visual + text overlay that answers "Why should I watch this?"]
Script: "[Bold claim or surprising statement]"
[3–10 sec: CONTEXT — Establish who this is for]
Script: "If you're a [audience] who [challenge], this is for you."
[10–45 sec: VALUE DELIVERY]
"[Step 1 / Point 1]"
"[Step 2 / Point 2]"
"[Step 3 / Point 3]"
[Keep each step to 1–2 sentences max]
[45–60 sec: CTA]
Script: "Follow for more [topic] tips. Save this for when you need it."
[Caption: First line = hook. Hashtags: 3–5 niche + 2 broad]
```
### 7.5 Email Marketing Templates
#### Newsletter Template
```
Subject: [Benefit or insight] — [curiosity/specificity element]
Preview text: [Complements subject, doesn't repeat it — adds urgency or context]
Hi [Name / Hey there],
[Personal observation or timely hook — 1–2 sentences that feel human, not broadcast]
---
## [Main Content Section Title]
[2–3 key points in scannable format]
• **[Point 1]:** [Benefit-focused explanation]
• **[Point 2]:** [Specific example or stat]
• **[Point 3]:** [Actionable tip they can use today]
---
## Resource of the Week
**[Title]** — [One sentence on why it's worth their time]
→ [Link]
---
## Quick Win You Can Implement Today
[Specific, actionable — 2–3 steps, under 100 words]
---
[Sign-off with personality]
P.S. [Bonus: additional value, soft CTA, or teaser for next issue]
```
#### Promotional Email Template
```
Subject: [Specific, concrete benefit] by [deadline/timeframe]
Preview text: [Scarcity or exclusivity signal]
Hi [Name],
[Open by acknowledging their pain point or aspiration — 2–3 sentences]
[Transition: "That's why we built/created/launched X"]
Here's what you get:
✓ [Benefit 1 — outcome, not feature]
✓ [Benefit 2 — outcome, not feature]
✓ [Benefit 3 — outcome, not feature]
[Social proof: testimonial with name + company, or specific result data]
[Primary CTA button: "Get Started Free" / "Claim Your Spot" / "Start Today"]
[Urgency element: deadline, limited availability, or bonus that expires]
P.S. [Reinforce urgency OR add bonus not mentioned above — P.S. gets read almost as often as the subject line]
```
### 7.6 Platform Image & Video Dimension Reference
| Platform | Image Type | Dimensions | Notes |
|---|---|---|---|
| Instagram | Feed square | 1080×1080 | 1:1 ratio |
| Instagram | Feed landscape | 1080×566 | 1.91:1 ratio |
| Instagram | Feed portrait | 1080×1350 | 4:5 ratio (recommended) |
| Instagram | Story/Reel | 1080×1920 | 9:16 ratio |
| Twitter/X | Tweet image | 1200×675 | 16:9 ratio |
| Twitter/X | Profile banner | 1500×500 | 3:1 ratio |
| LinkedIn | Share image | 1200×627 | 1.91:1 ratio |
| LinkedIn | Banner | 1584×396 | 4:1 ratio |
| Facebook | Feed post | 1200×630 | 1.91:1 ratio |
| Facebook | Stories | 1080×1920 | 9:16 ratio |
| YouTube | Thumbnail | 1280×720 | 16:9 ratio |
| YouTube | Banner | 2560×1440 | Channel art |
| TikTok | Video | 1080×1920 | 9:16 ratio |
| Pinterest | Pin | 1000×1500 | 2:3 ratio |
| Blog/Web | Hero image | 1600×900 | 16:9 ratio |
| Open Graph | Social preview | 1200×630 | OG standard |
### 7.7 SEO Content Framework
#### Keyword Targeting Hierarchy
```
Primary keyword (1):
→ Include in: title, first paragraph, 1–2 H2 headings, meta description, URL slug
→ Density: 1–2%
Secondary keywords (3–5):
→ Include in: H2/H3 headings, body paragraphs
→ Density: 0.5–1%
LSI keywords (10–15):
→ Include naturally throughout content
→ Don't force — use semantic variations
```
#### On-Page SEO Checklist
- [ ] Title: Primary keyword near the front, under 60 characters, click-worthy
- [ ] URL slug: Short, keyword-based, hyphens not underscores
- [ ] Meta description: Primary keyword, 150–160 characters, includes CTA
- [ ] H1: One only, matches or closely mirrors title
- [ ] H2–H6: Logical hierarchy, secondary keywords woven in naturally
- [ ] First 100 words: Primary keyword appears in first paragraph
- [ ] Image alt text: Descriptive, includes keyword where natural
- [ ] Internal links: 2–4 links to relevant pages on same domain
- [ ] External links: 1–2 links to authoritative sources
- [ ] Reading level: Flesch-Kincaid Grade 7–9 for most B2C; higher for B2B/technical
### 7.8 Press Release Template
```
FOR IMMEDIATE RELEASE
[OR: EMBARGOED UNTIL: DATE/TIME]
[COMPANY NAME] [ANNOUNCES/LAUNCHES/PARTNERS/ACHIEVES] [SPECIFIC THING]
[Subtitle: Supporting detail or secondary benefit]
[CITY, STATE] — [Month Day, Year] — [Company name], [brief company description], today announced [specific news]. [One sentence expanding on the news and its significance].
"[Quote from senior executive — forward-looking, human, and substantive]," said [Full Name], [Title], [Company]. "[Second sentence of quote that adds emotional or strategic color]."
[Paragraph 2: Expanded context — why this matters, what problem it solves, market context]
[Paragraph 3: Product/program/partnership details — specifics, features, availability, pricing if relevant]
[Optional Paragraph 4: Supporting quote from partner, customer, or investor]
[Paragraph 5: Availability and next steps — when, where, how to access, pricing]
###
About [Company Name]
[2–3 sentence boilerplate: what the company does, founded when, key customers/metrics]
Media Contact:
[Name]
[Title]
[Email]
[Phone]
[Website]
```
---
## Section 8: Content Calendar & Planning
**Source merged:** Content Calendar Template (alirezarezvani) + Content Planning Frameworks
### 8.1 Content Pillar Strategy (40/25/25/10 Rule)
```
Pillar 1: Educational (40%)
Formats: How-to guides, tutorials, explainers, tips & tricks, data analysis
Goal: Establish authority; drive SEO traffic; build trust
Pillar 2: Inspirational (25%)
Formats: Success stories, case studies, transformations, vision pieces, behind the brand
Goal: Build aspiration; create emotional connection; show what's possible
Pillar 3: Conversational (25%)
Formats: Behind-the-scenes, team spotlights, Q&As, polls, questions, hot takes
Goal: Build community; increase engagement; humanize the brand
Pillar 4: Promotional (10%)
Formats: Product announcements, offers, event invites, features highlights, CTAs
Goal: Convert interest to action; drive revenue; announce news
```
**Why this ratio works:** Audiences follow brands for value, not ads. The 40/25/25/10 ratio ensures the account is worth following first — then promotional content lands in a receptive audience.
### 8.2 Monthly Planning Framework
#### Month Setup (Do This First)
```markdown
## [Month] [Year] Content Plan
### Monthly Goals
- Traffic target:
- Lead generation target:
- Engagement target:
- Subscribers/followers target:
- Key campaign/theme:
### Key Dates This Month
- Product launch:
- Industry event:
- Holiday/awareness day:
- Content deadline:
### Monthly Theme
[One unifying topic or narrative thread that ties the month together]
### Primary Content Asset
[The one big piece — long-form blog, video, webinar, guide — that other content repurposes from]
```
#### Weekly Distribution Template
```
Week 1: Foundation
Monday — Blog post (primary keyword: [X])
Tuesday — LinkedIn insight post
Wednesday — Email newsletter
Thursday — Twitter/X thread
Friday — Instagram carousel
Week 2: Inspiration
Monday — Case study or success story
Tuesday — LinkedIn thought leadership
Wednesday — Product highlight or promo
Thursday — Community question or poll
Friday — Behind-the-scenes content
Week 3: Education
Monday — Tutorial or how-to (video or blog)
Wednesday — Infographic or data visual
Friday — Q&A or myth-busting post
Week 4: Conversion
Monday — In-depth guide or whitepaper tease
Wednesday — Testimonial or case study
Friday — Newsletter recap + CTA
```
### 8.3 Full Monthly Content Calendar Template
```markdown
# Content Calendar — [Month Year]
## Monthly Goals
- **Traffic Goal**:
- **Lead Generation Goal**:
- **Engagement Goal**:
- **Key Campaign**:
---
## Week 1: [Date Range]
### Monday [Date]
**Platform**: Blog
**Topic**:
**Primary Keyword**:
**Secondary Keywords**:
**Target Length**:
**Status**: [ ] Planned [ ] Written [ ] Reviewed [ ] Published
**Owner**:
**Notes**:
**Platform**: LinkedIn
**Type**: Article Share / Original Post
**Caption snippet**:
**Hashtags**:
**Optimal Post Time**: 9:00 AM
### Tuesday [Date]
**Platform**: Instagram
**Type**: [ ] Single image [ ] Carousel [ ] Reel
**Topic**:
**Visual brief**:
**Caption**:
**Hashtags**:
**Optimal Post Time**: 11:00 AM
**Visuals status**: [ ] Briefed [ ] Created [ ] Approved
### Wednesday [Date]
**Platform**: Email Newsletter
**Subject line (A)**:
**Subject line (B)**:
**Preview text**:
**Audience segment**:
**Primary CTA**:
**Status**: [ ] Drafted [ ] Designed [ ] Tested [ ] Scheduled
### Thursday [Date]
**Platform**: Twitter/X
**Type**: [ ] Single tweet [ ] Thread
**Topic**:
**Thread length (if thread)**:
**Media**: [ ] Images [ ] GIFs [ ] Video [ ] None
**Optimal Post Time**: 12:00 PM
### Friday [Date]
**Platform**: Multi-channel
**Campaign**:
**Assets needed**:
- [ ] Blog post
- [ ] Social graphics
- [ ] Email
- [ ] Video
---
## Week 2: [Date Range]
[Repeat structure]
## Week 3: [Date Range]
[Repeat structure]
## Week 4: [Date Range]
[Repeat structure]
---
## Content Bank (Ideas for Future)
1.
2.
3.
4.
5.
---
## Performance Review (End of Month)
### Top Performing Content
1. **Title/Topic**:
**Platform**:
**Key metric**:
**Why it worked**:
2. **Title/Topic**:
**Platform**:
**Key metric**:
**Why it worked**:
### Underperforming Content
1. **Title/Topic**:
**Why it underperformed**:
**Adjustment for next month**:
### Lessons Learned
-
-
-
### Adjustments for Next Month
-
-
-
## Resource Links
- Brand Guidelines: [Link]
- Asset Library: [Link]
- Analytics Dashboard: [Link]
- Team Calendar: [Link]
```
### 8.4 Platform-Specific Posting Time Reference
| Platform | Best Days | Best Times | Notes |
|---|---|---|---|
| LinkedIn | Tue–Thu | 8–10am, 12–2pm | Avoid weekends; business hours rule |
| Instagram | Mon, Wed, Fri | 11am–1pm | Wed 11am is peak; 7–9pm for lifestyle |
| Twitter/X | Weekdays | 9am–3pm | Lunch hour (12–1pm) is peak for B2C |
| Facebook | Wed–Fri | 1–4pm | Organic reach is low; boost important posts |
| TikTok | Any | 7–9pm local time | Evening audience is largest |
| YouTube | Fri–Sun | 2–4pm | Subscribers notified; Sunday afternoon peaks |
| Email | Tue–Thu | 10am–2pm | Tuesday 10am historically highest open rate |
| Pinterest | Sat–Sun | 8–11pm | Weekend inspiration browsing behavior |
*All times are in the audience's local timezone, not the sender's.*
### 8.5 Content Repurposing Matrix
One piece of primary content → multiple assets:
| Primary Asset | Repurposed Into |
|---|---|
| Long-form blog post (2,000+ words) | 5 LinkedIn posts (one per section), 1 Twitter thread, 1 email newsletter, 3 Instagram carousels, 1 YouTube video script |
| Podcast episode (30–60 min) | Audiogram clips (3×), quote graphics (5×), blog post transcript, Twitter thread (top insights), LinkedIn article |
| Case study | LinkedIn post, Instagram carousel, sales deck slide, blog feature, video testimonial script |
| Data/research report | Infographic, 10 data-point social posts, press release, webinar outline, email nurture sequence |
| Webinar/video | Blog summary post, highlight clips (3–5×), transcript, email follow-up series, slides deck |
| Tutorial/how-to | Short-form video (TikTok/Reel), Twitter thread (steps), Pinterest pin, email mini-course |
### 8.6 Content Ideation Workflow (Perplexity-Enhanced)
Leverage Perplexity Computer's live research capabilities for trend-driven ideation:
```
Step 1: Trend Discovery
→ search_web for "[industry] trends [current month/year]"
→ search_social for "#[industry] OR [topic]" (recent posts only)
→ Look for: high engagement posts, recurring questions, emerging terminology
Step 2: Competitive Content Audit
→ fetch_url on 3–5 competitor blog/social pages
→ Identify: their top-performing content types, topics they haven't covered, angles they miss
Step 3: Keyword Opportunity Research
→ search_web for "[topic] frequently asked questions"
→ search_web for "how to [topic] site:reddit.com OR site:quora.com"
→ Extract: recurring pain points = content opportunities
Step 4: Brief Creation
→ For each content idea, complete the Content Brief Template (Section 8.7)
Step 5: Batch Scheduling
→ Fill the monthly calendar template
→ Assign to content pillars (40/25/25/10)
→ Assign to platforms with platform-specific notes
```
### 8.7 Content Brief Template
```markdown
## Content Brief
**Title (working):**
**Content type:** [ ] Blog [ ] Social [ ] Email [ ] Video [ ] Podcast [ ] Infographic
**Platform(s):**
**Pillar:** [ ] Educational (40%) [ ] Inspirational (25%) [ ] Conversational (25%) [ ] Promotional (10%)
**Publish date:**
**Author/Owner:**
**Objective:**
What should the audience feel, know, or do after consuming this piece?
**Target audience:**
Which persona is this primarily for? What stage of awareness are they at?
**Primary keyword (if SEO):**
**Secondary keywords:**
**Hook/angle:**
What is the surprising, specific, or counterintuitive angle that makes this piece worth reading?
**Key points to cover:**
1.
2.
3.
**Key points to avoid:**
(What competing content covers that we want to differentiate from)
**Call to action:**
What is the single action the reader should take?
**Visual requirements:**
- Feature image: [ ] AI generated [ ] Stock [ ] Custom design
- In-article visuals:
- Social cut-down assets needed:
**Sources/references to include:**
**Internal links (2–4):**
**Word count target:**
**Deadline:**
```
---
## Section 9: Prompt Engineering for Creative Work
**Sources merged:** Prompt Engineer Toolkit (alirezarezvani/marketing-skill) + Senior Prompt Engineer (alirezarezvani/engineering-team)
### 9.1 Technique Selection Guide
| Situation | Technique | Why |
|---|---|---|
| Clear, simple, well-defined task | **Zero-shot** | Fastest; works well when format is unambiguous |
| Complex task needing consistent format | **Few-shot** | Examples anchor the model's output style |
| Multi-step reasoning, logic, diagnosis | **Chain-of-Thought (CoT)** | Explicit step-by-step reduces errors |
| Open-ended problem with multiple paths | **Tree-of-Thought (ToT)** | Forces exploration before committing |
| API integration, downstream processing | **Structured Output (JSON)** | Guarantees parseable responses |
| Persistent persona, rules, constraints | **System Prompt Design** | Separates static instructions from dynamic input |
| Improving prompts themselves | **Meta-Prompting** | Turns the model into a prompt optimizer |
### 9.2 Creative-Specific Prompt Templates
#### Image Generation Prompts
**Photorealistic product:**
```
Professional product photography of [product description], [surface/setting],
[composition: centered/rule-of-thirds/dramatic angle],
[color palette: warm/cool/neutral/specific tones],
[lighting: soft natural/dramatic studio/backlit/golden hour],
no text, no watermarks, high resolution
```
**Portrait/lifestyle:**
```
[Style: photorealistic/editorial/cinematic] portrait/photo of [subject description],
[environment and context], [pose or activity],
[lighting quality and direction], [color mood: warm/cool/desaturated],
[aspect ratio use case — e.g., "suitable for Instagram portrait format"]
```
**Illustration:**
```
[Art style: flat vector/line art/watercolor/gouache/digital painting/risograph]
illustration of [subject], [composition notes],
[color palette: limit to 3–5 colors, e.g., "dusty rose, sage green, off-white, and charcoal"],
[mood: playful/minimal/bold/organic], [intended use: app icon/blog header/print]
```
**Abstract/artistic:**
```
[Medium: oil painting/acrylic/pastel/mixed media/CGI]
[style reference: impressionist/bauhaus/surrealist/contemporary],
[subject or concept expressed abstractly],
[palette], [compositional quality: layered/sparse/chaotic/geometric],
[lighting and texture notes], no text
```
**Brand asset:**
```
Brand illustration for [company type/industry],
[visual metaphor for the brand value: e.g., "growth represented as a seedling becoming a tree"],
[brand colors: hex codes], [style: clean geometric/organic/bold typographic],
suitable for [use: website hero/social media/print], no text overlay
```
#### Video Generation Prompts
**Product showcase:**
```
[Camera: slow push-in/dolly/orbit/static] of [product],
[setting and surface], [key visual action or detail],
[visual style: cinematic CGI/lifestyle/documentary/abstract],
[lighting: dramatic/natural/artificial],
[color grade: warm/cold/neutral/film emulation],
no text, seamless loop if possible
```
**Story/narrative:**
```
[Shot type: wide establishing/medium/close-up/POV] showing [character/subject]
[action and emotion] in [setting], [time of day and lighting],
[visual aesthetic: handheld documentary/smooth gimbal/fixed frame],
[color palette and mood], [optional: ambient sound description]
```
**Abstract/motion graphic:**
```
Abstract [material/concept: liquid metal/fluid simulation/particle field/geometry]
[motion description: morphing/flowing/exploding/crystallizing],
[color palette], [lighting: dramatic/soft/neon/natural],
[loop quality: seamless loop], [style: CGI/hand-drawn/kinetic typography]
```
#### Voice & Audio Prompts
**Narrator/voiceover script brief:**
```
Write a [duration: 30-second/60-second/2-minute] voiceover script for [brand/product].
Tone: [tone attributes from brand voice framework]
Audience: [persona]
Key message: [single most important point]
CTA: [specific action]
Avoid: [anything to omit: technical jargon, competitor comparisons, etc.]
Voice style: [warm and conversational / authoritative and confident / playful and energetic]
```
**Podcast dialogue brief:**
```
Write a [duration] podcast segment between HOST and GUEST discussing [topic].
HOST voice: [characteristics — curious, challenging, accessible]
GUEST voice: [characteristics — expert, specific, story-driven]
The conversation should cover:
1. [Opening question/topic]
2. [Main insight or debate point]
3. [Practical takeaway for the listener]
Avoid: [lecture format, excessive agreement, abstract answers without examples]
End with a [teaser for next episode / book recommendation / listener question prompt]
```
#### Brand Copywriting Prompts
**Homepage headline:**
```
Write 5 homepage headline options for [company name], a [type of business]
that helps [target audience] achieve [outcome] without [pain point/obstacle].
Brand archetype: [archetype from Section 3.2]
Tone: [tone attributes]
Format: Each option should be under 10 words, benefit-led, and memorable.
Include one question-format option and one contrarian option.
```
**Social media post:**
```
Write a [platform: LinkedIn/Twitter/Instagram] post for [brand name] about [topic].
Brand voice: [archetype + 3 tone attributes]
Angle: [specific hook type from Section 7.2: contrarian/story/list/question]
Length: [platform-appropriate: e.g., "LinkedIn: 150–200 words"]
CTA: [desired action]
Do not: [anything to avoid]
```
**Email subject line:**
```
Write 10 email subject line options for [campaign/email purpose].
Audience: [persona and their current state of awareness]
Email goal: [open rate optimization / click optimization]
Include:
- 3 curiosity-gap options
- 3 specificity/number options
- 2 urgency/scarcity options
- 2 personalization options
Keep each under 50 characters for mobile optimization.
```
### 9.3 Prompt Optimization Methodology
#### A/B Scoring Framework (5 Dimensions)
Score each prompt version on a 1–5 scale across:
| Dimension | What to Evaluate |
|---|---|
| **Coherence** | Output is logical, well-structured, internally consistent |
| **Accuracy** | Factually correct / task-appropriate / no hallucinations |
| **Format compliance** | Matches requested format exactly |
| **Conciseness** | No padding, no redundancy, efficient delivery |
| **Usefulness** | A human would act on or use this output |
**Threshold:** Aim for ≥4.0 across all dimensions before considering a prompt production-ready.
#### Token Reduction Patterns
```python
# BEFORE: Verbose (312 tokens)
"""
You are a highly experienced and skilled assistant who specializes in sentiment analysis.
Your job is to carefully read the text that the user provides to you and then thoughtfully
determine whether the overall sentiment expressed in that text is positive, negative, or neutral.
Please make sure to only respond with one of these three labels and nothing else.
"""
# AFTER: Lean (28 tokens — same quality)
"""Classify sentiment as POSITIVE, NEGATIVE, or NEUTRAL. Reply with label only."""
# Savings at scale: 284 tokens × rate = significant cost reduction at volume
```
**Token reduction principles:**
1. Remove role descriptions that add no constraint ("You are a highly experienced...")
2. Replace verbose instructions with direct commands
3. Move examples to few-shot format rather than describing them
4. Eliminate redundant restatements ("Your job is to... please make sure to...")
#### Prompt Version Control
```markdown
# CHANGELOG.md
## [v1.3.0] — [Date]
### Changed
- Added explicit JSON schema to extraction prompt (fixes null-field regression)
- Reduced system prompt from 450 to 280 tokens (18% cost reduction)
### Fixed
- Sentiment prompt now handles mixed-language input correctly
### Regression: PASS (14/14 cases)
## [v1.2.0] — [Date]
...
```
**File structure:**
```
prompts/
├── CHANGELOG.md
├── production/ ← What's running in prod
├── staging/ ← Candidates under testing
├── archive/ ← Old versions (never delete)
├── tests/
│ ├── regression.json
│ └── edge_cases.json
└── results/
└── ab_test_[date].json
```
### 9.4 Common Prompt Engineering Pitfalls
| Pitfall | Description | Fix |
|---|---|---|
| **Prompt brittleness** | Works on test cases; breaks on edge cases | Always test with empty input, very long input, unicode, code injection |
| **Instruction conflicts** | "Be concise" + "be thorough" in same prompt | Resolve contradictions; prioritize one constraint |
| **Implicit format assumptions** | Model guesses the format | Always specify format explicitly |
| **Skipping regression tests** | Every prompt edit risks breaking prior cases | Build a regression suite before any changes |
| **Optimizing wrong metric** | Low token cost matters less than high accuracy for high-stakes | Match optimization target to task stakes |
| **System prompt bloat** | 2,000-token prompts that could be 200 | Test leaner versions — quality often holds |
| **Model-specific prompts** | GPT-4-tuned prompt degrades on Claude and vice versa | Test cross-model before deploying |
### 9.5 Creative Prompt Template Library (10 Templates)
```
1. VISUAL BRIEF → AI IMAGE PROMPT
Convert this creative brief to an optimized image prompt:
Brief: {{brief}}
Style: {{style_reference}}
Restrictions: {{what_to_avoid}}
Output a single, detailed prompt optimized for photorealistic AI image generation.
2. SCRIPT → VOICEOVER DIRECTION
Convert this script to voice direction for TTS:
Script: {{script}}
Target emotion: {{emotion}}
Pace: {{pace: slow/medium/fast}}
Emphasis points: {{where_to_stress}}
Output: Annotated script with [PAUSE] markers and [EMPH:word] emphasis tags.
3. BRIEF → VIDEO STORYBOARD
Create a 5-shot video storyboard from this brief:
Brief: {{brief}}
Duration: {{total_seconds}}
Style: {{visual_reference}}
For each shot: describe the camera angle, action, lighting, and a ready-to-use video generation prompt.
4. TOPIC → HEADLINE OPTIONS
Generate 10 headline variations for: {{topic}}
Audience: {{audience}}
Tone: {{tone_attributes}}
Include: question format, contrarian format, number list format, how-to format, and specificity format.
5. CONTENT → REPURPOSING PLAN
This is a {{content_type}} about {{topic}}:
{{content}}
Generate a repurposing plan producing 8 derivative assets for different platforms.
For each asset: platform, format, key angle, draft content.
6. BRAND → VOICE SAMPLE
Apply this brand voice to the following draft:
Brand: {{archetype}} archetype, {{tone_attributes}} tone, {{formality}} formality level
Draft: {{draft}}
Rewrite it to fully embody the brand voice. Preserve all factual content.
7. DATA → VISUAL CONTENT BRIEF
Convert this data into a visual content plan:
Data: {{data_points}}
Target platform: {{platform}}
Create: (a) key insight headline, (b) infographic outline, (c) 3 social post angles using the data.
8. PERSONA → CONTENT IDEAS
For the following audience persona:
{{persona_description}}
Generate 15 content ideas across:
- 5 educational topics they'd search for
- 5 aspirational topics they'd engage with
- 5 conversational topics they'd respond to
9. COMPETITOR ANALYSIS → CONTENT GAPS
Here are topics covered by our top 3 competitors:
{{competitor_content_list}}
Here are topics we've covered:
{{our_content_list}}
Identify: (a) topics they cover we don't, (b) angles they miss, (c) 10 content opportunities to differentiate.
10. PERFORMANCE DATA → CONTENT STRATEGY
Here is our content performance data for the last 90 days:
{{performance_data}}
Analyze: (a) patterns in top performers, (b) common traits of underperformers,
(c) 5 strategic recommendations for next quarter's content mix.
```
---
## Section 10: Unique Perplexity Computer Capabilities
These capabilities are native to Perplexity Computer and cannot be replicated through prompt engineering or code execution alone.
### 10.1 AI Video Generation
**What it does:** Generates actual MP4 video clips using Sora 2, Sora 2 Pro, Veo 3.1, and Veo 3.1 Fast models.
**When to use:**
- Brand videos, product showcases, social media content
- Visual demonstrations when screenshots/images are insufficient
- Abstract motion graphics for presentations or websites
- Longer narratives assembled from multiple clips
**Parameters:**
- `model`: sora_2 (default), sora_2_pro, veo_3_1, veo_3_1_fast
- `duration_seconds`: 4, 8, 12 (Sora); 4, 6, 8 (Veo)
- `aspect_ratio`: 16:9 or 9:16
- `image_path`: Optional starting frame for img2video
**Workflow reference:** Section 5.4 (AI Video Generation)
### 10.2 AI Image Generation
**What it does:** Generates actual PNG images using nano_banana_2 and nano_banana_pro models.
**When to use:**
- Blog headers and featured images
- Social media visuals
- Brand illustrations and graphics
- Product mockups and lifestyle imagery
- Style-transferred versions of existing images (img2img)
**Parameters:**
- `model`: nano_banana_2 (default), nano_banana_pro
- `aspect_ratio`: 1:1, 16:9, 9:16, 4:3, 3:4
- `images`: Up to 10 reference images for img2img
- `prompt`: Detailed description (see Section 2.3)
**Not for:** Charts, graphs, timelines, infographics with specific data — the model will hallucinate incorrect values.
### 10.3 Text-to-Speech & Voice Production
**What it does:** Converts text to natural-sounding speech audio using Gemini 2.5 Pro TTS and ElevenLabs TTS v3.
**When to use:**
- Voiceovers for video content
- Podcast production
- Audio versions of written content
- Product demos with narration
- Multi-speaker dialogue production
**Key differentiator:** Multi-speaker JSON format enables full podcast/dialogue production with 2+ distinct voices without needing any recording equipment.
**Workflow reference:** Section 6 (Audio & Speech)
### 10.4 Audio Transcription
**What it does:** Transcribes audio and video files with speaker diarization, word-level timestamps, and 99-language support.
**When to use:**
- Transcribing interviews, podcasts, and meetings
- Creating searchable text from audio content
- Repurposing video content into written assets
- Subtitle generation
**Key differentiator:** Speaker diarization up to 32 speakers makes it viable for large meetings and panel discussions.
### 10.5 Live Website Deployment
**What it does:** Builds and deploys websites, web apps, and web games accessible via a public URL.
**When to use:**
- Campaign landing pages
- Interactive tools or calculators
- Portfolio or showcase sites
- Event pages
- Product prototypes
**Key differentiator:** Unlike local HTML artifacts, Perplexity Computer-deployed sites are publicly accessible via a real URL — shareable with anyone without requiring the recipient to run code.
**Workflow reference:** Section 4 (Frontend Design & Web Artifacts)
### 10.6 Social Media Trend Research
**What it does:** Searches X/Twitter in real time with advanced operators for trend discovery, competitor monitoring, and audience research.
**When to use:**
- Content ideation: discover what topics are gaining traction
- Competitor monitoring: track what competitors are posting and how audiences respond
- Brand listening: find mentions, reactions, and sentiment
- Trend-to-content pipeline: identify a trending topic → create relevant content → publish before the trend peaks
**Operators available:**
```
#hashtag — posts containing hashtag
@username — posts mentioning user
from:user — posts from specific user
to:user — replies to specific user
is:retweet — include retweets
-is:retweet — exclude retweets
is:reply — include replies
is:quote — include quote tweets
```
**Content ideation workflow:**
```
1. search_social for "#[industry] -is:retweet" (recent, original posts)
2. Identify posts with high engagement or recurring themes
3. Note language patterns audiences use (use their words, not yours)
4. Find topics competitors haven't addressed yet
5. Create content that enters the existing conversation
```
### 10.7 400+ App Integrations
**What it does:** Connects to external services for content distribution, CRM updates, analytics gathering, and workflow automation.
**Relevant integrations for content work:**
- **Email platforms** (Gmail, Outlook): Distribute newsletters, track opens
- **Social schedulers** (Buffer, Hootsuite): Schedule posts across platforms
- **CMS platforms** (WordPress, Webflow, Notion): Publish content directly
- **Analytics** (Google Analytics, Mixpanel): Pull performance data
- **Design tools** (Canva, Figma — via API): Retrieve or update assets
- **CRM systems** (Salesforce, HubSpot): Segment content by customer stage
**Content distribution automation workflow:**
```
1. Write content → 2. Generate visuals → 3. Post to primary platform
→ 4. Schedule repurposed versions for other platforms
→ 5. Add to email newsletter queue
→ 6. Update CRM with content touchpoint
→ 7. Schedule performance review at D+7 and D+30
```
### 10.8 Scheduled Content Monitoring
**What it does:** Runs tasks on a schedule — daily, weekly, or custom intervals.
**Content applications:**
- Weekly performance reports: pull analytics data → summarize in email
- Trend monitoring: daily social search for brand mentions or competitor content
- Content gap alerts: weekly check if competitors published on priority topics
- Calendar reminders: flag upcoming publish dates that need assets created
- SEO rank tracking: periodic keyword position monitoring
### 10.9 Perplexity Computer Creative Production Stack
The full creative production workflow unique to Perplexity Computer:
```
RESEARCH
↓ search_web (trend research, keyword discovery)
↓ search_social (social listening, competitor content audit)
↓ fetch_url (read competitor pages, gather references)
PLANNING
↓ Create content brief (Section 8.7)
↓ Fill content calendar (Section 8.3)
↓ Build storyboard for video/audio (Section 5.5)
CREATION
↓ Write copy (Section 7 frameworks)
↓ generate_image (Section 2.3) — blog headers, social visuals
↓ generate_video (Section 5.4) — video content
↓ text_to_speech (Section 6.1) — voiceovers, podcasts
↓ Build web experience (Section 4) — landing pages, microsites
DISTRIBUTION
↓ call_external_tool (social schedulers, email platforms, CMS)
↓ Deploy live website via sandbox
MONITORING
↓ Scheduled performance tracking
↓ search_social for brand/content mentions
↓ Performance review → next cycle input
```
---
## Quick Reference: Decision Trees
### "What creative tool do I need?"
```
Making a static image?
→ Already have a reference to transform? → generate_image with images=[ref] (img2img)
→ Need photorealistic AI image? → generate_image (nano_banana_2)
→ Need programmatic design (poster, PDF)? → Canvas Design workflow (Python)
→ Need generative/algorithmic art? → Algorithmic Art workflow (p5.js)
Making a video?
→ Short clip (4–12 sec)? → generate_video (sora_2)
→ Long-form video? → Multiple clips → stitch with ffmpeg
→ Animated GIF for Slack? → Slack GIF Creator (PIL)
→ CSS animation for web? → Frontend Design workflow
Making audio?
→ Voiceover (single voice)? → text_to_speech (.txt file)
→ Podcast/dialogue (2 voices)? → text_to_speech (.json file, 2 speakers)
→ Complex production (3+ voices)? → text_to_speech (ElevenLabs) or .json with 3+ speakers
→ Transcribing audio? → transcribe_audio
Making web content?
→ Simple HTML experience? → Plain HTML/CSS/JS
→ Component-rich app? → React + shadcn/ui (Web Artifacts Builder)
→ Live public website? → website-building skill + sandbox deployment
Writing copy?
→ Blog post? → Section 7.3 templates
→ Social media? → Section 7.4 templates
→ Email? → Section 7.5 templates
→ Brand voice? → Section 3 (Voice framework)
→ SEO content? → Section 7.7 (SEO framework)
```
### "What do I need to build first?"
```
New brand from scratch?
→ Section 3.9 (Brand Identity Brief) → Section 3.2 (Archetype) → Section 3.3–3.5 (Voice)
Content strategy?
→ Section 8.1 (Pillar strategy) → Section 8.2 (Monthly framework) → Section 8.3 (Calendar)
Single piece of content?
→ Section 7.1 (Master workflow) → Section 7.3–7.5 (Templates)
Creative production?
→ Section 2.5 (Creative brief) → Choose modality → Execute
```
---
## Appendix: Dependencies Reference
### Python Libraries (Canvas Design, Generative Art, GIF Creation)
```bash
# Canvas/PDF design
pip install reportlab matplotlib pillow
# Algorithmic art (runs in HTML via p5.js CDN — no Python install needed)
# GIF creation
pip install pillow imageio numpy
# Audio post-processing
# Use ffmpeg (pre-installed in Perplexity Computer workspace)
```
### JavaScript / CDN Dependencies
```html
<!-- p5.js for generative art -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.9.0/p5.min.js"></script>
<!-- React for web artifacts -->
<!-- Handled automatically by Web Artifacts Builder scripts -->
<!-- Motion for React animations -->
<!-- npm install framer-motion -->
```
### Fonts
**Programmatic design (Canvas Design):**
- Fonts stored in `./canvas-fonts` directory within the skill
- Download from Google Fonts or system fonts for programmatic use
**Web (Frontend Design):**
- Import via Google Fonts CDN in `<head>`
- Preferred for online use: Google Fonts, Adobe Fonts, Font Share
**TTS:**
- No font dependencies — voice is determined by model and voice parameter selection
---
*Content & Creative Super-Skill v1.0 — Merged from 14 source skills across anthropics/skills, alirezarezvani/claude-skills, and Perplexity Computer built-in capabilities.*COMPATIBILITY & REFERENCES
Platform guidance
Imported from the listed AgentSkill.sh category. Complete supplied package files and notices are retained. Required external tools and credentials are not installed. No bundled code was executed during import. Individual agent task behavior has not been tested.