Learn UI UX design by copying - Task 1 / Web Design
HTML-код
- Опубликовано: 6 июл 2021
- One of the best ways to learn web design is by copying. To make things super easy for you, I've created the entire exercise on Figma, all you need to do is to go to the link below, duplicate the project and start practicing.
www.figma.com/file/y5xYCA0wKd...
Copying isn't the funniest thing about design, but the more you copy (from good design) the faster you learn.
More exercises to come, stay tuned.
Add your figma link here for review
docs.google.com/spreadsheets/...
-
Need UI/UX Mentorship? Book a session with me on Clascity
clascity.com/classes/83/caleb...
-
Feeling generous? Support me on Patreon
/ kayungcaleblai
-
My startup - A Skill-Sharing Platform to teach and learn anything
clascity.com/
-
Follow my work on Dribbble
dribbble.com/Caleblai
-
Personal portfolio
-
My design agency
www.alphaio.co/
-
Follow me on Instagram
/ caleb_kayunglai
this is amazing bro this is what i am searching for many days
thanks for it
Glad to hear! I may make a follow up video for another task if people want to keep learning
Thanks, Caleb!
ur welcome :)
Would you say it's better to just replicate the layout with rectangles instead of specific fonts and images? This eliminates the need to find the correct fonts and images. You simply place a rectangle over the website elements. This helps you become of the layout, which is the end goal. Glad to hear your opinion on this approach.
Sure yea, you can do a wireframe type of layout. whatever you think it's best for your learning!
@@KaYungCalebLai Regardless of what method, it takes TIME. I'm thinking of sketching the wireframes instead to save time.
Hi, Caleb thanks a lot for this video. So I used the link to the site but it turns out they changed their landing page and the image of the boxes on the right isn't there anymore. I can't find a suitable replacement on Google either. What would you suggest I use?
Thanks for the heads up! I just updated the figma file. You can find the new design in there with a couple of images to help you get through the task. Hope that helps!
Hi Caleb, what about when you want to copy app designs? How would you do it?
You mean mobile app? you can find some high quality prototype on ui8. this one for example ui8.net/whiteuistore/products/iotask-mobile-ui-kit then study their design system
nice 👍
Thanks!
Hey I am new to this field. After asking with so many seniors , I got to know that I must have my portfolio to get a job( in behance or dribbble) . Okay so I have created my account on behance but i dont have anything to upload there. I followed some UI design tutorials from youtube and posted there . I still need to learn UI design basics like typography, spacing , alignment, padding, border radius, fonts, typefaces and much more. I have a idea in my mind that I will redesign my university's mobile application because it is very bad user friendly. How can i start ? I found your video after searching so much on RUclips. I just cant design a whole application from scratch at this level.
Hey yea, check out my tutorial series, you should be able to learn the basic of graphic design. Then do these design exercises.
hey! I did the exercise and I am trying to comment the figma link but comment is not showing up, idk what might be the reason, are the comments under review? or youtube bug? can i send you the figma link somewhere for you to review. btw Thanks for this series!!
Yea I think youbute blocked the link, you can add the link here instead~!
docs.google.com/spreadsheets/d/1gNdEPXPE1-7lyi08NwX1WuhJW6XB30mhyav7ddH4qQw/edit?usp=sharing
@@KaYungCalebLai Added the link, please check :)
@@mohammedyaseen6835 This is looking really sharp, great job! I think it'll be better to share the working prototype as well. so I can see how closely you match up with the original and if you followed the grid or not. But overall, great job! I hope you learn a lot from the first exercise. Wait for the next one :)
@@KaYungCalebLai learned alot about spacing, typography and colors system and I did follow the grid. Thank you for the feedback, waiting for the next challenge :D
Graphic Design or Coding?
I like both too, pls help
If you're for money, pick coding
Graphic design or medicine? I like both. Please help me.
OMGGG this is me rn
finished vet medicine school, been working for a year, now I'm learning graphic design! do some internships to see more clearly how the work will look like ;)