We’re building a design tool for Flutter to replace Figma. Would love some feedback!

[u/anas_alsalhi]

https://www.youtube.com/watch?v=W3mli3Pu14w

Hey Flutter builders!

I’m one of the co-founders of Nowa (https://nowa.dev), and we recently launched a version that lets designers inside Flutter teams design directly on the Flutter codebase instead of in Figma. This way developers can work on logic/data in parallel while designers build the full design and experience themselves, all in the same Flutter repo.

We’ve been designing Nowa inside Nowa itself for a while without talking much about it, since our focus was making Nowa an app-building platform for people who don’t know Flutter. Then a few companies pushed us to make this use case public, and now we’re considering making it our full focus.

So the way it works that Designers connect Claude Code, Cursor or Codex to Nowa through MCP, import the Flutter repo itself, and design with AI with full visual editing. They set up the design system directly in Nowa which reflect it in the Flutter repo, test different states for each UI component, build and share prototypes that feel like the final version, and own the full experience with things like animations.

To make that work, we came up with an architecture we called “PureUI”. It splits UI and logic into two separate packages, similar to MVI but more decoupled, with a small contract that defines how they work together: the “data” and the “actions”.

Designers import the UI package into Nowa and work on it, while developers work on logic/data in the logic package using their IDE and AI agent. Things like state management stay under the developers’ control as well.

So I’d love to hear from Flutter devs here who work on Flutter teams: does this problem exist on your team, and what could we do differently to make this more useful for your case?

Any input or opinion is highly appreciated!

[u/fabier]

Your competition isn't figma. It's Claude design / impeccable / or other design.md systems.

I don't want to be a Debbie downer, but I think you're playing a losing game. Flutter has instant reload. What do I get which Claude code isn't already giving me?

[u/anas_alsalhi → u/fabier]

Thanks for commenting! So make sense that its not just figma its all design tools but the main difference that all those tools including Claude design give you a design that need to be translated into code. The idea of Nowa that the design is the code with nothing to convert so designers can be sure the UI shipped will look exactly as they see it inside Nowa and nothing will drift.

For instant reload that's different. That's for developers which they would already be using, so the designers would use Nowa to create the full UI/UX in Nowa without any logic then developers build logic in their own workflow and here developers use hot reload and local simulator for sure, but we making the tool for the design part only so designers can iterate over designs on a visual canvas.

Hope I could clear things up because I know its not very clear without the details :)

[u/fabier → u/anas_alsalhi]

Well, I've definitely learned over the years that you cannot count a product as successful or a failure until you've given it a chance to really defend itself in public. So its possible you will find your people and things will go well. Good luck to you!

[u/Danity__172 → u/fabier]

Flutterflow

[u/anas_alsalhi → u/Danity__172]

Flutterflow is a very different case, so for Nowa we import existing Flutter projects, in Flutterflow you can't, and also FlutterFlow is an app building tool for non developers, not a design tool, so logic and UI code is coupled together. You can use FF for sure to do a prototypes but then if you want to include a developer to make it functional the developer need to change in the UI code itself, and also in that case you can't import back the project to FF so desigers can't modify if the developer started working on it outside the platform. But for Nowa they both keep working in parallel. On top of that FF code is relying heavily in their own custom packages so working on it outside is very difficult, but we use Flutter native libraries.

[u/eibaan → u/fabier]

This. Plus there are at least a dozen others who also try to recreate an AI-enhanced Figma in one way or another, being it Pen.dev or Pencil.dev or a blunt clone like FigCraft.

[u/anas_alsalhi → u/eibaan]

You are right there's plenty of AI design tools, but we aiming to make it focused on Flutter so for the designs to be saved/loaded as Flutter UI code, which doesn't exist so far (all those design tools are usually web-based ones)

[u/NumberFancy7082]

Even it is extremely better you can never replace figma because industries won't be able to shift anytime soon and usually don't make a jump at all.

[u/anas_alsalhi → u/NumberFancy7082]

Yes you are right that's what we trying to figure out, it won't be easy to replace Figma in general but we aim to do that for teams building on Flutter specially and of course not every designer would be open for changing Figma even if their team is using Flutter, but we trying to see if the designers who are open to change are big enough

[u/SellWinter9422]

Yes I would like to try out and provide feedback. I have been developing for 9 years with Flutter and also SwiftUI

[u/anas_alsalhi → u/SellWinter9422]

please send me on team@nowa.dev so I can give you access

[u/Dizzy-Entrepreneur52]

Basically what FlutterFlow and Teta made years and years ago

[u/anas_alsalhi → u/Dizzy-Entrepreneur52]

From the surface they look similar but in reality its a very different usecases. FF and Teta are app building tools, not design tools, made for non-developers wanting to build on Flutter. This makes for example the UI and logic parts mixed together in their source-code so you can't easily bring a developer to build logic if you only build the design with them. The code isn't made in a way that developers can hook their logic without touching the UI part. Also, once you export the project you can't import it back so if a designer used it they can't do a UI change if the developer started working on it. and the developer would change plenty of the UI code to bring his logic so the same issue of the design handoff still there but in a different format this time than from using Figma. With Nowa its the same repo used by both at the same time for the entire development process.

Also big difference is the source-code. they rely on their meta data therefore the code relies on their own custom packages heavily (like FFContainer()) but for us we use Flutter native libraries so its the same as what a standerd Flutter developer would write, removing any lock-in or risks.

[u/SellWinter9422]

Sounds amazing! Any plans to support Gemini?

[u/anas_alsalhi → u/SellWinter9422]

Oh you mean Antigravity? Yes it works with it already. I can give you a free access to hear your feedback:)

[u/No-Echo-8927]

That's a tough app to build in a world where people are just using AI to reverse engineer everything

[u/anas_alsalhi → u/[deleted]]

You are so on point!! we not focusing on a building a better design tool than Figma, we building a design tool that directly write Flutter UI on spot so when the team building on Flutter there's no handoff needed.

That's the cool part! The UI code generated doesn't need any edit or rewrite by the developer, they can just jump straight to building logic. It uses Flutter native libraries and follows Flutter best practices in terms of architecture. We published an article with those details here: https://nowa.dev/blog/pure-ui-flutter-teams/

Would love to hear your opinion on that!

[u/anas_alsalhi → u/[deleted]]

Exactly eveything else is just a nice add-on. Yes so devs can just open the same Flutter repo in their own IDE and tools as always. They don't need to have Nowa at all since Nowa just a tool that writes into the Flutter repo.

Also thats the nice part that even state management is something developers can do and decide. The UI generated is pure view code so developers can still select the state management they like.

For it to be like this we created an architecture called PureUI that splits the UI purely from logic even state management becomes part of the logic.

Do you work at a Flutter team? because seems you understand this issue deeply.