logo
← ALL WORKSATYDEV® STUDIO // CASE DIALER
01 / INTERACTION DESIGN

SATYDEV®

The personal website you are browsing, featuring custom WebGL shaders, volumetric glass pills, and organic grids.

ROLEProduct Designer / Engineer
YEAR2026
TYPESelf Brand Site
STACKNext.js / Three.js / GSAP
LOADING MEDIA PIPELINE...
02 / THE PROBLEM
Generic developer portfolios feel like templates. As a designer who codes, I wanted my portfolio to feel like an interactive playground, communicating strong product thinking, WebGL performance, and typography control.
ROLEProduct Designer / Developer
TIMELINEOngoing
PLATFORMWeb Application
STACKNext.js / Three.js / GSAP / Tailwind
STATUSActive
01 / PROBLEM

Standard flat layouts fail to show interaction capabilities and front-end engineering limits.

02 / INSIGHT

Adding interactive WebGL components makes the interface feel alive and satisfying to explore.

03 / DECISION

Build custom fragment shaders and volumetric glass cards using Three.js and custom canvas logics.

03 / THE INTERFACE
LOADING MEDIA PIPELINE...
04 / IMPLEMENTATION

WEBGL SHADER GRID PIPELINES.

FRONTENDSTACKNext.js / Three.js (R3F) / Tailwind CSS
BACKENDSERVICESSupabase real-time visitor database
MOTION / ANIMATIONCustom WebGL shaders and GSAP ScrollTrigger reveals
SYSTEM ARCHITECTUREModular dynamic component grid layout
05 / REFLECTION

THE INTERFACE SHOULD BREATHE AND RESPOND.

We learned that combining strict typographic Swiss grids with playful organic shaders creates a premium, state-of-the-art developer brand that immediately commands attention.

NEXT PROJECT

NIRANKUSH

→

Design & Developed by satuxcodes
© 2026. All rights reserved.