How to Create Beautiful Mobile User Interfaces with Figma
Hi, guys, today I present to you a practical Figma Tutorial for total beginners. I will share some helpful UI design tips and we will design mobile screen of the app from scratch. We won’t use any advanced functions like auto layout, the reason behind this is that I want to present different approaches to designing in Figma and from a beginners perspective - using advanced functions at the beginning may be challenging.
My comments (chapters):
00:34 Design idea
00:59 Color selection
01:32 Color contrast ratio
02:39 Device frame
03:05 iOS Status Bar Figma Community
03:43 Layout grid and 8pt grid
06:35 Icon sources
07:31 Bounding boxes
10:35 Rounded corners
20:19 Photo sources
21:12 Filling element with photos
22:22 Color shades generation
29:49 New device frame
34:03 Style adjustments
34:20 Device mockup & finished presentation
Websites mentioned in the video:
https://maketintsandshades.com/ - Color shades generation
https://webaim.org/resources/contrast... - Color contrast checker
https://coolors.co/ - Color themes generator
https://www.flaticon.com/ - Icons source
https://elements.envato.com/ - Other resources like photos
Article about 8pt grid, mentioned in the video:
/ the-comprehensive-8pt-grid-guide
Watch my UX Design Tutorial for Beginners:
• UX Design Tutorials
#uidesign #figma #productdesign#ui #figmatutorial #designprocess
Смотрите видео How to Create Beautiful Mobile User Interfaces with Figma онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Kerev Design 01 Октябрь 2021, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 955 раз и оно понравилось 47 людям.