Sportlink Membership Site - Flux Academy Project
Unique challenges and insights about the project
In the beginning, I set up the CMS data by importing 62 items for 3 different collections (Events, Sport Type, Sports). These items were organised with a complex filtering system on the homepage (requiring custom CSS). A solid filter can help website visitors find what they are looking for a lot faster, increasing engagement and conversions. Additionally, implementing masking animations brought a dynamic visual element to the site. By using variable type on some of the sections I was able to build headings with responsive typography that animates on scroll and adapts to different screen sizes.
More technical stuff
On the technical side, building a custom full-screen menu with CMS links enhanced navigation and user interaction and integrating Memberstack for user accounts allowed for memberships on the Sportlink site. Managing and hosting a large number of videos also required careful planning to maintain site performance and integration with the CMS.
The button hover interactions (see video) were inspired by a race car that drives across a track with high speed. It required building a completely custom button with a masking animation and some custom CSS code.
Summary
This Webflow build was definitely very complex, technical and even a bit challenging here and there. But learning so many advanced Webflow features and even going beyond Webflow's native functionality through custom code was super fun! I am really grateful for the amazing team at Flux Academy for putting together such a strong course projects for their students!
Next Case:
