[FEATURE] Add Modern Landing Page with Hero Section and CTA Navigation

[samritmukherjee]

Currently, Reframe opens directly into the editor interface. While functional, new users may not immediately understand the product’s features, privacy-first approach, and browser-based workflow.

I would like to add a modern landing page that:

Introduces Reframe clearly
Highlights key features
Explains privacy/client-side processing
Improves first impression and onboarding
Adds responsive hero section with CTA buttons
Navigates users to the existing editor page

Proposed structure:

/ → Landing page
/editor → Existing editor UI

Planned additions:

Hero section
Feature cards
“No uploads / No login / 100% private” section
Responsive modern UI
Smooth animations
CTA buttons (“Get Started”, “Open Editor”)

The goal is to improve user onboarding and presentation while preserving the current editor experience.

[github-actions]

👋 Thanks for opening an issue, @samritmukherjee!

Our maintainers will review this shortly 🚀

Before you start working

• 📖 Read the CONTRIBUTING.md guide
• 💬 Wait for a maintainer to assign you the issue before starting work
• 🔍 Search for existing issues to avoid duplicates

For GSSoC'26 contributors

If you're contributing under GirlScript Summer of Code 2026, please mention it in your comment when requesting assignment:

"I'd like to work on this — contributing under GSSoC'26"

Architecture notes

Reframe is a static Next.js app with output: "export". Key points:

• All video processing uses FFmpeg.wasm (client-side, no server)
• headers() in next.config.ts won't work — use vercel.json instead
• not-found.tsx requires public/404.html + vercel.json routes config

Happy contributing! ⭐ Star the repo if you find it useful!

[samritmukherjee]

"I'd like to work on this — contributing under GSSoC'26"

[riddhimagupta2]

Hi @magic-peach , I'd like to work on this issue contributing under GSSoC'26.
please assign me this issue.

[github-actions]

Hey @riddhimagupta2, this issue has been assigned to you! 🎉 Please make progress within 5 days or it will be automatically unassigned due to inactivity.

[its-arpit-tripathi]

Hi, I am a GSSoC 2026 contributor and would like to work on this.

[magic-peach]

Thanks for the feature request, @samritmukherjee! A landing page that explains Reframe before the editor is an interesting idea.

A few important constraints to keep in mind:

• This project uses output: "export" in Next.js — it's a static SPA. Any landing page must be a static route (e.g., / redirecting to /editor), not server-rendered.
• The privacy-first, offline-capable design should be the hero message
• Must use the existing CSS variable design system (--bg, --surface, --text, --muted, --border) — no hardcoded colors

This is level:intermediate scope. If you'd like to work on this, comment below!

[github-actions]

Claude finished @magic-peach's task —— View job

---

Thanks for the clear technical guidance, @magic-peach!

I've noted the constraints for this feature request:

Technical Requirements Analysis

• ✅ Static Next.js SPA (output: "export")
• ✅ Use existing CSS variable system (--bg, --surface, --text, --muted, --border)
• ✅ Privacy-first messaging as hero content
• ✅ Static routing structure (/ → landing, /editor → existing editor)

Issue Status

This issue is currently assigned to @riddhimagupta2. The technical constraints and intermediate-level scope have been clearly defined by the maintainer.

No further action needed from me at this time - this is a status update that doesn't require implementation or direct response.

---