.png)
Client
Flutterflow
FlutterFlow has accumulated over 1 Million users and continues to grow at a tepid pace as they launch new features across the product development cycle. The team has also just raised $25.5 Million dollars to help them transform the visual development movement.
Services
Strategy, UI Design, Design System
Platforms
Web, Mobile, SaaS
Year
2020-2022
Project Overview
The FlutterFlow team approached us as they were preparing to make a pitch to Y-Combinator (a very well established and prestiguous funding group). Alex & Abel both come from a development background and both worked at Google together before finding out their ability to create products that are loved and easy to use.
They were looking for a design team in order to help them put together the core User Interface of their application. We were able to work out the specifications needed for their desired SaaS product at the beginning of the engagement. And continue with them as they built out features and had design needs for their builder in the early funding stages of YC.
Creating the Builder UI
One of our first action items was to create the general bones of the UI Builder so that a you could drag and drop elements onto the canvas to create your applications.
Color Theme
The very first task was to come up with a design system and color theme based on their current palette (purple, orange and black). We worked off the purple and black and came up with a few shades of dark charcoals to help layer our UI, we also tweaked the purple and orange to create a nice fluidity.
Icon Set
One of our first action items was to create the general bones of the UI Builder so that a you could drag and drop elements onto the canvas to create your applicaiton.
Building a #NoCode Builder
We work in design programs, prototyping and motion design tools all day everyday, so figuring out how a designer would like to interact with an interface is literally our job.
We worked with the FF team on figuring out the requirements for what a user can do; and how they can do it and we took it from there, providing a consistent design system for them to carry out to elements of the app they spun up in their spare time.
Drag & Drop Builder
In FlutterFlow you can easily create complext interfaces with a simple and easy to use drag & drop builder. We are able to build UI’s in code almost as fast as it takes us to build them in Sketch.
We love this tool becuase the use cases for it are out of this world, #nocode is really gaining traction and with agile frameworks handing over the reigns from development to design and cutting down on time spent coding the frontend is going to save a lot of $$$ in the future and @FlutterFlow will be there at the forefront of the movement for native app development.
Conclusion
We have worked with the FlutterFlow team in designing their product, template screens, sample apps, web design and so much more! In turn the product has evolved and received much praise from users, investors and no-code experts alike! They even won the 2021 Golden Kitty Award for Best No Code Tool.
You should def. keep an eye on this budding startup, that will in our opinion change the landscape of product development going forward.
Let’s build something amazing together.
© 2023 Kaleo Design LLC. All Rights Reserved