Danso

2025 · Front end only

bitby

A mobile UI reconstruction study rebuilding a crypto trading interface to learn dense, real-time layout.

  • JavaScript
  • React Native
Title card reading bitby, React Native UI reconstruction study

Screen recording coming soon

The source is on GitHub in the meantime.

View the source

Context

bitby is a UI reconstruction study: a student learning project that rebuilds the interface patterns of the Binance mobile app. It is not affiliated with, endorsed by, or connected to Binance, reproduces none of their trademarks or logos, and is not a working exchange, with no real market data, no accounts, and no trades.

The reason to rebuild a trading interface is that it is genuinely difficult. Dense numeric rows, constant updates, tight vertical rhythm, and a hierarchy that has to survive being read at a glance are harder problems than most CRUD screens ever pose.

My role

This was my first large project, and I was new to almost everything involved in it. It was a team effort: three front-end developers, three backend developers and a project manager.

I worked on the front end, including the screens, the navigation, and the list and chart components. The app is built in React Native, and the backend developers built the Java backend. The stack above lists only what I worked on, which is the same rule every project on this site follows.

Key decisions

Rebuilding from observation, not from assets. Working out the spacing, type scale and hierarchy by eye is what made this a study rather than a copy-paste exercise, and it is where the learning actually was.

The hard part

The hardest problem came when we connected the front end to the backend. Each side worked perfectly on its own, but once we joined them they would not talk to each other, and for a while we honestly did not know why.

The cause was on the front end. It contained logic that stopped the calls to the backend from completing successfully, so the backend never received a request it could answer. Removing that logic fixed it. What I took from it is to connect the two halves early, rather than assuming that two pieces which each work alone will work together.

Outcome, and what I would do differently

The app was not bundled for distribution, so there is nothing to install. The source is on GitHub.

What I took from it was calibration. Matching a production interface by eye teaches how much of a polished product is spacing and type discipline rather than features.

I do not regret how it turned out, but if I built it again I would approach the design differently from the start, bringing in the design patterns and architectural knowledge I have now to keep the front-end logic cleaner.