- 25
- 76 544
Design With Hannah
United States
Приєднався 21 січ 2019
Level up your design skills with Figma tutorials & design tips for designers.
Subscribe for digital design learning, Figma training videos, and Figma courses to help you design beautiful things!
Learn how to level up your web design or UI and UX design career, know-how, web design trends, how to become a web designer, and how to improve your design skills with Figma tutorials for beginners.
Whether you're a web designer, UI designer, UX designer, or product designer, or a front end developer, we can help.
If you have any video suggestions, leave a comment on any Figma tutorial video we release.
Thanks for watching, and happy designing!
Subscribe for digital design learning, Figma training videos, and Figma courses to help you design beautiful things!
Learn how to level up your web design or UI and UX design career, know-how, web design trends, how to become a web designer, and how to improve your design skills with Figma tutorials for beginners.
Whether you're a web designer, UI designer, UX designer, or product designer, or a front end developer, we can help.
If you have any video suggestions, leave a comment on any Figma tutorial video we release.
Thanks for watching, and happy designing!
Figma VS Adobe XD (2024): Best Web Design Tool? - UPDATED
🚀FREE intro e-course for Figma - Figma beginner to Figma winner: www.figmatraining.com/pages/figma-free-ecourse
Update: Adobe XD is in maintenance mode / discontinued and not developing new features, so that is something else to take into consideration.
Figma vs Adobe XD: What are the similarities and differences? Which tool is better for design, and when would you choose Adobe XD over Figma, or vice versa?
Both are highly respected design tools in the industry for prototyping software, but there are key differences to consider, and each has its pros and cons. Personally, I now use Figma for everything related to design prototyping, UI design, UX design, and web design.
---------------------------------------
💻 FREE design templates to get help you get started with Figma: www.saasdesign.io/templates/
🚀FREE e-course for Figma - Figma beginner to Figma winner: www.figmatraining.com/pages/figma-free-ecourse
---------------------------------------
Topics: Figma vs Adobe XD, learn UI design, UX design, web design, design software, design for beginners, new designers, design prototypes
Figma vs. Adobe XD - What's the Difference?
Timestamps:
0:00 Why it's important - Adobe XD vs Figma
0:34 Important update 2024
1:56 FREE Figma e-course for beginners
Music from freetouse.com/music
‘Marshmallow’ by ‘Lukrembo’
#uidesign #uxdesign #webdesign
---------------------------------------
What is your favorite design software? Let me know in the comments!
Update: Adobe XD is in maintenance mode / discontinued and not developing new features, so that is something else to take into consideration.
Figma vs Adobe XD: What are the similarities and differences? Which tool is better for design, and when would you choose Adobe XD over Figma, or vice versa?
Both are highly respected design tools in the industry for prototyping software, but there are key differences to consider, and each has its pros and cons. Personally, I now use Figma for everything related to design prototyping, UI design, UX design, and web design.
---------------------------------------
💻 FREE design templates to get help you get started with Figma: www.saasdesign.io/templates/
🚀FREE e-course for Figma - Figma beginner to Figma winner: www.figmatraining.com/pages/figma-free-ecourse
---------------------------------------
Topics: Figma vs Adobe XD, learn UI design, UX design, web design, design software, design for beginners, new designers, design prototypes
Figma vs. Adobe XD - What's the Difference?
Timestamps:
0:00 Why it's important - Adobe XD vs Figma
0:34 Important update 2024
1:56 FREE Figma e-course for beginners
Music from freetouse.com/music
‘Marshmallow’ by ‘Lukrembo’
#uidesign #uxdesign #webdesign
---------------------------------------
What is your favorite design software? Let me know in the comments!
Переглядів: 617
Відео
Ultimate Freelancing Guide for Designers (Make Money Through Freelance Design!)
Переглядів 25021 день тому
🚀 FREE Figma templates: www.saasdesign.io/free-figma-templates/ In this video, you'll learn how to make money freelancing as a web designer or UI UX designer. It covers unique jobs for web designers or developers including no code niches where you can make a career out of your web design or UI / UX design skills and add to your design portfolio. This also includes many no code / nocode website ...
Meet the NEW Figma | Figma AI + Config 2024 Updates ✨
Переглядів 4,7 тис.3 місяці тому
There has been a major Figma update that is starting to roll out in beta! ✅➤ FREE Figma for beginners e-course: www.figmatraining.com/pages/figma-free-ecourse The new Figma AI update news and redesign was announced at Figma Config 2024: So, what is most important here and what do you need to know? ➤➤ Update since filming: The "Make Designs" Figma AI design feature is now called "First Draft." ➤...
How to Build Work Experience in UI/UX Design in 2024 (Beginners Guide)
Переглядів 1,2 тис.4 місяці тому
🚀FREE Figma e-course - Figma beginner to Figma winner: www.figmatraining.com/pages/figma-free-ecourse You can become a UI UX designer without existing experience or a design degree. In this video, you'll learn how to get started in your design career by building up your work experience and portfolio (and how to do that when you don't have experience). This is a guide on how to get into UI and U...
UI vs. UX Design Explained - What's the Difference?
Переглядів 7254 місяці тому
🚀FREE Figma e-course - Figma beginner to Figma winner: www.figmatraining.com/pages/figma-free-ecourse UI vs UX design: what's the difference? What are the similarities and which one is best? In this video for design beginners, you'll learn about the different traits that are best for each. In this comparison video with examples, you'll learn about UI versus UX design and all about what UX desig...
Figma vs Adobe XD: What's the Difference?
Переглядів 8 тис.4 місяці тому
🚀FREE e-course for Figma - Figma beginner to Figma winner: www.figmatraining.com/pages/figma-free-ecourse Update: Adobe XD is in maintenance mode and not developing new features, so that is something else to take into consideration. Figma vs Adobe XD: What are the differences and what are the similarities? Which one is better to use for design - and in what cases would you choose Adobe XD over ...
10 Figma Tips The Pros Won’t Share | Figma Tutorial For Beginners
Переглядів 4135 місяців тому
In this Figma tutorial for beginners, you'll learn how to use new Figma plugins with the latest in AI - along with quick commands - to speed up your design workflow so that you can design faster and more productively. *・゚⋆*・゚*・゚⋆*・゚*・゚⋆*・゚*・゚⋆*・゚⋆ 💻 Free Figma templates: www.saasdesign.io/templates/ 🚀Level up your Figma skills from Figma beginner to Figma winner with the free Figma e-course: ww...
How to Install & Download Figma Free in 3 Minutes on Windows 10, 11 | 2024
Переглядів 3,1 тис.5 місяців тому
▶️ Get the FREE Figma e-course mentioned in this video: www.figmatraining.com/pages/figma-free-ecourse You can install Figma on Windows or you can also use the web-based version. You can get started with Figma with a free plan. It's compatible with all types of operating systems, including Windows, which I'll be highlighting in this design tutorial. ✅ You will need a free Figma account - you ca...
Figma Multi-edit: Best NEW Figma Feature? | Figma Tutorial For Beginners
Переглядів 3546 місяців тому
🎥🍿 Watch more learn Figma videos here: ua-cam.com/play/PLQzKJxZaoQ7-6C_nI0wghOoe72IIbeWt-.html Multi edit in Figma (new feature) helps you work faster by editing multiple objects, text, and variants at once across frames. ►►FREE Figma e-course: bit.ly/free-ecourse-learn-figma-m This Figma for beginners tutorial will show you exactly how to use Figma's new multi-edit feature, along with the thin...
ChatGPT Tutorial: How to Design An Entire Website With Chat GPT for Beginners
Переглядів 2,8 тис.8 місяців тому
►►🎥🍿 Want to learn more about using Figma for design mockups? Watch more here: ua-cam.com/play/PLQzKJxZaoQ7.html 🚀 In this ChatGPT web design tutorial, you'll learn how to create a website using AI prompts, based on a Figma design file which is used as a reference. Watch as I try to generate a website using Chat GPT to generate code (HTML and CSS) based on prompts. This works for websites and l...
How to Remove Background from Images in Figma - Remove & Delete Backgrounds Fast
Переглядів 3769 місяців тому
Learn how to remove background from images in Figma. 👉 Free Figma e-course: www.figmatraining.com/pages/figma-free-ecourse Figma remove background / remove BG plugins are the way to do this. This means you don't have to install any additional software. This free plugin really helps make things much easier! This is so much easier than jumping between software for Figma background removal, or hav...
Is Figma Really Free to Use?
Переглядів 1,4 тис.9 місяців тому
► Try Figma for free here: bit.ly/free-figma-account (using this link also supports the channel - thanks!) Is Figma free to use to design? Yes! New to Figma? 🎓Check out the free e-course: www.figmatraining.com/pages/figma-free-ecourse Figma pricing explained: Figma lets you have unlimited design drafts, but if you need other editors in your file, you get 3 files with other editors. You can shar...
How to Make Rounded Corners in Figma
Переглядів 1,5 тис.9 місяців тому
🚀Get the free Figma e-course & level up your skills: www.figmatraining.com/pages/figma-free-ecourse Learn everything you need to know about how to create Figma rounded corners in this tutorial, which you can apply to squares or rectangles. This is also referred to as a corner radius or border radius, depending on the language you're used to. You'll also learn how to add a border radius / corner...
Figma Tutorial: Must-Have Figma AI Plugins for Designers
Переглядів 17 тис.9 місяців тому
🚀Get the free Figma e-course: www.figmatraining.com/pages/figma-free-ecourse 👇 Subscribe for more videos like this on design and Figma 👇 www.youtube.com/@design-with-hannah?sub_confirmation=1 In this Figma tutorial for beginners, you'll learn how to use Figma AI plugins to help speed up your workflow in web design. Music by Lakey Inspired Timecodes: 0:00 About Figma AI plugins & why 1:22 Free F...
How to Undo Component in Figma - 2024
Переглядів 1,9 тис.9 місяців тому
How to Undo Component in Figma. 🚀Get the FREE Figma e-course: www.figmatraining.com/pages/figma-free-ecourse In this video tutorial you'll learn how to undo component in Figma. Easily remove a component in Figma if you want to make changes to it on its own without impacting the other components. ⭐ Free Figma e-course: www.figmatraining.com/pages/figma-free-ecourse 🎓 Want to level up your Figma ...
Best FREE Image Upsize Software (BEST RESULTS!)
Переглядів 15710 місяців тому
Best FREE Image Upsize Software (BEST RESULTS!)
Figma vs Canva | How Different Are They?
Переглядів 4,1 тис.10 місяців тому
Figma vs Canva | How Different Are They?
How to Import Sketch to Figma - Unbelievably Simple!
Переглядів 1,5 тис.11 місяців тому
How to Import Sketch to Figma - Unbelievably Simple!
The EASY AI Background Remover For Images
Переглядів 12911 місяців тому
The EASY AI Background Remover For Images
How to Undo Changes in Figma (Fastest Way to Undo in Figma)
Переглядів 2,6 тис.11 місяців тому
How to Undo Changes in Figma (Fastest Way to Undo in Figma)
How to Add Fonts in Figma in ~5 Minutes | For Beginners
Переглядів 17 тис.11 місяців тому
How to Add Fonts in Figma in ~5 Minutes | For Beginners
Dashboard Design Figma - Material Design UI
Переглядів 1,1 тис.2 роки тому
Dashboard Design Figma - Material Design UI
Design a SaaS MVP in Minutes? Design a Modern Dashboard Figma UI - Speed Design
Переглядів 1,1 тис.2 роки тому
Design a SaaS MVP in Minutes? Design a Modern Dashboard Figma UI - Speed Design
Figma Smart Animate Tutorial (Menu button)
Переглядів 1852 роки тому
Figma Smart Animate Tutorial (Menu button)
SaaS Design - Figma Speed Art Tutorial
Переглядів 4,1 тис.2 роки тому
SaaS Design - Figma Speed Art Tutorial
thanks for this explanation..got my choice much easier...
Thank you ❤
My pleasure! Thank you for watching!
Easy to understand comparrison , i shall take a look at your e-course on figma :)
Thanks! Glad it was helpful
Perfectly explained. Thank you very much.
Glad it helped!
Figma is becoming very expensive now.
Definitely have to keep an eye on seats & access. Pricing has changed a lot over the years, but I still find it to be the best on the market for UI and UX related projects. What tools are you using the most in your work these days?
🚀New to Figma? Get the FREE Figma e-course - Figma beginner to Figma winner: www.figmatraining.com/pages/figma-free-ecourse ⭐ Currently trying to reach our goal of 2,000 subscribers on the channel - thanks very much for being a part of it!
Are you looking for a video editor to edit your videos?
🚀 FREE Figma templates to kickstart your design projects: www.saasdesign.io/free-figma-templates/
👍👍👍
I already have the beta version but I can't see the AI features, is there any option I should enable?
Hi Luis, Figma temporarily disabled the AI features unfortunately - I believe they wanted to work on it more to smooth out some issues with it. Here's more info: www.figma.com/blog/inside-figma-a-retrospective-on-make-designs/ Hope you'll see it again soon!
@@design-with-hannahoh okay! I’ll be waiting for it. Thank you so much for the reply, Hannah!
Update: This feature is back and in beta, and it's now called "First Draft." It can be found in the same area.
@@design-with-hannah awesome! I’m gonna try it! Thank you Hannah
Thanks a lot .from Ethiopia
Glad it helped!
The only reason i am here that you look gorgeous. i downloaded figma and began taking steps with a roadmap do you have any tips for a fresh UI designer 😀
Thanks for being a subscriber - I am actually working on a video right now about UI design tips, design principles and best practices - hopefully it'll be out in the next 1-2 weeks if all goes well.
did not work....WHY?! @design-with-hannah
Hi, I will try my best to help! Answering these questions will help me better understand & troubleshoot what might be happening with the Figma fonts error you are receiving, since there could be a number of things happening: 1) What are you trying to accomplish? 2) What have you tried so far? 3) What error(s) are you seeing, if any?
Such a good video! Tysm❤
So glad to hear it was helpful, and thanks very much for the kind words!
Yeah, long story short: Figma is better cause XD is dead ... (or a zomie like Flash was for a decade) So You're a tad late with your little vid, like a year or two. But HOW CAN I INSTALL XD TODAY?
Thanks 💜💜💜
Yes, glad the video helped!
Thanks a lot, Hanna! You help me to "save time"
Glad to hear that it helped!
Anyway Adobe bought Figma so don't expect it to be free for long haha
Crl serio????????
As of December 18, 2023, Figma and Adobe ended their acquisition agreement after more than a year of regulatory scrutiny.
Speaking of intuitive as a windows user and developer ctrl + zoom is not entuitive, but I get it, when I move from XD to Figma , I had the same issues I found that Figma was not that intuitive, I was lost to even create a simple device wireframe, or zoom in and our or even pan, it it was always more jittery then in xd. With XD manipulate objects at the vector point is so easy, in Figma you need to change from vector to whatever, and when it was to export something jzzzz I took a day inn Figma it was buried in the properties, crasy!
Thanks for sharing your experience! Yeah that's very true, it can depend on which tool you're starting with and each tool can change a lot over time, too. It looks like Figma is actually staying an independent company - it appears the merger with Adobe did not go through.
I am a INTJ-A INTJ-T individuals are more likely to experience self-doubt, be highly critical of themselves, and feel the pressure to continuously improve. They may struggle more with stress but use this as a motivator for personal growth. INTJ-A individuals, on the other hand, possess a higher level of self-confidence and emotional stability. They are less likely to be affected by stress and external criticism, maintaining a steady focus on their goals.
Thanks for sharing - very cool!
it work but next day i open back figma the font is gone. need install again and refresh page and the font are there
Well thats a lie because adobe xd is much easier and more simpler to navigate and work with
Your experience is not universal. Learn the shortcuts 💀
Hahahaha😂😂😂😂😂
I'm INTJ-T. Currently on a project of a Website Development and was watching your video to cover up the role of a missing Ui/Ux Designer
Another INTJ! What design topics are you looking to learn more about?
@@design-with-hannah I am trying to make a Website as I participated in a Web Development Team Project on a inter-school competition. Aiming for the first prize I am trying to make a Portfolio website for my Web Development Team using only HTML,CSS & Javascript. Though I am a front-end developer, I am trying to fill up the role of a missing Ui designer as people of my ages are not interested in skill development.
That's great - good luck with the competition. If you are new to design, Dribbble, Awwwards & the Figma Community are also nice places to browse if you are looking for some design inspiration or an idea of different styles
Morning tea and Evening Coffee...
Nice!
XD is no more, so I guess we don't have the choice anymore. I preferred XD for loading speed.
I'm an ISFP. I started learning UX designing. Found it kinda overwhelming. Decided to move to UI designing. I'm learning Figma from your course.
That is great and thanks for sharing! I think ISFPs would do wonderfully in UI, especially because ISFPs are known for being artistic and passionate. And big welcome to the course! In the course now you can submit your prototype for evaluation, which I'd recommend whenever you are ready for feedback or if there is anything you could use extra help with along the way. Best of luck in your UI journey!
4:31 😂
Glad you could appreciate it!
If you really wanted to you can use Figma to do what Camva does, but not the reverse. Good video.
100% - Figma is better for wireframing and UI at the moment, so it depends on a person's use case which one they will choose. Thanks and glad you enjoyed the video!
Wow now everyone can be a Ui designer
It's pretty wild!
I hope not🤞
I see designers using it as another tool - and that businesses will still need a human perspective, understanding, and direction to properly solve real problems with design (except for very small startups/hobby projects maybe).
@@design-with-hannah i dont think that now everyone can solve problems and be a UI designer just like not every guy with a pitchfork is a Poseidon
@@design-with-hannah yes but everyone can't solve problems most of them only know how make beautiful design only senior designers in a company do that maybe (problem solving) Overall i can say that now its not about designing beautiful Ui but its about solving problems
When is the update coming out?
Hi, from what I understand (though I can't speak for Figma), this release will be rolling out over these next few months to the public. If you want early access, check out ~4:19 in the video for a quick explanation, or you can click the question mark in the bottom-right corner when you're in Figma and then click the "Join UI3 + AI waitlist" link. Hope you are able to see it soon and curious to see what you end up thinking of it!
@@design-with-hannah Hi, thanks for the reply to my question. it already asked me to join the waiting list for the UI13 + AI feature with all its products based on fig jam and the rest so I am waiting on it to be that hope it will be soon for me to see these new AI features at work
New video after a long time. The future of UX design involves the collaboration of humans and AI, working together to create mind-blowing experiences. How did you get the Figma AI?
Hi Omar! Hope you've been doing well. To get the new version of Figma, you can click the question mark at the bottom right corner when you're in Figma, and after click the question mark, there should be a link that says "Join U3 + AI Waitlist." Do you see it? Thanks for sharing your thoughts on design and AI - I completely agree. You know it's almost like AI is turning designers into design leaders because it shifts the focus to thinking about more high-impact decisions in design - and less time on tedious tasks. At the same time I can see and understand why it would be scary at times, so I think the question for designers is: How can we utilize our humanity to design better experiences for the world and solve even more problems now that we don't have to focus on tedious manual tasks?
🚀 Level up your design skills with the FREE Figma for beginners e-course: www.figmatraining.com/pages/figma-free-ecourse ⭐ Currently trying to reach our goal of 2,000 subscribers on the channel - thanks very much for being a part of it!
Can we take a moment to appreciate all the animation work that has been done for this video!
Thanks for the comment! I went with an editor for this one and they did a fantastic job.
The main consideration should be that XD has been discontinued. It's no longer available to new users. Existing users can access but there will be no further functional updates only security fixes. Sad to say XD is dead.
Yes, I've now made a note of this in the video description & need to get around to recording a new version of this video to include this info going forward. With Adobe XD being in maintenance mode now, are you using Figma now or another tool?
@@design-with-hannah I’m not doing a great deal of UX or prototyping work so XD is sufficient for now. If that changes, I’ll probably get using Figma.
tooo much makeup
Dude it’s a video about figma not her makeup…
THANK YOU!!!!
Yes, so glad it helped! :-)
Is there any FREE version for the Wireframe Designer AI plugin ? Since it only allows for 6 wireframes in the free version. BTW, very useful tool !
Hello! If you are a beta user of the new version of Figma, there is now a great new AI feature where you can create wireframes. To join the beta waitlist, you can click the question mark at the bottom-right corner of Figma and then select to join the UI3 + AI waitlist if not. Here's a recent video I did on it: ua-cam.com/video/tMZAGehxVxQ/v-deo.html Hope it helps :-)
Thank you for this excellent video! ❤
So glad to hear it was helpful!
Cant fine free course at all!
I like your simplifying vibe, for lack of a better term. 30 year art/creative director here who is going to learn Figma. Sighhhh, more crap to learn. Will take your free e-course.
Thanks!! Which tool are you migrating from? Yeah, it can seem like a lot initially, but I think that getting a solid grasp of the basics - things like Figma styles and components - can really help get up and running quickly. For example, I wouldn't worry too much about things like Figma variables, auto layout, etc until later because you can do a fair amount without them, and those particular features tend to be most overwhelming for folks. You may have seen this already, but if not, the Figma Community also has some pretty great open source templates contributed by various designers - nice for reverse-engineering as you're getting started: www.figma.com/community/free
What happened to your videos about building a SaaS and getting healthy MRR? it looks like this channel has now just switched to parroting obvious and outdated design "tips" that can be easily found with a Google or ChatGPT search. not nearly as useful as other design channels such as @rachelhow who has more real world content. Unsubscribed.
haven't eaten yet! just coffee for now lmao! thanks for the vid. it was helpful.
Just had my coffee too! Glad to hear the video was useful and thanks for your comment :-D
simple and useful.
Thanks - appreciate you!
It was pretty helpful! You are the best 🥰
Thank you for the nice comment! :-D
I am here to say thanks for the educational and informative information 💕
Thanks for watching!
Thankkkkssss 🙏❤❤
Glad that it helped!
Congratulations! 1k
Whoo! Thanks for your support Omar!
@@design-with-hannah Welcome
This video make me curious about UI/UX design. But i didn't find proper source or channel for learn it. I have so many effective business idea. Unfortunately I can't execute it because of....
Hi! What parts of UI/UX design are the biggest challenges for you right now?
it doesnt work
Hi! What error are you seeing or what part is not working for you currently? Knowing a bit more can help me get a better idea, as it could be caused by a number of different things.
@@design-with-hannahmy fonts used to work in Figma and today they all went missing. I have them installed but they don’t show anymore
it use full 👍
Glad to hear it, thanks!
any use of other social media ? ☺
🚀FREE Figma e-course for learning how to design in Figma as a beginner: www.figmatraining.com/pages/figma-free-ecourse