How Flutter changed Development for the Better

Bridging the gap between design and development

Rafael Alonso
4 min readFeb 24, 2021
Image Source: Simple Solutions

Flutter is one of the most popular mobile frontend frameworks right now. But why is it so popular in a market with more mature hybrid (iOS and Android) frameworks like React Native? Some argue this is due to the hybrid development of mobile apps with native performance, in contrast with the other hybrid frameworks. But let’s admit it, the performance difference between all mobile frameworks is so small that if users notice poor performance it’s 99% likely to be the developer’s fault, not the framework’s.

In my experience with Flutter, its greatest advantage is the massive library of curated widgets already included in the framework. In order to explain why this is so important, we should first get some perspective.

The birth of an app

The process of creating an app is quite tricky and not as easy as it seems. From my experience most clients fall into two categories (with exceptions obviously). The ones who came up with a game-changing idea that would make a killer app and the ones who have a physical product they want to enhance with software in the form of an app.

The one thing they both have in common, is that they haven’t fully materialized their vision. They have an idea of how the end product would look like, but they’re not completely certain down to the very last detail. So what happens next? They hire a designer to bring their marvelous creation to life, and this is where problems begin.

Developers usually take the fall

Allow me to explain, UI driven development is the simplest path but it is also quite often a risky move. When your talented designer learns about your idea, the first thing he does (just like any artist would) is seek inspiration from similar projects on sites like Dribbble, Pinterest, etc. He then selects a couple of screens he likes, creates a “Frankenstein” with parts he thinks will do the trick and gives them a pretty makeover to look and feel cohesive.

This usually results in an excellent work and gives the client a tangible version of the product they envisioned. The client is happy, the designer is happy, everybody wins. Except for the developer.

Design is only the first step

Image source: flutter.dev

Beautiful UI does not necessarily result in a pleasant UX, so what seemed to be amazing in theory ends up being useless once implemented. What does this mean? That the tricky component the developer spent hours and hours to bring to life has no practical use. This misunderstanding triggers a chain of events.

The client feels confused, so now he begins to feel insecure about the whole project itself. On the other hand, the designer that has been out of touch with the project for months becomes hesitant to come back and fix the problem. And lastly, the programmer tries to solve the dilemma but his solution does not comply with the designer’s work and the client’s expectations.

Iterating is a natural part of the development process and most programmers ditched traditional waterfall methodologies for agile methodologies. Having said this, as a programmer myself, I still see the same mistake being made every time apps get developed with an already “finished” design. Developers and designers should not work independently, they should cooperate closely throughout the whole process and avoid falling into archaic waterfall methodologies.

Flutter’s greatest perk

The most fundamental principle of UX is lots and lots of user testing, so handing in a figma/illustrator file with a design that “seems right” is in theory and in practice unlikely to result in an app that feels great to users. So how do we avoid this? Well, this is the scenario where Google’s Flutter shines.

Flutter’s vast library of widgets allows developers to bring to life rough concepts from designers without the app looking like a horrid prototype of a Windows 98 program. Apps tend to stray away from the creation of revolutionary interface components. This happens because learning a new interface is far more difficult than going for the familiar components. The latter are more intuitive resulting in a better experience.

Google knows this, they have carefully studied and synthesized all the most commonly used components and integrated them into their library of widgets. With Flutter developers don’t have to spend time trying to imitate components or looking for libraries online, it’s all within their reach. Flutter also avoids the separation between design and layout (HTML/CSS) making the process even less tedious. This allows developers to swiftly bring rough concepts and designs to life without wasting time on making them look good, thus being able to test the design as early as possible.

Iteration at its best

So what happens if a component doesn’t “feel good”? The developer can ditch it to try something else in a matter of seconds and keep on iterating. Once the app feels good, the designer can work his magic to make it look distinct and amazing. Voilà! Your wonderful idea is now an awesome app which looks and feels great in record time!

Do you know what record time translates to? Loads of money saved by the client for utilizing the expensive developer’s time in a more efficient way. Now yes! Happy client, happy developer and happy designer, everybody wins with Flutter. At CreateThrive, Flutter is our go-to tool when developing mobile apps.

You might be also interested in: Staff Augmentation: A powerful tool for 2021

--

--