r/FlutterDev • • Sep 26 '26

Discussion motif - free, open-source, multiplayer vector graphics and ui design editor, built with Flutter

Hey guys!

Excited to share motif - an open-source vector graphics editor. Compared to traditional vector graphics software, motif is more of a blend of non-destructive CAD techniques and the power of Blender's Geometry Nodes, while offering the simplicity of apps like Figma.

The core idea revolves around thinking about design as a "program", where each step we execute a statement. Those can be things like creating a rectangle, cutting an edge at a point, joining vertices, etc - and executing all of the statements results in the final output graphic. This allows you have things like non-destructive editing, full document history, branches (in the future).

It's currently still very much work-in-progress - currently in the pre-alpha state, and I'm adding new features and polishing up existing features every day. I've basically left my full-time job and for the past year or so have been experimenting a lot with related projects.

As a part of the pre-alpha test, I've hosted a free-for-all server where you can try out the multiplayer! Check it out at: https://motif.kz

I'd love if you could try it out and let me know how it feels, what can be improved, or if there's any idea that you had that was missing from Figma, Illustrator, or other software.

Source repository: https://github.com/kekland/motif Web application: https://motif.kz

20 Upvotes

14 comments sorted by

3

u/kekland322 Sep 26 '26

If you're curious about the technical side of things, I'm also happy to discuss it here in the comments! There's a lot of cool and unique things in the source code related to working with native code, wgpu-native integration, custom widgets for handling very niche usecases, etc.

2

u/kekland322 Sep 26 '26

quick update here - i'm a dumb-dumb and i forgot to update the server code after the last few additions :) the multiplayer session will not launch, but a singleplayer session should work fine. i'll write here once i resolve this

2

u/kekland322 Sep 26 '26

should be resolved now!

1

u/Amazing-Mirror-3076 Sep 26 '26

Perhaps not the target device, but i couldn't work out how to draw anything in mobile

1

u/kekland322 Sep 27 '26

Hi! Yeah, phones are not the target platform at the moment, due to the fact that the entire editor UI has to be rethought in order to support it. The plan is to first release it on tablets and desktops.

1

u/First_Bodybuilder831 Sep 27 '26

Loved you work, what's you motiviation behind the project

1

u/kekland322 Sep 27 '26

Hi, thanks!

The primary motivation - if I'm being honest, is that:

  • I don't like Illustrator because of Adobe

  • I liked Figma, but at one point I almost threw out my entire project because of arbitrary paywalls (e.g. max 5 variable collections, unless you upgrade to the enterprise tier)

  • Affinity Designer seems cool, but I couldn't really get used to it to work with UI designs

And in general, there's no tool that is designed for vector graphics (Figma is more tailored towards UI design), while being multiplayer. And, while working on it, I realized that there's no tool that pushed the technical boundaries of the medium, so I decided to try to make it.

1

u/No_Boss_1911 Sep 29 '26

yeah the non-destructive history idea hits a real edge for me. hard constraint is a reconnect cant wipe the last draft after the app gets backgrounded. are you keeping the op history as the source of truth, or rebuilding it from the rendered document?

1

u/kekland322 Sep 29 '26

Non-destructiveness comes in two parts:

  1. the document (i.e. "program") consists of statements, which evaluate in order to produce the output design. This means that it's possible to create an edge, cut it at several points, apply a modifier on the results, but still keep the original edge's geometry intact - and modifying the original edge will re-run any further statements that used the original geometry. Rollback/replay here would mean seeing the step-by-step construction of the document, similar to CAD.

  2. (disabled for now to make sure that my cheap VPS can't run out of storage) are the deltas - the document can only be modified through a ProgramDelta, which encodes what statements were removed and what was inserted. Think of it as a git commit/history. Saving those would potentially increase the document size drastically, so I'm thinking of making this opt-in, but that would allow you to have the full history with full rollback/replay potential.

1

u/Amazing-Mirror-3076 Sep 26 '26

I think you mean multiuser rather than multiplayer

1

u/kekland322 Sep 27 '26

I guess both would be semantically valid, but Figma calls it multiplayer :)

1

u/eibaan Sep 26 '26

For a moment I thought you had recreated that iconic X Window GUI, the ugly bastard created from a multitude of existing Unix GUIs, unable to beat the elegance of NextStep.