The art of
technical architecture.
I am a developer who views code as a medium for creative expression. Based in Pakistan, I bridge the gap between complex engineering and refined digital aesthetics.
My journey began in structural engineering before finding a digital canvas. This background instills a "foundation-first" philosophy in my development process. Every line of TypeScript is a structural beam; every WebGL shader is a play of light on a physical surface.
I specialize in building interfaces that don't just function, but feel. I believe luxury is found in the invisible details—the timing of a transition, the weight of a font, the precision of a layout shift.
Technical Vocabulary
React & TypeScript
Architecting scalable, type-safe systems with a focus on atomic design and reusable logic.
WebGL & Shaders
Pushing the boundaries of the browser with performant 3D experiences and custom GLSL.
Visual Design
Crafting high-end editorial layouts with a focus on typography and negative space.
Interactive Motion
Choreographing digital experiences that respond to user intent with fluid, physics-based motion systems.
Core Vitals
Obsessive optimization for zero-latency interactions and ultra-low load times.
Principles
How I make decisions
A small set of rules that keeps the work consistent—across performance budgets, visual systems, and long-lived codebases.
01
Clarity over cleverness
Readable architecture scales teams. If it can’t be explained simply, it’s not stable enough to ship.
02
Performance is a feature
I treat Core Web Vitals as product requirements—measured, budgeted, and defended during iteration.
03
Systems, not screens
I build design tokens, primitives, and patterns first—then assemble pages as compositions, not one-offs.
04
Motion with intent
Animation must clarify hierarchy and state. Ambient motion is restrained; transitions earn their presence.
Toolbox
Next.js / React
App Router
TypeScript
Strict-first
Tailwind CSS
Tokens + utilities
Framer Motion / GSAP
Interaction
Three.js / WebGL
Immersive
Vercel / Edge
Delivery
Signals
What “good” looks like
Evidence that the work is robust: measurable, repeatable, and comfortable to maintain after launch.
Core Web Vitals
Performance
Budgets defined early; regressions caught before release. Fast-first decisions throughout the build.
Accessible by default
A11y
Semantic structure, keyboard flows, contrast, and motion preferences built into the system—not bolted on.
Maintainable delivery
Engineering
Type safety, conventions, and components that age well—so future updates remain confident and quick.
Associate Software Engineer
2025 — PRESENTTriminage
Delivered full-stack features on Next.js and Supabase—from UI through the data layer—that ship cleanly and hold up under growth. Improved maintainability and load performance so releases stay faster to ship and smoother for users.
Software Engineering Intern
2025 · 2 MONTHSTriminage
Two-month internship contributing to production Next.js features, UI polish, and code quality. Built familiarity with the team’s stack and delivery standards before joining full-time as Associate Software Engineer.
Ready when you are
Tell me about the work.
A short note is enough. I’ll reply with fit, timing, and the next step so we can move without the runaround.