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, and the current composition of that workflow, and how things can, could, or we think will evolve.

A year before the first iPhone blew people’s minds, I graduated with an Interactive Arts degree that I was a few years late on starting, and I was madly passionate to find a job as an Interaction Designer — a role that at that time was lipstick on a web-developer. I was interested in the bleeding-edge, the out there stuff, like camera vision, sensors, data-visualization and how all that mixed in with artistic expression. I wasn’t the only one, but the centres for that kind of work were really few and far between, and a lot of them were in Europe.

Between Design and Development

An experiment in motion typography, bridging the des + dev teams at the Futurelab.

A comp was made in illustrator that expressed an idea, one that made total sense to the creative person who envisioned it, but made far less sense to the engineer who had to realize it. While beautiful in sentiment, that idea clearly overlooked basic fundamental aesthetic principles. The problem was that the designer was trying to express a vision of dynamic motion, but was fundamentally constrained by the static medium (sic. Illustrator) that they were using to express themselves. I came to believe that all designers should know how to program so that they could design in the medium they were creating for.

The final piece was a massive interactive installation at the Vienna airport.

Another thing I learned from that time was the enormous undertaking of building custom interfaces. At the time, JUCE had split out from Tracktion and was one of the newest industry tools for developing custom desktop and mobile applications, while Processing and OpenFrameworks were on the rise as alternatives for building expressive and dynamic experiences. I thought that it would be amazing to have a robust library of animated, customizable interface components that could be reused for any purpose (i.e. a code-based design system).

That was a nice idea. Then I quit the Lab, moved to the mountains, and shelved the design-system idea for a while.

Discovering A New Paradigm

Drawing with type on a Cintiq (Left). Interactive installation at an event (Right).

After more than a year of experimental development with Objective-C, I understood that there was a fundamentally different paradigm for rendering software. This technique, which was at the core of Mac app development, didn’t require re-drawing an interface at 60 frames per second. This technique was also layer-based, rather than drawing-based, which meant that there was a massive opportunity for inventing new kinds of aesthetics. I remained driven by the idea that artists should learn to program. I was obsessed and insatiable.

A print work I made with the software.

A New Approach to Creative Coding

Eventually, on a cold snowy winter evening in a Canadian pub, someone walked in wearing a cowboy hat and shorts. A friend of mine caught this and said “See? Even that guy has an iPhone.” A longstanding discussion came to an end and initiated C4’s move to from Mac to iOS.

Over the coming years, I would leverage C4 to teach programming for artists, to produce print and interactive data visualizations, and build cutting edge experimental apps for companies like SAP.

Interactive apps I built, using C4, for SAP.

The ability think through code to produce beautiful user experiences manifested the opportunity to open a design studio. From there, I managed to win grants, build new cutting-edge interfaces, interactive installations and generally bring my practice into a blooming professional environment.

Our latest installation was a massive interactive touch wall.

One evening, I gave a presentation about creative coding and first met a brilliant engineer who was interested in contributing to C4. We started working together and eventually he took the lead on the engineering development and direction of the project. I learned a lot along the way, and one day came the opportunity to take the project to the next level.

Evolving Into a Product

A slide from my presentation at Layers 2019.

The idea was simple: if people don’t want to learn programming, then give them something that programs for them. I would later come to realize that the idea was also consistent with my original thesis: designers should be able to design in the medium for which they were producing.

We got the funding we needed to kick things off, the first line of code was committed in August, 2015, and the product was called C4 Studio. About a month later, Principle was released and looked just about exactly what we had sketched out earlier that summer… But, it didn’t have anything to do with code export and, luckily, pretty much ever prototyping tool to come thereafter also had nothing to do with software.

Shipping Creative Vision

Today, Flow has the most powerful and flexible approach on the market for bridging the gap between Design and Development. This can be seen in the variety of export options (buttons, launch screens, onboarding animations, spinners), the variety of languages (Swift, React, HTML, JS, CSS), the variety of platforms (Xcode, Web, Android) all of which are backed up by the media export options that include images, animated GIFs / PNGs / SVGs, movies, and Lottie files that it can produce.

We have built a system for converting creative expression into a variety of visual media, or to beautifully written, efficient, modern software. It is the software side that truly gets to the root of my earliest vision, by allowing people to test in the medium before shipping. Flow allows a designer to craft beautiful signature motion pieces and, ultimately, accurately ship their creative vision.

Originally published at on November 5, 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