Feat/landing protocol showcase

[parasmani-dev]

Summary

This PR implements the redesigned Hero section with an interactive, real-time 3D WebGL iPhone model built using Three.js, matching the authentic Desert Titanium / Copper aesthetic and protocol branding.

---

What was done

1. 3D Interactive WebGL iPhone (ThreeIphoneCanvas.tsx)

• Chassis Geometry: Extruded rounded-chassis with precision Apple-spec curved corners, bevel segments, side antenna bands, action button, volume rockers, power key, and camera control pad.
• Front OLED Screen: 2D canvas texture with curved borders, Dynamic Island, Windmill Protocol typography, live orderbook status pill, and 3D ceramic protocol robot mascot.
• Backplate Design:
  • Precision Desert Titanium / copper-orange gradient finish with brushed metallic sheen.
  • Low-profile horizontal camera visor with organic pill contours.
  • Authentic triple-lens triangular cluster (>) with raised titanium bronze rings, sapphire glass, and concentric pupil reflections.
  • True Tone flash, audio microphone pinhole, and dark LiDAR scanner correctly arranged on the right column.
  • Official Apple logo centered in the lower matte panel with correct orientation (bite & leaf on the right).
• Physics & Interactivity: 360° drag-to-rotate with smooth inertia damping and natural idle floating animation.

2. Hero Section Refinements (HeroSection.tsx)

• Elevated symmetrical side cards (StardustArchive trading stats, PandaExplorer 3D mascot).
• Polished navbar typography and pill contrast.
• Removed redundant legacy floating protocol component for cleaner bundle size and layout flow.

---

Quality Gates Passed

• npx tsc --noEmit — 0 TypeScript errors
• npm run lint — 0 ESLint errors
• npm run build — Turbopack production build succeeded cleanly

---

Assisted by AI coding agent (Antigravity).

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
windmill-evm-web	Ready	Preview	Sep 7, 2026 5:34pm UTC

[coderabbitai]

Important

• 🔍 Trigger review

This repository does not receive automatic reviews because it has fewer than 10 stars.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yml

Review profile: ASSERTIVE

Plan: Team

Run ID: f66a6736-9a24-410a-a3c9-50ef0b4e42fd

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[socket-security]

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	@​types/​three@​0.185.4
	three@​0.185.1

View full report

[parasmani-dev]

@aniket866
I have just done the hero section as you said. If this is perfect, I will proceed with working on the other pages. I will be travelling to Bangalore today so I won't be able to update you immediately. Thanks!

[aniket866]

@aniket866 I have just done the hero section as you said. If this is perfect, I will proceed with working on the other pages. I will be travelling to Bangalore today so I won't be able to update you immediately. Thanks!

[aniket866]

@aniket866 I have just done the hero section as you said. If this is perfect, I will proceed with working on the other pages. I will be travelling to Bangalore today so I won't be able to update you immediately. Thanks!

Not yet , you guys are missing the whole point , I am trying to make it more towards the screenshot, notched Navbar , 3d main card, 85% size of the main card, bg mixture and blende of 2 colors and then small components in the hero section , that's the whole point I want to achieve it

[parasmani-dev]

Hey @aniket866 !

Alright, I took your feedback to heart and went all-in on matching that screenshot:

Got the 85% 3D card floating in the center with the dual-color peach/coral background blend.
Made the notch genuinely transparent (an actual cutout this time, no colored paint job!) with the Creator / Collector toggle properly sitting inside it instead of falling off the shelf.
Added all the tiny crew members around the 3D phone the bee, panda, koala, the 5★ badge, and the radar map.
Kept the top global navbar matching the live site font sizes and components so nothing breaks.
Knowing frontend design, I’m 99% sure you’ll still spot something that’s 2 pixels off 😂. Please let me know what needs tweaking and I'll fix it right up

[aniket866]

See I am still not 100% satisfied with the design , but I respect your efforts and I think somthing we are missing is the proper contrast , shawoding and soul that makes the desing premium and quite close

also I am not forcing you t match exactly , but you know in real world applications you will be given a figma desing and you have to acheive that design in developemnt 100% , that's why I am still not finalizing this design

I tried the design myself but it was time taking that's why I left it midway this is how close I was

I will merge you Pr but change this branch to dev, as this is not final working design so to keep main branch clean , Change this PR's target branch to 'dev'

[parasmani-dev]

@aniket866 your design looks good and Yeah, I understand what you mean. I can iterate on it further if you want , I’d rather take the time to get it to the point you’re expecting than rush to get the PR merged. I’m still quite new to contributing to open-source projects like this, especially when the design direction is more open-ended, but I’ll do my best to understand what’s missing and improve it.

I’m not in a hurry from my side. I know you want to move this forward as well, so just let me know what you’d like me to focus on, and I’ll work on it accordingly.

[parasmani-dev]

@aniket866 navbar will be the notch one you mentioned and just check it ,no pressure at all. i can iterate more images if you felt the soul in it !!