Decoding Flutter: What It Is and When to Use It

When it comes to mobile app development it’s important to know what tools are out there, what pain points different solutions can solve and the best time to use them.

When the project is right, we’ll use Flutter. Here we’ve broken down what it is, what should you know before beginning the development process and some of its use cases.

What is Flutter?

Flutter is Google’s open-source, user interface (UI) software developing kit for building applications across Android and iOS, as well as Windows, Mac, Linux and Google Fuschia.

It uses Dart language and is a cross-platform framework that enables developers to build from a single, compiled codebase. Developers can access a foundation library and design-specific widgets to build applications. 

To date, nearly half a million developers use Flutter each month, and two million developers have used Flutter since version 1.0 was released in December 2018.

While it’s not suited for every job, Flutter has become a known name in the app development world. At Sush we find it’s particularly good for minimum viable product (MVP) prototyping and rapid iteration, and for businesses that have an existing app that is unstable and needs attention. We have now productionised several mobile apps built on Flutter in New Zealand used by enterprises to engage customers or for the internal workforce to improve productivity.

Cross-platform Framework for Greater Efficiency

Having a cross-platform framework means developers build from one codebase. As such, they can build for the desktop, embedded, mobile and web apps at the same time without having to start again for each operating system.

Essentially this means Flutter doesn’t need platform-specific UI components to render its UI. The app will function fine with no changes to Dart code. There are some key benefits to this. For one, reusing code can save time in the initial development phase.

Furthermore, it can make updates, maintenance and adding new features simpler as these can be built and rolled out simultaneously across platforms. It also means businesses can experiment more with features and fixes.

Saving time and enabling the opportunity to experiment makes Flutter suited to start-ups looking to save resources. It also suits enterprises wanting to target multiple devices.

Google calls the notion of cross-platform frameworks ‘ambient computing’, and its recent updates which bring Flutter to the web, shows the company’s continued focus on creating a UI framework that caters for all screens and devices.

Flutter’s Engine for Design and Performance

A crucial component of the Flutter framework is the widgets. There are many types available to developers to define every aspect of the app experience from a UI standpoint.

The ready to use widgets include shared element transitions; shape, colour and shadow manipulations; clipping; and transformations. For those that want more control, there’s the option to use the Foundation Library’s methods so developers can draw directly to their app canvas.

The two design-specific widgets available in the framework are Material Design, which utilises Google’s design language, and the Cupertino widgets for iOS Human interface guidelines. Essentially, widgets help developers save time and customise as needed.

Flutter uses the graphics engine called Skia, developed by Google, for rendering to a platform provided canvas. The significance of this is that developers don’t need to adjust UI to transfer it to a platform.

For native app performance without the additional development, Flutter talks to platform-specific SDKs, such as Android or iOS. However, we’ll note it can still be beneficial for some companies to invest in native development and build their own functionality.

The ‘hot reload’ feature of the Flutter engine enables the code to be updated and changed to be reflected immediately in the app - it’s cited to take about one second to reload.

In addition, changes can be made while the app is running and developers can work with UX designers more interactively in real-time. This is ideal for companies wanting to test and experiment with new features and bug fixing.

Extending Flutter from Mobile to Web

Google has recently announced that Flutter now offers web support. Essentially developers can compile existing Flutter code written in Dart to a browser without the need of a plug-in. Web content is rendered using standards-based web technologies such as HTML, CSS and JavaScript for app experiences across modern browsers.

At its current state, the web offering suits certain use cases over others. A connected progressive web application or embedded interactive content could work well, however, content that is text-heavy and flow-based may not work so well. We expect Google to continue to roll out more updates in this area.

Flutter in Use

There are many use cases of Flutter. It’s been used by companies wanting to connect more effectively with existing customers, as a mobile extension of an existing service, to develop internal operations, and as a standalone service.

Significant global vendors have turned to Flutter, including Google for the Google Ads mobile app, which is designed for customers who want to be across campaigns on the go. We pride ourselves in Sush Labs, New Zealand, for being technology agnostic and leading with a business-problem-solution mindset. Based on the business case and scope of the problem, we build native mobile apps using Swift for iOS and Kotlin for Android, PWA apps and Google Flutter to support ambient computing.

Alibaba, the Chinese multinational eCommerce company, developed Xianyu on Flutter. The shopping platform app is used by more than 50 million users regularly to buy and sell products from different categories.

Standalone apps include Reflectly, the award-winning mindfulness app, and Grab, the merchant app for food delivery. 

Extensions of existing platforms or services include Philips Hue and eBay Motors. Philips Hue has created an app that allows users to set the mood and sync their smart lights to their media, while eBay Motors enables users to browse, buy and sell vehicles from their phone.

Groupon created an app for its key stakeholders - its merchants. The app enables merchants to track campaign performance, manage customer satisfaction and get support.

An example of Flutter used for internal operations is the Landscape Management Network (LMN) CRM mobile application.

The landscape management company has its mobile CRM app integrated with its existing web CRM to enable landscape contractors to manage the leads and clients in their sales pipeline.

There are a number of tools available to aid in mobile and web application development, each with their own feature sets and quirks. At Sush, first we work to understand the business and primary objective, and then choose the right tool for the job. In this way, we can continue to deliver results for our clients.