Origami Web Design
Modern agency site to market services, showcase work, and drive leads via a validated contact funnel.
Overview
Modern agency site to market services, showcase work, and drive leads via a validated contact funnel.
Screenshots
Tech Stack
Key Features
- ▸Services overview and details
- ▸4‑item portfolio grid
- ▸Blog listing and case studies
- ▸Validated contact form → SMTP email
- ▸Reading progress and sticky CTA
- ▸Responsive images and clean semantics
Design Philosophy
Clarity and speed; service-led storytelling with responsive layouts and strong contrast for readability.
Design
Focused on clarity and speed: typography choices to improve scan-ability, high-contrast UI for readability, and a layout that highlights primary actions and content without distraction.
Development
Built with Next.js 14, React 18.2, Tailwind CSS 3.4, TypeScript 5, Zod, Nodemailer (SMTP). Emphasis on modular components, predictable state handling, and accessible interactions. Performance budgets guided media usage and bundle size.
Target Audience
Small businesses and founders seeking a modern web presence and lead-generation funnel.
Deployment
Deployed on Vercel with automatic preview builds and main-branch production releases. Contact form emails are handled via SMTP using environment variables for secure configuration.
Challenges
Performance without layout shift, reliable email delivery, responsive grids, and SEO/semantics.
Outcomes
High Lighthouse locally (90s+ typical for Next/Tailwind), live contact funnel with SMTP email notifications, fast pages and easy content updates.