Figma design all over the place when imported

[vvaroczii]

I am trying to import screens I have created in Figma however once imported the design is all over the place, sizing is off, elements moved etc.

Anybody has any suggestions on how can I import a like for like version from Figma?

[tatiang]

I have yet to see a successful implementation of Figma in Thunkable. The little I tried when it first was added to the product was a failure. I’m sure part of it was my fault but I’d love to see a proper tutorial on how to do this well.

[domhnallohanlon]

@vvaroczii can you try delete Screen1 and then import into a “blank” Thunkable project?

Let me know whether or not that works for you, if not please PM me your Figma file

[codeswept]

I have only tried implementing Figma once, just to test it out, and it worked quite well for me:

The sizing and spacing is also pretty on-point.

[vvaroczii]

@domhnallohanlon I am unable to delete Screen 1, I get a blank screen and on refresh the screen is back.

On import I get the below.

Should me

[vvaroczii]

Thanks @codeswept unfortunately I dont get the same result but hopeful that this will be resolved.

[domhnallohanlon]

@vvaroczii

on refresh the screen is back

Can you try importing before you refresh the page?

What does the alignment look like when you preview your app?

The only issues I can see are the icons at the top of the screen - right?

For the “My profile” and job title labels can you set the text alignment to left?

[vvaroczii]

Icons displayed incorrectly, the line wasnt imported, some of the labels have been resized…
Also I have noticed when I link a block to a component e.g. on click action to a card, in the companion app the card is invisible…

[domhnallohanlon]

@vvaroczii

the line wasnt imported

Does it appear in your component tree?

[vvaroczii]

Nope.

[vvaroczii]

[domhnallohanlon]

@domhnallohanlon

if not please PM me your Figma file

Can you PM me your Figma file so please?

[domhnallohanlon]

Getting there @vvaroczii!

[vvaroczii]

Oh nice!!!

[nchila2p]

Hi @domhnallohanlon hope you well!

I am experiencing a very similar issue to @vvaroczii, would you be able to assist in the same way through PM? Would greatly appreciate the help!

Thank you!

[domhnallohanlon]

@tatiang

I’d love to see a proper tutorial on how to do this well.

Thanks for the feedback @tatiang - I’ve got one in the works, will share with you directly before publishing!

---

@vvaroczii

Oh nice!!!

Thanks @vvaroczii, glad you like it. Were you able to get this published in the end?

---

@nchila2p

would you be able to assist in the same way through PM?

Just seeing this question now @nchila2p - what sort of app are you working on? Can you post about it here so that we can all learn together?

Thanks!