ttvfx.com

The marketing site for Two Tales VFX: Next.js 16 (App Router), Tailwind CSS v4, exported as static HTML.

npm install
npm run dev      # http://localhost:3000
npm run build    # static site in ./out

Editing content

All copy (studio info, services, projects, contact email) lives in content/site.ts. Items marked TODO are placeholders.

• Projects: add an entry to projects. Put stills in public/work/ and set image: "/work/name.jpg" (2.39:1 looks best). video accepts an MP4 path or a Vimeo/YouTube embed URL. Each project gets a page at /work/<slug>/.
• Showreel: drop public/reel.mp4 (muted, looping, ideally under 10 MB) and public/reel-poster.jpg, then set site.reel and site.reelPoster.
• Logo: the fox mark is a vector in components/Fox.tsx / public/fox.svg, traced from G:\_ADMIN\TWOTALESLOGO.png. Favicons are app/icon.png and app/apple-icon.png.

Structure

app/
  page.tsx            home: hero, selected work, services, studio, contact
  work/page.tsx       project index
  work/[slug]/        project detail pages (statically generated)
  sitemap.ts, robots.ts
components/           Header, Footer, Hero, Frame, ProjectCard, Reveal, Timecode…
content/site.ts       all site content

Deployment is covered in DEPLOY.md.