🚀 Boost Your Presentations with Claude + Slidev

Ever spent hours wrestling with presentation tools? I've discovered a game-changing workflow combining Claude AI and Slidev. Think of it as having a technical co-pilot for your Slides.

Claude is Anthropic's AI assistant known for in-depth technical understanding and natural language interactions.

Slidev is an open-source presentation tool designed specifically for developers, allowing them to create slides using Markdown and Vue components with live coding capabilities.

Together, they form a powerful combination for creating presentations efficiently.

Why This Matters 💡

Creating technical presentations is often time-consuming. You need clear explanations, code examples, and engaging visuals. This workflow cuts that time dramatically while improving quality.

I'm not a big fan of PowerPoint 😅

My Workflow 🎯

1. Prompt Engineering

Start by crafting effective prompts. Here's a real example:

❌ Basic Prompt:
"Create slides about How the Web Works"

✅ Enhanced Prompt:
"Create comprehensive educational content in 
Markdown format explaining 'How the Web Works', 
structured for conversion into presentation 
slides. The content should be highly accessible 
for complete beginners with no technical 
background."

💡TIP: You can ask Claude to do the prompt for you. Just give him your instructions.

Your task is to convert my instructions in a powerfull,
well-structured prompt to be used in Claude.ai later.

--- Start Instructions:
Create a good explanation of “How the Web Works” in Markdown format.
The resulting content will be used to create slides or presentations later.
Content should include:
1. What the Web (WWW) is
2. What HTTP and HTTPS are
3. What TCP/IP (Internet) is
4. Client-server flow, including DNS, ISP, request and response

Use a phone book as an analogy for DNS
Suggest the best order for the content, don't necessarily follow
the order I give you
Target audience: No experience / Beginners
--- End Instructions

The output must be the prompt. AVOID create the content

Claude helps refine these prompts. It suggests improvements and points out missing context.

2. Content Generation Phase 📝

Feed the refined prompt back to Claude. The key here is iteration:

1. Start with an outline
2. Generate section-by-section content
3. Request specific examples
4. Ask for clarification on concepts

3. Technical Implementation with Slidev 🛠️

Since Claude doesn't have an internet connection, his Slidev knowledge base may be limited or outdated. However, it's not a big deal.

Slidev is opensource. All of its documentation is available in Markdown files on GitHub. I've downloaded the docs (just clone the repo) and imported it into a new Claude Project (Claude Projects is a feature of Claude Pro).

Create a new project...

We provide additional instructions (Available in Gist)

We finally uploaded the documentation

Docs will be available as context throughout the entire project. A project in Claude acts as a knowledge base. Each new chat you start will have access to the documentation without you having to re-attach it and you'll have it available to create as many presentations as you want.

This gives Claude context about:

• Available layouts
• Component syntax
• Styling options
• Animation capabilities

Now Claude can generate Slidev-specific markdown

4. Get the Code

Create a New Chat using the Slidev Copilot Project. Provide clear and detailed instructions for your presentation. Attach the content you generated in step one and let the magic begin.

NOTE: Don't expect to get a perfect result on the first try. Iterate on the content and code you generate. Once you have a good base/starter, you can quickly modify what you need.

Key Benefits 🎉

1. Time Efficiency: Cut presentation creation time by 60%
2. Technical Accuracy: Claude understands complex technical concepts
3. Consistency: Maintains style and depth throughout
4. Flexibility: Easy updates and iterations

Best Practices 📌

1. Keep prompt history for reuse
2. Use Claude Projects for documentation context
3. Test generated code snippets
4. Review technical accuracy
5. Iterate on specific sections

Common Pitfalls to Avoid ⚠️

• Don't rely on Claude for exact Slidev syntax without context
• Always verify technical claims
• Keep backups of working prompts
• Test presentations in presenter mode

Conclusion

The magic of combining Claude's AI capabilities with Slidev's developer-first approach goes way beyond just saving time. It transforms how we craft technical presentations, making them more engaging, accurate, and impactful.

Give it a try – your future self (and your audience) will thank you 😉