Control, Craftsmanship and Code Export

This article is a set piece of a series of writings which are an exposition of our thoughts, experience, and reflections from working in design and development wheelhouses, about the SDLC, the current composition of that workflow, and how things can and will evolve.

This is article #1 of that series.

In many circles, over many pints, and in many threads, lives the often fiercely debated topic of 3rd party libraries. Should you use them or not? Is it good or bad practice? Are they the Devil?

At Flow we’re constantly aware of and dwelling on this dialogue, because engineers are one of the primary users of our product. While the elusive unicorn may animate and program by themselves, the majority of teams working with Flow have engineers and designers working together, using the product. From the design side, our product needs to be a beautiful, easy and powerful animation tool. From the development side, it needs to produce modern, clean, flexible software.

But, therein lies a problem. So let me explain.

A Gentle Bias

Let’s have a look at two really important reasons for this sentiment.

Control

Building a design + animation tool is very complex and requires a significant amount of architectural software. In our journey, making certain that our software is stable requires a great deal of control, and is a primary reason that we write most software from scratch. On top of that, we often need to quickly work backwards from a bug to the exact source of an error — with a small team, knowing where a bug is coming from is critical. However, that level of control is far less important for UI elements, where we can easily justify the use of generated code.

Craftsmanship

“Clean code always looks like it was written by someone who cares.” – Robert C. Martin

We totally get it. Our team has had long discussions about the color, including questions like “what does a color mean?” to “what does the absence of color imply?” Every design element in our product exists because it represents a critical idea. From the engineering side, every line of code is written with the same attention to detail that we put into design.

An Olive Branch

If you’re on the fence, I’d love for you to suspend your disbelief for a moment and have a solid look at the quality of our code, and the structure of an exported project.

Our iOS export is a great example because you can integrate an animation into your project through Interface Builder. We use native UIKit classes, and everything is backed by Apple’s Core Animation. It’s not like we couldn’t figure out how to make animation work on iOS, and so created an animation engine for you… We didn’t do that. There are no heavy-handed 3rd party libraries here.

For iOS, we make Core Animation work for everyone.

Dialed — One of our 50 free iOS Activity Indicators — and its animation code.

For the Web, we make Web Animations work for everyone.

Dialed — Exported as Web Animation code, running in the browser.

Code Export that Really Works

Flow is a simple-to-use animation tool that eliminates the need to manually convert things to code. It preserves a designer’s vision while saving your whole team time, money, and heartache.

We’re here to force multiply your team’s ability to implement animations and elevate the user experience of your product.

Originally published at https://createwithflow.com on November 2, 2020.

A new class of UI Animation software. Import from Sketch. Animate in Flow. Export production-ready code.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store