REDSOFA (https://redsofa.com/) is an Awwwards-winning website, celebrated for its simplicity and innovative use of a draggable carousel to display recent works. The standout feature of this site is the parallax mouse effect used to showcase all their featured projects. Inspired by these unique elements, I recreated this frontend project to capture its minimalist design and engaging visual effects.
To achieve this, I utilized HTML to lay the robust foundational structure of the website. Advanced CSS was meticulously employed to design the site, crafting intricate micro-animations that closely mirror the original’s sophistication. The project leverages a suite of powerful JavaScript libraries:
- GSAP for executing major animations that bring the site to life.
- ScrollTrigger for developing custom scroll-based animations, ensuring an impeccably smooth and engaging user experience.
- Locomotive Scroll for implementing fluid, seamless scrolling effects that enhance the dynamic nature of the site.
- Swiper JS for creating the highly interactive and visually appealing draggable carousel, which showcases recent works with elegance and precision.
This project was a valuable learning experience, particularly in using Swiper JS for the site's carousel effect and recreating the mouse parallax effect. Analyzing and implementing these features provided deeper insights into advanced web design techniques and animation integration. The process of reverse-engineering the site's functionalities was both challenging and rewarding, significantly contributing to my professional growth.
The main challenges included learning and analyzing the site before proceeding to recreate it. Implementing the mouse parallax effect and integrating Swiper JS for the first time were particularly demanding but ultimately rewarding tasks.
I invite you to explore the repository and experience the clone of REDSOFA. Your feedback and suggestions are highly appreciated, as they will help me continue to improve and refine my skills. Feel free to share your thoughts and insights on the project!