Brendon Powell

Adobe Xd to Flutter, Does it Work?

In early May of 2020, Adobe Xd featured a plugin that boasted ‘Convert Xd designs into working Flutter code!’ in a collaboration with Google — and while that claim is technically accurate, the truth is disappointing. Let me explain: No, there is too much. Let me sum up: I used the plugin to export from Adobe Xd into Flutter but the code created is not better than a live action demo. One that can only perform a single kind of transition from screen to screen, and it can’t even scroll. Even as a demo it isn’t useful since Adobe Xd can also demonstrate the design and can animate a wide variety of transitions.

The Longer Story

For a while now I’ve been mulling over the idea of building a solo mobile application from scratch using Flutter. All I needed was a relatively simple idea (✅) and the know-how (❌). When I saw that Adobe Xd had a Flutter export plugin I decided to give it a go. I thought that maybe this plugin could give me the leg-up I was looking for and simplify the coding process — after all I’m not a software engineer — although I do have a little bit of software development background and understanding.

Sadly, the Adobe Xd to flutter plugin leaves a lot to be desired. It gets something built and looks great in a Flutter debug demonstration, but that’s about all the export can do. The plugin doesn’t really provide a springboard starting place, at least not one that saved me a lot of time or energy. I think I would have been better off starting with a Flutter tutorial and learning the basics there instead of trying to bring this reanimation of my Xd design into working order.

That being said, the adobe Xd to Flutter plugin did motivate me to give this solo app idea a try. So I’ve got that going for me. Which is nice.

Suggestion to the Developers

Tagging. Allow me to tag portions of my Xd design so that the plugin can easily recognize standard pieces of logic. For example: Tag the app-bar. Tag the app body. Tag a card. Tag your mom, start somewhere and build up. As it stands I can’t find a use for this plugin. It requires me to massage my design into it so that everything exports properly. Proper exporting is the least of my concerns when there isn’t anything I can use anyway.

Leave a Reply

%d bloggers like this: