Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

Another quick Figma tutorial to create this animation using variable and conditions 🥤. Small video to create this included. And get the code cheatsheet shared below. ✨

realvjy's profile picture

vijay verma

35,652 subscribers

139,393 görüntüleme • 2 yıl önce •via X (Twitter)

Bilim & Teknoloji
LIVE

Anya Rossi• Live Now

Private livecam show

11 Yorum

vijay verma profil fotoğrafı
vijay verma2 yıl önce

Grab this code cheat sheet with all variables and conditions.

vijay verma profil fotoğrafı
vijay verma2 yıl önce

Thanks! Keep tuning for more experiments. Let me know if you have any query. Till then keep designing/creating/sharing whatever you like 🙌

vijay verma profil fotoğrafı
vijay verma2 yıl önce

Here other similar tutorial

Figma profil fotoğrafı
Figma2 yıl önce

@realvjy you never cease to amaze us 🤩

vijay verma profil fotoğrafı
vijay verma2 yıl önce

Figma and me

Pablo Paredes profil fotoğrafı
Pablo Paredes2 yıl önce

@figma After many trials and fails, I finally made it 🙌

Miggi from Figgi profil fotoğrafı
Miggi from Figgi2 yıl önce

@figma Wizard! 🧙🏽

vijay verma profil fotoğrafı
vijay verma2 yıl önce

@figma 🫶

vaibhav aggarwal profil fotoğrafı
vaibhav aggarwal2 yıl önce

@figma Will try to create more new stuff using variables, but this is so cool🙌

˗ˏˋ vyshnav ˊˎ˗ profil fotoğrafı
˗ˏˋ vyshnav ˊˎ˗2 yıl önce

@figma This is cool. I’m going to try it! 🤝

vijay verma profil fotoğrafı
vijay verma2 yıl önce

@figma Great! Love to see what you make 🥤

Benzer Videolar

Hey 👋 designers, Here’s a quick tutorial on how to create light and dark mode designs in Figma using the color variable system. Retweet and Share with your fellow designers.
1:24

Hey 👋 designers, Here’s a quick tutorial on how to create light and dark mode designs in Figma using the color variable system. Retweet and Share with your fellow designers.

UxUi.Tega

12,043 görüntüleme • 11 ay önce

It’s Figma fun day - Here's a quick tutorial demo for smart use case of the new variable updates. Created a smart segment control button and it’s so intelligent. Also shared cheatsheet for all variables below. Enjoy 🤩
1:34

It’s Figma fun day - Here's a quick tutorial demo for smart use case of the new variable updates. Created a smart segment control button and it’s so intelligent. Also shared cheatsheet for all variables below. Enjoy 🤩

vijay verma

97,493 görüntüleme • 2 yıl önce

With new Figma variables. We can create any number of flow using conditions on a single frame. Testing a free flow character movement. Also tried to detect object and it worked. Small demo for something big we can create. Shared some logics below 🤩
0:34

With new Figma variables. We can create any number of flow using conditions on a single frame. Testing a free flow character movement. Also tried to detect object and it worked. Small demo for something big we can create. Shared some logics below 🤩

vijay verma

381,273 görüntüleme • 2 yıl önce

Use Create an Animation to bring your lessons to life! ✨Here's a short tutorial to get you started. 👇
0:57

Use Create an Animation to bring your lessons to life! ✨Here's a short tutorial to get you started. 👇

Canva Education

157,285 görüntüleme • 3 yıl önce

TUTORIAL: create shimmering SVG paths in Framer without any code. comment “SVG” and i’ll send this to you for free.
0:30

TUTORIAL: create shimmering SVG paths in Framer without any code. comment “SVG” and i’ll send this to you for free.

Framer University

25,570 görüntüleme • 1 yıl önce

They went on to create two more pieces of test footage using this animation and effects technique.
1:07

They went on to create two more pieces of test footage using this animation and effects technique.

SEGA Informant

651,581 görüntüleme • 11 ay önce

In today's tutorial, you can learn how to make an interactive vibrant card animation in Rive. By following this technique, you can create reusable component and bring the same nice effect on cards on your site. Send me DM or reply in the comments to get Figma + Rive file.
3:23

In today's tutorial, you can learn how to make an interactive vibrant card animation in Rive. By following this technique, you can create reusable component and bring the same nice effect on cards on your site. Send me DM or reply in the comments to get Figma + Rive file.

Alex Barashkov

51,172 görüntüleme • 2 yıl önce

How to Create Viral Al Story Videos That Keep People Watching (Complete Al Film Tutorial) This information is for both new and existing creators on YouTube, learn and implement. I have also shared free tools you can use to create this videos, check the video segment. Like, Retweet and Bookmark. Follow me BIG CHRIS
15:15

How to Create Viral Al Story Videos That Keep People Watching (Complete Al Film Tutorial) This information is for both new and existing creators on YouTube, learn and implement. I have also shared free tools you can use to create this videos, check the video segment. Like, Retweet and Bookmark. Follow me BIG CHRIS

