⚡Make a Professional Website UI Design in Figma - Figma Tutorial (Hindi)
👉 Register for UI/UX Design workshop for FREE: web.growthschool.io/DND
👉 100% Discount for first 100 people 🔥
👉 Become the top 1% by learning and increasing your earning potential 🔥
Hey everyone in this Figma tutorial we will learn to create a clean and fresh website UI design in Figma I will take you over each and every step in detail so sit back and enjoy and get ready to learn something new today!
⚡Download Figma for Free: psxid.figma.com/bpmjxc
⚡Learn Figma in 20min: kzread.info/dash/bejne/eKyOqK2Ml9PLcsY.html
✨Download Free Project File - rb.gy/w7w2v
🎁My Transitions Pack:
(Indian Users) - www.dopemotions.com/product-page/content-creator-bundle
(Foreign Users) - dopemotions.gumroad.com/l/contentcreatorbundlev1
--
🔵Other Helpful Figma Tutorials:
10 Tips to work 10X Faster in Figma: kzread.info/dash/bejne/YmGZztqjlazNgtI.html
Design Beautiful Websites in Figma with These UI Tips: kzread.info/dash/bejne/aZl6xruGnJmZe7A.html
Figma UI Design Tutorial: kzread.info/dash/bejne/rKuiuKSuc9vOnpc.html
Figma Tutorial: Nike Website UI Design: kzread.info/dash/bejne/kZuMj86wqbCyp6w.html
Figma UI Design Tutorial: Website UI Design in Figma: kzread.info/dash/bejne/X6GWu6OjZcvcfNY.html
Create Frosted Glass Icons in Figma: kzread.info/dash/bejne/h6l-3MRrmc3bZrQ.html
🟢 My After Effects course is out now!
www.dopemotions.com/courses
--
▪️ Contact
For business, inquiries email me here: nikhil@dopemotions.com
Website: dopemotions.com
Thank you
#FREEworkshop #Growthschool #BecomeTop1%
Пікірлер: 184
👉 Join Growthschool workshops for FREE: web.growthschool.io/DND 👉 100% Discount for first 100 people (Reshare this with your friends who will need this ❤) 👉 Become the top 1% by learning and increasing your earning potential 🔥 🌟 Growthschool has already taught more than 800,000 students and helped thousands of learners to grow in their careers. ✅ Join the workshop today and start your journey to become top 1%
@rohit_vaishnav
9 ай бұрын
Facing submission error
@mjawwad073
8 ай бұрын
Nikhil Try to Make Tutorial on How to Make Wireframes in Figma or any UI Design Tool.
Kal mene apki figma wali saari playlist khatam ki or soch rha tha k ab dhoondo koi or designer jo or sikha sake thank god apki video agayi love you
You can do basic arithmetic operations(+, -, *, /) in text input boxes(height, width, x and y coordinate etc) in figma and to find center of a frame in figma just divide the corresponding measurement(height or width) by 2. I hope this helps people who are new to figma🙂
You Can try Pressing the Alt Key while selecting the frame/box etc. and hover the mouse cursor to know the pixel distance.
Bohot bohot cool lagta hai aapke tutorials follow karke ...I have created few stylish projects applying your methods ... and that's it everything going great ❤😊😊thanks alot by the way may hamesha may aapke figma tutorials k liye wait karti hu ...kuch new project pay kaam karne k liye ...here aaj v may beth gayi 😂apko follow karke khudke idea lagake new kuch banane ka ... we all have fun while designing ❤🎉
Nikhil bro, except for the snapping or guide, I got a way out of your problem. To your problem create a horizontal straight line in Figma, first, press 'L' to activate the line tool. Then, while holding the SHIFT key, drag your mouse horizontally. After that, select both the frame and the line by clicking on the background frame in the layer panel while holding the control button. Finally, you can achieve center alignment by clicking on the "Center Align" option in the properties panel on the right side, or simply use the keyboard shortcut "Alt + V" for a quick center alignment.
To find Center, I mostly divide the width Or height by 2. suppose wdth is 1080, then I will write 1080/2 on width panel. Then it will automatically set it into half.
Great , I'm waiting for your more Figma content. Please add more to your Figma playlist, we will love it.
Impressive, I was waiting for you more figma content. Please add more to your Figma playlist, we will love it.
Really Excellent Tutorial Boss. May God Bless You ♥
Just use the layout grid section to make margins, rows or columns, that is a good design habit and of course you can also see the center point as well.
Thank you so much brother 🤗 Aap itna ache se explain karte ho Great 💯
This is an Amazing tutorial. I really appreciate your work. 👍
To find center there is red line suggestion center if we expand rectangle (make sure your snap is on)
Wonderful video , good quality, good content & love you Nikhil Dada ❤️❤️❤️
It really very helpful for Me.. thanx nikhil Bhai for this very knowledgeable video❤
thank you bhaiya aapki wajah se ab me figma achhe se use kar pa rahi hu
I've noticed you make a rectangle on text to make buttons instead select text and click shift+ A to make auto layout as frame you can adjust space between text and whole frame also, it will save a lot of time. And great design btw
@saamira86
6 ай бұрын
thanks, I must say I got to know something new today
For typography in ui design , aap 4 ya 5 ke multiplication use kar sakte hai bcs jo pixel grid use hoti hai wo always divided by 2 hoti hai in web and mobile both that's why , and try not to go below 16/14 , and for banner me Jo button hai you can try black button , because login and pre product seems same , I think one should have that attention to check the product , hope this helps ❤
@surajgupta6515
9 ай бұрын
honestly thoda complex lga.. though I'm new to ui ux but typography in general mere liye thoda nya h
Sir from where can we get the vector minimal images like the electric scooter in this project. Or how can we create such images. ?
Love ❤ this creative tutorial
Can you tell what type of glasses are you wearing in this video, name a specific model please? thanks in advance
Nice work, but there's a better way to design using Figma, especially when it comes to buttons, grids, and alignments. It makes a developer's life easier and improves the design process overall. Still, your content is great, and you've made smart choices with colors and contrast. Keep it up!
NICE TEACHING, THANKS A LOT
For center Select frame and rectangle And then go to auto layout Then wrap and align right
After long time figma but stillllllll osmmmmmmmm booom eye-catching 🔥🥵
What buttons u click to select the elements one by one
Got alot tips from yu 1) the shadow should not be totally black 2) the font size if Yu took 14 then the range is in even like 12 or 16 3) the style of font not more than 2 Thanks for the tips
Just do simple arithmetic here to find center (screen height/2). 4:36
Aap ko age kisi rectangle ka half janna hai to usko frame height se match krke uska height ko divide 2 kr shakte ho. jaise 982 hai idhar to udhar aap direct likhdo 982/2. Vo automatic half calculate krlega.
Bro you can use layout grid (rows or columns ) to find center
Kuch raham karo Frontend Developer par😂
@NasrinSultanaLipi-yh6vq
2 ай бұрын
😂
@Travelsandmore407
Ай бұрын
Frontend developer chor ho gaye h 😅😅😅 isliye ye ho raha h
@sanjeevgupta9472
22 күн бұрын
UiUx designer hi front end wale ko design banake deta hai taki vo systematically develop kre website ko.
@muzammalrana571
10 күн бұрын
Bhai developement chor k designer e bn jaty
It is very asthetic no doubt. But is it practically user friendly or not? Suppose when it will practically be implemented how it will look in mobile version?
bro from where we could find images which you are using in figma projects?
aap project banane k liye kon c side use karte hai ?
4:48 you can directly do calculation where inputs the dimension ✌✌
bro where you got that scooter componenet
how can i downlaod that scooter image like what these type of images are called??
Aur intro mast lagta hai .. I do vibe with this
Bhai kya baat h kya clear sumjatay ho Thankyou so much bhai or bhai mujay basic se figma ki vedio dekhni h apko to kese dekhu
Last me jo shadow diya ye shadow browser me kaise dikhega? Browser me to sirf frame k andar k elements dikhega
Sir apne " Iconsax Icon Setby Iconduck" ye plugin kese run kiya plz Btado SIr
Thank you so much sir, this video is really helpful to me 😊 , I saw your video for the first time and after 5 minutes I subscribed to your channel., again thank you sir, I request you sir, make more videos about UI design, figma tips, idea, color theory and more... 😊
is project me jo iner circle h wo Main Rectangle k andr kaisy krna h ?
@NikhilPawarr to know the centre, see the height of the frame, eg here the frame is of 982, So now select the rectangle and put height as 982/2 you will get the exact half the height as that of the frame
Awesome bro .... bro ye logo or scooter wali image kaha se li apne ?
Where can we get these types of vectors from sir Nikhil?
Sir, graphic designer ke liye laptop kon sa acha hoga, 35,000 ke budget mein
Sir how to download and where to download this bike type 3d images ya components object's?
Where do you get these high quality graphics, illustrations and images?
A Lot Helpful Videos
I've problem with opening the project file could you tell me how to do that
bhaiya aapne jo electric scooter ki picture lagayi hai esi tarah ke picturs hame kahan se mil sakte hai
please upload more of these figma tutorial videos
i have downloaded project file but it is not working how to make it work, can u pls help me
Bhai plz muje koi batao ki me front language sikhu ya fir ui ux desginer
Sir hamne figma me design krna to sikh rahe hae or bht kuch aap ne sikhaya is ke liye thanks. But is ko kaise dilever krte hain or clint ko app me kaise dilever krte hae as a freelancer bataye
Bro teach us complete auto layout , responsive design too ❤
Hi bro I watched your video and copied your same design and modified it slightly for mobile. and thanks
Figma sirf framework aur design ke liye hai ya isko internet par post bhi kar sakte hai?
I built complete design watching the tutorial. I really enjoyed and learned a lot. thanks Nikhil
@NikhilPawarr
5 ай бұрын
Glad it helped
Thanks you vii❤
Nikhil, I have registred. why it is asking to use watsapp web?
Love From Bangladesh Sir ♥️
-20:24. Sir I am a student learning figma too. Here you asked how to get center. So there in the right panel's top there alignment options with that you can get center. At first i aslo get confused about center. I haven't telled fully
i have to learn graphics design.. Where should i join
Can you tell me the name of the bike?
How to use Figma design website in my shopify store?
Amazing !!
From where can we find such Scooter png from?
You can do math operations in figma so if the height is 860/2 figma will give you half. I learn after effects from your videos 😊 I have been a Designer for more than 8 years now. If anyone has questions around Visual Design I am available on adplist for mentorship sessions.
@QuantumCanvas07
5 ай бұрын
As a beginner web developer should I be moving to figma without making my raw CSS strong? It seems like it would take years but I get a lot of confidence after building projects from scratch.
Design wise its a great tut. But In the way you make it is not a right approach... For example the way you make menu and buttons is not a good way instead you can use auto layout feature of figma to make responsible buttons menus and even you can make the whole page responsive.. You are a great designer and I really like your videos ❤
where we find photo of your work which look great
Can you make a video on exporting this project as HTML and CSS?
hi used autolayout n constraints in design
Is there any job role in pigma
Nice design and good video.. Best wishes..
@NikhilPawarr
Ай бұрын
Thank you so much
good✨
Sir UI UX men grid system samjhaye. Alignment men problem ati hai decision kese lun Koe Kuch bol raha to koe Kuchh. Hm ap sy seekhna chahten hen.
Very Interesting design
Personal portfolio using figma plz. For backend developer
Is this responsive?
Can you give figma file of the same?
Hi Nikhil - your Vedio was knowledgeable- could you please provide one more Vedio on how to create a website with figma as we see on Pinterest it’s quite mesmerising- thanks
Intazar ki gadi Puri Hui🥺🔥
Hi nikhil bro aik video coffee poster pr bhi bnao figma mein jo k dekhny mein bohat amazing ho glassmorphism effect bhi use kiya ho us poster mein plz.
aesi images kha se download kre??
sir figma to learn kr liya but clients kase project deta h please tell me
i understand your lecture
Pls make more Figma tutorial and animation also
Bahut hi accha tha
It's not happening how you are coping the color code it's not happening in my figma the same problem also occurred before so give me some solution sir by the way you have amazing speaking sir and voice also awesome
Bhot piyara
bro when will you launch the after effcts pro course????????????????????????????????????
How to use this in website?
Sir koi figma par koi app kaa full project pe video banao pls ❤
Sir Figma banane ke baad usko website paar kaise laye?
@suryasahi9450
9 күн бұрын
Usko code karke
bhai yr figma me autoframe, variable, components ye sb ko kaise use krte hai... iska bhi video tutorial lao😇
Bhai figma prototype par bhi ak video bna do ❤
Amezing