mirror of
https://github.com/jamiepine/voicebox.git
synced 2026-09-16 13:20:39 -07:00
Jamie Pine
8377152d86
New Spacedrive-inspired landing page with dark warm color system, glassmorphic navbar, feature cards with animated illustrations, and an interactive ControlUI mockup that cycles through voice generations with real audio playback via WaveSurfer. The ControlUI demo script is fully data-driven - profiles, generation text, audio samples, and effects are all configurable from a single DEMO_SCRIPT array. Includes 6 real voice samples (Jarvis, Morgan Freeman, Sam Altman, Samuel L. Jackson, Linus Tech Tips, Fireship) converted to webm opus.
Voicebox Landing Page
Landing page for voicebox.sh - a modern Next.js 16 application.
Tech Stack
- Next.js 16 with App Router
- Bun for package management
- Tailwind CSS with shadcn/ui components
- TypeScript with strict mode
- Railway deployment ready
Getting Started
Prerequisites
- Bun installed (bun.sh)
Installation
cd landing
bun install
Development
bun run dev
Open http://localhost:3000 to view the landing page.
Build
bun run build
Production
bun run start
Configuration
Update Download Links
Edit src/lib/constants.ts to update:
LATEST_VERSION- Current release versionDOWNLOAD_LINKS- GitHub release download URLsGITHUB_REPO- Repository URL
Update GitHub Username
Replace USERNAME in src/lib/constants.ts with your actual GitHub username.
Deployment to Railway
- Connect your GitHub repository to Railway
- Railway will auto-detect
nixpacks.toml - Set root directory to
landing/ - Railway will automatically:
- Install dependencies with
bun install - Build with
bun run build - Start with
bun run start
- Install dependencies with
- Configure custom domain
voicebox.shin Railway settings
Project Structure
landing/
├── src/
│ ├── app/
│ │ ├── layout.tsx # Root layout with metadata
│ │ ├── page.tsx # Landing page
│ │ └── globals.css # Global styles
│ ├── components/
│ │ ├── Header.tsx # Top navigation
│ │ ├── Footer.tsx # Footer
│ │ ├── DownloadSection.tsx # Download buttons
│ │ └── ui/ # shadcn/ui components
│ └── lib/
│ ├── utils.ts # Utility functions
│ └── constants.ts # App constants
├── public/
│ └── voicebox-logo.png # Logo asset
└── nixpacks.toml # Railway deployment config
Features
- Responsive design (mobile-first)
- Dark mode by default
- SEO optimized metadata
- Download links for Mac, Windows, Linux
- Feature showcase
- Platform highlights
- GitHub integration