- 137
- 232 769
Dennis Leoca
United Kingdom
เข้าร่วมเมื่อ 15 ม.ค. 2020
I share things about Product Design (UX/UI) and Online Business.
For business inquiries or if you just want to say hi you can get in touch with me here: www.dennisleoca.com.
For business inquiries or if you just want to say hi you can get in touch with me here: www.dennisleoca.com.
I redesigned YouTube
In this TH-cam video, I will take you on a creative journey as I redesign the iconic TH-cam platform from my unique perspective. Join me as I walk you through each step of my design process, offering a detailed, behind-the-scenes look at how I envision and reimagine TH-cam. From initial concepts to final touches, you'll gain insight into my design philosophy and see how I approach enhancing the user experience on this beloved platform. Watch now to explore my vision for a redesigned TH-cam!
Annotation Kit: www.uxlab.academy/product-presentations/free-figma-annotation-kit
Figma File: bit.ly/3yIaT3G
BECOME A DESIGN MASTER
🔥 www.uxlab.academy/
🧑🎓 Learn Product Development: bit.ly/45FsPrw
🧑🎓 Free Figma Course: bit.ly/3NeAQg3
✨ Best Figma Design System: bit.ly/48E0qlU
AFFILIATE LINKS
These links are affiliates. Clicking may earn us a small commission at no extra cost to you. We only recommend trusted products. Your support through these links directly backs our channel. Thank you for being part of this fantastic community!
🖥 Try Webflow: bit.ly/3RBppjp
✨ Try Figma: bit.ly/3vlzF7O
💬 Try FigmaJam: bit.ly/3vnsY59
🔥 Try Figma Premium: bit.ly/48or1Uu
📝 Try Notion: bit.ly/3vPecVc
🗓️ Try Reclaim Ai: bit.ly/499Au2f
CONNECT WITH ME
🐦 Twitter / X: bit.ly/3WSi3tV
📸 Instagram: bit.ly/43Gp8Ab
📹 TH-cam (Subscribe): bit.ly/3RGcrkB
CHAPTERS
00:00 Introduction
00:30 Defining my KPI's
01:39 Audit the current user interface
03:27 Getting familiar with the user interface
03:58 Preparing the assets
06:59 Designing
16:02 Final designs
Annotation Kit: www.uxlab.academy/product-presentations/free-figma-annotation-kit
Figma File: bit.ly/3yIaT3G
BECOME A DESIGN MASTER
🔥 www.uxlab.academy/
🧑🎓 Learn Product Development: bit.ly/45FsPrw
🧑🎓 Free Figma Course: bit.ly/3NeAQg3
✨ Best Figma Design System: bit.ly/48E0qlU
AFFILIATE LINKS
These links are affiliates. Clicking may earn us a small commission at no extra cost to you. We only recommend trusted products. Your support through these links directly backs our channel. Thank you for being part of this fantastic community!
🖥 Try Webflow: bit.ly/3RBppjp
✨ Try Figma: bit.ly/3vlzF7O
💬 Try FigmaJam: bit.ly/3vnsY59
🔥 Try Figma Premium: bit.ly/48or1Uu
📝 Try Notion: bit.ly/3vPecVc
🗓️ Try Reclaim Ai: bit.ly/499Au2f
CONNECT WITH ME
🐦 Twitter / X: bit.ly/3WSi3tV
📸 Instagram: bit.ly/43Gp8Ab
📹 TH-cam (Subscribe): bit.ly/3RGcrkB
CHAPTERS
00:00 Introduction
00:30 Defining my KPI's
01:39 Audit the current user interface
03:27 Getting familiar with the user interface
03:58 Preparing the assets
06:59 Designing
16:02 Final designs
มุมมอง: 182
วีดีโอ
I owe you an apology
มุมมอง 1872 หลายเดือนก่อน
BECOME A DESIGN MASTER 🔥 www.uxlab.academy/ 🧑🎓 Learn Product Development: bit.ly/45FsPrw 🧑🎓 Free Figma Course: bit.ly/3NeAQg3 ✨ Best Figma Design System: bit.ly/48E0qlU AFFILIATE LINKS These links are affiliates. Clicking may earn us a small commission at no extra cost to you. We only recommend trusted products. Your support through these links directly backs our channel. Thank you for being ...
Figma update | Multi-Edit
มุมมอง 3954 หลายเดือนก่อน
In this video, I'll be demonstrating the latest feature in Figma, known as multi-edit. Figma file: bit.ly/43pn0ha BECOME A DESIGN MASTER 🔥 www.uxlab.academy/ 🧑🎓 Learn Product Development: bit.ly/45FsPrw 🧑🎓 Free Figma Course: bit.ly/3NeAQg3 ✨ Best Figma Design System: bit.ly/48E0qlU AFFILIATE LINKS These links are affiliates. Clicking may earn us a small commission at no extra cost to you. We ...
The best apps on Mac 2024 | Unique apps
มุมมอง 2.1K4 หลายเดือนก่อน
Dive into the cutting-edge world of Mac applications in 2024! In this video, we're exploring the best Mac apps of the year-tools meticulously chosen to boost productivity and simplify life. These top-tier performers are designed to keep you ahead in the ever-evolving tech landscape. To me, these are the crème de la crème of Mac apps, as I use these apps constantly in my daily workflows. So whic...
Figma animation tutorial | Disappearing Button
มุมมอง 1.2K5 หลายเดือนก่อน
In this Figma animation tutorial, I will show you how to recreate the new call-to-action animation that Apple.com has introduced on their websites using nothing but Smart Animate inside Figma., I will then show you how you can convert this animation into a component that you can reuse in all of your other Figma projects. Create a free account to download file Link to file: www.uxlab.academy/fre...
UX/UI Design is Dead in 2024?
มุมมอง 1.4K5 หลายเดือนก่อน
UX/UI Design is Dead! This is the headline that I've seen lately everywhere I looked. Now the reason I made this video is because I wanted to express my personal opinion about this matter and share with you guys my opinion about the future of UX/UI Design. BECOME A DESIGN MASTER 🔥 www.uxlab.academy/ 🧑🎓 Learn Product Development: bit.ly/45FsPrw 🧑🎓 Free Figma Course: bit.ly/3NeAQg3 ✨ Best Figma...
Everything you need to know about UX/UI Design, in 2024
มุมมอง 2.2K6 หลายเดือนก่อน
In this video, I will tell you everything you need to know about UX/UI Design. We will explore various job titles and positions available, including UI Design, UX Researcher, UX/UI Designer (also known as UX Designer), and Service Designer. Also, I will precisely outline the skills required for each role, go through the day-to-day responsibilities, and discuss the timeframe needed to acquire th...
Bento Grids - New Design Trend for 2024
มุมมอง 4.4K7 หลายเดือนก่อน
Bento Grids - New Design Trend for 2024
Figma Tutorial: how to fix position when scrolling
มุมมอง 8K8 หลายเดือนก่อน
Figma Tutorial: how to fix position when scrolling
Figma Tutorial: Smart Animations In Record Time
มุมมอง 47210 หลายเดือนก่อน
Figma Tutorial: Smart Animations In Record Time
Best tool for creating documentation
มุมมอง 1.2K10 หลายเดือนก่อน
Best tool for creating documentation
UI Design - Food App (Figma Tutorial)
มุมมอง 71011 หลายเดือนก่อน
UI Design - Food App (Figma Tutorial)
How To Come Up With Design Ideas When You're Feeling Stuck
มุมมอง 34211 หลายเดือนก่อน
How To Come Up With Design Ideas When You're Feeling Stuck
The Digital Product Secret Nobody Knows!
มุมมอง 199ปีที่แล้ว
The Digital Product Secret Nobody Knows!
Microsoft Clarity: A New Way To Boost User Engagement
มุมมอง 3.2Kปีที่แล้ว
Microsoft Clarity: A New Way To Boost User Engagement
Apple Vision Pro through a Designer's Lens
มุมมอง 337ปีที่แล้ว
Apple Vision Pro through a Designer's Lens
Brilliant how you explain things so easily for beginners! Liked and subbed 🫡
Would you say Mizco is legit? I’m getting out of a horrible boot camp and looking to take more courses. Thanks.
For anyone just wanting to have their menu fixed on top, just watch the 3 first minutes xD 15 minutes tutorial for this is wild. Also, no need to shrink your "Desktop" frame in order to have the vertical scroll to work ; it will only leads to cut your protoype view in the play mode. The warning message in Figma scroll tool is only here to let you know that you content should be bigger than the target screen size (chosen when you create your Desktop frame) :) But thanks for the help!
This was soo helpful! Thank you!
Which design system did you use? Very helpful video 🎉
Thanks for the video, everything is expressed clearly! Could you, please, tell if there is a chance to adapt the size of the text to the size of the frame? For instance, the frame becomes smaller and I want the font to change to a smaller size too. Thank you in advance for your response!
thank you bro for your helpful video and information
since it's been one year of making this video, did figma fix the auto-layout bug that dennis talks about?
thanks, all these videos are so helpful and straight to the point, that's amazing !!!
Thank you very much. That made me easily understand how auto layout works. 😊
So the takeaway is use gradients in borders to make elements stand out over different views. Did we need to watch you build something from scratch for 90% of the video 16:09
Also since this is a video about visibility over various fields of view, is there a reason why you didn’t mention accessibility requirements in various scenarios? I’m pretty sure the secondary button will not even meet accessibility in the majority of compositions you chose
holy shit this is actually good
This is actually a good idea! thankss
You got really awesome teaching skills bro
Inundating the user with info is not a way to make it more likely for them to consume and follow through, instead they would be more likely to tag the info all together as noise, and just not register it. So I think this is a very niche sort of thing, and most people would not like this sort of info overload. But it looks nice I guess
I've been looking for a good way to do this. Thank you!
GREAT VIDEO! Thank you so very much for posting this, it really helped me understand Auto Layout & Constrains.
For me the screenshot clarity took from my website/webshop at the heatmaps page of clarity is white, so I cannot see anything on the heatmaps. Do you know what can cause this? I tried a lot already.
Hey Dennis This is vickAlmondo, Takeouts Guy. This is nice. Sending you loads of support ❤❤
Awesome!!
Thank You bro, It was so much helpful,
thanks for teaching so clearly
Pleasure is all mine! Happy to hear it was helpful 🙌🏼
👋
UIs are ultimately necessary evils and nothing else. I need an Interface to communicate with the machine before me. That is the only point, the only reason for being for a UI. If there ever comes a point where I can talk to my pc or plug it into my brain, UI web design as a job will disappear over night. Meaning, first and foremost, UIs need to be functional. And after fourty years of computer UI design, one would imagine that all the designing has been done, all the bad ideas have been weeded out, and all the tricks are known. For some reason, this is not the case. e.g., the new youtube UI design they rolled out over the course of the last half year. It doesn't improve ANYTHING. it takes an existing, working, interface, shuffles the existing elements around and then calls that a job well done. The current youtube design works. It will continue working. It will still be working in a thousand years just the way it is now. Or in other words, if it works, don't try to fix it. So yeah, in a way, I would argue that UI design IS dying, by the simple virtue that eventually we will know all the things that work. The better the designers of the present are, the less the designers of the future will have to do outside of functionless aesthetics and pointless redesigns.
TH-cams UX is pretty bad, so not the best example - but while theres still interfaces, there'll still be new features and needs as well as just new digital apps all together. Just because it "works" doesn't mean its good, and there's both functional and financial reason to continue pursuing its advancement
@@Balloonbot Whether or not a program works is the primary judgement for whether or not it is a good program. Except even that is not true, because if your program does NOT work, then it isn't even eligible to be judged. It is just broken. So that is your counter argument for that point. "If it detracts from the work that needs doing, it is most definitely bad". That is why the youtube redesign was so badly received. No new functionalities and the existing ones were made less accessible. And while I cannot talk about the old TH-cam UI from the content creator side, from my side its UI is pretty good. VIdeo in the center, recommendations to the side, comments below, additional elements take up very little space. It is pure functionality and gives me exactly what I need and want. There is quite frankly no reason to change any of that and no reason to add additional "features".
@@Alexander_Kale You dont need to add features for UX to be refined. That's besides the point, you said: "I would argue that UI design IS dying, by the simple virtue that eventually we will know all the things that work." - which doesn't make sense, there'll still be new products that serve different purposes as well new emerging platforms like VR/AR - which have barely been touched yet in terms of UX/UI. There are some great UX creators who have redesigned apps that are very popular and technically "work" but not as well as they could. Its a better example to illustrate the ongoing need for designers even on large scale established apps. I would be more specific on which creators, but sometimes comments are blocked for advertising if I do so.
@@Balloonbot It makes sense in terms of specific products. YOutube as it is does not require a redesign. It works the way it is. As long as you do not change what youtube does, there is a limited amount of optimizations you can do. And your example of people redesigning popular apps is exactly that, a support for my claim. Eventually those app will have finished the process of UI optimization, and those people will be out of a job, they will have to move on to other projects. Overall, you made my point for me. Thnx.
How to you deal with scale? For 2D design we have fixed resolutions of screen but in mixed reality scale be can anything. how do you determine what should be the minimum font size, icon size, clickable area and so on…?
That’s a very good question! Although I cannot answer the exact question. A good resource I can recommend reading is: developer.apple.com/design/human-interface-guidelines/designing-for-visionos I’m currently going through it myself 😅. So if I find something about your question will let you know 😅
@@DennisLeocathanks for the resource!
How do we make it stop
Unfortunately there is no way we can stop it. The only way forward is to learn how to leverage it to help us become better at our jobs.
Outdated as of 2024. Figma introduced variable-mode based responsive typography.
True! New video comming soon! Than you for pointing it out!
WOOOOOAHHHH finally i understand it
🙌🙌🙌
I ilke the color grading. it feels clean
Thank you!
I tired this but it has scaling side effect when zoom in and out quickly you can see grid element growing or shrinking.
That's interesting, I have't been able to replicate that...you mean when you're zooming in the grid becomes bigger?
@@DennisLeoca Yes. Before settling down. I used it for section not frame.
Thank you! It helped me.
Where is ar vr ???
AR stands for Augmented Reality and VR stand for Virtual Reality. As a quick way of explaining it: Augmented Reality (AR) overlays digital content onto the real world, while Virtual Reality (VR) creates a completely immersive digital environment. AR adds to reality, VR replaces it.
Sir, do you have a video on setting up project in figma completely like from setting up color system to fonts and variables etc. like how one should initailize a project in figma after which design should get started. This video was very helpful sir, Thank you. You've got a subscriber.
I don't have such a video because it's quite a lot to talk about on that topic but it is included in the UI Masterclass Course.
The only video which helps me to understand the difference between auto layout n constraints 😅, I was so confused between these two
Happy to hear it helped!
Totally wonderful 🎉
Thank you 🙏🏻
Thanks to your videos, I learned how to work with Figma. Thank you very much!
You’re welcome! So happy to hear this! Well done 👏
Awesome I’m excited to start the series !
Happy lerning! If you have any questions feel free to reach out!
Please turn off the annoying background music!
Ok, thank you for the feedback!
This is great. You are a good tutor.
Thank you! I appreciate it 🙏🏻! And happy to hear you found it useful ☺️
Very good explanation for this feature of autolayout
Thank you 🙏🏻!
This click bait crock of shit needs to stop. Spreading mis information. Disliked. 👎
Man, I was looking for this for so long, thank you so much!
Your welcome! Happy to hear that you found it useful!
you seem like the kind of dude that make the new reddit and youtube layout and think you "improved it" when you just made it worse. But your data shows that 90% of people are too stupid to know how to change the default layout of a site via plugin.
Hey Dennis! Hope this finds you well. I've watched the video three times, but I just understand that this is a way to "tag" the fonts for the handoff stage. I thought that responsive typography would involve a responsive behavior, growing and shrinking following the size of the frame, like frames with auto layout, or responsive websites works. Btw, I'm still unable to find a video that teach exactly that. Is it possible?
Hey Mauro! Yes you are right this is just a way to manage and tag your different font sizes in Figma. Regarding the responsiveness of the fonts I get this question quite a lot but unfortunately at the current moment there is no way you can achieve that in Figma. You can make the text “responsive” in the sense that you can add auto-layout to it but then when the screen size changes you need to manually switch between the diferent font sizes. Hopefully they will come up with an update for this soon.
Finally I got my answer of my confusion about why this set by default fixed . Thank you 😊
Glad to hear it helped! 😊
you just explained this in just 8 minutes love it !
🙌🏼🙌🏼🙌🏼
Simply Thanks ❤
You’re most welcome 🙏🏻
you really helped me fr, thanks a lot
Happy to hear that! 🙌🏼
Thank you king