Role: Frontend Developer (Component Architecture & Motion)

This project served as a high-stakes technical self challenge for ThrillX Design, a Canadian digital agency. The brief was uncompromising: take a high-fidelity design and translate it into performant, production-ready code.

The Goal: Demonstrate not just coding ability, but architectural thinking, clean file structure, maintainable CSS, and smooth motion execution.

To ensure the codebase was as professional as the visual design, I established a modern environment using Vite.

Templating with Pug: I chose Pug (formerly Jade) to componentize the HTML. This allowed me to break the UI into reusable chunks (mixins for cards, buttons, and sections), mimicking a modern framework workflow without the overhead.

Modular SCSS: Styles were architected using the 7-1 pattern, ensuring that the visual system was scalable and easy to maintain.

A static luxury site feels cheap. To elevate the brand, I utilized GSAP (GreenSock) to handle complex sequencing.

The Reveal: Elements don't just appear; they stagger in. I used GSAP Timeline to synchronize the text reveals with image loads, ensuring the user is guided down the page.

Performance: All animations were optimized to run on the compositor thread where possible, maintaining a silky 60fps even during scroll events.

Scope: Full Homepage implementation from design handover.

Design: Provided by ThrillX Design

Implementation: Jose Armando Felix – Responsible for full code implementation, logic, and animation tuning.

Stack: Vite, Pug (HTML templating), SCSS, GSAP

Live Link: https://the-lion-group-rust.vercel.app