How I Create AI Demo Videos for My Hackathon Projects
DEV Community

How I Create AI Demo Videos for My Hackathon Projects

Using a local LLM with vLLM, Microsoft Edge TTS, and AI tools to turn project demos into clear, engaging videos.

Why I built this workflow

Building a hackathon project is only half the work. You also need to explain the problem, show the product working, and make the value obvious to judges.

I wanted a repeatable way to create narrated demo videos without depending entirely on expensive cloud-based LLM APIs or recording every voiceover myself.

My workflow combines:

  • vLLM to serve a local language model and help write or refine the narration.
  • Microsoft Edge TTS to turn the script into spoken audio.
  • Other AI tools to help create supporting visuals, diagrams, subtitles, or scene ideas.
  • Screen recording and video editing tools to show the real project and assemble the final video.

The goal is not to make an AI-generated video pretend to be the product. The goal is to explain the real product clearly, using AI to speed up production.

1. The tools behind the workflow

vLLM: a local LLM for the script

I run a language model locally and serve it through vLLM. I can send it the project description, feature list, technical stack, and key user flows.

I use the model to:

  • Turn rough project notes into a structured video script.
  • Explain technical features in simpler language.
  • Write an opening hook and a concise conclusion.
  • Break the narration into scenes.
  • Refine wording so the voiceover sounds natural when spoken aloud.

vLLM provides an OpenAI-compatible API, which makes it convenient to connect to scripts and applications that already support that API format. Documentation: vLLM documentation

A practical note: local inference is not automatically free. You still need suitable hardware, and performance depends on the model, quantization, context length, and available memory.

Microsoft Edge TTS: turning the script into narration

After the script is ready, I pass the narration text to Microsoft Edge TTS to generate speech. The Python package edge-tts makes it straightforward to generate audio with available Microsoft neural voices.

Why I use it:

  • I can generate narration without recording my own voice.
  • I can choose from available voices and languages.
  • I can regenerate a section after changing the script.
  • I can save the output and use it in my video editor.

Important: edge-tts is an unofficial interface to Microsoft's online text-to-speech service. It is not a fully local TTS engine, so the narration step requires an internet connection and is subject to the service's terms and availability.

Other AI tools: supporting assets

I can use other AI tools where they genuinely help - for example, to create a visual concept, simplify a diagram, suggest scene transitions, or generate subtitles.

I keep the actual product walkthrough authentic: screenshots and screen recordings should show the real application, not invented UI.

2. My end-to-end workflow

Step 1 - Collect project information

I start with the material I already have:

  • Project name and one-line summary.
  • Problem being solved.
  • Target users.
  • Main features.
  • Technology stack.
  • A short list of actions to demonstrate.
  • The result or impact I want viewers to remember.

The more concrete the input, the less generic the script will be.

Step 2 - Generate a scene-by-scene script

I ask the local LLM to structure the video into a few clear sections:

  • Hook: introduce the problem or surprising idea.
  • Problem: explain why the problem matters.
  • Solution: introduce the project.
  • Live demo: show the main user journey.
  • Technology: briefly explain the architecture.
  • Closing: summarize the value and next steps.

I review the script before generating audio. AI-generated claims should be checked against what the project actually does.

Step 3 - Generate the voiceover

I send the approved narration to Edge TTS and save the resulting audio file. I keep the script divided into scenes rather than generating one huge audio file.

This makes it easier to replace a sentence, adjust pacing, or rearrange the video later.

Step 4 - Record the real product

I record the application running and capture the most important workflows.

A useful demo usually shows:

  • The starting screen.
  • One complete user journey.
  • The most distinctive feature.
  • The result produced by the application.
  • A brief view of the architecture, if it helps explain the project.

I avoid long loading screens, unnecessary cursor movement, and repeated actions.

Step 5 - Add visuals and edit

I combine the screen recording, narration, and supporting assets in a video editor. I add captions, labels, transitions, and background music only where they improve clarity.

I also check that the voiceover matches the action on screen. A polished video is not useful if the narration describes something the viewer cannot see.

3. Architecture at a glance

The following diagram shows the content-production flow. The project recording and AI-generated assets join the narration during editing.

flowchart TD
  A[Project notes, features, and tech stack] --> B[Local LLM served by vLLM]
  B --> C[Scene-by-scene demo script]
  C --> D[Review and edit script]
  D --> E[Microsoft Edge TTS]
  E --> F[Voiceover audio]
  G[Real application] --> H[Screen recording]
  I[Other AI tools] --> J[Supporting visuals and assets]
  F --> K[Video editor]
  H --> K
  J --> K
  K --> L[Final hackathon demo video]

4. Why this setup works for hackathons

  • Reusable: I can follow the same process for different projects.
  • Flexible: I can change the model, voice, visuals, or editor independently.
  • More control: I can run the LLM locally instead of sending every script prompt to a hosted LLM API.
  • Faster iteration: I can regenerate only the narration section that changed.
  • Clearer storytelling: a structured script helps keep the demo focused on the problem and the product.

There are trade-offs. vLLM needs compatible hardware and setup. Edge TTS relies on an online service. AI visuals can also take time to review. I use each tool where it saves time rather than adding complexity for its own sake.

5. What I want to automate next

There is room to take this workflow further:

  • Generate a first-draft script from a repository README.
  • Turn the script into a scene list with suggested screen actions.
  • Generate subtitles automatically.
  • Match narration sections to recorded clips.
  • Use FFmpeg to automate repetitive editing tasks.
  • Export versions with different lengths for a presentation, social post, or project page.

The long-term idea is a pipeline where project information and a screen recording become the starting point for a nearly finished demo video - with a human reviewing the story and final edit.

Conclusion

A hackathon project deserves a demo that makes its value easy to understand. My combination of a local LLM served with vLLM, Microsoft Edge TTS, and other AI tools helps me create narrated project videos in a repeatable way.

The important part is the balance: use AI to speed up scripting and production, but show the real application and keep the claims honest.

Build the project. Tell the story. Show the proof.

Tools and references

  • vLLM documentation
  • Microsoft Edge TTS Python package (edge-tts)
  • FFmpeg documentation

Image note: the photographs in this article are illustrative. Replace them with screenshots of your own vLLM setup, generated narration, and actual hackathon application to make the post a stronger build-in-public story.

Read on DEV Community ↗ ← Back to News

Comments

No comments yet. Start the discussion.