UI Components from Figma to Composable Functions - Introducing with Relay

✨Get Figma:
psxid.figma.com/fu4217nukuan
In this video I'm going to introduce you with Relay! A new way of converting your UI Design from Figma to Android Studio in a form of Composable Functions. Amazing right? Watch the video until the end! Enjoy! :)
🌟Figma Course (My Platform): stevdza-san.com/p/one-and-onl...
🌟Figma Course (Udemy): www.udemy.com/course/one-only...
⌚Timestamps
0:00 - Introduction
1:45 - Figma Setup
5:39 - Android Studio Setup
7:00 - Add Figma Access Token
8:57 - Import UI Packages
11:13 - Inspect Composable Functions
16:16 - Run the App
17:31 - Update UI Packages
19:40 - Conclusion

[@maksiksq]

That's insane. I'm just starting developing in Android Studio and this makes everything so simple. The docs didn't mention some details and this video helped me set everything up, thanks!

[@Minc-sq6mh]

Just read that on the Android blogs and here u go u already have a video about that. Thanks man

[@StevdzaSan]

I'm quck ⚡️

[@VINITJACOB]

THANK YOU....JOINED UR FIGMA ON UDEMY..UR GIFTED INSTRUCTOR

[@DahabJr]

This is awesome, finally Android Studio guy's did something we really need it, thank you sir .

[@StevdzaSan]

We've been waiting this one for years. Thanks! :)

[@zakishaikh2223]

This is what I was waiting for since it was in Alpha thanks.

[@StevdzaSan]

It's still in alpha tho

[@vengateshm2122]

Dev summit was nice. Thanks for elaborated video on Relay.

[@vengateshm2122]

Kindly create video on custom layouts in compose with an example

[@PedroBarbosaRoman]

This is great! The android ecosystem is finally catching up with the web in terms of tooling and paradigms

[@StevdzaSan]

With each year it's getting better

[@enikebraimoh]

thank you very much for sharing stev, this is really awesome... i know this still inn alpha tho... but honestly the setup and update process are really hectic 😅, i can't imaging going back and forth like this just to update a composable... but i know things would definatly change in the future❤

[@StevdzaSan]

The setup part is a little bit tedious at the beginning, but once you install all those things, it gets easiler. But yeah, it's still in Alpha, and there will definitely be improvements in the future. 😊

[@dharamveermithileshgupta2358]

FInally something good happening on Android development ecosystem 🌟.

[@YazdanQezelbash]

Thank you very much ❤❤❤❤

[@mhdanwar]

This is great. Tried after ADS.

[@sidx45]

lol of course they come out with this as Im finishing my pain in the ass to build custom plug-in to export my UI designs into code... Anyowho, looks great

[@user-cb2bx3eb9i]

Thank you stev. I wanna use relay plugin but i have problem when i using material3 in android project. Do you have any solution?

[@jopadjr]

182nd...Thanks. I have a few subscription on your Udemy courses. Great, great. Will definitely buy your new course.

[@yousefreda9984]

what if I can not click at Create UI Package in the relay plugin at Figma.

[@slcsb116]

Awsome

[@stepbroimstuck6715]

This thing generated a kotlin file for the cards thing you said, is it possible to generate it in java??

[@khaled.noordin]

Great content thanks

[@StevdzaSan]

Enjoy buddy

[@shivyatripathi4192]

In my case the preview in android is coming very unexpected , like texts are distorted , some components are not visible , can you please help, I'm trying since very long

[@Allrounder.00007]

How do we start android development, should we start with compose first or non compose..

[@StevdzaSan]

Compose definitely ✅️

[@ryukz8453]

What if I want make a list of cards with lazy column?

[@StevdzaSan]

Just just create one card, and then import it in Android Studio.

[@map5569]

Do you know what could be the reason that the "Create UI Package" button looks disabled to me?

[@StevdzaSan]

You need to select the component which you want to package.

[@shahar19971]

happen also in my figma, any ideas?

[@StevdzaSan]

@@shahar19971 Select the MainActivity and then click that option.

[@pavlo1374]

Please upload a new video on Relay

[@toystoryscarymovie-forkids3323]

complex process! would be easier to design directly with android studio

[@StevdzaSan]

The setup process is done once. After that it's easy.

[@richashah1996]

not able to generate compose classes after all steps as defined

[@StevdzaSan]

You may have forgot to click that green hammer button on the top?

[@richashah1996]

@@StevdzaSan my files now get generated but it comes with generated folder not as your in debug folder. Any workaround for that?

[@StevdzaSan]

@@richashah1996 You also get some additional composables besides the main component, that's normal.

[@smitdubey8333]

Converting SVG files: Exception Converting SVG resources does anyone has idea how to solve this error while generating build codes

[@itsfela]

F0cking same

[@angaar222]

Sir is it for xml too?

[@StevdzaSan]

Nope. Compose only. Check my website if you wanna learn a modern Android Development with Jetpack Compose: stevdza-san.com ✅️

[@robertfontaine3650]

A year later is anyone using this. Seems like a really nice idea but I am only seeing trivial examples and no discussion of the tool since all the hype a year ago.

[@7xFuryPlayz]

this whole bunch of code is just to create a cardView with , two textViews -_- with old xml you can create it easily , then whats the advantage of using compose over xml , -_- , some says compose is reuseable, , then xml is not reuseable??, , xml is also reuseable , you can use one layout whereever you want to use withing your project -_-

[@costube9574]

This is nice. But, if we have the UI for both light mode and night mode, then how will we properly import the ui on android studio?

[@StevdzaSan]

Will do a video about that. 👍

[@dnyaneshwardalvi5793]

How to fix this error - Converting SVG files: Exception running shell command '/Users/dnyaneshwardalvi/Downloads/HelloFigma/app/build/tmp/com.google.relay/0.3.00/vd-tool/bin/vd-tool'

[@glebdolskiy]

It didn't works. In build.gradle I get No value passed for parameter 'id' and even 4 errors. In the video all plugins starts from id but I created empty Compose project and all plugins has another view: alias(libs.plugins.com.android.application). Okay, I wrote alias(libs.plugins.com.google.relay) and got Unresolved reference: google. WTF?

[@YazdanQezelbash]

Thank you very much ❤❤❤❤