All work

Case study · Cycling · 2026

FrameFit

A personal project. I wrote the fit engine as a pure module with tests before I drew a single screen, so the numbers could be trusted.

From the maker's side
FrameFit: cover screen
Client
Personal project
Sector
Cycling
Year
2026
What I did
Concept, Design, Flutter, Testing
Stack
  • Flutter
  • Dart

Buying a bike online means guessing a frame size from a chart. FrameFit replaces the guess with a measurement.

What was built. A mobile app that takes a rider's body measurements, inseam, torso, arm and height, and returns a frame size and a fit range for the bike type they are buying. The fit engine is a separate, pure module with a test suite, so the numbers can be checked against known fits without opening the app. The interface is in Arabic and English with right-to-left layout.

Stack. Flutter and Dart. The fit engine is plain Dart with unit tests, the UI is a thin layer over it.

What was hard. Getting the engine right before the screens. The fit formulas were written and tested first, against published sizing data, and the app was built only once the tests passed. That order kept the maths honest and the app small.

Screens

  • FrameFit: screen 1
  • FrameFit: screen 2
  • FrameFit: screen 3

To hire the studio behind this work, go to Web Harbor Technology.

Web Harbor Technology