sergeev.media
Overview
A portfolio for a video editor: a mosaic of playing clips on the first screen, a carousel of vertical shorts and a horizontal reel.
- Year
- 2026
- Type
- Portfolio · Motion
- Role
- Design and full-stack development
- Link
- sergeev.media
- 14
- vertical shorts
- 2
- languages
Challenge and solution
The challenge
A video editor’s portfolio has to show many clips at once — without a huge page load or stuttering on phones.
The solution
Posters load first and each clip only plays while it is on screen, then lets go of its video when it scrolls far away. GSAP and Lenis tell the story on scroll, and a native dialog plays any clip full screen with sound.
Screens
What it does
- Full-screen hero reel with the editor’s name on top
- Ticker of formats: Reels, Shorts, YouTube, ads, music videos
- Swipeable carousel of 14 vertical shorts with clients and durations
- Horizontal section with long-form videos
- “About” photo with a 3D depth effect
- Price list, process and contacts in Telegram, WhatsApp and Instagram
- Russian and English versions
Under the hood
- Clips start on scroll into view, pause when they leave and drop their source when far off-screen.
- Clicking a clip opens a native dialog with sound and pauses smooth scrolling.
- The depth photo is an image plus a depth map turned into a WebGL surface with a Bayer dither.
- Heavy motion only runs on desktop and never when reduced motion is requested.
- Next.js
- React
- Tailwind CSS
- GSAP
- Lenis
- WebGL
- Cloudflare