Mobile App · React Native · Play Store Live
Piwi
Athlete Passport
Tunisia's first unified platform for endurance athletes. From fragmented Facebook posts to a centralized race discovery engine, verified leaderboards, and digital athlete passports. Built from zero engineering background to Play Store launch.
New skills unlocked
I didn't start building an app because I had a startup dream. I started because the bridge between design and development was big for the longest time, but now the lines are blurring and I was curious to see what's on the other side. After vibecoding my portfolio, I decided to go further and see where my creativity and problem solving skills take me. They took me to the Play Store.
Product Designer
Systems & UX
Vibecoder
AI Amplified
Fullstack Designer
Design + Code
Product Owner & Founder
Ship & Scale
Races were everywhere and nowhere
In Tunisia, finding your next race meant scrolling through fragmented Facebook posts, WhatsApp forwards, and word-of-mouth. There was no single source of truth for endurance athletes.
No place to discover events, compare distances, or track your own history across seasons. Athletes had no digital passport. Years of results scattered across screenshots, spreadsheets, and memory. The community existed, but it was invisible.
Discovery Friction
4+
Average apps/platforms an athlete checked before registering.Identity Gap
0%
Athletes with centralized, verifiable race history.Trust Deficit
High
Results were self-reported and unverified.Organizer Reach
Limited
No dedicated discovery channel beyond social circles.From idea to Play Store
The barrier wasn't technical knowledge. It was momentum. Curiosity. Stubbornness. Systems thinking. Taste. The willingness to stay inside confusion long enough for clarity to emerge.
I traced issues, fixed flows, restructured components, improved logic, and kept shipping. What started as "let's see if I can" became "I actually can." The escalation wasn't just in complexity, it was in belief.
Idea
Concept born. Research into the Tunisian endurance scene. Problem validated through athlete interviews.
Design
Figma system established. User flows, wireframes, and component library created from scratch.
UI V0
First React Native screens. Theme system centralized. Navigation and basic layouts functional.
Database Connected
Supabase PostgreSQL schema live. Auth, real-time subscriptions, and API layer operational.
First Beta
Internal testing with 10 athletes. Discovery feed, race cards, and basic profiles functional.
Play Store Launch
Public release. Real users downloading. The story had just begun.
Designing the athlete passport
Discovery Feed
Personalized race recommendations, featured events, and discipline filters. The UI prioritizes visual hierarchy. Race photos take center stage while metadata sits cleanly below.
I used a rotating featured race system (AsyncStorage persistence) to give every organizer fair visibility without algorithmic bias.
Advanced Search
A unified search experience that handles everything from empty state suggestions to deep filter logic within a frictionless context.
Instead of burying users in 5 separate screens, I designed a unified search flow. From empty state to results, everything happens in one coherent context.
Athlete Passport
A centralized profile showing race history, verified personal records, badges, and national rank. Athletes finally have a digital identity that persists beyond any single event.
The PR grid uses sport-specific icons and color-coding so athletes can scan their achievements in milliseconds. Guest mode shows preview data to reduce signup friction.
National Leaderboards
Filterable by sport, distance, gender, age category, and governorate. Result claims go through admin verification to maintain credibility.
The podium uses gold, silver, and bronze gradients with rank-appropriate heights. 1st place is physically elevated. Privacy-aware: athletes can hide from leaderboards.
Designer, amplified
My product design background turned out to matter more than I expected. I already understood user experience, hierarchy, reusable systems, product flows, visual consistency, and emotional engagement. AI didn't replace those skills. It amplified them.
Figma
Design system, component library, and theme tokens for dark/light modes.
- Component library
- Theme tokens
- Dark / Light modes
React Native + Expo
TypeScript frontend with Supabase backend. AI-assisted logic generation.
- React Native + Expo
- Supabase backend
- AI-assisted logic
Play Store
OTA updates, real users, and continuous iteration post-launch.
- Play Store release
- OTA updates
- Real users
Tech Stack
I centralized theming early because I was terrified of spaghetti code. Every color, spacing value, and border radius lives in a single theme object. The app supports full dark mode because it cost almost nothing to implement systematically.
Real users, real feedback, real next steps
I launched yesterday. The numbers are small because the story just started. I am documenting the journey publicly, sharing builds, explaining decisions, showing the messy middle.
People aren't just reacting to the product. They're reacting to the speed of transformation.
Downloads
<100
Play Store downloads (launched yesterday).Database
60
Races catalogued in the database.Active Users
30
Early adopters exploring the platform.Verification Queue
Growing
Result submissions waiting for admin review.What's Next
I stopped waiting for permission
I used to think there would be a moment where it becomes clear that I'm not cut out for things like this. But instead, the opposite kept happening. Things kept getting more complex, and I kept finding a way through them.
I originally wanted someone else to give me permission to enter the tech world. A recruiter. A company. A job offer. But building Piwi taught me that sometimes you become the thing first, and the permission comes later.
I thought I was waiting to become a product designer at a company. Instead, I was accidentally becoming a founder.