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.

FigJam & Figma Slides

3:52 with Daniel Montgomery

In this video, we explore FigJam and Figma Slides, two innovative products from Figma designed to enhance collaboration. Starting with FigJam, a whiteboarding tool perfect for brainstorming and UX workshops. We then transition to Figma Slides which integrates presentation creation within Figma's ecosystem, offering templates and customization options for a seamless design experience.

In this video, we're diving into FigJam and Figma Slides, two smaller products 0:00
from figma that bring some unique features to the table, let's start with FigJam. 0:04
FigJam is a whiteboarding tool great for brainstorming sessions and 0:08
UX design workshops. 0:12
If you've used tools like Google Jamboard, Miro or Lucidspark, FigJam will feel 0:13
familiar as it also aims to simulate the collaborative whiteboard experience. 0:17
When you open FigJam, you'll see a variety of templates to kick things off, let's try 0:22
out the sharing team updates template it's straightforward and user friendly. 0:26
To start, we're greeted with an onboarding wizard, but 0:30
I'll just click through this and explore on my own. 0:33
At the top you'll find the main menu similar to the one in figma's design tool. 0:37
Here we have all of the menu options that we've come to expect when working 0:42
in Figma. 0:45
We can even add pages to our FigJam file, just like a design file. 0:48
Over on the right, you'll notice features you may recognize from Figma like 0:52
the spotlight function and even an AI generate templates option allowing you 0:56
to create custom templates if you want something beyond what's provided. 0:59
On the bottom toolbar you have options for adding sticky notes like virtual postas, 1:04
which you can place anywhere on the board. 1:08
I'll put one in the green team updates section to show how a team member might 1:11
add a note to update the board. 1:15
But post it notes aren't the only thing at our disposal, 1:17
you'll also find shape tools to add different shapes like squares or circles, 1:20
though I find sticky notes to be more effective in FigJam. 1:24
Since FigJam is a collaborative tool, it's perfect for 1:27
real time interactions where teammates can add notes, shapes and comments on the fly. 1:30
The text tool lets you type anywhere, 1:35
giving plenty of options to express ideas and work together. 1:37
Sections allow you to cluster and 1:43
organize related objects without grouping them permanently. 1:44
You can also add a table to organize data collaboratively, similar to a spreadsheet. 1:49
And there's even a stamp tool for quick reactions like a thumbs up or 1:55
one to show support for ideas. 1:59
To the far right there's a resource panel with stickers, templates, widgets and 2:05
plugins. 2:09
This area is handy for tools you might need during a meeting, like a mood slider 2:09
for gauging team sentiment or a timer for time bound activities. 2:13
The workshop timer can also be found in the menu in the top right corner. 2:16
You can even add lofi music to play in the background while brainstorming or 2:19
wireframing, creating a relaxed atmosphere for collaboration. 2:23
FigJam is a fun, flexible tool worth exploring for free starter plans, 2:27
you're allowed three FigJam files. 2:31
For additional files, there's an add on option at $5 a month, 2:33
moving on to Figma Slides when you open Figma Slides, 2:37
you'll see a welcome message, Meet Figma Slides. 2:40
It's currently in beta and lets you create presentations within Figma's ecosystem. 2:43
Free until early 2025, 2:47
after which there may be a monthly add on fee similar to FigJam. 2:49
After hitting get started, you'll see a selection of templates, 2:53
I'll pick this green one which has a nice look. 2:57
Here you see all of the pre created slides in the presentation, I'll just click add 3:00
all slides and update the header to portfolio review 2025 as an example. 3:05
On the left you can see the slides in the presentation and 3:10
on the right there's a panel with layer and template settings. 3:13
You can change fonts, colors and 3:16
other styling options here to make the presentation match your brand or style. 3:18
Like other presentation tools, you can click and edit elements, resize them and 3:23
move them around, much like you would in Google Slides or PowerPoint. 3:27
The difference here is that it's within Figma so 3:31
you can use features like Smart Animate for 3:33
smooth transitions, making it a seamless part of Figma's ecosystem. 3:35
That's a quick look at Figma Slides, a solid option for presentations, 3:39
if you're already using Figma for design work. 3:42
In the next video we'll go over some of Figma's professional plan features like AI 3:45
tools and developer mode, see you there. 3:49