Our applause for Flutter.
Flutter enabled and continues to empower the team at Posse to do more for the Hamilton app than if we created two fully native apps. But it goes beyond the savings of creating two apps from a single code base — creating apps is just faster and more fun with Flutter.
Flutter made it possible to deliver more and at a higher level of quality. If we had developed two independent fully native apps, we never would have shipped the feature set we had at launch. The ability to do more continues to be a major benefit as we grow and add features to the app on a weekly basis.
We see Flutter as our (increasingly less) secret weapon and a strategic advantage. Our teams move faster, execute better, and have higher morale. Since we only have to build features once, the app is far more consistent on both iOS and Android with less overhead ensuring the consistency. We particularly love that the typically tedious updates (e.g., updating graphics, copy, tweaking UI elements, testing, etc.) are literally 2x faster and overall less boring and painful.
Flutter has withstood everything we’ve thrown at it, despite it being in alpha for most of the time we’ve been working with it (it’s now in Beta). We are not limited by the multi-platform framework. We make extensive use of the plugin system and if Flutter cannot do something we need it to, the Flutter team has been keen to help or it is easy to fallback to native components.
When we picked Flutter it was a risk, now we see it as a massive advantage and a major part of our strategy going forward. We encourage you to take your shot with Flutter.
The Story of Tonight
Hamilton is one of the most loved Broadway shows of all time. It’s won many honors and awards and has a fan following that is unprecedented on Broadway.
When the producers decided to create a Hamilton app, they had very high expectations. Hamilton is an incredible work of art and its app needed to be worthy of what Lin-Manuel Miranda and all of the talented people behind the show created.
The stakes were high. The app experience had to be exceptional. It had to provide features fans would love and provide better access to the show for all. It had to be beautiful, usable, and brand-driven in its design. It had to be snappy and polished. We could not afford compromises in the user experience.
My Shot
After reaching out to a variety of potential development partners, the Hamilton and Posse teams found kindred spirits in each other and started defining the best ways to create an exciting app experience.
Posse presented two approaches:
- Build two apps: a native iOS app and a native Android app
- Build a single multi-platform app using Flutter, a new Google technology
Option 1 is what we’ve always done — and probably what most people would recommend today. It’s the closest to the metal and least limiting long-run. But you have to do everything twice, so you can only do half as much. It takes more time. It’s more expensive. It’s harder to manage over time.
Option 2, on the other hard, is something bold, something risky, something exciting and something potentially game-changing — Flutter, a new framework from Google for creating apps on both iOS and Android that could be indistinguishable from native apps. Flutter addressed the problems we saw in other frameworks like React Native and Xamarin that typically had prevented us from recommending multi-platform solutions.
99% of companies would probably go with Option 1 — the safe option. But as members of the Google Developer Agency Program, Posse had an inside relationship with the Flutter team. We had been working with Flutter for months and were blown away by how much it improved our team and our work.
Flutter was an option to do more faster. Flutter created a foundation for the Hamilton team to focus more on new user benefits they could deliver than on building and managing two different app teams. The opportunity to be the first major commercial brand to embrace Flutter and show the world a new future was a fit for Hamilton’s ethos.
We weren’t going to throw away our shot — we decided to build the Hamilton app with Flutter.
So collectively, we decided we weren’t going to throw away our shot — we decided to build the Hamilton app with Flutter.
What’d I Miss
But, what exactly is Flutter and why does it matter? If you’re familiar with Flutter, then please skip ahead. If not, it’s important to understand the context of modern mobile development and why Flutter exists.
Flutter is Google’s mobile UI framework for crafting high-quality native interfaces on iOS and Android in record time. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source.
In mobile development, we have two major mobile platforms Apple/iOS and Google/Android. Apps must be on both platforms to be available to everyone.
But creating apps for iOS and Android are two very different animals. iOS apps are built with Objective-C or Swift. Android apps are built with Java or Kotlin. iOS apps are created in XCode and deployed via iTunesConnect and the App Store. Android apps are created in Android Studio and deployed via the Play Store.
The solution to this divergence for most companies is to simply have two different teams — one for iOS and one for Android. The problem is obvious. Two apps. Two teams. Two different platforms. 2x the cost. 2x the time. 2x the overhead.
Everything must be done twice, and that assumes both teams implement a feature consistently the first time. If you’re Facebook, then this is irrelevant because you have all the money and talent in the world to solve this problem. If you’re a start-up or budget constrained, this is a big deal.
Why isn’t there a better way?
Wait For It
Cross-platform frameworks have long been touted as the solution to the “build it twice” problem.
Solutions like PhoneGap and Appcelerator Titanium emerged first to solve this problem. Next came Xamarin and React Native with their unique approaches and solutions to bring multi-platform development closer to the promised land.
And now, Google has given us Flutter. Wm Leler from Google has an excellent article called “What’s Revolutionary about Flutter”, that does a great job of explaining why Flutter is different and good in its own way. Martin Aguinis from Google also launched this Introducing Flutter Video which describes Flutter at a high level in under 2 minutes.
Prior to Flutter, Posse had never once recommended a multi-platform framework to our clients. We simply didn’t trust them.
So, why did Posse recommend Flutter for Hamilton?
- Feel — Flutter apps feel native with less work. Scroll views bounce or glow. The theme-able interface makes it easy to adjust to fit styles and norms of both iOS and Android.
- Performance — Flutter does not have a “bridge” as Wm explains. Flutter’s performance is better than any other framework we’ve tried.
- Dart — Yes, Dart. It’s high performance, easy-to-learn, and we trust code written in Dart more than we do in JavaScript.
- Tooling & Hot Reload — Flutter has a lot of nice things that make developing easier and faster, including a fast hot reload, CLI tools, and IDE support.
- Great Team — The Flutter team is active, responsive, and helpful.
- Layouts & Widgets — The widget system and the way you create layouts is just so much more enjoyable, not to mention faster, than native code.
- Plug-in System — A novel, scalable solution to make sure Flutter never becomes a huge obstacle to something we want to do.
- It’s not JavaScript — We write a lot of JavaScript at Posse. JavaScript is incredibly powerful and popular, but we’ve always felt it’s relaxed approach makes it dangerous.
For the first time, with Flutter, we confidently believed a solution existed that met our needs. This is not to say that React Native, Xamarin, and the others are not also good solutions. But for us, Flutter finally checked all our boxes.
The Room Where It Happens
We started the Hamilton app in May 2017, and had a firm launch date in August — only 3 months. We needed to build sign-up / login flows, the home screen, ticket lottery entry and purchase, a dynamic content newsfeed, a complete e-commerce merchandise experience, a HamCam selfie camera, a shareable sticker experience, user profile management, and more.
Flutter improved our process in a variety of crucial and important ways:
- One team! — We only needed a single team to develop the apps, which was a huge advantage. A single developer could focus on a specific feature and see it all the way to completion on both platforms without context switching. Developer collaboration always was exceedingly high since everyone was working in the same language and codebase. Team flexibility was also improved as any developer could slot in to lend a hand or if someone was sick or vacation.
- Enjoyable layout creation (20x better!) — One of the most surprising things the development team identified about Flutter was the UI layout system. One developer on our team posited that creating layouts in Flutter is “20x better than native”. That’s huge, and remember you only have to do it once. Most importantly, we used to hear a lot of complaints about creating layouts and getting consistent results on iOS and Android — our team now finds creating layouts fun.
- Prototyping & design iteration — No matter how rigorous the design phase, iteration always happens during development. Flutter makes prototyping UI incredibly fast. Updating and modifying design is trivial by comparison to native approaches. The ability to prototype our proposed solutions and then quickly iterate the design saved a ton of time.
- Hot reload FTW! — This is probably the feature that first gets people really excited about Flutter. When you change your code and watch hot reload update your app in near real-time, it’s mind-blowing. Recompiling and re-navigating to the area of the app you were working on now seems akin to riding a horse on the highway. Moreover, hot reload significantly streamlines design review and pixel perfection. Our designers sit shoulder to shoulder with the developers to fine tune the UI.
- Composing widgets and declarative layouts — We have long been believers in doing layout with code only. Programmatic layouts are, in our opinion, the only way to get scalable results. Flutter’s approach is refreshing. Using widgets and wrapping objects to achieve desired effects is intuitive and easy.
- IntelliJ IDEA — This was another surprise. Our team used IntelliJ IDEA to author the code and it had a number of exciting advantages vs. XCode and Android Studio. IntelliJ is fast, doesn’t crash, and makes many things easier (like imports). The Dart analyzer was also extremely helpful and improved our code — especially since Dart was relatively new to our team.
- Animation simplicity — Creating animations and transitions felt much more straightforward and simpler to execute than on native platforms.
- Reduced testing burden — Since the code is the same for both iOS and Android, we generally only had to test a new feature once on iOS or an Android device. This was a massive time savings. Of course we still had to test different device types, screen sizes, etc. for layout and UI issues. But for the most part, if we tested a feature on an iPhone, we didn’t need to retest it with the same rigor on Android (and vice versa).
- Plugins and channels — One of our concerns with multi-platform frameworks is access to OS- and hardware-specific features. Flutter’s plug-in and channel system is an intuitive way to deal with this. For instance, we could leverage the native Stripe SDKs on both iOS and Android using channels or the Firebase SDK via the Flutter plugin.
- Falling back to native — When a channel or plugin could do the job, we discovered we still had all the power of native at our fingertips. If Flutter can’t yet do something you need it to do, you can still create a native view and present it in the app to accomplish your goals. In this case, you have to write code twice, but that’s a good tradeoff for the flexibility of not being limited.
Satisfied
After working exclusively in Flutter for several months, the true validation of Flutter for our team is found in the opinions of the development team:
- Our team strongly felt that Flutter (alpha issues aside) easily improved our development efficiency by 25%, and that is only in comparison to building a single iOS or Android app.
- Eliminating an entire app from the development process, cut the effort in half right there.
- Reduced overhead in design reviews, project management, and testing was another huge savings of at least 25%.
The only things that held us back were issues stemming from Flutter being alpha software, the learning curve of working with something new, a limited set of plugins, and coordinating our priorities with the Flutter team.
We also had the honor of presenting our experience building the app at Google Developer Days in Krakow Poland. We’d encourage you to watch the video to get a deeper look at some of our methods.
In aggregate, we feel we were able to accomplish 75%-125% more than if we had created these apps as two independent native apps — and it’s only going to get better as Flutter improves and the community grows.
History Has Its Eyes On You
The other major validation of Flutter is found in the feedback from app users, and there are three major metrics to consider:
- Over 1MM installs, 500MM MAU — The Hamilton app is a big app with lots of monthly and daily users. Flutter scales to a big audience and delivered an experience enjoyed by hundreds of thousands of people.
- The fans love it — The apps have enjoyed mid-to-high 4.X ratings in both the Apple App Store and Play Store since launch. The feedback on social media and from the press has been extraordinary.
- Nobody thinks it’s not native — We occasionally ask and nobody yet has immediately thought the Hamilton app is anything but native. That is a huge proof point for Flutter.
We set out to make an app for Hamilton that would be worthy of the show and give fans something special. Without a doubt, Flutter helped us achieve our goal.
What Comes Next?
Flutter is great for launching apps, but managing, improving, and growing an app after launch is just as important. Fortunately, the benefits of Flutter have continued to pay dividends for our team.
Flutter is great for launching apps, but managing, improving, and growing an app after launch is just as important. Fortunately, the benefits of Flutter have continued to pay dividends for our team.
- Design Refinements — Since launch, we have made a number of design refinements to the core user experience — including changing layouts, navigation, text copy, imagery, and more. If we were managing two apps, some of these improvements simply would not have happened because the cost of doing it twice would have outweighed the benefit of the change.
- Bug Fixes — We use Sentry and Firebase Analytics and constantly monitor issues with the app. Flutter improves the velocity of bug fixing, testing, and consistency across platforms.
- New Features — Adding new features is an efficient and pleasant experience. The architecture scales easily and we rarely need to consider nuances of platform-specific implementations.
- Compliance Efficiency — Occasionally there are updates where it is crucial that the solution is implemented perfectly. For instance, we needed to add region-specific opt-outs for legal compliance. These updates were complicated and nuanced and a major liability if implemented incorrectly. Communicating it to a single developer, verifying implementation once, and testing once significantly reduced the risk of miscommunication and inconsistent/incorrect implementation.
When we started the Hamilton project, we were laser-focused on launch. But as we’ve settled into managing a high-scale production app, Flutter has been an incredible advantage. It continues to help us focus on improving the features and adding value to users. Additionally, it has reduced fatigue and kept our team interested by reducing the burden of duplicative work. Flutter has turned out to be just as valuable after launch as it was getting it to market quickly.
Who Lives, Who Dies, Who Tells Your Story?
We’ve been working with the Hamilton Flutter codebase for over nine months now, and we believe more strongly than ever that it was a great decision to user Flutter.
In fact, Posse is all-in on Flutter and recommending it to all of our clients. It’s benefits are simply too significant to ignore.
Posse is all-in on Flutter and recommending it to all of our clients. It’s benefits are simply too significant to ignore.
React Native and Xamarin are also fine solutions that provide similar benefits. For us, the choice is clearly Flutter. The fact that there is now a choice of capable multi-platform frameworks means that we can probably expect these tools to get better and better as they compete with each other.
Flutter is definitely worth paying attention to closely. It has a number of important benefits relative to the others. Some will eschew it because of Dart, but that is a foolhardy reason to not try it. It is at least as good as any other multi-platform solution, if not better. Flutter is also how you create apps for Google’s experimental Fuschia OS, which some people dream may be the successor to Android. We’ll have to wait and see.
All we can tell you is that, for us here at Posse, Flutter passed with flying colors and continues to impress. At the time, it was a risk for the Hamilton team to decide to build with Flutter. But now — especially since Flutter is officially in beta and is building more and more momentum— it just looks like a smart decision to make.
About Posse
Posse is a NYC-based multi-platform design and development studio that works with great companies to create amazing apps. Posse was the first to launch a major commercial app using Flutter.
Contact us about your digital project.
