Tonal

Ensuring feature parity at Tonal with Flutter

Goal

Tonal’s mobile engineering team started work on the mobile app only a few months before the company announced their unique at-home fitness product, so the team needed to move as quickly as possible. Tonal’s native Android software team was dedicated to building the native Android app that runs on the Tonal hardware, which left only one software engineer to build the mobile app from the ground up. Having never shipped a mobile app before, Tonal didn’t know what percentage of users would use Android vs. iOS, but they did know that they wanted to give both platforms equal attention and maintain feature parity. They also needed a framework that would enable them to build a custom, branded user interface that felt uniquely Tonal while still feeling like a friendly, native mobile app. And because the app would need to be maintained over a long period of time, they needed a solution that would allow it to scale alongside a growing team of software engineers.

Why Flutter?

Tonal was immediately impressed with Flutter’s architecture. Unlike other cross-platform frameworks, Flutter handles rendering the user interface. This fundamental architecture decision made Tonal more confident that they would be able to build a custom experience without spending a lot of time debugging visual issues across platforms. Despite the fact that no one on the team had experience with Dart, the team was confident after experimenting with the language and finding it friendly and intuitive. And since the framework provides a code formatter, code linter, static code analyzer, and documentation on standard conventions, the team was able to start building features very quickly. In less than half the time it took to build a proof of concept in another framework, the Tonal team was able to recreate the entire app with Flutter.

Their Solution

Despite coming from a wide range of backgrounds and experiences, Dart and Flutter were easy for everyone on the team to pick up quickly. Tonal was able to take the app from just an idea to a full-fledged, production-ready mobile app deployed to actual users in less than a year. Flutter made it easy to move quickly with features like stateful hot reloading, enabled by Dart’s ability to compile both AOT and JIT. Since the app’s launch in 2019, the Tonal mobile team has been able to rapidly iterate on the app, releasing new versions of the app every two weeks.

“Flutter's developer experience is top-notch. Unlike most JavaScript frameworks that boast a 'hot reloading' developer experience, Flutter's hot reloading actually works reliably and is consistently very fast.”

- Max Lapides, Mobile Software Engineering Manager, Tonal

Results

Flutter made it easy to ship an app with very few engineering resources. When Tonal launched its mobile app in 2019, there were only two engineers on the project. But while the team has increased significantly since then, Flutter continues to support the ever-increasing complexity of the app as it scales with the company. Tonal has shipped an incredible array of features in the mobile app so far, including a custom charting library, animations with Rive, a leaderboard that lets you smoothly scroll through tens of thousands of active members, a custom native workout video player, and more, with new features on the way. All of this has been accomplished with full feature parity across iOS and Android. Flutter has liberated Tonal to focus on building awesome features and keeping their users engaged and delighted.