How to Create Wireframes in Figma - Figma Tutorial 2023 from Beginner to Advance
Вставка
- Опубліковано 28 лип 2024
- In this video, I will show you how you can create wireframes in Figma as quickly as your practice.
This is the first episode in our Figma tutorial series from beginner to advance where you will learn everything about Figma and how you can start designing the easy and professional way!
TIMESTAMPS:
00:00 - Intro
00:22 - Why create wireframes?
02:10 - Get familiar with Figma interface
13:08 - Example wireframes I did
14:55 - Let's create basic wireframes in Figma
33:30 - Your assignment and join me in my Discord community
34:47 - What's next?
🔸 Next episode: How to Create a Moodboard in Figma • How to Create a Moodbo...
⏪ Previous episodes: How to Create a Systematic Design System • Video
Keep watching and don't forget to subscribe for upcoming videos!
🔴 Subscribe to my channel: / franzescolasticodesigns
🟣 Join EsCommunity Discord Server: / discord
🎥 MY FAVORITE UA-cam GEAR
Camera: shp.ee/bg32m23
Key Light: shp.ee/mbyn6xp
Softbox Kit: shp.ee/8z2nvh5
Softpanel Light: shope.ee/aypeeMeO
Smart RGB Light: shp.ee/yaugvjt
Camera Mic: shp.ee/wbw9qxj
Condenser Mic: shp.ee/6i86akr
Tripod: shp.ee/d9r9rkj
🖥 MY SETUP
Mac Mini M1 16GB: www.apple.com/ph/mac-mini/
Standing Desk: flexispot.ph/product/electric...
4K Monitor: shp.ee/p2a8n49
Extension Monitor: shp.ee/i6cmpje
Monitor Mount: shp.ee/kewundj
Monitor Light: shp.ee/k7knqp5
HD Webcam: shp.ee/sncbmxm
Mechanical Keyboard: shp.ee/5b7jzzm
Wireless Mouse: shp.ee/qaxndai
Speaker: shp.ee/w72sdwv
Headphone: shp.ee/8xitrkd
Earbuds: shp.ee/6xdhvw3
Desk Mat: shp.ee/5im85uh
USB Hub: shp.ee/ry9zvdv
Portable 1 TB SSD: shp.ee/s5r5wc2
Neon LED Sign: shope.ee/89wgYnjQye
🎶 MY FAVORITE SOUND: www.epidemicsound.com/referra...
🟣 LET'S CONNECT
Instagram: / franzescodesigns
TikTok: / franzescodesigns
Facebook: / franzescodesigns
DISCLAIMER
Some of the links in my video description are affiliate links, which means I will make a small commission if you click them and make a qualifying purchase, at no extra cost to you :)
#uiux #figmatutorial #figma #createwireframes
Very helpful Franz. Please continue the tutorial series. Thank You!❤
Glad it’s helpful! Thank you and yes, you can count on it! 🙌🏻🥳❤️
Thank you ma'am
this is helpful! thank you!
Glad it was helpful! 😍🥰
This is a very interesting and helpful series. Keep it coming 🙂
More to come! 🤓😎
Very helpful. :)
Glad it was helpful! 😍
Salamat sa video😊
My pleasure! ❤️😍
Waiting for a tutorial of creating simple design system master! 🔥
Lapit na! Stay tuned! 😎
Thank you for your very interesting topic about figma.. Sana po mapa dalas ung pag upload mo na kaka excite at ka abang abang ung vids mo idol franz
Aww thanks for your appreciation! 🥰 Yes yes, trying my best to upload weekly..hehe! 🤓🤩
Thanks for making this video Franz. I also love your Filipino accent. 😍 I have a question about creating wireframes for app UX/UI and even for the web in general. I used to create wireframes first for clients and then high-fidelity mock-ups.. But ever since I've used page builders such as Divi and Elementor which was 6 or 7 years ago I have designed/built directly on the page builders. What you think are the pros and cons when it comes to the design process of starting from wireframes vs. building right away on the browser or mobile apps? Also which types of clients prefer one over the other? I have always attracted clients who do not mind me building right on the page builders and skipping the "design" part of the process. So I am curious if I can still be able to get clients who do not mind the longer version.
Like agad post ni idol
Thank you! 🥰😍
This was really useful, thanks ❤
Btw I like your hairstyle and you have a cute smile
Have a great day Franz🌼
Aww thank you so much for the appreciation, Asmaa! 💛
New bie sub and great tutorial, God bless
Thanks for subbing!
Thank you Miss Franz! Skin Care reveal din please! Super pretty! :D
You’re welcome! 😍 Oh..haha! I did a video sa TikTok ko bout my skin routine 😆
Possible po ba Ms.Franz after ng video tutorial meron kang short video clips on how you present the design stage sa client?😍 same po ng ginawa mo sa Moodboard,para po sa amin na nag istruggle on how we communicate well sa client. thanks a lot, Ms. Franz 🤩👊
For sure! Ttackle natin yan sa mga susunod na episodes 😊
@@FranzEscolasticoDesigns thanks a lot Ms. Franz. napakabait naman🤩 ❤❤❤👊
Nice vid po! Ask lang po kung anong mauuna? Wireframing process po ba or moodboard? 😁
If you’ll follow the guidelines, then wireframing it is pero in reality either will do talaga.
Miss Franz, is this the paid Figma platform or just the free?
Hello! For this tutorial, I used the free plan lang pero paid or free, same pa din ng tools and features 😊
Hi po. pwde po ba makahingi nang parang questionnaire guide na pwdeng maibigay sa Client po? para mas maintindihan ko kung ano ang gusto po nila mangyari sa website? hehe. :D if possible lang po hehe. Thank you.
Oh sure sure, I made a video din sa TikTok ko bout the questionnaire. Share ko dito as YT shorts 😁
Ma'am mganda umaga po sayo
Tanung lang po?
Pwede po ba pumasok sa company nyu kahit no experince?
Gusto ko po kase maging isang Web Design or Developer? Ma'am
No hiring po sa ngayon ☺️
ahh cgee po salamat po sana mabigyan ako nang opportunity sa inyu :)@@FranzEscolasticoDesigns
😄 *Promosm*
Fraaaanzzz maono parin ba to?? 😮
Nope! Haha! Fifine na gamit ko, super way better! I’ll make a review soonest! 😁
Instead of trying to flog all the crap and equipment on your channel, how about posting a copy copy of the Fitbit image so you can actually follow the tutorial. Your just wasting peoples time .
Thank you ma'am