You are one of the few people who explains in a very short and precise way as you go straight into the point, thank you so much, keep up the amazing work.. My best regards.
I'm a front-end developer with 10 years of experience, and the knowledge you shared in your video is invaluable. Thank you for making this information available for free on UA-cam; well done!
Thank you so much for this, Aliena. I'm still fairly new to everything, and the whole idea of components, variables, master components, and assets scare me. Especially when I see videos of people using and making them so casually and quickly. It's nice to get a slowed down version of how and why to use them. And you keep driving the point of using community resources, something I never would have looked at without you. Thank you! ❤
Can you believe that I was waiting for this info from my first job as UX junior designer and none explain that like you? Finally, I resigned to this company trying to figure it out few things. Well known fintech company. This info is actually pure gold....thank u from Australia. The majority of information on design systems revolves around creating a basic version and this is ok but no enough. However, the experience of working with a design system already made it within a large corporation is vastly different, and you nail it. You made a clear and spectacular 15 min video explaining something that many senior UX can't do it. Thank u again.
I am so glad that this video was helpful. I experienced it myself so I know what's lacking out here. I've learned the basics of how to create some basic style myself. But after I joined eBay, I realized that tech companies have a dedicated team on creating design systems, and most of us need to learn how to use it, rather than how to create one. I hope more people can find this video 😄
P.S. A shortcut to select the right layer in design system is holding Command or Control so that you don't have to click multiple times. (Shout out to Theo for reminding me) Help me shape my Figma course 👉 forms.gle/qZU7hVN7gT2o7Tbe9 Figma 👉 psxid.figma.com/mtvfdvfjvpps Figma professional plan 👉 psxid.figma.com/sp3ulqgt744y-cb44ct Enjoy!
thanks for always clearly defining things.. small thing but it makes such a difference! with so much ui/ux jargon, i find it's easy to forget and lose focus when i'm designing...!
Great video again ! Love your videos As a tip, we can select a sub-element by holding ctrl in Figma, and click. Instead of clicking several times to access it
This tutorial was very helpful. I would like to see more practical tutorials like this where you use popular design systems for ios and android. I'd greatly appreciate it if you could tell me what steps should be taken in order to access components from the Design System file directly into my project file without switching tabs(import? publish library? share? copy link?)? 💯👍🤓
A set of Figma components is not a design system UNLESS those components are also implemented by the developers technically. Often, this is visible in Storybook. Otherwise it is a set of components. A design system is as much about the end code as the designs in Figma. So if the developers don't have the component already built code and the names/tokens are not the same as their components then you are not working with that company's design system.
You're right because a design system is filled with elements that are already coded into the website so if something needed to be changed it would be through the design system and like you mentioned it probably needs to be developed for it to actually be within that system
Is the requirement to create one's own icons and components to avoid accusations of plagiarism still prevalent? I believe few years ago, we have still been taught to create original components on sketch or icons on Illustrator to prevent potential issues. I'm curious if this standard has shifted ?
Ohhhh, I usually use material icons in 90% of my products, check out here: fonts.google.com/icons These are high quality open source icons from google that also make it easy for engineers to implement. If you are working with a company that has its own design system and icons, then use theirs. But other scenarios, I suggest you to go with material icons.
hey alina so If I have to do changes in design system at one place will it reflect everywhere like where the element is used basically I want to ask can I use this for making my own product ? and will it be okay to use this for making my own product
Great question. You can use a pre-built design system for your own product. But I'd suggest using the ones designed for everyone to use it like tailwindui, instead of brand-specific ones like Shopify/ Uber. After all, your design needs to speak for its brand identity, not some other company's brand identity. Larger Design system like tailwindui may allow more customization and better off with IP.
dammm its sooo diccicult as helll. Now I am feeling like seriously i don't know anything about figma. My dream of working in a big company seriously narrowing down a bit now.
Oh nooo, there are some other tutorials videos I created on wireframing, prototyping, and auto layout. To be honest, working with a design system won’t come natural. I’d suggest to start from other places 👍👍
As a procrastinator, I prefer these kinds of short tutorials, thank you :)
Thanks for letting me know!
You are one of the few people who explains in a very short and precise way as you go straight into the point, thank you so much, keep up the amazing work.. My best regards.
Thank you Mohammed! I'm glad it was helpful 😄
I'm a front-end developer with 10 years of experience, and the knowledge you shared in your video is invaluable. Thank you for making this information available for free on UA-cam; well done!
Thank you so much for this, Aliena. I'm still fairly new to everything, and the whole idea of components, variables, master components, and assets scare me. Especially when I see videos of people using and making them so casually and quickly. It's nice to get a slowed down version of how and why to use them. And you keep driving the point of using community resources, something I never would have looked at without you. Thank you! ❤
Thank you so much for letting me know!~
Can you believe that I was waiting for this info from my first job as UX junior designer and none explain that like you? Finally, I resigned to this company trying to figure it out few things. Well known fintech company. This info is actually pure gold....thank u from Australia. The majority of information on design systems revolves around creating a basic version and this is ok but no enough. However, the experience of working with a design system already made it within a large corporation is vastly different, and you nail it. You made a clear and spectacular 15 min video explaining something that many senior UX can't do it. Thank u again.
I am so glad that this video was helpful. I experienced it myself so I know what's lacking out here. I've learned the basics of how to create some basic style myself. But after I joined eBay, I realized that tech companies have a dedicated team on creating design systems, and most of us need to learn how to use it, rather than how to create one. I hope more people can find this video 😄
P.S. A shortcut to select the right layer in design system is holding Command or Control so that you don't have to click multiple times. (Shout out to Theo for reminding me)
Help me shape my Figma course 👉 forms.gle/qZU7hVN7gT2o7Tbe9
Figma 👉 psxid.figma.com/mtvfdvfjvpps
Figma professional plan 👉 psxid.figma.com/sp3ulqgt744y-cb44ct
Enjoy!
I love how fresh, informative and useful your videos are.
Thank youuu
I'm just starting my journey from Graphic Designer to UX Designer! Your videos have been super helpful, thanks a lot :D
Thank you Alejandra!
I found your channel yesterday and I couldn’t be more happy that I did ❤️!
I’ve been binge watching ur videos and Im loving it so far ❤️
Yay! Thank you!
thanks for always clearly defining things.. small thing but it makes such a difference! with so much ui/ux jargon, i find it's easy to forget and lose focus when i'm designing...!
Great video again ! Love your videos
As a tip, we can select a sub-element by holding ctrl in Figma, and click. Instead of clicking several times to access it
😮 O.M.G... That works so smooth 🤣🤣🤣 (Command in Mac) I have to add this in my video description.
Okay I've just added this to the description and the pinned comment. Thank you!!
so amazing ... your videos have really helped me as a ux designer ! thank you
Thank you Vanita!
4:09 instead of clicking multiple times for selecting an element just hold cntrl/cmd and then click that element.
Hope it helps😇
Totally! Thanks so much for sharing.
I am starting with figma.
Thank you for this wideo ❤
You're welcome 😊
This tutorial was very helpful. I would like to see more practical tutorials like this where you use popular design systems for ios and android. I'd greatly appreciate it if you could tell me what steps should be taken in order to access components from the Design System file directly into my project file without switching tabs(import? publish library? share? copy link?)? 💯👍🤓
Thank you for this. Could you please make another for a mobile design?
Thank you for such a detail video.
That was awesome, thank you. Really useful
A set of Figma components is not a design system UNLESS those components are also implemented by the developers technically. Often, this is visible in Storybook. Otherwise it is a set of components. A design system is as much about the end code as the designs in Figma. So if the developers don't have the component already built code and the names/tokens are not the same as their components then you are not working with that company's design system.
You're right because a design system is filled with elements that are already coded into the website so if something needed to be changed it would be through the design system and like you mentioned it probably needs to be developed for it to actually be within that system
Thank u so much …as a beginner this helped
Thanks for letting me know!
It's a wholesome video! Thanks.
At 15:19, what exactly did you do for the column "Photo / Vel cras auctor ...." to double ??
Thank you!
Thanks for this amazing video really appreciate
excited
Hello! Please can you tell me which computer will be the best for ui/ux designer? Thanks!
Great video thank you ❤
Is the requirement to create one's own icons and components to avoid accusations of plagiarism still prevalent? I believe few years ago, we have still been taught to create original components on sketch or icons on Illustrator to prevent potential issues. I'm curious if this standard has shifted ?
Ohhhh, I usually use material icons in 90% of my products, check out here: fonts.google.com/icons
These are high quality open source icons from google that also make it easy for engineers to implement.
If you are working with a company that has its own design system and icons, then use theirs. But other scenarios, I suggest you to go with material icons.
Awesome - thank u
Here I'm again refreshing my brain data😂
make more vedios on figma please you teach exccelently
hey alina so If I have to do changes in design system at one place will it reflect everywhere like where the element is used basically I want to ask can I use this for making my own product ?
and will it be okay to use this for making my own product
Great question. You can use a pre-built design system for your own product. But I'd suggest using the ones designed for everyone to use it like tailwindui, instead of brand-specific ones like Shopify/ Uber.
After all, your design needs to speak for its brand identity, not some other company's brand identity. Larger Design system like tailwindui may allow more customization and better off with IP.
It’s very helpful 🎉
I am really thank you to give this video. It is very helpful .so,You will give the more and more video . please
Thank you, I will!
so with design systems are they used with the components included? and the templates?
i havent see component overview on my design system whats the reason?
Everything turned purple when I was adjusting the side panel 😭 idk how to put it back how it was 😂
支持支持❤
谢谢谢谢❤
dammm its sooo diccicult as helll. Now I am feeling like seriously i don't know anything about figma. My dream of working in a big company seriously narrowing down a bit now.
Oh nooo, there are some other tutorials videos I created on wireframing, prototyping, and auto layout. To be honest, working with a design system won’t come natural. I’d suggest to start from other places 👍👍
thanks for your response@@AlienaCai
.