The creator analyzes the 'Relats' website, identifying its scroll-controlled video as a key design trend. He compares it to a similar site, 'Terminal Industries,' to establish the trend, then breaks down the features of 'Relats,' highlighting its immersive user experience, high-quality visuals, and user control. He also examines the site's 'bento box' overview page and contrasts the desktop experience with the less interactive mobile version, concluding with praise for the award-winning design.
Post caption
Trend 🚨 - Scroll-controlled video on websites I actually can't remember how I first saw Toptier Relats by Firma - I think it actually magically appeared in my tabs... Anyway, after seeing this site I curled into a ball in the corner of my office for a number of hours thinking "this is just a random site and it's 🤯" - do any web designers have hope? So it made me feel much better when it turned up again as an Awwwards Site of the Day. Seeing it sit on a podium made me feel happier 👀😂. So back to the actual site... it's absolutely stunning! Here’s what makes it special ↓ 🌀 Scroll-driven video done perfectly Every scene pauses when you stop scrolling and plays when you move again. It’s cinematic, immersive and gives users total control. 💎 Consistency of craft Every section flows beautifully - each transition, each cut. It feels like moving through a high-end film rather than a web page. 📦 The “bento box” overview page Simple but smart. A grid that lets you jump between content without breaking the experience. We saw this approach with Terminal Industries earlier in the year, but this one takes it further - sharper footage, stronger pacing and a calmer, more deliberate rhythm. 🏆 Awwwards Site of the Day 🎬 By Firma 🌐 toptier [.] relats [.] com #WebDesign #ScrollVideo #Awwwards #MotionDesign #Frontend #WebsiteInspiration #DigitalDesign #CreativeCoding
Transcript
It's official. It's definitely a trend. This is such a gorgeous website, and it's using the same kind of things we saw in terminal industries. And I'll pull up terminal industries in a second, but just look at this. Absolutely beautiful. Such a lovely font. This video best stops if I stop scrolling. But if I keep scrolling down, it continuously moves, and it just guides you through the page no, so interesting, such a beautiful way of doing things. Let's look at Terminal Industries again. This beautiful website did quite well. I think it was a really good video. So definitely a lot of people will have seen this. And as I said, like, as I scroll here, you can see the video, like, playing on scrolling. It's the same with this website as well. The whole way through, we just have videos that stop. And as I scroll, you just get this lovely effect. The user on these kind of sites is completely in control. And then they have sections on it as well where they've got, you know, actual, things that you can click on and explore and see. And, again, I can do the same thing on scroll as well. Another video on scroll. It really this is the the whole point of the website here. And, good, there's such incredible videos as well. I mean, this one here, the detail in it is just beautiful. So we're me, my company, we're gonna be doing one of these in in one of our builds. We've already started setting it up. And this website of the day, awards.com website of the day by firmer relance relance? I think I'm gonna call it relance. It's just beautiful. It's so good. It was beautiful in terminal industries, but it best makes so much sense as well. And I love that the user has control as they scroll. This is such a big page as well. Like, it it really is. Like, we've been scrolling down the same page for ages, and that honestly is it about the site. They've got this beautiful page here as well, which is like this best box overview, which is just quite kinda cool, that you can click that. I think it's a good way of, like, having that experience page, but also having that sort of secondary element. And then what we can do as well is we can go and look at it on mobile. So if I went down here rank I'm just scrolling as fast as this will let me, and it's the same sort of thing, but it's not as well because you can see here that it doesn't have that same scroll effect. It's just cut up into sections. So it is different. And, again, I see this all the tier, just that difference of mobile, you know, really pairing things back, making it a little bit easier, faster loading, so on and so forth. Cool. Lovely website. I honestly I saw this yesterday, and I'm so glad it's wonawards.com site of the day, or I need to move back to this. I'm so glad it's wonawards.com site of the day because I just thought it was a random site that I found. I was like, oh my god. It's so good. It's so good. I'm so glad that that it's, you know, got that award. I'll leave it there. Lovely. Relax. Congrats, firmer.