High-end editorial agency template with interactive scroll animations, dynamic case studies, and 5-minute config. Built with Next.js 14, Tailwind CSS & Framer Motion.
Arca® High-End Editorial Agency & Studio Template High-end editorial agency template with interactive scroll animations, dynamic case studies, and 5-minute config. Built with Next.js 14, Tailwind CSS & Framer Motion. Designed for creative studios, branding agencies, art directors, and senior freelancers charging \$5k–\$50k+ per engagement. No generic AI templates, no bloated page builders. Pure architectural minimalism, disciplined typography, and instant 100/100 performance scores. Live Demo https://arca-template.vercel.app/ What’s Inside - Architectural Homepage: - Floating pill navigation with responsive mobile overlay - Editorial hero with 4-column metadata matrix & dual-city relay timezones - Interactive ScrollReveal motion powered by Framer Motion - Selected works showcase with hover states & direct case study routing - Studio philosophy manifesto with dynamic KPI counter - Structured service rows with turnaround tags & deliverables breakdown - Documentary video reel card with custom play trigger - Social proof & 5-star verified client review grid - 3-tier transparent pricing cards with monthly retainer highlight - Interactive accordion FAQ with top-aligned controls - Functional lead capture contact form (Formspree plug-and-play) & physical studio hub cards - 6x Dynamic Case Study Detail Pages (`/work/[slug]`): - Full narrative case study layouts: Strategic Thesis, The Core Challenge, System Solution - Measurable Impact KPI grid (100% sell-out, 4.2x lift metrics) - Multi-image campaign gallery diptych - Verified stakeholder testimonial endorsement - Studio credits breakdown & circular next-project pagination - Statically generated via generateStaticParams for instant zero-latency loads & max SEO - 3x Long-Form Journal Essay Pages (`/journal/[slug]`): - Editorial reading experience with reading progress indicator bar - Monospaced metadata tags (category, date, read time) - Styled pullquote callouts & sub-section headers - Author bio footnote card & next-article recommendation - Centralized Single-File Config (`config/site.ts`): - Customize entire website (branding, copy, prices, hub locations, case studies, essays, form endpoints) in under 5 minutes from 1 file without touching layout components. Tech Stack - Framework: Next.js 14 (App Router, Server Components & Static Site Generation) - Styling: Tailwind CSS (Custom studio palette: charcoal #11100C, warm cream #F4F0E8, teal accent) - Motion: Framer Motion (restrained, scroll-triggered reveals, zero lag) - Icons: Lucide React - Typography: Inter + Editorial Serif font pairings - Responsiveness: 100% responsive audited down to 320px screens (iPhone SE to 4K desktop) - SEO & Social: Pre-configured dynamic OpenGraph tags, sitemap.xml, robots.txt Quick Start (Up in 3 Steps) bash 1. Install dependencies npm install 2. Run local development server npm run dev 3. Edit config/site.ts with your studio info & deploy to Vercel in 1 click!
