Continuous running, constant flow.
A single search to discover street races in Brazil, with data from the main registration sites gathered in one place.
Context
Sportflow is a personal project from 2024, born from the pain of finding the right race. To find one, amateur runners check several registration sites, calendars and social networks, each with a different experience and not always up to date.
The idea is to gather data from the main race sites in one place and show only what helps runners decide. It is a new product, not a redesign, and it is live with real users.
Problem
For the runner
- Information scattered across many sites;
- Poor user experience on those sites;
- Outdated data that erodes trust;
- Too many steps to reach the right race.
For the product
- Goal: be the place where discovery happens and turns into action: runners leave with a race picked and go on to register.
- Success metric: visits and clicks to the official registration.
- Constraints: solo project, no budget and no partnership with the source sites. The data has to be gathered and kept up to date without depending on them.
The solution
Search with filters
Race name, state and city on a single screen, sorted by date or lowest price: runners reach the right race without opening several sites.
Everything in one place
Races from the main sites appear in one standard format, with the information that matters for the decision. Comparing is easy.
Up-to-date data
A bot collects races from TicketSports and RunningLand, and the footer shows the date of the last update. This tackles the distrust that old information created.
Race page: date, location, routes and rules in one place, with the "Inscreva-se" (Register) button that goes straight to the official registration.
Standard card: date, city, distances and "starting at" price look the same for every race, whichever site it comes from.
Process
Research
- Conversations with at least 5 runners, a review of the 3 main sites they mentioned, and my own experience racing. All informal, with no forms and no documentation.
- People chose races by distance, date and lowest registration fee → sorting by date and price sits at the top, and distances appear on every card.
Decisions and trade-offs
| I chose | Instead of | Because |
|---|---|---|
| Sending runners to register on the official site | Selling registration inside Sportflow | The focus is discovery. Selling would require payments, support and agreements with organizers. |
| Collecting data by scraping | Relying on partnerships or platform APIs | Solo project, no budget and no API access. Scraping made it possible to launch without depending on anyone. |
| Sorting by lowest price | A price range filter | People searching want to see the cheapest races first, without having to set a value. |
| Search at the top, with inline filters | A fixed sidebar filter | In testing, the sidebar showed fewer races at once and made the responsive behavior harder to control. |
Explorations and validation
- The first direction included login and a runner profile to connect people registered for the same race, including Strava data. The idea left the MVP to keep the focus on discovery and moved to the next steps.
- In tests with Vinícius, a fixed sidebar filter showed fewer races at once and made the responsive behavior harder to control. I replaced it with a search bar at the top, with inline filters.
Branding
The name combines Sport and Flow, with the tagline Continuous running, constant flow: continuous, frictionless movement, the same promise as the search experience. The main color is orange #FF4507, with lime #CEFF02 as the highlight, blue #003EDC as support and a cream #FFF5EA background. The typeface is Sora, for headings and text.
UI and design system
- I started from card references on other event platforms and tested several versions of the race card in Figma until I reached the one that is live.
- I designed the interface components (race card, distance, date and location tags, header and registration button) on top of a style guide with palette, typography, spacing and shadows.
Development
- Stack: Next.js, CSS Modules (Sass) and MariaDB.
- How the data arrives: it is updated by scraping the main ticketing pages, TicketSports and RunningLand.
- Why it matters: past races stay saved in the database, but the search shows only upcoming ones. The list stays clean for people searching, and the history is ready for runners to save the races they took part in.
Results
~80
users per month, according to Google Analytics
500+
races registered, from TicketSports and RunningLand
1 search
instead of several sites to compare races
Learnings
- Sportflow delivers on its promise: it makes choosing a race easier and cuts search time considerably.
- I would start with design rather than development, and run broader research before defining the features. Since the project is still live, it keeps improving.
Next steps
- User login, to build a community where runners in the same race can interact.
- Let runners save the races they took part in, using the history already stored in the database.
- Track clicks on "Inscreva-se" to see how many searches turn into registrations.
- Add other sports beyond street running.
- A blog and a store with affiliate links, on top of the ads the site already runs.
- Let users create their own races.
My role
Personal project. I was responsible for the product idea, research, branding, UX/UI and development. Thanks to my friend Vinícius Pereira, who got me into racing and helped with the research and testing as a user.