https://www.hackdemo.win/_next/static/chunks/252.4522def63e1f1404.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[252],{1252:function(e,s,t){t.r(s),t.d(s,{default:function(){return n}});var o=t(7437);function n(){return(0,o.jsxs)("article",{className:"space-y-6 text-sm leading-relaxed text-gray-600",children:[(0,o.jsxs)("section",{children:[(0,o.jsxs)("p",{className:"mt-2",children:["You've just spent 36 hours building something amazing. Your backend works, your frontend is polished, and your pitch slide deck is almost ready. Then you realize — ",(0,o.jsx)("strong",{children:"you have no demo video to show the judges"}),"."]}),(0,o.jsxs)("p",{className:"mt-2",children:["This is the moment most hackathon teams lose. Not because their product is bad, but because they can't communicate what it does in the 3–5 minutes judges give them. A polished demo video is the highest-leverage asset you can create in the final hours of a hackathon — and with AI tools like HackDemo, it now takes ",(0,o.jsx)("strong",{children:"under 5 minutes"})," instead of 2 hours."]})]}),(0,o.jsxs)("section",{children:[(0,o.jsx)("h2",{className:"text-lg font-semibold text-gray-900",children:"Why a Demo Video Wins Hackathons"}),(0,o.jsx)("p",{className:"mt-2",children:"Hackathon judges evaluate dozens of projects in a single day. They're tired, they're rushed, and they're making snap decisions. Here's what a demo video does for you:"}),(0,o.jsxs)("ul",{className:"mt-2 list-disc pl-5 space-y-1",children:[(0,o.jsxs)("li",{children:[(0,o.jsx)("strong",{children:"It scales your pitch."})," Not every judge sees your live presentation. A video demo lives on your Devpost submission and gets watched during deliberation."]}),(0,o.jsxs)("li",{children:[(0,o.jsx)("strong",{children:"It proves it works."})," A screen recording of your actual product carries 10\xd7 more credibility than slide screenshots. Judges see real interactions, not mockups."]}),(0,o.jsxs)("li",{children:[(0,o.jsx)("strong",{children:"It tells a story."})," A narrated walkthrough guides judges through your user flow — problem → solution → magic moment — without them having to figure it out themselves."]}),(0,o.jsxs)("li",{children:[(0,o.jsx)("strong",{children:"It works async."})," Corporate-sponsored prizes often have separate judges reviewing submissions offline. Your video is your 24/7 salesperson."]})]})]}),(0,o.jsxs)("section",{children:[(0,o.jsx)("h2",{className:"text-lg font-semibold text-gray-900",children:"The Old Way: 2 Hours of Pain"}),(0,o.jsx)("p",{className:"mt-2",children:"Before AI demo tools, creating a decent product walkthrough looked like this:"}),(0,o.jsxs)("ol",{className:"mt-2 list-decimal pl-5 space-y-1",children:[(0,o.jsx)("li",{children:"Record your screen with OBS or Loom (5 min)"}),(0,o.jsx)("li",{children:"Realize you clicked the wrong button and re-record (another 5 min)"}),(0,o.jsx)("li",{children:"Write a voiceover script so you don't ramble (20 min)"}),(0,o.jsx)("li",{children:"Record the voiceover, re-record 4 times because your teammate is talking in the background (30 min)"}),(0,o.jsx)("li",{children:"Import into a video editor, sync audio to video, add annotation arrows (45 min)"}),(0,o.jsx)("li",{children:"Export, realize the file is 2 GB, re-encode (15 min)"}),(0,o.jsx)("li",{children:"Upload to YouTube or Google Drive, hope the link works (5 min)"})]}),(0,o.jsxs)("p",{className:"mt-2",children:["Total: ",(0,o.jsx)("strong",{children:"~2 hours"}),". In a 36-hour hackathon, that's 5.5% of your total time — spent not building, not designing, not preparing for Q&A."]})]}),(0,o.jsxs)("section",{children:[(0,o.jsx)("h2",{className:"text-lg font-semibold text-gray-900",children:"The HackDemo Way: Under 5 Minutes"}),(0,o.jsx)("p",{className:"mt-2",children:"Here's the workflow that hackathon winners use:"}),(0,o.jsx)("h3",{className:"mt-4 font-semibold text-gray-800",children:"Step 1: Install the Extension (30 seconds)"}),(0,o.jsxs)("p",{className:"mt-1",children:["Add the"," ",(0,o.jsx)("a",{href:"https://chromewebstore.google.com/detail/hackdemo-%E2%80%94-ai-demo-record/dlkbndgmhlmddbihhjilapjncpbenhkj",target:"_blank",rel:"noopener noreferrer",className:"text-hack-primary hover:underline",children:"HackDemo Chrome extension"}),". No config, no API keys, no setup wizard. Sign in with Google and you're ready."]}),(0,o.jsx)("h3",{className:"mt-4 font-semibold text-gray-800",children:"Step 2: Record Your Flow (1–2 minutes)"}),(0,o.jsxs)("p",{className:"mt-1",children:["Click \"Start Capture\" and walk through your product's key user journey. Don't worry about perfection — HackDemo detects every click, input, and page navigation automatically. Focus on showing the ",(0,o.jsx)("strong",{children:"problem → solution path"})," that judges care about."]}),(0,o.jsxs)("p",{className:"mt-1",children:[(0,o.jsx)("strong",{children:"Pro tip:"}),' Record the "before" state too — show the problem your product solves, then show your solution in action. This contrast is what wins pitches.']}),(0,o.jsx)("h3",{className:"mt-4 font-semibold text-gray-800",children:"Step 3: Let AI Do the Narration (30–60 seconds)"}),(0,o.jsx)("p",{className:"mt-1",children:'Click "Done" and HackDemo\'s AI takes over. DeepSeek anal

