Creating parallax with variables - Figma tutorial

[@haythamwali6642]

I'm convinced you are a wizard.

[@soumilkumar]

Love the fact that we can learn and access the Figma file as well! Thanks for the amazing efforts and videos! You've got a subscriber :)

[@jessicalima1807]

Not often I comment on videos, but I'm doing it here so more people can watch this one. Amazing tutorial, truly. Thank you for sharing your knowledge. Just subscribed to your channel.

[@doubleglitch]

That's very nice of you to say, thank you!

[@fopesanchezebhota713]

Now this is absolutely sweeeettttt. Never thought it'd be possible. But this right here? Genius!!!

[@thiagotorelli2283]

WOW! Dude! This is INSANE! When I read the title of the video and saw the thubnail, the only thought in my mind was "IN FIGMA?!?! THE FUCK?!?!". Amazing video! Congrats

[@doubleglitch]

Thanks! Stick around, there's more to come

[@MariusLeica]

This video is amazing! It's realy show your skills and knowledge of figma. Thank you very much for your work and I really hope you can make more of this in the future!

[@kikuru3]

crazy stuff, what a king you are!

[@annacgfx]

Amazing tutorial. Thank you!

[@kraucifer]

Снимаю перед тобой шляпу, это очень крутая огромная и крутая работа.

[@Crab_Cyborg]

+

[@kraucifer]

Сори что на русском, я не из рф, но в целом из снг, другого языка к сожалению не знаю, но через гугл переводчик переводить грубовато. В целом даже если ты не оценишь моё мнение, чел ты правда крут ❤

[@anmoljuneja145]

Superb! Loved each second of the video

[@amer4716]

Man thank you so much for the effort, i'm sure you heard about Framer, can you release a video about how we can do the same thing in Framer?

[@pheeh9]

Дуже круто, я б навіть сказав ахуєнно! Awesome stuff as allways! Thanks for sharing!

[@doubleglitch]

Дякую, пане!

[@uiuxshoaib]

Bro it went through me head :D But its awesome, I need to rewatch it.

[@nartinjo]

Dude you are a godsend

[@emmygraphics5741]

Love your video bro, please keep creating more

[@doubleglitch]

Working on it 🫡

[@gaman_look]

awesome!! figma master 🎉

[@KakashiMendu]

Got the sub and like bud ! Would love the follow up of breaking down the illustration for parallax

[@georgezorbas9036]

BRAVOOOOO! you are fantastic

[@saturnivideomaker8360]

WHAT THE HACK?????????? :D OH WOW, YOU'RE SO AMAZING DDDDDDDDD:

[@RajeshKumar-xj3gz]

Fabulous🔥

[@sevenson5112]

At the first time is scary to learn

[@DaveRowley-d4l]

lol this is bananas.

[@zt_design]

Super 🔥👍

[@DesignwithHuma]

wow

[@felix-ng1dl]

When you finished creating variables for X and Y, why didn't you show the results in the prototype? My response: The X cursor works well, but when you create a variable for the Y cursor, the X cursor does not work because the Y cursor covers the X cursor frame.

[@doubleglitch]

I understand why you feel so cautiously about that, there are a ton of fakes, but this is not one. You can just check the Figma Community file in the description and see for yourself, it's free. I'm using a hack I invented, it allows triggering several interactions simultaneously, so both X and Y work just fine

[@piotrgaska6442]

@@doubleglitch I have the same problem as @felix-ng1dl Any idea how to fix it? I can see it's working in your design but not in my case

[@helios1051]

this is blackmagic 🔥 with this mouse direction-aware technique, maybe there's a way to make working rotative buttons ? ...

[@doubleglitch]

You mean 3D or perspective rotation? That's definitely not possible, at least now, there's no 3D rotation functionality

[@helios1051]

@@doubleglitch no, more like the potentiometers you can find on a MIDI keyboard, I've never been able to make them work properly because you need to make a circular movement to make it turn, in both ways. I looked over the internet but it seems to be a big challenge and I didn't find anyone who managed to do it.

[@doubleglitch]

Ah I see, no, still impossible, there are simply no variable for the layer rotation. You can kinda fake it using two states with different angles and Smart animate on drag, but it will snap anything in between to these two states only

[@AarRaeidulAhsan]

insane

[@VinitShimpi-qx9zs]

why not to use spline then ?

[@bharathmks7347]

🎉 nice

[@daru4]

개쩐다

[@felix-ng1dl]

me Again, not all UIUXs understand the instructions you make, they will comment that cursor X can work well, but when cursor Y is created, cursor not all uiux can find out where the problem is.. for me, X and Y won't work at the same time because in your video you made the X frame an autolayout, and in the figma file you didn't explain step by step I'm not trying to say you're wrong or anything, as a uiux I'm trying to find a way why this can't work and indeed I checked there was an error in the video you made. If others follow your video instructions then they will be just as confused as to why X and Y can't work at the same time. my answer is because in your video frame X you create autolayout

[@felix-ng1dl]

but, again. you r amazing , smart i just respect, not all uiux can't make animation and figure out the case

[@piotrgaska6442]

Thanks man. I was getting frustrated. Yes, as you wrote, no auto layout fix the problem

[@mojito1216]

Can you please continue 😢

[@clipsdestroyer18]

Great tutorial man, i love it. can u show how to generate the image for parallax effect?

[@doubleglitch]

On it!

[@shifatmasud]

❤

[@k16e]

Tedious. But, fun. Maybe?

[@doubleglitch]

Yea, a bit of both. Or you can just download the file in the description 🙂

[@glagraphy6533]

can we implement this on framer? :)

[@doubleglitch]

Not without custom code I think

[@glagraphy6533]

@@doubleglitch okey thanks!

[@davidfitcher2953]

How to deliberately waste time

[@doubleglitch]

Well, there's the file, so you don't have to

[@davidfitcher2953]

@@doubleglitch Thanks!!!