Digital Archive / 2026

Selected
Artifacts.

Project_01WEBGL

3D Scroll Canvas

WebGL scene driven entirely by scroll position — geometry morphing and smooth camera path interpolation.

Project_02WEBGL

Three.js Video Gallery

Spatial video gallery rendered inside a WebGL scene with custom shader distortion on hover.

Project_03INTERACTION

Matter.js Scroll Physics

Physics-driven UI where elements respond to scroll as simulated rigid bodies with real collision and gravity.

Matter.jsCanvas APIGSAP
scroll-matterjs.rahmounidev.com
Project_04ANIMATION

Horizontal Scroll Engine

Custom horizontal scrolling system with velocity-based easing, momentum, and magnetic snap points.

Project_05ANIMATION

Parallax Snap Scroll

Infinite vertical scroll with multi-layer parallax depth and magnetic section snap on scroll release.

Project_06ANIMATION

Savoir Faire — Page Reveal

Staggered mask-reveal animation sequence for editorial-style page entries — inspired by high-end agency sites.

Project_07ANIMATION

Page Transition System

Route-level transition orchestration with shared layout animations and coordinated exit/enter sequences.

Framer MotionNext.jsReact
page-transitions.rahmounidev.com
Project_08ANIMATION

First / Last Scroll

Synchronized first-in last-out scroll choreography across layered content panels — study in sequencing.

Project_09UI / MOTION

Monica — Landing Page

High-conversion landing page with scroll-triggered reveal sequences and ambient gradient system.

Framer MotionReactTailwind
monica-landing-page.rahmounidev.com
Project_10UI / MOTION

Monica — Vertical Carousel

Spatial content carousel with fluid perspective transforms — depth-layered vertical navigation.

Project_11UI / MOTION

Work Section Scroll v1

Portfolio work section with staggered entrance, parallax headers, and hover depth effects.

Project_12INTERACTION

Digital Business Card

Interactive digital business card with ambient particle field and flip interaction.