When ASUS commissioned us to design and implement a new landing page compatible with their proprietary CMS, we were faced with some unique architectural challenges. Rather than relying on heavy, JavaScript-centric frameworks like Next.js or Gatsby—which often require deep configuration and experience to optimize properly—we decided to go with Astro.

When we picked it up, it felt like a fresh breeze of air. Astro approaches site generation from the opposite direction. Instead of starting with a heavy JavaScript stack and optimizing it down, it starts with clean HTML and introduces JavaScript only where it is genuinely needed. 

This approach gave us complete clarity over what the website was actually loading. Refreshing was lightning-fast, and we were spared the usual server-side hydration errors and obscure warnings. By stripping away the heavy overhead of traditional site generation, Astro allowed us to focus entirely on implementing smooth sliders, image effects, and animations using React, GSAP, and Tailwind. Ultimately, adapting the final output to integrate with the ASUS CMS became almost trivial.

Knowing that we only utilized about 20% of Astro's full capabilities for this project, it has easily become our most promising framework for building high-performance websites in the future.

The core theme for the ASUS landing page was focused entirely on look and feel: everything needed to be light, fluid, and smooth, avoiding any hard cuts or jarring transitions. While most off-the-shelf slider libraries could have handled the basic functionality, they would have felt clunky and disconnected from the rest of the page's design.

To solve this, we used GSAP to build the sliders from scratch. This made it possible to animate slider texts, images, and video transitions with the exact same fluid choreography as the rest of the site's elements. By opting for this custom approach, we were able to turn a complex functional requirement into a seamless, elegant extension of the overall user experience.