24uurszeilrace.app – Sail Smarter, Race Better
Kirill Kataev
This image displays a minimalist login screen for a web application titled “24race app”. Centered on a dark navy-blue background, the UI features a clean and modern design with a focus on clarity and contrast.
Working Area
This UI screenshot showcases the route planning interface of the 24uurszeilrace.app, a tactical sailing application. The design features a dark nautical chart with interactive elements overlayed in bright, contrasting colors for clarity.
Key UI Elements:
Map Area:
A series of white and cyan route lines represent calculated sailing legs between buoys and waypoints (e.g. VF-A, WV12, KR, etc.).
Detailed coastline and inland waters of Friesland, the Netherlands, are shown using Mapbox vector tiles.
Top Center:
A “Get Route” button, indicating the user can trigger a route simulation based on current wind and settings.
Top Right:
Settings and Edit Polars buttons allow for adjusting parameters and polar diagrams (boat speed at various wind angles).
Bottom Panel:
Displays detailed leg data including:
Course info (e.g., VF-A → WW12)
TWA (True Wind Angle), Wind Speed, Boat Speed, Time on Leg
Timeline Bar: A slider at the bottom shows the duration of the simulation from start to finish, useful for race pacing.
This interface helps sailors simulate the most effective 24-hour route by dynamically calculating performance based on live or forecasted wind and custom polar data.
Settings Sheet
This screenshot displays the “Edit Race Profile” panel of the 24uurszeilrace.app.
Key UI Elements:
Right Panel:
A dedicated sheet where sailors can configure race parameters.
Under the hood, 24uurszeilrace.app is powered by a super-efficient route simulation script running in a Web Worker, ensuring smooth performance without blocking the UI. The app is built as a Progressive Web App (PWA) for offline access and mobile readiness. From Mapbox rendering to AI-optimized routing logic, every technology is chosen for speed, accuracy, and reliability — making this tool race-ready from start to finish.
Like this project
Posted Jul 7, 2025
24uurszeilrace.app is a tactical sailing app to plan, simulate, and track optimal routes using real-time weather, buoy data, and custom polars.
