Design a simple UI from scratch for a Food App in Figma - For beginners
Вставка
- Опубліковано 10 січ 2022
- Learn how to design simple screens for a food app in the Figma design tool. Full course: designcode.io/quick-apps-figma
📂 Figma file
➡ www.figma.com/file/xjhsy4eEFS...
🔗 Links mentioned in the video:
➡ Apple Design Resources: developer.apple.com/design/re...
➡ Discover design: dribbble.com
➡ QOFOOD - 3D Food and Drink Icons: www.figma.com/file/Owhw4yTkod...
➡ Odamam 🍔 - 3D Illustration: www.figma.com/file/iKPJwQyYuB...
➡ SALY - 3D Illustration Pack: www.figma.com/file/Mi9NrsNnAC...
🖥 Visit our website for more design tutorials
➡ UI Design Quick Apps in Figma: designcode.io/quick-apps-figma
➡ Figma handbook: designcode.io/figma-handbook
➡ UI design handbook: designcode.io/ui-design-handbook
➡ iOS design handbook: designcode.io/ios-design-hand...
➡ UX design handbook: designcode.io/ux-design-handbook
👋🏻 Let's connect!
➡ Twitter: / titepommee
➡ Instagram: / sourasith.design
🎵 Music from Uppbeat (free for Creators!):
➡ uppbeat.io/t/soundroll/feelin...
➡ License code: TNFSVAFXIFYGZGY1
#figma #uidesign
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
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 😊
Very helpful! Thanks for this great walkthrough!
Glad it was helpful!
Nice design & thanks for sharing the FIGMA file. This video is very useful for web developers with no design experience.
Impressive, Love your work and teaching method. 💗
this video was really all i needed rn
Thank you for sharing, the nice tutorial is just simple for a newbie, useful !
This was very helpful I had no idea you can do this much with figma!! WOW!!
Glad I could help!
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 ☺️
Super inspiring! 😊 Keep it up.
Love this UI
Thank you very much, very helpful and gracious work!
Glad you liked it!
😊thanks this was very useful to me you are amazing at your work
thank you for this video u saved my academic life, commnty
Thank you this video was very helpful ❤
You're so welcome!
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 👍👍
How did you distort the circle into a blob?
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?
Please can you help me with the resources you used for the design?
thanks for your tutorial finally i design a app
Glad I could help!
Thank u soooo much thats soo helpful
Glad it helped!
hello i dont understant,please help. How add statis bar from assets. I can't do it
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
You are using a Macbook right? Will it work if i do the same thing in windows?
great tutorial thank you so much!!!!!
You're very welcome!
Really Cool
Thanks 😊
I tried to duplicate the 3d illustration but the option wasn't there. And how do I download the fonts into figma
Hi... im not getting the status bar in my figma.. how do i add it
it was really nice Thank you
Glad you liked it!
this is great
Very good and simple example for beginners do rocking ☺️ kindly share more Vedio for beginners
Thanks 😍
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
UI means focusing on the design? and the UX job is to bring the UI design to work?
amazing💫
Thanks 🔥
when i search assets for "dots" it comes up with no results, why?
Thanks!
Welcome! :)
After this video, I had a desire to create an app)
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
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.
how do you access status bar in assests
How do I add these assets to my projects?
I can design, but I never know how to start... This was pretty useful, thanks!
Can you link the Design Code UI kit plz?
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
Vodafone Mobile App UI UX Design Using Figma 🎉
Full Video: ua-cam.com/video/Oky0Q7mZVH8/v-deo.html
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
Would we still use the iOS kit for Android?
apple kits i can use on android ?🤔
In 2:27 how did she make the eclipse into a .... different shape?
May i know what is the name of UI is this pls any one tell me this
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?
how do you add the assets?
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
How do i get libraries in figma?
how you bring illustration from one page to another
Please show how your color selection methods
how to get the UI kit?
How to do the frame?
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
There are some steps that have been cut the specifications and that's where I lose track
How can I use the free UI kit?
nice
Cannot find the duplicate icon:(
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??
do you do such creations for companies?
Can someone demonstrate interface metaphor for me?
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
I'm not able get anything in assets do I need to purchase premium version ?
same here
videonya keren, moga tambah berkembang''''''''''''
how can i find status bar, home indicator in the asset ?
You can get a copy here: www.figma.com/community/file/984106517828363349
Great with thanks
You're welcome!
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
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
How about you show how to setup ios in figma
Thank-you for setting up Korea subtitle. It's gonna help me
can you please give me community link
Mam...your teaching level is super but please like slow video upload..to usefull for beginners
you dey madddd
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.
cant use iOS 15 KIT . any can help?
mee too bruh .did you find any solution
Tank you sourasth🤣👍👍👍👍
Welcome 😊
Thanks!
thanks to you
😍
I didn’t see status bar in my assets ..how do I go about it ?
Which software is this?
It's Figma. :)
2:25 how you convert this ellipse into curvy shape ???
After creating a ellipse just double tap it
You can adjust as you wish
How do i download UI Kit in my projects? I can only copy from the whole ui kit file, how do i search assets just in my project like you did on 1:17, without need to switch between files?
Do you see Asset next to Layer? It's on the top left side. You will see the search field. Next to it, there is a book icon. Click on it, and you must activate the IOS 15 UI Kit from Figma by Joey Bank. Once it is activated, you can search in search example: Status bar.
@@DesignCodeTeam i cant find dots in asset
Those blobs area pain to create in code unless using a png. 😅
amazin!!!!!, please give me tutorial again
Thank you! We have several tutorials for you :)
mbak satu ini keren kali
Can u please tell me How much do you charge for this UI design?
❤
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.
The buttons are too small
Hi! I would like to know how to get the assets that she added by searching in the assets bar. I guess assets have to be imported from somewhere as I don't get anything by searching in my asset bar. Can someone help me?
I had the same doubt...please will u help me if you got the doubt solved...
nice video but the music makes me have anxiety
UI Design అంటే ఏమిటి : ua-cam.com/video/MXxT4WoJqyA/v-deo.html
UX Design అంటే ఏమిటి :ua-cam.com/video/V4MVoXA3-j4/v-deo.html
very good but too fast
hey, there's a channel named Wilson Wings that I thinks been reposting ur stuff