Dive into the world of collaborative design with Figma, the leading web-based design tool that has transformed the way designers and developers bring ideas to life. In this video, we explore Figma's groundbreaking 2023 updates and how they are redefining collaborative design and development. Discover the power of Dev Mode, new prototyping capabilities, and other features that make designing in Figma a breeze.
Join me as I walk you through the latest features Figma rolled out in 2023, showcasing how these updates enhance collaboration, speed up the design process, and foster innovation. Whether you're a seasoned designer or a newbie looking to get a grip on modern design tools, this video is your gateway to mastering Figma.
Try Figma for free here(affiliate link):: https://bit.ly/Try_Figma
Educators get it free here: https://www.figma.com/education/
Download images used in tutorial: https://bit.ly/figma_images
Why Figma should be your choice for UI: https://teachers.tech/learn-ui-design-with-figma/
Try Figma's Whiteboard FigJam: https://youtu.be/eSrPZQDXWhw
0:00 Introduction
0:33 What is UI Design
1:32 Signup for your FREE Figma account
2:04 Quick tour of Figma
3:30 Explore the Figma Community for templates
4:36 Finding and opening a template in Figma
5:37 Tools for modification and design
7:50 Rearranging the template
9:21 Deleting and naming
10:35 Adding frames to start your design
11:51 Setting your background color
12:32 Adding a shape
13:35 Adding a button with text
16:08 Naming the button layer
17:23 Grouping objects
18:11 Adding more text
19:10 Adding an image in Figma
20:58 Modifying images
21:48 Adding a logo
22:09 Cropping images
23:16 Figma Community - Find iPhone status bar
25:16 Adding second frame
25:59 Adding and modifying shapes
26:27 Curving corners of shapes
27:50 Explore Figma Community - Phone icons
30:57 Inserting shapes as image placeholders
37:33 Adding a circle shape with a stroke around
39:03 Adding more phone icons to the design
39:44 Adding shapes for image placeholders for multiple images at once
43:00 Pause the video here to create a frame on your own
43:14 Prototyping your design
DISCLAIMER: This video and description contains affiliate links, which means that if you click on one of the product links and end up purchasing it, I’ll receive a small commission. This helps support the channel and allows us to continue to make videos like this. Thank you for the support!