GFR – Gran Fondo Rank case study

Gran Fondo Rank GFR website landing page for cyclists

Hello Dribbble! 👋

Remember our last breakdown of the GFR logo? Now it's time to show you the rest of our work!  So, hold onto your handlebars as we dive into the design journey of GFR - Gran Fondo Rank, the ultimate website for all you Gran Fondo race athletes out there! Our mission? To determine the crème de la crème of cyclists worldwide by crunching race data and dishing out our original GFR score.

Gran Fondo Rank search modal with athletes and races

Search for Athletes or Races

Ready to discover your cycling gems? Our search functionality is designed with your convenience in mind. Simply type in the search bar, and watch as real-time suggestions appear in a dynamic dropdown, guiding you along the way. If you prefer a more hands-on approach, simply click the "Search" button, and you'll be taken to a dedicated page where you can delve deeper into the details of the athletes or races you're interested in.

Athletes Profile & Leaderboard

Each athlete's profile serves as a gateway to their triumphs, showcasing their race results, essential information, and after having activated their account, a direct link to their Strava profiles for an extra dose of cycling insights.

Leaderboard — the ultimate battleground of cycling greatness. Here, we highlight the top 100 athletes with the highest GFR score. Scroll through the ranks and witness the names that inspire awe. But it doesn't end there! We've given you the power to filter the leaderboard based on race categories, locations, or distance. This way, you can dive deep into the specific cycling achievements that captivate your interest.

Mobile Version

Just as a reminder, our athletes are always on the move, chasing those cycling dreams. Here are a couple of screens showing how our website behaves on mobile devices. Stay connected and stay on track! 🚴‍♀️

Check it out live here: https://www.granfondorank.cc/

GFR was designed using our MasterUI UI-kit: https://www.masterborn.com/masterui

_____

We are available for new projects!

Drop us a line 👉🏻 contact@masterborn.com

We are hiring 💼 https://masterborn.com/career/

More by MasterBorn

View profile