05.11.2025·00:07:06

Why This Will Win Awards

This week's award-winning website by Nicolo Miranda might be the heaviest but most beautiful site I've ever seen - featuring incredible Three.js 3D models, smooth Lenis scroll effects, and mind-blowing attention to detail. We break down why this Meta glasses campaign site took forever to load but delivers an unforgettable immersive experience, the secret behind the contextual scroll bars that actually improve scroll hijacking UX, and whether you could vibe code something this complex with AI. Plus, we discuss why big brands create these crazy campaign sites separate from their normal shopping experience and why this represents the pinnacle of creative web design! — TIMESTAMPS: 0:00 - The HEAVIEST Website Ever 🐢 0:25 - Mind-Blowing 3D Details 0:47 - Accessibility Wins 1:35 - Tech Stack Revealed 2:26 - Performance vs Beauty 3:18 - Could AI Build This? 4:09 - Scroll Hijacking Done Right 🔄 5:14 - Campaign Site Strategy 6:13 - Breaking Into Big Brands 6:55 - What is "CMD + AI"? — Unlock the full potential of your online presence with Kabarza and Samuel—experts in web design and development (respectively), powered by cutting-edge AI solutions. We blend creative design with advanced tech to deliver smart, high-impact websites that stand out. Ready to elevate your business? Contact us today and see what AI-driven innovation can do for you! LINKS & RESOURCES: Check out Kabarza's amazing work: https://kabarza.com Visit Samuel's website for more: https://samuelgregory.co.uk 📷 Follow on Instagram: / cmdaishow — #WebDesign #ThreeJS #CreativeCoding #WebsiteShowcase #WebDevelopment #AwardWinning

Transcript
All right. So, this is site of the week. Uh, this is designed by Nicolo Miranda, uh, in my believe probably the best web designer out there. He's just insane. And this is like his new work. Uh, and I'm pretty sure this is going to win some awards. It's a bit heavy though, like the website took like a good moment to load, but once it loads, you see it uh, took no time to reload. And it has like this really cool slider that auto plays. And we have some video controls. This is, by the way, really nice for accessibility that you can pause it. You can It's mute by default, so it's not bothering me. And it's about the this meta glasses that are made with this company. This is a I don't know, sport glass company. I'm not sure. Apparently now you have like your smart glasses, you know, for different occasions. For example, in this Yeah, because you had the meta display, right? And these are cuz Luxology or Luxia or something like that own Oakley and Ray-B band. So there's obviously Okay, good, good, good. By the way, you see this slider? That's really cool. Do you see the the nice small details that that's what I'm all about. I I love these like very tiny details that are out there. Uh I haven't looked into the code but just from here it looks like they are using by the way Adob Analytics. Interesting. We'll talk about this in a bit. They are using Lennis for the smooth scroll. If you are wondering how that is made, that's with a plugin called Linus. And we have some 3D stuff made with 3JS. I don't see GSAP, which is a bit strange, but maybe it's not loading correctly because I'm pretty sure they maybe they rolled their own. Maybe they've got their own I mean are they what what JavaScript do they I don't know that well I sort of know this tool but like is JavaScript so preact boomerang was it boomerang? If you scroll up see the one on the right here they're JavaScript libraries. Yeah, this is Boomerang. What is Boomerang? That sounds like it would be an animation library. Is a JavaScript library that measures the page load time. So, not that. Oh, interesting. So, we have some of these scrolls. Uh, and you see here we have a 3D 3JS stuff. That's cool. Yeah. And this this took like a good minute to load. This is what was really heavy. M. And yeah, you got those reflections moving in real time as well. Yeah. And you have like the colors. Oh, yeah. You see here it's it's quite slow compared to the Apple website like where you have like the full iPhone that you can like rotate. It's just much much faster than this. Um even though the iPhone probably is um like a bit heavier or at least that's how I how I think. Anyway, uh the site is pretty cool. Do you think you could vibe coat something like this if you had the model? Well, the model would need to be um created, you know, you can't This is a CAD model or something. It's based off real. So, once you have the model Yeah. I mean, all this is is just, you know, you could probably do this in spline even. It's just a model that uh that you can rotate and whatever. And I I've no doubt that the position and and rotation is probably tracked and you could you just switch the model out. Do you know what I mean? So you're just you're just loading a new model. You just load there's probably a way that you can actually trigger different materials which might probably be um performant, but I'm not I'm not great at the 3D stuff. But this seems pretty straightforward. You know what is really cool here as I scroll I have this main scroll bar but also I have this contextual scroll scroll bar. I think this is like it ma it's making it better with these sites that do scroll hijacking and they are like you know typically not known for the best UX but at least they are giving you here a little bit more visual actually like visually they tell you where where they are and uh where you are like you're not lost in uh in it. Yeah, this part it has some Yeah. immersive audio. You can have like music. Yeah, that's it. Uh it's a shop. It's an experience within uh this like whole brand. This is also something interesting. These brands sometimes they have a more normal shop, nor normal website, but for a com campaign, for a product, they launch these like crazy ass websites which uh works great with creating awareness and once people are in and people are interested, they can have a more normal shopping experience. So that website is not destroying the entire like the website, you know. Yeah, it's just an extra nice experience. Yeah, that's that's what I wanted to do a few years ago, but I just don't have the contacts. Like I got in contact with a few big companies, but no one with any real weight behind it. But I was like, you know, shopping took the Apple took Apple as a as an example like you always get the the landing p well. Yeah. as you've just described, you you once you navigate to the shopping experience is a very boring, straightforward experience, but the the actual marketing side, this stuff is all very and I would love to have done more sites like this. I I think I got in contact with Anchor. I built like Anchor, like a you know, the battery company. I built them like a thing. Um but yeah, I just couldn't I just could not find the contacts to to break into that market unfortunately. Interesting. Yeah, but you see how faster this one loaded uh compared to the other one. So I don't know how much of this is about the models themsel or like how it was coded but this it was instantly loaded when I loaded the page but but the other one took a good while. Anyway, this is website of the week week uh picked by me before it wins award. You you hear it. Yeah, you saw it here first. Um, it will probably win awards. Like Nicolo Miranda, he doesn't do work that doesn't win awards. This is part of a larger conversation on my show, Command AI, which we stream live every single week. We discuss the news and all things related to AI in the world of design and web. Catch us next week and join in the banter.