Flutter: the first UI platform designed for ambient computing
We’re writing to you from Flutter Interact, Google’s biggest Flutter event to date, where Google is making a number of announcements about Flutter, including a new updated release and a series of partnerships that demonstrate their commitment to supporting the ever-growing ecosystem around Flutter.
From Device-centric to App-centric development
Our original release for Flutter was focused on helping you build apps that run on iOS and Android from a single codebase. But Google wants to go further.
We live in a world where internet-connected devices are pervading in every area of our lives. Many of us transition throughout the day between multiple devices: phones, watches, and other wearable devices, tablets, desktop or laptop computers, televisions and increasingly, smart displays such as the Google Nest Hub.
In this emerging world, the focus starts to move away from any individual device towards an environment where your services and software are available wherever you need them. Google calls this ambient computing, and it’s core to the vision for Flutter: a portable toolkit for building beautiful experiences wherever you might want to paint pixels on the screen.
With Flutter, instead of being forced to start your app development by asking “which device am I targeting?”, Google wants you to be able to begin by focusing on what you want to build. In this multi-device, multi-platform world, Flutter aims to provide a framework and tooling for creating user experiences without compromise on any device or form factor. The Dart-powered Flutter engine supports fast development with stateful hot reload, and fast performance in production with native compilation, whether it is running on mobile, desktop, web, or embedded devices.
If you’re a startup, Flutter lets you test your idea on your total addressable market, rather than being forced to target just one user base due to a lack of resources. If you’re a larger company, Flutter lets you consolidate your team’s resources onto shipping a single experience, reusing code across mobile, web and desktop as you see fit. Flutter is unique in supporting such a diversity of natively-compiled experiences from a single codebase.
It’s been great to see how Flutter has flourished in the short time since its initial release. Well over a million developers are already using Flutter for apps both large and small. In GitHub’s 2019 State of the Octoverse report, Dart and Flutter ranked #1 and #2 for the fastest-growing language and open source project respectively over the last twelve months, and Flutter is now one of the ten most starred software repos on their site. And in a recent analysis by LinkedIn, Flutter is described as “the fastest-growing skill among software engineers”.
The rest of this article talks about the progress towards this ambient computing vision and specifically focuses on the announcements the Flutter team made today to help designers and developers collaborate together on stunning visual experiences built with Flutter.
Flutter on mobile, desktop, and web
Today at Flutter Interact, Google is announcing Flutter 1.12, its latest stable release of the Flutter framework. This latest quarterly release represents the work of hundreds of contributors from inside and outside Google, and brings new performance improvements, more control over adding Flutter content to existing apps, and updates to the Material and Cupertino libraries. We also have a new Google Fonts package that provides direct access to almost 1,000 open-sourced font families, putting beautiful typography within reach in just a line of code. More information about what’s new in Flutter 1.12 can be found in the dedicated blog post on the Flutter Medium channel.
Google is increasingly using Flutter for mobile app development, thanks to the productivity benefits it offers for multiplatform development. At Interact, the Stadia team showcased their app, running on both iOS and Android from the same codebase and built with Flutter. Talking about their experiences, the team had this to say:
“As Stadia was initially investigating mobile, Flutter enabled us to prototype quickly, demonstrate gameplay on Android, and then staff one team to build our cross-platform experience without compromise. We’re delighted with the results and are continuing to build new features in Flutter.”
Of course, many companies outside Google are also using Flutter for their app development. Splice provides a library of millions of sounds, loops, and presets that help musicians bring their ideas to life. When they decided to add a mobile app to supplement their existing desktop experience, they chose Flutter because, as they put it: “Speed to validate our product hypothesis was critical. We are a small team, so we needed a single solution that could deliver an equally great experience to all our users on iOS and Android.”
Within six weeks, they had built a prototype that validated their choice, and their new mobile experience is live in both the Apple Store and the Google Play Store:
Adding a mobile experience is already showing results, with a significant percentage of purchases now coming through their mobile app. And with Flutter providing consistency across multiple platforms, they’re now experimenting with bringing some of the same experiences into their desktop app.
On the subject of desktop, Google has made much progress with macOS support. For the first time, you can use the release mode to build a fully-optimized macOS application using Flutter, and we’ve been working to expand the Material design system in Flutter to support apps that are designed for desktop-class form factors. More information on building for desktop can be found at flutter.dev/desktop.
Lastly, Google announces the beta release of Flutter’s web support, adding stability and maturity over the previews that Google shipped earlier this year. It’s now possible to build and consume web plug-ins, enabling Flutter apps to take advantage of a growing ecosystem of Dart components for everything from Firebase to the latest web APIs. Since the Flutter team announced their early adopter program a couple of months ago, they’ve been working with customers like Journey to test web-based experiences with Flutter, and now they’re ready for a broader set of developers to start building web content with Flutter. More information on Flutter’s web support can be found at flutter.dev/web and at the companion blog article that was published today.
Flutter as a canvas for creative exploration
Flutter’s stateful hot reload feature makes it easy to make changes and see the results in real-time; and with every pixel drawn by Flutter, you can blend UI, graphical content, text and video with custom animations and transformations.
Today Google is launching tools for designers to more fully participate in the creative process of building Flutter applications.
Supernova has integrated Flutter into their design and prototyping tool, with animation support, Material Design integration, and an updated interface designed for Flutter. They also announced a new browser-based tool, Supernova Cloud, which is built entirely with Flutter’s web support.
Rive (previously 2Dimensions, who published the Flare graphics tool) announced that they’re consolidating their company name and product into one brand. They unveiled their new company and product name, Rive, as well as a number of new product features. Perhaps the most notable feature in Rive is support for importing Lottie files created with Adobe After Effects, enabling deeper integration of Flutter into existing workflows for animated content. Rive now supports real-time dynamic layering effects like drop shadows, inner shadows, glows, blurs, and masking.
Rive eliminates the need to recreate designs and animations in code, greatly simplifying the designer-to-developer handoff. This means that designers are free to iterate and make changes at any time. And because it outputs real assets that integrate directly with Flutter, not just MP4 videos or GIF images, Rive allows you to create sophisticated and dynamic interactions, game characters, animated icons, and onboarding screens.
Lastly, another big endorsement of Flutter as a canvas for creatives comes from Adobe, who are announcing Flutter support in Creative Cloud with a plugin that exports designs from Adobe XD into Flutter. Adobe XD, Adobe’s user experience design platform, allows product design teams to design and prototype user experiences for mobile, web, desktop, and beyond. Instead of simply handing off design specs and leaving development teams to understand and interpret a designer’s vision, the new XD-to-Flutter plugin automatically converts XD designs into code that is immediately usable as part of your Flutter application development.
The XD to Flutter plugin will be available as open-source early next year. You can find out more about XD to Flutter and sign up for early access on Adobe’s website.
Flutter is at its heart an open-source project. Google’s journey thus far has broadened from their original mobile-centric release to incorporate a wider range of form factors, and they continue to invest in designer and developer tools that increase both the productivity and the beauty of your finished application.