Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

Introduction to Wireframing

Well done!

You have completed Introduction to Wireframing!

Sign up for Treehouse Back to Library
Preview
Video Player
00:00
00:00
00:00
  1. 2x 2x
  2. 1.75x 1.75x
  3. 1.5x 1.5x
  4. 1.25x 1.25x
  5. 1.1x 1.1x
  6. 1x 1x
  7. 0.75x 0.75x
  8. 0.5x 0.5x
Use Up/Down Arrow keys to increase or decrease volume.

Sharing Wireframes in Figma

2:59 with Daniel Montgomery

In this video, we’ll review how to share your design in Figma with stakeholders and collaborators, detailing how to set permissions, assign files to projects, and manage access for real-time feedback.

Welcome back, in this video, 0:00
I'll show you how to share your design with stakeholders and collaborators. 0:01
Once you're ready for 0:04
their feedback to start, I'll head up to the share button in the top right corner. 0:05
Once clicked, we see a pop up, you'll notice a notification saying to invite 0:11
people to edit this file, we must move this draft into our projects. 0:15
This means we need to assign the file to a project first, 0:19
below there's a field to add the email of a user we want to invite. 0:22
For this demo, I'll use testattest.com permissions can be set to can view or can 0:25
edit, allowing users to either just view the design or collaborate in real time. 0:30
I'll delete the email for now, underneath the email input, we have access permission 0:35
settings where we can adjust who has access and in what capacity. 0:40
If I click to adjust these settings, another popup appears, if you've used 0:43
collaborative tools like Google Docs, these share settings will feel familiar. 0:47
You can choose whether anyone with the link has access or 0:51
restrict it to specific people you invite via email. 0:54
You can also decide what actions they can take, viewing, 0:56
which also allows commenting or full editing permissions. 0:59
To grant edit permissions, you'll need a paid professional plan, keep in mind that 1:03
adding users with edit access will automatically add them to your team, 1:07
which will increase your billing fees. 1:10
However, users can view your file for free with no limit on the number of viewers. 1:12
Alternatively, collaborators can make a copy of your file and 1:16
edit it themselves for free, 1:20
but they will no longer see any updates you make to your file in real time. 1:21
For extra security, you can add a password to the document, 1:25
which will be required to view, comment, or edit depending on their permissions. 1:28
However, adding a password also requires a paid professional plan, 1:32
let's head back to the main screen. 1:35
Here you can copy the dev mode link to share with developers or 1:39
copy the prototype link. 1:42
If you just want someone to view and 1:43
use the prototype without access to the design file. 1:45
You can also publish your file to the community, 1:48
allowing other users to make their own copy and edit it. 1:50
Lastly, there's an option to get an embed code for 1:53
embedding your design in tools like Notion or Coda. 1:56
Now let's take a quick look at what someone sees when they receive a link 1:59
to your work in Figma. 2:02
When a stakeholder or collaborator opens the link, 2:07
they'll see a welcome to Figma message and be invited to create an account. 2:09
They can sign up with their email or continue with their Google account. 2:13
Once signed in, they can start adding comments if they have edit permissions. 2:17
They'll also be able to select elements, make changes, or add new components. 2:22
This highlights Figma's multiplayer functionality, 2:26
enabling real time collaboration. 2:29
For example, if I select the first card pattern in our design file and 2:31
then switch back to the collaborator view, you'll see that card highlighted in pink. 2:34
That magenta color is associated with my account, indicated by the D for 2:38
Daniel in the corner. 2:42
This shows others what I'm selecting or editing in real time, and that's it. 2:43
Figma makes sharing and collaborating seamless and intuitive, 2:47
with robust options to fit different workflows. 2:50
Join me in the next video, where I'll cover the pros and cons of Figma and 2:53
whether or not Figma is right for you. 2:56