- [Instructor] Figma allows you to import…a range of image types into your design projects,…like JPEG, GIF, PNG, SVG, content you copy paste,…and those images are brought into your designs…as background images in frames depending on what they are.…If they're an image they'll do that,…if it's vector it'll stay vector and be editable.…In this video you'll explore adding a few image files…and kind of learn how they work,…and also mask content.…With MyTravelApp open let's zoom to fit everything.…So you can press Shift + 1 so you can zoom to fit.…There are a bunch of zoom commands…we can use as we go here.…
And what I wanna do is I wanna put an image…on a couple of these frames.…So to place an image, you can learn the shortcut later,…but you can also come up here to shape tools…and Place Image,…or come under the file menu and do the same thing.…Choose Place Image, come to the Exercise Files folder,…and we're gonna come to the 03 AddingContent folder.…And you should see we've got hike1…and a whole bunch of images here.…
Author
Released
6/25/2018- Creating a Figma project
- Importing from Sketch
- Working with frames and shapes
- Adding and formatting text
- Drawing, components, constraints, and versioning
- Creating a prototype
- Previewing your designs on mobile devices
Skill Level Intermediate
Duration
Views
Related Courses
-
UX Design: 1 Overview
with Chris Nodder13m 48s Intermediate -
UX Foundations: Interaction Design
with David Hogue3h 33m Intermediate -
UX Foundations: Prototyping
with Diane Cronenwett1h 18m Beginner
-
Introduction
-
Using the exercise files2m 1s
-
1. Set Up a Figma Project
-
What is Figma?3m 47s
-
Sign up and take a tour3m 56s
-
Setting up local fonts1m 42s
-
Import from Sketch4m 26s
-
-
2. Adding Content
-
Set up frames4m 53s
-
Working with pages3m 52s
-
Creating and editing shapes5m 38s
-
Drawing4m 35s
-
Images and masking7m 29s
-
Adding and formatting text5m 32s
-
Organizing with layers3m 21s
-
Working with components4m 10s
-
Applying constraints6m 33s
-
Versioning3m 46s
-
-
3. Prototyping
-
What is prototyping1m 30s
-
Create a prototype5m 21s
-
-
4. Teams
-
Setting up a team4m 9s
-
Creating a project2m 43s
-
Working with Team Libraries7m 26s
-
-
5. Collaborating, Sharing, and Exporting
-
Live Device Preview3m 27s
-
Sharing7m 4s
-
Commenting4m 21s
-
Exporting assets4m 8s
-
-
Conclusion
-
Next steps38s
-
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.
CancelTake notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.
Share this video
Embed this video
Video: Images and masking