I missed class to build this immersive portfolio!!

#devchallenge #googleaichallenge #portfolio #gemini

New Year, New You Portfolio Challenge Submission

This is a submission for the New Year, New You Portfolio Challenge Presented by Google AI

About Me

Hi, I'm Amaan Syed. I'm not just a Full Stack Developer; I'm an architect of speed. In a world of loading spinners and jittery frames, I believe web experiences should feel like driving an F1 car: precise, fluid, and aggressively fast.

My portfolio is a direct reflection of this philosophy. It meshes strict engineering (Type-Safety, Dockerization) with a visual style that lives at the intersection of Formula 1 aerodynamics and Sci-Fi futurism. I wanted a site that didn't just list my skills but performed like valid race telemetry—precise, fluid, and dynamic.

Portfolio

made for desktop (wide screens) and mobile (narrow screens)

🏎️ CLICK HERE TO VIEW FULL SITE (DESKTOP RECOMMENDED)

How I Built It

I wanted to push the browser's rendering engine to its limits using physics-based animations and custom WebGL-style effects without the overhead.

Tech Stack

Framework: React + Vite (for lightning-fast builds)
Animation: Framer Motion (complex physics-based transitions)
Styling: Custom CSS (Glassmorphism + Neo-Brutalism)
Deployment: Google Cloud Run (Dockerized Nginx container)

Design Decisions: "AeroFlow" & "Liquid Glass"

AeroFlow: The background isn't a static image. It's a living component that renders "Scuderia Red" flow lines using chaotic Bezier curves. They dash and pulse across the screen, mimicking wind tunnel telemetry data.
Liquid Glass: The UI elements use a "Frosted Glass" effect combined with high-contrast neo-brutalism, creating a look that feels like a futuristic heads-up display.
Immersive Micro-Worlds: instead of a grid, I built:
- Web: A 3D "Splatter" layout where browser windows float in Z-space.
- Mobile: A vertical "tear-off" card deck that feels tactile.
- AI: A "Blast Door" terminal interface with holographic particles.

Google AI Integration

This project was Turbo-Charged by Google Antigravity.
It wasn't just a code generator; it was my pair programmer for complex physics math:

Refining Physics: I used Gemini to fine-tune the damping and stiffness coefficients in the Framer Motion springs for the "Mobile Card Stack".
DevOps-in-a-Box: I'm a frontend guy, not a sysadmin. Antigravity wrote my Dockerfile and nginx.conf for Cloud Run, handling the tricky SPA routing logic instantly.
Visual Polish: The AI suggested using conic-gradient masks for the "Silver Flow Button" to create a perfect metallic sheen without looking like a generic asset.

What I'm Most Proud Of

I am incredibly proud of the Blast Door Terminal in the AI section. It’s pure CSS/JS theatre—scanlines, holographic particles, and a mechanical door opening sequence that syncs perfectly with the user's journey. It turns a boring "Skills" list into a narrative event.
Most importantly the overall aesthetic of the site which I want to theme around my interest like F1, Star Wars, color science and typography

This portfolio is me: Stay Hungry, Stay Foolish!

Top comments (9)

ANIRUDDHA ADAK • Feb 2

Cool!

Sairaj Jawalikar • Feb 11

Amazing site dude 😎!

Shaurya Negi • Feb 17

🔥Awesome site, really cool animations

Konark Sharma • Feb 2

Pretty cool work. I liked the F1 car animation. It really got me addicted to scroll back and forth and really loved the rotating tyre animation. Good job keep it up.