A dark, modern marketing site for a creative studio showcasing design, motion, and brand work for ambitious teams.
- 🎨 Dark, Cinematic UI - Modern gradient backgrounds with high-contrast design
- 🎭 Smooth Animations - Framer Motion animations throughout with scroll-triggered effects
- 📱 Fully Responsive - Optimized for mobile, tablet, and desktop
- ⚡ Fast & Modern - Built with Next.js 16, React 19, and TypeScript
- 🎯 Conversion-Focused - Strategic layout with clear calls-to-action
- 🌊 Horizontal Navbar - Sticky navigation with smooth interactions
- Framework: Next.js 16 (Pages Router)
- Language: TypeScript
- Styling: Tailwind CSS 4
- Animations: Framer Motion
- Deployment Ready: Vercel-optimized
- Node.js 18+ installed
- npm or yarn package manager
- Clone the repository:
git clone https://github.com/wabbit12/nightwave.git
cd nightwave- Install dependencies:
npm install- Run the development server:
npm run dev- Open http://localhost:3000 in your browser
nightwave/
├── components/ # React components
│ └── Footer.tsx # Footer component
├── pages/ # Next.js pages
│ ├── _app.tsx # App wrapper
│ └── index.tsx # Homepage with all sections
├── styles/ # Global styles
│ └── globals.css # Tailwind base styles
├── public/ # Static assets
└── package.json # Dependencies
- Hero - Main introduction with launch overview
- Stats - Key metrics and snapshots
- Work - Showcase of services and approach
- Services - Launch sprint and retainer options
- Approach - Process and methodology
- Contact - Inquiry form for potential clients
npm run dev- Start development servernpm run build- Build for productionnpm start- Start production servernpm run lint- Run ESLint
Deploy to Vercel with one click:
Or deploy manually:
npm run build
npm startThis is a design case study and portfolio project.
Created by @wabbit12