BIG CHRIS

23,677 görüntüleme • 1 ay önce

If you're using Claude Code, but haven't started using Skills... you need to get on it NOW I built 2 skills: - Nano Banana Pro - Three.js Used them to create this AI app that takes my picture and creates interactive 3d greeting cards Full video tutorial landing tomorrow! Just in time for Christmas!
0:22

If you're using Claude Code, but haven't started using Skills... you need to get on it NOW I built 2 skills: - Nano Banana Pro - Three.js Used them to create this AI app that takes my picture and creates interactive 3d greeting cards Full video tutorial landing tomorrow! Just in time for Christmas!

Chong-U

238,750 görüntüleme • 5 ay önce

You can make your Figma designs functional with Claude AI Select component, go to Dev Mode and use Figma to Code plugin to turn to React/Tailwind. Copy the code and paste to Claude AI. Prompt "Create this component and center it". Then, "Make this functional", "Add rounded corners", "add hover states", "animate transitions". Don't forget to ask "always give full code". Otherwise, it might break the Artifact.
6:06

You can make your Figma designs functional with Claude AI Select component, go to Dev Mode and use Figma to Code plugin to turn to React/Tailwind. Copy the code and paste to Claude AI. Prompt "Create this component and center it". Then, "Make this functional", "Add rounded corners", "add hover states", "animate transitions". Don't forget to ask "always give full code". Otherwise, it might break the Artifact.

Meng To

171,513 görüntüleme • 1 yıl önce

If you want to create more delicious milk 🥛, Friend of Dorothy Supplements has the answer 👌 ~~~~~~~~~~~~~~~~~~~~~~~~ -You can get yours here: and using this code you get a discount : Chriscosplay_10%
0:20

If you want to create more delicious milk 🥛, Friend of Dorothy Supplements has the answer 👌 ~~~~~~~~~~~~~~~~~~~~~~~~ -You can get yours here: and using this code you get a discount : Chriscosplay_10%

Bull Sada

17,992 görüntüleme • 1 yıl önce

DIY tutorial - How to create an animation board!!!
4:15

DIY tutorial - How to create an animation board!!!

Tlauz - Animation course!!

871,046 görüntüleme • 9 ay önce

A quick tutorial on using the Figma MCP server with Windsurf!
3:03

A quick tutorial on using the Figma MCP server with Windsurf!

Windsurf

113,151 görüntüleme • 1 yıl önce

Quick Maya animation tip on how to use Animation Layers to create transition animations for games. Link to full video in comments. #animation #animator #3d #3dart #maya #gamedev #walkcycle #tutorial #howto #cg #cgi #vfx #3danimation
1:33

Quick Maya animation tip on how to use Animation Layers to create transition animations for games. Link to full video in comments. #animation #animator #3d #3dart #maya #gamedev #walkcycle #tutorial #howto #cg #cgi #vfx #3danimation

Mark Masters

32,090 görüntüleme • 2 yıl önce

How to create the viral celebrity selfie trend using AI — from image to video. Quick breakdown: •
1:01

How to create the viral celebrity selfie trend using AI — from image to video. Quick breakdown: •

Inspirenaire

45,578 görüntüleme • 5 ay önce

How to create this bullet time effect with higgsfield. ai here is a quick tutorial sc ig/kayo
0:48

How to create this bullet time effect with higgsfield. ai here is a quick tutorial sc ig/kayo

Laurent Correia Bill

30,140 görüntüleme • 7 ay önce

✜ After completing the above step, proceed to create your workspace. ✜ Open the source code, as shown in the video below and click "Create a working copy" ✜ Next, click "Save" and name your workspace.
0:23

✜ After completing the above step, proceed to create your workspace. ✜ Open the source code, as shown in the video below and click "Create a working copy" ✜ Next, click "Save" and name your workspace.

ᴛʀᴀᴄᴇʀ

27,010 görüntüleme • 1 yıl önce

Say hello (again) to Figma Weave. Build workflows to create and edit images, video, 3D, and more. As we work on bringing Weave to the Figma canvas, what are some things you want to see?
0:32

Say hello (again) to Figma Weave. Build workflows to create and edit images, video, 3D, and more. As we work on bringing Weave to the Figma canvas, what are some things you want to see?

Figma

323,580 görüntüleme • 1 ay önce

Here the tutorial video on how I made this falling coin Animation in figma. I hope this helps.
3:32

Here the tutorial video on how I made this falling coin Animation in figma. I hope this helps.

Khlaseek designer

29,831 görüntüleme • 12 gün önce

Pojoquiet shared a quick tutorial showing a simple trick they often use to create sci-fi textures in Blender. See more:
1:33

Pojoquiet shared a quick tutorial showing a simple trick they often use to create sci-fi textures in Blender. See more:

Jettelly Inc.

14,839 görüntüleme • 5 ay önce