- 40
- 177 842
Studio XD
เข้าร่วมเมื่อ 12 ส.ค. 2023
Hey there ! I'm Hamza and I'm a Mobile app Developer and a User Interface Designer. In this Channel you'll learn stuff related to Figma for UI/UX and Flutter for Mobile app development.
Create a Button with Hover Effect in Figma | 2 Minutes Figma Tutorial
In this Video, I'll show you how you can make a Hover effect animation in Figma.
Make sure to leave a like and subscribe for more content like this.
Make sure to leave a like and subscribe for more content like this.
มุมมอง: 111
วีดีโอ
How to Use Circle Avatar Widget in Flutter | 5 Minutes Flutter Guide
มุมมอง 95หลายเดือนก่อน
Hey guys ! In this video I'll show you how you can use Circle Avatar in Flutter. Source File: bit.ly/4e43pqs
How to make an Interactive Accordion Menu | 5 Minutes Figma Tutorial
มุมมอง 96หลายเดือนก่อน
Hey guys ! In this video I'll show you how you can make an Interactive Accordion. Source File : bit.ly/4dGSH9b
How to Make Button Controlled Photo Carousal in Figma | 6 Minutes Figma Tutorial
มุมมอง 291หลายเดือนก่อน
In this Video I'll show you how you can make Button Controlled Carousal in Figma. Source File: bit.ly/4gZjiRO
Interactive Selectable Options Button in Figma | 5 Minutes Figma Tutorial
มุมมอง 117หลายเดือนก่อน
Hey guys ! In this video, I'll show how you can make selectable interactive buttons. Source File: bit.ly/4evw4FT
How to Design Animated Splash Screen in Figma | 4 Minutes Figma Tutorial
มุมมอง 144หลายเดือนก่อน
Hey guys ! In this video I'll show you how you can make an animated Splash Screen in Figma. Like & Subscribe if you want more content like this. Thanks !!!
Drawer Widget Guide for Beginners in Flutter | 8 Minutes Flutter Tutorial
มุมมอง 572 หลายเดือนก่อน
Hey guys ! In this video we learned how you can implement a drawer widget in Flutter. Source Code: bit.ly/3YkKYbi
App Bar Widget Guide for Beginners in Flutter | 5 Minutes Flutter Guide
มุมมอง 442 หลายเดือนก่อน
Hey guys ! In this video I'll show you basics of app bar in flutter. Like and Subscribe for more. Source Code: bit.ly/40kitNp
How to Display / Access Images in Flutter | 2 Minutes Flutter Tutorial
มุมมอง 502 หลายเดือนก่อน
Hey guys ! In this Video I'll show you how You can Display images or access them from a path in flutter. Make sure to Like and Subscribe if You're new for more content like this.
Use Custom External Fonts in Flutter | Flutter Tutorial
มุมมอง 513 หลายเดือนก่อน
Hey Guys ! In this Video, I'll be showing you how you can use external fonts in flutter code.
How to Make Slide to Confirm Interactive Button in Figma | 3 Minutes Figma Tutorial
มุมมอง 1.7K3 หลายเดือนก่อน
Hey guys ! In this video I'll show you how you can make a Slide to Confirm Button. Link to Source File: bit.ly/3AdHTl2
Make SWIPE to Delete Interactive Button in Figma | 3 Minutes Figma Tutorial
มุมมอง 5673 หลายเดือนก่อน
Hey Guys ! In this video I'll show you how you can make Swipe to Delete Interactive Button in Figma. Like & Subscribe for more content. Link to the file in this Video: bit.ly/46wqBM9
How to Create Swipeable Carousal in Figma | 6 Minutes Figma Tutorial
มุมมอง 4495 หลายเดือนก่อน
Hey guys ! In this video I'll show you how you can make swipe carousal in figma. Make sure to leave a Like and Subscribe for more content like this.
How to make a Typing Indicator Animation in Figma | 3 Minutes Figma Tutorial
มุมมอง 2735 หลายเดือนก่อน
How to make a Typing Indicator Animation in Figma | 3 Minutes Figma Tutorial
How to make Login Screen Slide Animation in Figma | 7 Minutes Figma Tutorial
มุมมอง 3775 หลายเดือนก่อน
How to make Login Screen Slide Animation in Figma | 7 Minutes Figma Tutorial
How to Make Hide/Show Password Interaction in Figma | 3 Minutes Figma Tutorial
มุมมอง 1K5 หลายเดือนก่อน
How to Make Hide/Show Password Interaction in Figma | 3 Minutes Figma Tutorial
How to make Card Flipping Animation in Figma | 3 Minutes Figma Turorial
มุมมอง 3K6 หลายเดือนก่อน
How to make Card Flipping Animation in Figma | 3 Minutes Figma Turorial
How to make a Vertical Scrollable List in Figma | 3 Minutes Figma Tutorial
มุมมอง 1.7K6 หลายเดือนก่อน
How to make a Vertical Scrollable List in Figma | 3 Minutes Figma Tutorial
How to make RGB / Animated Loading Bar in Figma | 3 Minute Figma Tutorial
มุมมอง 8198 หลายเดือนก่อน
How to make RGB / Animated Loading Bar in Figma | 3 Minute Figma Tutorial
How to make Marquee / Text Slide Animation in Figma | 3 Minutes Figma Tutorial
มุมมอง 9478 หลายเดือนก่อน
How to make Marquee / Text Slide Animation in Figma | 3 Minutes Figma Tutorial
Correct way to Design Vertical Scroll Screen | 2 Minutes Figma Tutorial
มุมมอง 4558 หลายเดือนก่อน
Correct way to Design Vertical Scroll Screen | 2 Minutes Figma Tutorial
How to Horizontal Scroll in Figma Design | 1 Minute Figma Tutorial
มุมมอง 5588 หลายเดือนก่อน
How to Horizontal Scroll in Figma Design | 1 Minute Figma Tutorial
How to Make Automatic Photo Carousel in Figma | 3 Minutes Figma Tutorial
มุมมอง 114K9 หลายเดือนก่อน
How to Make Automatic Photo Carousel in Figma | 3 Minutes Figma Tutorial
How to Design Circular Ring Animation in Figma | 3 Minutes Figma Tutorial
มุมมอง 4529 หลายเดือนก่อน
How to Design Circular Ring Animation in Figma | 3 Minutes Figma Tutorial
How to make Radio Wave/Pulsing Animation in Figma | 3 Minutes Figma Tutorial
มุมมอง 8639 หลายเดือนก่อน
How to make Radio Wave/Pulsing Animation in Figma | 3 Minutes Figma Tutorial
How to make Skeleton Loading Animation in Figma | 4 Minute Figma Tutorial
มุมมอง 6359 หลายเดือนก่อน
How to make Skeleton Loading Animation in Figma | 4 Minute Figma Tutorial
How to Export PNG or PDF file from Figma | 2 Minutes Figma Tutorial
มุมมอง 24510 หลายเดือนก่อน
How to Export PNG or PDF file from Figma | 2 Minutes Figma Tutorial
How to make Neon Text in Figma | 1 Minute Figma Tutorial
มุมมอง 30610 หลายเดือนก่อน
How to make Neon Text in Figma | 1 Minute Figma Tutorial
How to make dotted line pattern in Figma | 1 Minute Figma Tutorial
มุมมอง 2.7K10 หลายเดือนก่อน
How to make dotted line pattern in Figma | 1 Minute Figma Tutorial
How to Import Export Figma Files Locally | 1 Minute Figma Tutorial
มุมมอง 1.9Kปีที่แล้ว
How to Import Export Figma Files Locally | 1 Minute Figma Tutorial
by far the easiest tutorial to follow. Good Job!
thank you, easy, short to understand
how to text into it?
i cant use the change to option any ideas why?
You need to make sure you Combine your components. First make your frame into components then select all and click "Combine components" The UI of Figma has changed after the update so you'll have to look for the option on right side.
thanks bro
You're the best Figma teacher. Thank you. Have a good one!
Thank you so much. you made my day!
Thanks, I'm glad to help
thanks its work!
Thanks!
On creating the blinker point, what did click after clicking create component? It made a default and a variant 2
Select variant 2 from layers and decrease it's visibility to 0% then prototype to make it blink.
can we make this for for options?
@@aneelafarooqi9984 Yes by using similar method you can customize it and use for options.
😊
Simple and quick tutorial. None of the other long videos helped but this video helped me. Thank you
I'm glad to help you, thanks
you are great i was stuck from more than 6 hours
Thank you, I'm glad to help
how to duplicate thse form idk how you did it
You can either copy paste it or drag the form while pressing Alt key.
@@studio_xd i did it, thank you sir
will it open the keyboard
No this tutorial is a figma design design for the form field, no coding is involved in it.
Good
Also Make a video on how to make it functional
Will definitely make an updated version, Thank You for the feedback
Is it possible to make an endless carousel, but in such a way that when you hover the mouse over a photo, it stops?
Yes you can do that by using variables. You need to create placeholder component for each image.
@@studio_xd Thank you for your answer! It sounds difficult 🤯 Maybe you can make a tutorial or know of another one to watch?😭
@@snowycrunch016 Thank You, Will definitely make a video on it soon.
Clear, short, simple to understand! Thank you!
thankyou!!!
i did this exactly the same and it did not work why :(
It’s cool but I feel u should add some explanation
Good
Nice^ For 1 state...
Thanks Its work!'
THANK YOU SO MUCH!!!
hello is to be much easy ha
Muchas Gracias Senior
Спасибо большое
@@re_anna Спасибо большое
How you are moving the Ecilipse and icon not using auto layout?
@@foyzulhasan4242 Auto layout is not required to move or animate anything, it's just a good way to make responsive designs that adopts to different screen sizes.
Good work
Hi, this was great, but I followed the steps to the detail and it doesn't work when I try to Preview. Any idea of what could be happening?
same I got the same problem
Try to place all elements in a frame too.
Thanks 💜💜💜
ctrl key?
I'm sorry for not mentioning, Ctrl is Control Key for Windows and Command for Mac
thank you for the tutorial!
is there a way we can control the direction of the flow?? like instead of going to left, it's going to be on the right side?
Yes, All you have to do is to place the images on the left side (like we placed in this video on the right side) Do the prototyping and it'll go to right side from left.
We can use instant option instead of Smart Animate for transition from frame 4 to 1 this will resolve the issue of opposite direction flow.
I watched countless complicated videos to learn about radio buttons, but this one is by far the simplest. Please create more videos on Figma essentials and fundamentals!
Really glad to help you and will definitely make more tutorials for essential stuff. Thanks
I agree
Nice
Nice Carry on
Whoo❤
hi! it doesn't flip for me, just eases in/out. how can i fix this? thanks!
Hi ! I've attached the source file of the card I made in this video, in the description. Unfortunately I can't quiet tell what went wrong for you without looking into your file so please compare my file with your. Hope it'll help you figure out the issue. Thanks
Gracias ♥
Super helpful! Tysm
Gracias, fue muy funcional para mí. Era justo lo que bucaba.
De nada, estaré feliz de poder ayudar.
Once I run animation in preview mode the component won't automatically work. I've completed the other steps. Just don't know what i'm doing wrong. Can you help?
Does it work at all ? By clicking or it doesn't responds ?
@@studio_xd Dose not respond
I just got it to work. I then added it to my wireframe, and it dose not work again.
ok. I deleted the frame and re-installed the instance. Works now. thanks for responding and the video!
How do you make the carousel continue from the 1st picture, instead of it going back to the left, continue right?
To start the Carousal from the 1st picture instead of going to it from the last picture from left to right. You need to select the prototype settings of last image and set the animation to Instant instead of Smart Animation. Then the carousal will continue from 1st picture instead of going to itm
I love this! thanks
Muy útil gracias ❤
Vgood❤❤❤