1yzes your recorded steps and generates a step-by-step narration script. Google TTS produces the voiceover in your chosen language. Visual annotations — click markers, input highlights, scroll indicators — are applied automatically.'}),(0,o.jsxs)("p",{className:"mt-1",children:[(0,o.jsx)("strong",{children:"Pro tip:"})," Review the AI-generated narration and tweak any step. Add your team name, mention the tech stack, or highlight the innovation that makes your project special. The text is fully editable before export."]}),(0,o.jsx)("h3",{className:"mt-4 font-semibold text-gray-800",children:"Step 4: Export MP4 and Submit (30 seconds)"}),(0,o.jsx)("p",{className:"mt-1",children:"One click exports a polished MP4. Upload to Devpost as your demo video, add the link to your pitch deck, or play it directly during judge presentations. The file is optimized for web sharing — no 2 GB monsters."})]}),(0,o.jsxs)("section",{children:[(0,o.jsx)("h2",{className:"text-lg font-semibold text-gray-900",children:"What Makes a Winning Hackathon Demo"}),(0,o.jsx)("p",{className:"mt-2",children:"After analyzing dozens of winning Devpost submissions, here are the patterns that separate winning demos from the rest:"}),(0,o.jsx)("h3",{className:"mt-4 font-semibold text-gray-800",children:"1. Start with the Problem (15 seconds)"}),(0,o.jsx)("p",{className:"mt-1",children:"Don't jump straight into your product. Spend the first 15 seconds showing the problem. Judges need context. \"Managing cloud costs across three providers is a nightmare — here's what it looks like today.\""}),(0,o.jsx)("h3",{className:"mt-4 font-semibold text-gray-800",children:"2. Show One Clear User Journey"}),(0,o.jsxs)("p",{className:"mt-1",children:["Don't demo every feature. Pick ",(0,o.jsx)("strong",{children:"one"})," user journey that demonstrates your core value prop. A 2-minute focused demo beats a 5-minute feature dump every time. Judges can always explore more features on their own if they're interested."]}),(0,o.jsx)("h3",{className:"mt-4 font-semibold text-gray-800",children:'3. Highlight the "Magic Moment"'}),(0,o.jsxs)("p",{className:"mt-1",children:["Every great hackathon project has a moment where it clicks — the AI generates a response, the visualization renders, the automation triggers. Make sure this moment is ",(0,o.jsx)("strong",{children:"annotated and emphasized"})," in your video. HackDemo's auto-annotations handle this for you."]}),(0,o.jsx)("h3",{className:"mt-4 font-semibold text-gray-800",children:"4. Keep It Under 3 Minutes"}),(0,o.jsxs)("p",{className:"mt-1",children:['The most common feedback from hackathon judges: "demos are too long." Aim for ',(0,o.jsx)("strong",{children:"90–150 seconds"}),". If you can't explain your product's value in 2 minutes, you haven't distilled it enough. Record multiple takes if needed — each one costs pennies in AI credits."]}),(0,o.jsx)("h3",{className:"mt-4 font-semibold text-gray-800",children:"5. Add Narration — Don't Rely on Music"}),(0,o.jsx)("p",{className:"mt-1",children:"A silent screen recording set to lo-fi beats doesn't explain anything. AI narration costs ~$0.03 per demo and adds enormous value. Judges who watch your video during deliberation (often without audio from your live pitch) need the narration to understand what's happening."})]}),(0,o.jsxs)("section",{children:[(0,o.jsx)("h2",{className:"text-lg font-semibold text-gray-900",children:"Real Hackathon Scenario: The Last 2 Hours"}),(0,o.jsx)("p",{className:"mt-2",children:"Here's how a typical winning team uses HackDemo in the final stretch:"}),(0,o.jsxs)("ul",{className:"mt-2 list-disc pl-5 space-y-1",children:[(0,o.jsxs)("li",{children:[(0,o.jsx)("strong",{children:"T-2:00:"})," Core feature is working. One teammate starts recording the demo while others fix bugs and prepare slides."]}),(0,o.jsxs)("li",{children:[(0,o.jsx)("strong",{children:"T-1:55:"})," Recording done. AI processing begins. Team reviews the generated narration and tweaks two steps."]}),(0,o.jsxs)("li",{children:[(0,o.jsx)("strong",{children:"T-1:50:"})," MP4 exported. Video is uploaded to Devpost as a private/unlisted link. The demo is ",(0,o.jsx)("em",{children:"done"}),"."]}),(0,o.jsxs)("li",{children:[(0,o.jsx)("strong",{children:"T-1:00:"})," Team rehearses the live pitch, referencing the demo video for timing and narrative flow. No one is frantically editing in iMovie."]}

1),(0,o.jsxs)("li",{children:[(0,o.jsx)("strong",{children:"T-0:05:"})," Submission deadline. Demo video is polished, narrated, and already attached to the Devpost submission."]})]}),(0,o.jsxs)("p",{className:"mt-2",children:['Compare this to the team that starts recording at T-0:45, has no narration, and submits a silent screen recording with "we\'ll add voiceover later" in the description. ',(0,o.jsx)("strong",{children:"Same product, radically different judge experience."})]})]}),(0,o.jsxs)("section",{children:[(0,o.jsx)("h2",{className:"text-lg font-semibold text-gray-900",children:"Multi-Language Demos for Global Hackathons"}),(0,o.jsxs)("p",{className:"mt-2",children:["Competing in a hackathon with international judges? HackDemo supports ",(0,o.jsx)("strong",{children:"20+ languages"})," for AI narration — English, Chinese, Japanese, Korean, Spanish, French, German, Portuguese, and more. Record once, generate narrations in multiple languages if needed."]}),(0,o.jsx)("p",{className:"mt-2",children:"This is especially valuable for events like lablab.ai, Devpost hackathons with global sponsors, or any competition where judges may not be native English speakers. A demo narrated in the judge's language signals effort and respect."})]}),(0,o.jsxs)("section",{children:[(0,o.jsx)("h2",{className:"text-lg font-semibold text-gray-900",children:"Privacy: Share Without Leaking Secrets"}),(0,o.jsxs)("p",{className:"mt-2",children:["Hackathon demos often get shared publicly — on Devpost, Twitter, LinkedIn, and GitHub. HackDemo's ",(0,o.jsx)("strong",{children:"auto-blur feature"})," detects and obscures API keys, passwords, email addresses, and other sensitive information in your recording. You can share your demo confidently without worrying about accidentally exposing credentials."]})]}),(0,o.jsxs)("section",{children:[(0,o.jsx)("h2",{className:"text-lg font-semibold text-gray-900",children:"What Judges Actually Look For"}),(0,o.jsx)("p",{className:"mt-2",children:"Based on judge criteria from major hackathons (MLH, Devpost, lablab.ai), here's what your demo video should communicate:"}),(0,o.jsx)("div",{className:"mt-2 overflow-hidden rounded-xl border border-gray-200",children:(0,o.jsxs)("table",{className:"w-full text-left text-sm",children:[(0,o.jsx)("thead",{className:"bg-gray-50",children:(0,o.jsxs)("tr",{children:[(0,o.jsx)("th",{className:"px-4 py-2 font-semibold text-gray-900",children:"Criterion"}),(0,o.jsx)("th",{className:"px-4 py-2 font-semibold text-gray-900",children:"What to Show in Your Demo"})]})}),(0,o.jsxs)("tbody",{className:"divide-y divide-gray-100",children:[(0,o.jsxs)("tr",{children:[(0,o.jsx)("td",{className:"px-4 py-2 font-medium text-gray-700",children:"Innovation"}),(0,o.jsx)("td",{className:"px-4 py-2",children:'The "how did they do that?" moment. Annotate the technical highlight.'})]}),(0,o.jsxs)("tr",{children:[(0,o.jsx)("td",{className:"px-4 py-2 font-medium text-gray-700",children:"Impact"}),(0,o.jsx)("td",{className:"px-4 py-2",children:"Show the problem first, then the solution. Make the contrast visible."})]}),(0,o.jsxs)("tr",{children:[(0,o.jsx)("td",{className:"px-4 py-2 font-medium text-gray-700",children:"Execution"}),(0,o.jsx)("td",{className:"px-4 py-2",children:"Demonstrate a working product, not wireframes. Real clicks, real data."})]}),(0,o.jsxs)("tr",{children:[(0,o.jsx)("td",{className:"px-4 py-2 font-medium text-gray-700",children:"UX / Design"}),(0,o.jsx)("td",{className:"px-4 py-2",children:"Smooth flow, visual polish. HackDemo annotations highlight the journey."})]}),(0,o.jsxs)("tr",{children:[(0,o.jsx)("td",{className:"px-4 py-2 font-medium text-gray-700",children:"Presentation"}),(0,o.jsx)("td",{className:"px-4 py-2",children:"Clear narration, logical flow, professional delivery. AI handles this."})]})]})]})})]}),(0,o.jsxs)("section",{children:[(0,o.jsx)("h2",{className:"text-lg font-semibold text-gray-900",children:"The Bottom Line"}),(0,o.jsx)("p",{className:"mt-2",children:"Hackathons are won and lost in the presentation. You can build the most technically impressive project in the room, but if judges can't understand what it does in 2 minutes, you won't win. A narrated, annotated demo video is the single highe

1st-ROI asset you can create in the final hours."}),(0,o.jsxs)("p",{className:"mt-2",children:["With AI tools like HackDemo, creating a professional demo now takes ",(0,o.jsx)("strong",{children:"under 5 minutes"})," — less time than it takes to brew a pot of hackathon coffee. There's no reason to submit a silent screen recording ever again."]})]}),(0,o.jsx)("section",{children:(0,o.jsxs)("p",{className:"mt-4 rounded-xl bg-gray-50 px-4 py-3 text-sm",children:[(0,o.jsx)("strong",{children:"Win your next hackathon with a pitch-ready demo —"})," new users get ",(0,o.jsx)("strong",{children:"$0.50 free"})," credits, enough for your first fully-narrated demo. No credit card required."," ",(0,o.jsx)("a",{href:"https://chromewebstore.google.com/detail/hackdemo-%E2%80%94-ai-demo-record/dlkbndgmhlmddbihhjilapjncpbenhkj",target:"_blank",rel:"noopener noreferrer",className:"font-medium text-hack-primary hover:underline",children:"Start free →"})]})})]})}}}]);