rambaarde.com
Creative DevNext.jsGSAPFramer MotionSanity

This Site — CMS-Driven Creative Portfolio

Introduction

The site you’re on — a fully dynamic, CMS-driven creative portfolio. Nothing is hardcoded: every case study, the about page, experience, and skills are served from one centralized Sanity CMS that also powers blog.rambaarde.com.

Details
Project Namerambaarde.com
Timeframe2025 — Present
RoleDesigner & Developer
The Goal

A portfolio that demonstrates the craft it claims: purposeful motion at 60fps, custom interaction systems instead of library defaults, and content that updates without a deploy.

About page — Sanity-driven experience timeline
About page — Sanity-driven experience timeline
Case studies index with CMS-managed projects
Built, Not Installed

The page transitions are a custom GSAP system inspired by Barba.js that intercepts internal navigation and slides routes in with expo easing. Smooth scrolling is a hand-rolled requestAnimationFrame + lerp loop — no Lenis, no Locomotive. Text reveals are scroll-driven word-by-word Framer Motion animations, and the theme toggle uses the View Transitions API with a GSAP fallback for browsers without it.

One CMS, Two Sites

Nothing on this site is hardcoded. Every case study, the about page, work experience, education, certifications, honors, and skills are served dynamically from a single, centralized Sanity CMS — and that same CMS also powers the blog at blog.rambaarde.com. One content backend behind two live front-ends (rambaarde.com and the blog), each edited and published without a code deploy.

Scope
Centralized Sanity CMS powering rambaarde.com + blog.rambaarde.com01
Fully dynamic content — case studies, about, experience, education, skills & more02
Custom GSAP page-transition system03
RAF + lerp smooth scroll engine04
Scroll-driven text reveal & hover-preview components05
View Transitions API theme toggle with fallback06
The Details

Neue Montreal across four weights, oklch color tokens for both themes, prefers-reduced-motion fallbacks on every animation, and Next.js 16 with React 19 underneath.

Want to see more?