Wondros

A cinematic, SSR-powered React platform for Wondros, a strategic creative agency turning complex ideas into impact across film, branding, campaigns, and digital communications.

Launch Project
Project Hero Image
01 / Live website

Client

Wondros — Strategic Creative Agency
Los Angeles, CA

Services

Web Development
SSR Architecture
Motion & Video

Industry

Creative Agency
Film & Branding
Philanthropy

Year

2024

About the project Showcasing work that moves the needle.

Wondros designs communications that build trust, drive engagement, and deliver measurable outcomes for clients like the NIH, IBM, MD Anderson, Stand Up 2 Cancer, American Express, and Craig Newmark Philanthropies. The site needed to feel as cinematic and considered as the work itself, a portfolio-first experience where film, campaigns, and case studies could breathe.

Our team built it as a server-side rendered React application on Vite, giving the team fluid, app-like interactions while keeping every case study fully crawlable, instantly shareable, and fast on first paint. Capability and focus-area filters update the work grid in place, with state preserved across navigation so visitors never lose their place.

Film is treated as a first-class citizen. I integrated the Vimeo API into a custom video pipeline that pulls thumbnails, durations, and HLS streams directly from the client’s library, so the Wondros team can publish a new film without touching code. Lottie handles micro-interactions and lightweight motion graphics, and Framer Motion drives page transitions, hover choreography, and layered reveals across hero modules and case study scroll states.
Everything ships through AWS CodePipeline to an EC2 fleet, fronted by a global CDN for fast asset delivery worldwide, an infrastructure stack that matches the production value Wondros brings to every frame they put out.

03 / Tech Stack Cinematic, fast, SSR.

A modern React stack with Vite-powered SSR, Vimeo-driven film delivery, and motion handled by Lottie and Framer Motion, deployed to AWS via CodePipeline and served from the edge.

React

Component architecture for the entire front-end experience.

01
Framework

Tailwind CSS

Utility-first CSS for rapid, consistent UI development.

02
Styling

Vite SSR

Server-side rendering for fast first paint and full SEO.

03
Rendering

Vimeo API

Custom film pipeline pulling thumbs, durations, and HLS.

04
Video

Lottie

Lightweight, scalable motion graphics and micro-interactions.

05
Motion

Framer Motion

Page transitions, hover choreography, and layered reveals.

06
Animation

AWS EC2

Scalable cloud compute serving the SSR Node runtime.

07
Hosting

AWS CodePipeline

Automated CI/CD from commit through build to deploy.

08
DevOps

CDN

Global edge delivery for assets, images, and video posters.

09
Delivery