Cinematicinterfacesengineeredwithprecision.
Creative Developer · Digital Experience Designer
I design and engineer products that feel like culture, not software — studios trust me with the hero moments.
One developer, the whole stack.
Every layer, end to end — shipped by one pair of hands.
Frontend
React · Next.js · Tailwind
Motion & 3D
Framer · R3F · GLSL
API / Edge
REST · tRPC · Server Actions
Backend
Node · RSC · Streaming
Database
Postgres · Supabase · Prisma
Infra / DevOps
Vercel · CI/CD · Docker
About / Philosophy
Ibuildsoftwaretheway
filmdirectorsbuildscenes—
everyframeisadecision,
nothingisincidental.
I'm Amr — a creative developer working at the seam between brand, product, and motion. I lead frontend on flagship work for studios and product teams who care about the millisecond, the kerning, the easing curve.
My discipline is restraint at high resolution. Less surface, more depth. Every transition has a reason; every empty pixel was chosen. The portfolio you're reading is itself the proof.
Recent proofs ofpractice.
Four recent engagements — one flagship, two shipped, one in the kiln. The cards stack as you scroll; each opens the live site.
Premise
An editorial, brutalist site for a Kuwait-based fit-out and general contracting studio. The web equivalent of walking into a finished space.
Stack
Premise
A precision-engineered presence for a Kuwait-based medical equipment distributor — 25+ brand partners, 170+ product lines, 24/7 technical support.
Stack
Premise
The first bilingual holistic wellness program in the Middle East. Built on functional medicine, NLP, and metabolic health — presented like a science magazine, not a clinic.
Stack
Premise
A clinical-grade aligner studio in Kuwait City — three-minute scans, real-time simulation, a treatment plan you can watch unfold tooth by tooth. Currently in build.
Stack
Scenarios
—Spaces,ScriptedintoReality
Client
Scenarios Design
Role
Brand · Frontend Architect
Status
Featured
Premise
An editorial, brutalist site for a Kuwait-based fit-out and general contracting studio. The web equivalent of walking into a finished space.
Challenge
Contracting studios usually present themselves as catalogues — galleries, price points, certifications. Scenarios needed to read like a creative house: confident, restrained, and structured like a six-act script.
Approach
I built the site around the studio’s own metaphor — every project is a script, every page a scene. Oversized serif type, generous whitespace, an ember accent dot, and motion timed to the rhythm of a stage cue.
Outcome
A site that moved Scenarios from contractor to creative studio in the buyer’s mind — and won them their first international RFP within a month of launch.
+62%
RFP win-rate
4:18
Avg session
98
Lighthouse perf
Quipmed
—LeadingMedicalInnovation
Client
Quipmed
Role
Frontend Architect
Status
Live
Premise
A precision-engineered presence for a Kuwait-based medical equipment distributor — 25+ brand partners, 170+ product lines, 24/7 technical support.
Challenge
Medical distribution sites are usually flat directories. Quipmed needed to feel as serious as the equipment it sources — calm, exact, and quietly authoritative.
Approach
A clinical green-on-ink system. Floating credibility badges (ISO, brand partners, 24/7), an anatomical hero, and a system of micro-interactions that signal precision at every hover.
Outcome
A site clinicians and procurement managers actually trust. Bounce rate down 38%, partner inquiries up sharply within the first quarter.
Stack
LivFunctional
—Healing,RootedinScience
Client
LivFunctional
Role
Creative Developer · Brand
Status
Shipped
Premise
The first bilingual holistic wellness program in the Middle East. Built on functional medicine, NLP, and metabolic health — presented like a science magazine, not a clinic.
Challenge
Wellness brands in the region either feel medical and clinical or fluffy and Instagram-y. LivFunctional needed the rare third register — rigorous, warm, and unapologetically modern.
Approach
An off-white editorial palette, generous serif headlines, and a live glucose visualization that proves the science in real time. Bilingual EN/AR from the first commit, RTL-correct everywhere.
Outcome
A consultation funnel that converts at 4.1% from cold traffic — a number wellness clinics in the region rarely see.
Stack
Smartee
—Tomorrow’sSmile,bytheMillimeter
Client
Smartee Kuwait
Role
Founding Designer · Engineer
Status
In Development
Premise
A clinical-grade aligner studio in Kuwait City — three-minute scans, real-time simulation, a treatment plan you can watch unfold tooth by tooth. Currently in build.
Challenge
Aligner brands either feel cosmetic or feel hospital. Smartee needed to feel like aerospace — precise, calm, and quietly futuristic. A clinical product with the visual confidence of a tech launch.
Approach
Concentric radial lattices, scientific telemetry chips (0.04mm scan, 0.12N pressure, 47° arch correction), and a deep crimson palette that reads premium without reading dental.
Outcome
Currently in private beta with the founding clinical team. Public launch and first patient cohort scheduled for Q3 2026.
Stack
Scroll to open the build.
Real builds, playing live.
Keep scrolling
Selected frames,
inorbit.
A self-driving carousel. Hover to pause and steer your eye. Built with pure CSS 3D — no images of images.
ScenariosQuipmedSmarteeLivFunctionalAward-winning on the small screen too.
Threeguarantees,
inwriting.
One pair of hands.
Strategy, design, motion, and code — no hand-offs, no telephone game. The person you brief is the person who ships, and nothing gets lost between departments that don't exist.
Motion with meaning.
Nothing on screen moves without a reason. Every transition communicates hierarchy, causality, or care — never decoration for its own sake. If an animation doesn't earn its frame budget, it doesn't ship.
Ship-ready, day one.
Production quality from the first commit — performance budgets, accessibility, SEO, and analytics built in, not bolted on. The handover is a deploy key, not a folder of maybes.
The render and its source, hand-built.
Webuildfromscratch.
No templates · No page builders
—— 06 · Process
Method
A five-beat method for inevitable software — the same sequence, every engagement, no improvisation where it counts.
Listen
Strategy before pixels. I interrogate the brief until the real problem surfaces — usually it’s not the one in the doc.
Frame
A single hero metaphor. One idea the whole product can hang from. If it doesn’t survive five minutes of pressure, it dies.
Compose
Editorial layouts, opinionated motion, system-level thinking. Every screen earns its place.
Ship
Production-grade engineering on day one. No throwaway prototypes — the demo is the product.
Tune
Frame rate is a feature. Latency is a feature. The site you’re on right now is tuned to 60fps on a five-year-old laptop.
Fullstack
oftaste&craft.
I'm a one-person studio for the things that matter most — strategy, interaction, motion, and shipping. For everything else I assemble teams I trust and lead them on the work.
Product Engineering
- Next.js 15 / RSC
- TypeScript
- Edge runtimes
- Vercel / Cloudflare
Motion & Interaction
- Framer Motion
- GSAP / ScrollTrigger
- Lenis
- Choreography systems
3D & Immersive
- Three.js / R3F
- Shaders (GLSL)
- WebGL
- Spatial UI
Design Systems
- Tokens & theming
- shadcn/ui
- Tailwind architecture
- A11y baked in
Bilingual / RTL
- Arabic + English from day one
- RTL-correct motion
- Locale-aware UX
- Type pairing
Brand Direction
- Editorial systems
- Typography
- Motion identity
- Cinematic storytelling
Motionisthe
invisiblescript.
Animations don't decorate the interface — they choreograph the user's attention. I treat every easing curve, stagger, and pause as a director treats a cut.
Cursor-aware interaction
Magnetic
Sequenced reveal logic
Stagger
GPU-driven color
Iridescence
Fourconvictions
Iwon'tnegotiate.
Restraint is a feature.
Every element on screen is an obligation. Remove until it hurts. Then remove one more.
Motion is meaning.
If a transition doesn't communicate hierarchy or causality, it shouldn't exist.
Speed is a love letter.
Frame rate, time-to-interactive, latency — these are how a product respects the person using it.
Brand lives in the details.
The kerning of the caption. The easing of the toast. The empty state nobody will see.
Whatthepeople
payingmesay.
Amr doesn’t ship features — he ships moments. The work feels considered down to the millisecond, and clients notice within thirty seconds.
Studio Founder
Scenarios Design
He took a vague brief and returned a product that closed our first enterprise pilot. The motion alone moved the needle.
Head of Product
Healthcare SaaS · Kuwait
Frontend craft at the level you usually only see in studios with twenty engineers. He’s one.
Engineering Director
Regional Startup
Most portfolios are static. His site is the proof.
Creative Director
Brand Studio
Engagement
Founding-team work, flagship product launches, brand engineering, and the one-off cinematic landing page that earns a studio its next client.
Working from
Salmiya, Kuwait
GMT+3 · Worldwide
Let'sbuildsomethingunforgettable.
01 · Founding work
Build something from zero.
Founder-mode partnership for early-stage product. Design, engineering, brand — one pair of hands.
02 · Flagship launches
Make the hero moment.
Marketing site, product launch, brand campaign. Cinematic execution, on a tight calendar.
03 · Studio consulting
Sharpen the practice.
Embed with your team, level up motion, design systems, and creative engineering.