Design a simple UI from scratch for a Food App in Figma - For beginners
ฝัง
- เผยแพร่เมื่อ 20 ส.ค. 2024
- Learn how to design simple screens for a food app in the Figma design tool. Full course: designcode.io/...
📂 Figma file
➡ www.figma.com/...
🔗 Links mentioned in the video:
➡ Apple Design Resources: developer.appl...
➡ Discover design: dribbble.com
➡ QOFOOD - 3D Food and Drink Icons: www.figma.com/...
➡ Odamam 🍔 - 3D Illustration: www.figma.com/...
➡ SALY - 3D Illustration Pack: www.figma.com/...
🖥 Visit our website for more design tutorials
➡ UI Design Quick Apps in Figma: designcode.io/...
➡ Figma handbook: designcode.io/...
➡ UI design handbook: designcode.io/...
➡ iOS design handbook: designcode.io/...
➡ UX design handbook: designcode.io/...
👋🏻 Let's connect!
➡ Twitter: / titepommee
➡ Instagram: / sourasith.design
🎵 Music from Uppbeat (free for Creators!):
➡ uppbeat.io/t/s...
➡ License code: TNFSVAFXIFYGZGY1
#figma #uidesign
![[TH] 2024 PMSL SEA W1D5 | Fall | เก็บแต้มของจริง คือวันนี้](http://i.ytimg.com/vi/EciIAlCXg5k/mqdefault.jpg)
I don’t think this tutorial is for beginners. I found it way too fast-paced, and there are some points you didn’t really explain. Couldn’t follow it at all. It’s a shame because your design is amazing. For me it was more impressive to see how well you use Figma, than actually learning something myself. Maybe this is for people who have already a basic notion of it.
did you find a way to understand it ?
yeah it's not for beginners
yeah, I totally agree. She didn't say how to upload the Font (I have downloaded but tried so many times to import just couldn't work), how to download iOS 15 UI Kit for Figma (I found the Kit but just can't add it to my draft). she is really good at designing but too bad I can't have all the tool to follow her steps. sigh
@@lookthatpigisflying9694 did u figure out how u add it to ur draft?
hey i don't know if you still need this but i figured it out. for at me at least, i needed to go into the actual figma desktop app's community. It worked there, i could see all the assets even in a new design file. @@hebaashtar3542
Vodafone Mobile App UI UX Design Using Figma 🎉
Full Video: th-cam.com/video/Oky0Q7mZVH8/w-d-xo.html
I followed you way,but when i searched in assets i found nothing it says “no results”
can you please answer this quesrtion
I have ten the same problem
you can search it first from the community
Thank you very much! I completed my very first tiny project! And I am so proud of myself!
Congratulations on your first project! 👏🏻 Your next challenge is to choose another project to improve your skills ☺️
I have two questions : 1) Easy UI Designs is the title of the project or a UI Design kit ? If it's a kit how can i download it ?
2) How can i dowlnoad the Designcode plugin to access the community resources on figma ?
did you find a solution ?
@@marokhlifa7159 nope
This was very helpful I had no idea you can do this much with figma!! WOW!!
Glad I could help!
Nice design & thanks for sharing the FIGMA file. This video is very useful for web developers with no design experience.
Wow, what a coincidence I am watching this video from Nepal and today's Nepali date is 1st Baisakh 2081 B.S. That means today is a new year in Nepal.
So Happy New Year to all
Great video! I found all your videos really helpful and each step well described.
Keep up the good work!
And a happy new year! 👍🏼😊
Thank you 😊
Love this UI
nice very helpful. but it probably will look confusing to people who don't know much/are just starting with figma
Yes it is too fast
Very helpful! Thanks for this great walkthrough!
Glad it was helpful!
UI Design అంటే ఏమిటి : th-cam.com/video/MXxT4WoJqyA/w-d-xo.html
UX Design అంటే ఏమిటి :th-cam.com/video/V4MVoXA3-j4/w-d-xo.html
Slow down you are too fast for beginners if you want to teach other you have to slow down
Slow it down then.
@@TheMediaLogoEditor928 also not just the pace, since video is stated ”for beginners” it would be nice to have her explain what she is doing as she does it ”i click here - to do this, that makes this happen” this video feels more like a showcase of her doing a simpleish design. Supertalented! But as a beginner it would help if it was slowed down both tempo and speaking pace
Bouy
where did she even get her assets from
boahhh @@elixir375
Impressive, Love your work and teaching method. 💗
Thank you very much, very helpful and gracious work!
Glad you liked it!
great tutorial thank you so much!!!!!
You're very welcome!
this video was really all i needed rn
thanks for your tutorial finally i design a app
Glad I could help!
Can you please show how to download and run those kits(apple, UI)? I couldn`t do it.
Did you find out how to download that?
@@nikhilmohan7736 hello bro
Mam can we download in figma we are using windows 10
😊thanks this was very useful to me you are amazing at your work
I can design, but I never know how to start... This was pretty useful, thanks!
Super inspiring! 😊 Keep it up.
Really good. Thanks for it 😀
My pleasure 😊
@@DesignCodeTeam I'm a mobile developer and new to designing. Please continue this type of videos on figma 👍
We’ll definitely post a lot more videos on UI
@@DesignCodeTeam thank you 👍👍
Very good and simple example for beginners do rocking ☺️ kindly share more Vedio for beginners
Thank u soooo much thats soo helpful
Glad it helped!
Thank you for sharing, the nice tutorial is just simple for a newbie, useful !
How did you distort the circle into a blob?
Thank you this video was very helpful ❤
You're so welcome!
it was really nice Thank you
Glad you liked it!
In 2:27 how did she make the eclipse into a .... different shape?
After this video, I had a desire to create an app)
Thanks for your video. However in my opinion the music is distracting
amazing💫
Thanks 🔥
Really Cool
Thanks 😊
how can you find what you need in the assets? whenever I type a component it doesn't appear, only give me the " no result " :( do I need to download it or something ?
same issue
will come back here in a few weeks time, i think i lack basics cz i cant understand since the font instruction at the beginning
hello. I'm totally new to UI design. can you please show slowly or tell how you did bubble shape when coloring. I couldn't do it
Hey at 2.43 she draws another one - so when you draw a circle click the symbol on the top which appears near component one that allows you to deform the shape
Please can you help me with the resources you used for the design?
i used to design this beautifully ...i was so hopefull, then i learned how real world apps try to implement their design as fast as possible and they want you to use angular material components who are such a pain in the ass to rewrite and you end up doing as much as possible from the design, and for the love of God how can i use semibold in html??
Mam...your teaching level is super but please like slow video upload..to usefull for beginners
There are some steps that have been cut the specifications and that's where I lose track
Thank you for this detailed, easy to replicate tutorial. However, I cant tend to find fonts on the User Interface guidelines. Maybe I ain't doing something right or the site's been redesigned. Please can someone kindly put me through?
Ok video... First dont just show what to download, show how you download it too! I think many have this problem and cant even start ur tutorial cuz they are missing this step.
this is great
UI means focusing on the design? and the UX job is to bring the UI design to work?
Thanks 😍
Hello Can I ask something? How can I add the status bar to Assests? I got the UI kit to apple but I couldn't apply the status bar to Assests
You can copy directly in the iOS 15 UI KIT and then paste to your Figma page.
when i search assets for "dots" it comes up with no results, why?
Why I feel like I wasted my time here clicking on the links given and then finding those are just view only files. What I have to do with that..Like seriously...girl your should have provided the open files so that we can practice.
I DIDINT find the Angular buttom in Fill why ??
Please show how your color selection methods
You are using a Macbook right? Will it work if i do the same thing in windows?
Thanks!
Welcome! :)
Do I need to stick with the same hight always? What if I have a lot of content to be displayed on the same screen?
nice video but the music makes me have anxiety
What about the design of a tablet?
Thank-you for setting up Korea subtitle. It's gonna help me
I'm not able get anything in assets do I need to purchase premium version ?
same here
I tried to duplicate the 3d illustration but the option wasn't there. And how do I download the fonts into figma
I need a tutorial for this tutorial
Hi... im not getting the status bar in my figma.. how do i add it
mbak satu ini keren kali
Great with thanks
You're welcome!
very good but too fast
videonya keren, moga tambah berkembang''''''''''''
hello i dont understant,please help. How add statis bar from assets. I can't do it
Those blobs area pain to create in code unless using a png. 😅
Cannot find the duplicate icon:(
Thanks!
thanks to you
how you bring illustration from one page to another
Can you link the Design Code UI kit plz?
How about you show how to setup ios in figma
Would we still use the iOS kit for Android?
you dey madddd
Tank you sourasth🤣👍👍👍👍
Welcome 😊
May i know what is the name of UI is this pls any one tell me this
How can I use the free UI kit?
could u tell me how did you create this kinda cool color i tried but i couldn't please teach about us
about it to as
How do I add these assets to my projects?
how do you access status bar in assests
how to add illustrations to my page ? ))))
do you do such creations for companies?
How do i get libraries in figma?
i am not getting anything in assets. What to do now???
Do you have a paid Figma account? If not, you'll need to go directly to their file and copy and paste it onto your canvas.
nice
apple kits i can use on android ?🤔
How to do the frame?
Tem como eu criar um projeto que de para digitar depois? Tipo criar um input text( área) um bloco branco que da pra digitar nele. Um bloco grande. Tipo criar um bloco de notas no figma,isso é possível?
pelo que eu entendi do seu comentário, você gostaria de algo como o FigJam?
accent so cute
how to get the UI kit?
how can i find status bar, home indicator in the asset ?
You can get a copy here: www.figma.com/community/file/984106517828363349
The buttons are too small
how do you add the assets?
2:25 how you convert this ellipse into curvy shape ???
After creating a ellipse just double tap it
You can adjust as you wish
amazin!!!!!, please give me tutorial again
Thank you! We have several tutorials for you :)
Can someone demonstrate interface metaphor for me?
😍
can you please give me community link
Hey where are i found the assesst thats are use in your design first to last. please response me.
I can't share the links here because they will delete. Go to Figma Community, tap Joey Banks," the creator" and select iOS 15 UI Kit :)
@@DesignCodeTeam thank you so much 🥰🥰
@@DesignCodeTeam Thanks