Have a look
under the hood.

Our mobile technological stack

With cross-platform compatibility between app and web in mind, we decided to use Flutter. For our backend, machine learning, and analytics needs we use Firebase and Python. While also using C++/Swift/Java/ Javascript/WASM for platform-specific operations.

The Editor

How do you create incredible content for your products? With a state-of-the-art photo and video editor, of course. Our editor is composed of three components: the rendering pipeline and the tools that interact with the layers in it and the exporting pipeline.

The rendering pipeline

Our rendering pipeline takes care of displaying layers (shapes, images, videos, stickers..) and responding to user inputs, such as movement and rotations. Most of the pipeline is handled and manipulated in Dart and rendered in pure Flutter. For videos, we modified the Flutter engine to be able to extract frames as Dart's ui.Image(s) in the fastest possible way which is not currently allowed by the engine.

The exporting pipeline

To export videos, we modified the Flutter engine to be able to extract asynchronously from the UI, in an accelerated way, frame-by-frame the results of the rendering pipeline. These frames are then aggregated at a platform level and encoded in a video that our users will simply share on their social media. This process allows us to be mostly platform agnostic.

Our Apps

Providing a seamless editing experience is our goal. While most projects might start and end on a phone, there are some features which only tablets and desktops can support. Developing a cross-device experience, allows users to start editing on their phone while still having the freedom to finalise their projects on a different device.

Meet Magma, our
Design System

We have built a design system and always try to reuse as much UI elements as possible across all platforms. This is why we created Magma, our reusable UI component library, that plays a vital role in our development process.

State managment
using TCA

TCA is an unidirectional dataflow, Redux-like, library, which simplify state management in a consistent and understandable way. We loved this paradigm from day 1 and have decided to embrace it, port it onto our technological stack in Flutter.

Try Clay for free
on iOS and Android