►
From YouTube: Intro to how GitLab is using Figma
Description
We reviewed the current work that's been happening in Figma, and have discussion around the app and concepts that differentiate it from Sketch.
A
Yeah
awesome
all
right,
so
yeah
we're
just
catching
up
quick,
I'll
jump
right
in
because
I
know
I,
there's
no
like
I've
got
like
a
list
of
things.
I
wanted
to
get
to
run
through
and
then
I
know
it's
a
short
amount
of
time,
but
I
didn't
want
to
catch.
You
Daniel
like
at
the
end
of
your
Friday
and
have
you
going
your
weekend
so
so
I'll
jump
in
and
cover
things
and
feel
free
to
interrupt,
and
if
we
don't
get
to
everything,
that's
that's
totally
fine.
A
We
can
create
another
one
of
these
sessions
but
at
least
to
give
like
high
level
and
then
we
can.
We
can
go
from
there.
So
I'll
go
ahead
and
share
my
screen
here,
one
second:
let's
just
do
all
right.
Can
you
see
that
all
right,
yep
my
calendar,
so
I'll
start
by
just
sharing
like
the
current
work,
we're
doing
in
figma
and
kind
of
where
that
is
at
and
then
I'll
just
jump
into
the
tool
itself
and
what
we're
doing
and
I'll
talk
a
bit
fast,
but
but
again,
please
feel
free
to
just
tell
it.
A
You
know
you
can
expand
any
of
these
in
that
epoch
and
look
apologies
for
my
internet
little
warning
there,
and
so
we
have
a
list
of
those
questions
and
the
answers,
some
resources
and
then
below,
there's
sub
epics
and
each
one
of
those
is
kind
of
related
to
a
portion
of
the
work
we're
doing
so.
There's
figma,
like
page
templates,
there's
components
and
documentation.
A
The
two
that
we've
really
focused
on
right
now
is
documentation
and
components,
documentation
you
notice.
A
few
of
these
are
closed.
We've
created
a
separate
contributing
figma
document
in
the
design
project
that
outlines
those
decisions
that
we've
made
and
some
of
those.
As
far
as
like
how
to
how
do
we
name?
How
do
we
organize
them?
How
do
we
publish
what's
our
perspective
on
plugins,
etc?
So
it
a
lot
of
it
mirrors
our
sketch
contributing
deal,
but
it's
very
specific
to
figma,
so
I'd
recommend
checking
that
out
and
then
our
components.
A
We
have
a
list
of
everything
that
we're
doing
to
in
figma
to
have
parity
with
what's
in
sketch,
and
you
can
see
there's
there's
several
of
these
that
are
closed.
There's
there's
many
more
that
are
still
open,
so
anyone
can
can
contribute
to
it
and
participate.
You
don't
have
to
have
like
a
pilot
seat
or
a
paid
seat
to
do
so,
and
the
contributing
kind
of
goes
into
that
a
little
bit
more
since
any
one
kind
of
a
free
figma
account.
A
You
can
essentially
create
a
draft
and
then
anybody
can
review
it,
and
we
can,
you
know,
bring
it
into
Global's,
and
so
I
won't
go
through
that
too
much.
But
there's
you
know
those
issues
you're
there,
let's
see
here,
I'm
going
to
jump
in
the
one.
That's
just
complete,
really
quick,
all
those
focus
on
badge
just
to
show
you
the
kind
of
the
effort
we're
doing
around
it
for
each
one.
A
We
are
capturing
like
what
are
all
the
variations
that
we
have
in
sketch
and
you
know
making
those
like
checklist
so
that
we
just
make
sure
that
we're
having
parity
and
then
in
most
states
or
you
know,
different
variants.
We
link
to
the
actual
component
in
figma,
since
we
can
just
share
directly
to
that
a
design
file
and
then
same
as
we
have
with
a
lot
of
our
sketch
assets.
There's
a
checklist
for
assignees
and
reviewers
to
walk
through.
So
you
know,
anytime,
anybody
creates
an
issue
for
a
new
component.
B
A
It
gets
closed
out
so
so
that's
that's
kind
of
the
work
we're
doing
around
that.
At
the
moment
we
have
like
five
seats
like
paid
seats
that
we're
using
for
like
the
gig,
the
get
lab
team,
but
it's
like
I
mentioned,
like
anybody
can
still
contribute
and
we're
working
on
other
resource
allocation
to
you
know
see
what
we
do
with
with
the
team
and
getting
everybody
access.
C
A
I'll
jump
into
to
figner,
really
quick
and
just
to
back
up
the
reason
we're
exploring
figma
is
obviously
that
the
tool
you
know
it
very
much
aligns
with
remotes
in
the
sense
that
you
know
it's
built
for
remote
teams.
It's
built
for
collaboration
for
async
work
and
a
lot
of
its
features
really
support
that,
as
well
as
the
thought
of
everyone
can
contribute
right.
The
ability
to
to
have
a
tool
that
can
be
used
on
almost
any
device
or
platform
and
you
know,
doesn't
require
sketch
on
a
Mac.
A
It
can
be,
you
know,
separate
from
any
kind
of
repo
or
get
knowledge
to
access.
You
know
with
commits
and
stuff,
so
there's
a
lower
barrier
to
entry
for
anyone
to
contribute.
You
know
they
can
create
in
Sigma.
What's
called
a
draft
like
duplicate
the
file,
do
their
own
work
on
it,
share
it
and
we
can
bring
stuff
back
into
Global's
as
necessary.
So
it's
very
much
in
line
with
with
it.
Everyone
can
contribute.
A
So
so
that's
a
little
bit
about
like
everything,
we're
doing
and
any
questions
on
any
of
that.
Not
for
me,
okay,
all
right.
So
so
then,
what
I've
got
on
the
screen
here
is
just
the
Sigma.
Like
our
get
lab
account.
You
can
see
that
I've
got
just
two
files
here
that
are
actually
shared
publicly,
and
so
one
of
those
is,
is
our
Global's
which
I'll
get
into
and
another
one
is
a
another
tool
that
I
had
created
some
time
ago,
just
some
accessibility,
blue
lines
so
like
ways
to
annotate
design
files.
A
These
are
just
shared
publicly,
so
that
other
you
know,
designers
could
actually
duplicate
these
files,
use
them
and
have
access
to
them.
So
within
that
we
also
have
like
these
are
all
our
files
in
our
and
our
team.
We
have
our
Global's
like
I
mentioned.
That's
also
published
I've
got
some
copies
of
the
sketch
documents
in
here
just
for
reference.
A
We
have
templates
so
that
if
anybody
is
building
a
new
component
or
an
icon,
we
have
like
pre-made
templates
for
them,
so
like
jump,
an
icon
placeholder
for
the
name,
the
actual
you
know
a
su
ID
and
then
you
know,
let's
see
here,
we
have
room
for
icon
and
key
lines
and
exploration
with
the
grid,
so
everything's
kind
of
setup.
For
somebody
to
pick
up
some
things
and
run
with
to
try
to
make
it
easy
so
so
we've
got
there,
there's
also
resources
that
we've
kind
of
grouped
under
our
team
account.
A
So
there's
you
know,
there's
like
another
design
system
from
LexA
comets
that
was
kind
of
an
early
reference
like
cursors.
If
anybody
needs
like
a
cursor,
you
know
like
symbols
and
stuff,
as
well
as
those
blue
lines
that
I
mentioned
and
there's
also
some
resources
for
documentation,
and
this
is
basic
symbols
and
styles
that
we
can
use
as
headers
that
don't
mix
with
our
actual
design
library,
and
in
that
way
we
can
kind
of
annotate
design
files
and
such
without
having
any
kind
of
no
ways
be
brought
in
with
styles.
A
Like
you
know,
somebody
would
wonder
like
well,
should
I
use
this
design?
Well,
you
know
it's
actually
just
part
of
the
documentation,
so
I'd
be
separate.
So
so
it's
kind
of
the
the
lay
of
the
land
I'll
jump
into
our
Global's
file.
Unless
and
I'll
pause
really
quick
if
there
or
any
other
questions
alright.
A
So
in
our
Global's
file,
we've
got
it
organized
on
the
in
the
pages
similar
to
how
pajamas
is
organized
at
the
moment.
So
these
are
all
you
know
asked
for
items
that
you
would
find
in
pajamas
wanted
to
have
like
a
one-on-one
one-to-one
navigation
structure
so
that
it
was
easy
to
to
kind
of
map.
The
two
didn't
go
like
atomic
design
here,
and
you
know
component
layout
and
pajamas.
We
didn't
want
to
have
two
different
paradigms
there
so
kept
it
very
similar.
So
as
you,
you
know
she'd
work
through
here.
A
You
could
see
that
we
have.
You
know
quite
a
few
things
built
out
and
obviously
we've
got
the
issues
to
fill
out
the
rest,
but
I
will
jump
into
one
of
those
and
then
talk
a
little
bit
about
kind
of
some
of
the
aspects
of
figma
like
and
I'm
and
I
apologize
if,
like
you're
familiar
with
all
this
already,
so
you
know
feel
free
to
stop
me,
but
I
just
wanted
to
kind
of
start
out
a
base
level
just
to
make
sure
everybody
was
kind
of
anyone
who
might
watch
this
later.
A
The
world
is
kind
of
on
the
same
page
of
some
of
the
basic
paradigms
of
figma,
but
just
to
start
figmas,
all
cloud-based
right,
so
there's
no
local
files.
Everything
is
going
to
be
automatically
updated
and
saved,
which
it
which
is
actually
really
convenient.
They
do
have
like
a
99%
like
uptime.
There
was
some
downtime
last
week
which
they
addressed
and
and
had
some
fixes
for,
but
for
the
most
part,
it's
very
reliable.
It's
fast
it's
efficient
and
you
don't
have
to
worry
about
repository
to
manage
your
design
files,
which
I
think
is
very
helpful.
A
One
feature
that
I
that
they
don't
have,
which
I
think
that
will
probably
be
coming
in
the
future,
is
the
ability
to
work
offline.
Obviously,
that
poses
some
problems.
When
you
have
designers
working
in
the
same
file
potentially
working
offline,
trying
to
merge
those
changes
back
in
like
a
visual,
you
know
piece
is
going
to
be
a
little
different
to
merge
and
update.
Then
then,
a
code
base
would
be
so
they
have
some
challenges
there,
but
that's
the
main
limitation
I've
found
to
this
point:
it's
just
not
being
able
to
work
offline.
A
A
C
Quick
question:
yes,
please
so
I
recently
have
been
working
on
the
drop
down
update
for
pyjamas
and
I.
Think
we're
still
working
in
sketch
files
for
that
primarily
so,
if
I
needed
to
change
the
instance
sheet
for
drop
downs,
for
example,
what
I
need
to
also
change
it
here
as
well
or
we're
not
quite
there
yet
would
Sigma.
That's.
A
A
good
question
we're
we're
not
quite
there
yet
I
would
say
that
all
the
work
should
still
be
done
in
in
the
sketch
UIKit,
even
like
badges.
For
example,
I
had
worked
through
some
exploratory
work
with
our
badge
styles
in
figma,
and
then
I'm
actually
porting
those
back
over
to
sketch
right
now.
All
you
know,
iconography
updates,
I'm
doing
are
still
final.
You
know
finalizing
sketch,
so
very
much
I
think
anything
would
be
and
sketch
at
this
point
until
we
actually
said
like
hey
I'll
work
from
here
on
out
would
happen
in
figma.
A
C
B
A
So
one
of
the
when
I
started
using
Sigma,
one
of
the
main
paradigms
was
just
that
that's
different
from
sketch
is
organization
around
like
components
and
libraries
and
publishing
and
how
all
that
works,
and
it
took
me
a
while
to
kind
of
I,
don't
get
really
familiar
with
how
that
works
and
used
to
it.
So
you
know
a
sketch.
A
Obviously
you
know
by
default,
kicks
the
symbol
over
to
a
symbols
page,
and
you
can
organize
your
symbols
and
then
use
instances
and
different
pages
and
and
whatnot
Fignon
is
a
little
different
in
that
it
doesn't
create
that
extra
layer
right
with
symbols.
They
call
it
components
and
a
component
can
just
live
wherever
you
make
it
and
and
stay
there.
I
know
you
can
do
that
sketch
too,
but
that's
kind
of
the
main
way
that
they're
used
in
Sigma
and
in
sketch,
when
you
organize
your
library,
you
do
it
by
like
a
layer
naming
convention.
A
A
Then
it's
the
page
and
then
it's
the
the
frame
and
then
it's
the
actual
component
itself,
so
all
of
those
factor
into
the
name
of
something
how
it
would
appear
in
a
published
library
and
that
took
a
lot
of
like
getting
used
to
for
me.
But
in
the
end
it's
it's.
It's
so
much
more
simple
to
update
so
you'll
notice,
I'll
take
badges,
for
example,
but
I've
got
a
page.
That's
named
badge,
I
have
a.
A
Let's
see
here
a
frame,
that's
called
variants
and
then
I
have
a
component
that
is
called
neutral,
muted.
You
know
double
O
small
and
that
this
one,
obviously
badges,
there's
there's
a
lot
more
variants
there.
So
the
naming
gets
a
little
more
complex,
but
if
I
go
over
to
assets,
you'll
see
I've
got
badge,
I
have
my
badge
variants
and
then
I
can
say:
okay,
here's
neutral
and
so
that
cascade
floats
through
and
then
by
the
time.
I'm.
Here
it's
just
you
know
it's
just
the
last
part
of
the
slash
pattern.
A
For
that,
so
naming
is
actually
quite
a
bit
simpler
like
if
I
you
know,
if
I
change
the
name
of
this
frame
to
examples.
You
know
really
quick
here.
I
could
go
over
here
and
you
can
see.
Oh
a
badge
example
like
it
cascades
to
everything.
I
had
to
change
it
in
one
place.
I
didn't
have
to
go
to
each
layer
and
you
know,
do
a
finder
in
a
place.
So
it's
really
helpful
with
naming
and
like
even
testing
things
out
like
does
this.
Does
this
make
sense
in
the
assets
panel?
I
can
change
it.
A
B
A
Yeah,
that's
a
great
question,
so
let
me
just
explain
how
we're
organizing
items
here
and
that'll
kind
of
dovetail
into
that
you'll
see
over
here.
We've
got
base
like
as
base
frame
and
we
have
variants
and
if
I
go
away
over
here,
I've
got
instances.
So
the
thought
here
is
that
for
something
that
has
multiple
variants,
we
create
a
base
component
right,
so
that
and
I
actually
have
those
in
that
frame
and
then
they'll
propagate
throughout
there.
A
They're
neutral
they're,
not
prescriptive,
but
they
have
all
the
assets
that
might
be
possible
to
use
in
that
component
and
from
there
I
can
duplicate.
It
actually
make
an
instance
of
it
and
then
convert
that
to
a
component
with
that.
It
has
a
little
more
prescriptive
color
and
you
know
typography
other
aspects
of
it
and
then
from
there
we
use
instances
which
are
not
components
but
just
examples
of
how
you
can
work
with
that
actual
component
to
make
different
states
etc.
So,
if
I
was
to
create,
you
know
a
new
badge.
A
Well,
let
me
back
up
really
quick.
So
the
reason
we
do
that
is
also
so
that
changes
propagate
or
any
like.
If
I
come
in
here
and
I,
say
I
actually
want
this
to
be,
for
I
can
hit
that
and
then
every
every
instance
of
it
every
place
that
that
is
used.
It
propagates
all
the
way
through.
So
we
can
update
the
base
component
and,
have
you
know
those
propagating
changes,
really
easy
and
I?
Think
that's
that's
really
helpful.
You
know
if
I
change
the
order,
you'll
see
how
that
changes
throughout.
A
You
know
that
change
persists
through
every
instance
of
that
that's
leveraging
that
base.
So,
let's
just
say,
I
wanted
to
create
a
new
buy
ads.
Really
quick,
I'll,
just
I'll
just
make
this
really
diamond
dirty
with
our
timing.
Okay,
we've
got
that
there.
I
can
just
take
this
and
go
ahead
and
just
making
a
component.
A
So
so
you
see
by
the
the
actual
file
name,
figma
kind
of
identifies
or
not
the
file
name
they're
the
kind
of
a
layer
name
it'll
identify
it
as
a
component
right
on
that
space.
If
I
wanted
to
use
it,
you
know,
I
could
actually
I
can
just
duplicate
it
and
make
a
copy
of
it
and
then
all
of
a
sudden
you
see
I've
got
this
open
diamond,
which
is
represents
an
instance
of
that
component.
A
So
if
I,
you
know
changed
the
color
here,
it'll
propagate,
but
then
what's
nice
about
instances
is
I
could
actually
go
ahead
and
here
and
change
this
color
and
it
doesn't
go
back
upstream
and
and
now
I've
got
the
overrides.
Essentially
so
that's
kind
of
a
nice
way
to
do
it,
but
that's
how
visually
in
the
product
they
treat
the
differences.
And
then,
if
you
wanted
to
use
this,
you
know,
let's
say
if
I
want
to
use
it
over
in
an
icons.
A
A
A
Course
I
made
it
into
a
component
yeah
and
then,
if
I'm
in
this
one
I
can
also
you
know
over
here,
I
can
sit,
I
can
swap
it,
I
can
detach
it.
I
can
go
back
to
the
master
and
it'll
go
back
to
the
to
find
it
what's.
Also
really
nice
about,
figma
is
let's
say:
I
accidentally
delete
that
well
now,
I've
got
these
instances
that
have
they're
not
tied
in
anything
anymore.
I
can
actually
come
over
here
and
say:
I'll,
restore
master
component
and
all
of
a
sudden,
like
I've,
got
the
master
back.
A
A
Yeah,
so
so
it's
it's!
It's
pretty
helpful
as
I've
gone
through
here,
you
probably
noticed
like
I'm,
using
like
keyboard
shortcuts,
etc.
They
are
different
from
sketch
and
what
I
found
is
the
easiest
way
to
to
kind
of
learn
through.
If
you
hit
shift
control
and
question
mark
on
the
Mac
keyboard,
you
will
see
this
panel
pop
up
and
it
goes
through
all
of
the
different
shortcuts.
So
there's
essentials
and
tools
and
view
and
zoom
I
won't
go
through
them
all,
but
they're
all
in
there,
and
it's
really
easy
to
actually
see
kind
of.
A
What's
what's
going
on,
I
know
we're
at
time,
but
I'll
take
a
few
more
minutes.
If
you
guys
are
still
good
I
wanted
to
to
talk
through
just
how
others
would
access
these
files
and
use
them
and
and
kind
of
you
know
the
workflow
for
that.
So
today
we
have
this
Global's
file,
but
we're
not
really
trying
to
do
a
lot
of
work
in
the
Global's
other
than
bring
finalized
designs
in
there.
So
today
what
I
would
do
is
that
would
create
you
know:
I've,
take
this
component
template
perhaps
open
up
in
the
template.
A
I'm
going
to
go
ahead
and
just
duplicate
that
I
get
an
option,
I'll
open
it
and
what
I
would
end
up
doing
is
taking
this
and
I'll
move
it
to
project
I'll,
move
it
to
my
own
drafts,
all
right.
So
now
it's
it's
personal
I'm.
The
only
one
kit
that
can
see
this
and
I
will
just
do
tests
I'm
the
only
one
that
can
see
this
I
can
do
the
work
here
on
my
own
account,
etc,
and
then
this
file
would
be
something
that
somebody
else
would
review
to
bring
back
in
later
right.
A
So
in
that
sense
we're
keeping
the
cut
the
Global's
pure
and
then
being
able
to
still
have
the
ability
to
review.
So
you
know
so,
let's
talk
about
like
permissions
and
ability
to
review
so
obviously
I'm
a
member
of
the
team
and
that's
a
member
of
the
team.
I
could
easily
just
share
this
with
and
they
can
have
access
to
to
mess
with
a
file
to
edit
it
to
duplicate
it
themselves.
But
let's
say
it's
time
for
like
developer,
handoff
right
and
getting
involved
with
like
PM's
or
people
that
might
not
have
a
paid
license.
A
What's
what's
really
nice
is
that
anybody
can
access
a
figma
file
and
there's
there's
kind
of
three
different
layers
to
it.
There's
like
a
paid
my
team
member
account.
There
is
just
another
user
who
might
have
like
a
free
account
and
then
there's
people
that
don't
have
an
account
at
all.
So
all
three
of
those
have
the
ability
to
view
your
design,
assets
and
I
think
that's
really
powerful
with
figma
and
just
because
of
the
like
the
visibility
it
gives
everybody.
A
So
as
a
team
member
I
have
access
to
everything,
so
you
know,
let's
just
say,
I'm
just
going
to
copy
the
link
and
I'm
gonna
share
it
to
myself
in
a
I,
have
a
different
account
and
I'll
show
you
kind
of
how
the
tiers
work
here,
but
I'm
just
pasting
that
link
in
here
so
oops
got
a
404.
Let
me
go
back
here:
let's
do
this,
I'll
send
it
to
my
gmail
and
you
can
see.
I
can
view
it.
A
So
that's
fine
I
could
select
if
I
wanted
to
have
this
person
edit
it,
but
we'll
go
ahead
and
do
that.
So
I
can
see
that
my
other
account.
So
the
person
has
that
ability
here
I
should
be
able
to
view
this
now.
Okay,
so
now
I'm
viewing
this
file
as
a
viewer
as
a
view,
only
so
I've
got
view
access,
so
this
would
be
kind
of
like
your
Zeppelin
or
your
sketch
inspector,
where
you
can
come
in
and
now
view
these.
You
know
the
designs
and
actually
see
what
the
specs
are.
A
So
this
is
like
all
with
a
free
account,
so
developers
or
PMS
could
have
their
own
free,
pigma
account
and
I'd
be
able
to
get
all
the
specs
and
everything
they
need.
They
can
view
it,
and
you
know
whatever
format
you
can
view
this
list,
etc.
So
it's
all
the
same
specs
that
that
any
any
team
member
would
also
be
able
to
see
another
advantage.
A
Is
they
have
the
ability
to
be
part
of
the
conversation
and
leave
notes,
and
you
know,
share
things
and
and
be
part
of
that
conversation
all
with
a
free
account,
so
our
ecosystem
kind
of
opens
up
where
right
now,
our
specs
are
pretty
locked
down
and
you'd
have
to
comment
in
an
issue
and
take
things
back
to
specs.
This
allows
kind
of
a
one-on-one
conversation
to
happen
in
the
design
file,
but
let's
say
that
you
know
I
share
this
with
somebody
that
doesn't
even
have
a
figma
count.
Let's
just
see
if
this
link
works
here.
A
All
right,
so
it's
asking
me
to
login,
so
I
will
go
over
to
this
figmas,
the
beta
right
just
for
an
example.
This
is
for
like
a
completely
unauthenticated
user,
who
has
no
figma
account
you'll
notice
that
if
it's
shared,
where
anybody
with
the
link
can
view
can
view
it,
they
still
have
access
to
it.
So
I
can
go
in
here
and
see
you
know
all
of
the
design,
all
the
files
for
reference,
I
just
can't
comment
or
or
get
specs
off
of
that
there's.
A
No,
they
figure
quite
yet,
but
so
so
any
level
of
user.
Who
has
you
know
the
link
with
you?
Access
can
actually
get
in
there.
They
don't
have
to
have
any
kind
of
account
and
I
think
that's
really
useful,
so
people
that
are
viewing
issues
or
merge
requests
that
need
to
see
the
design
that
can
always
reference
it
and-
and
it's
some
way
you
know
get
access
to
that.
You
can
say:
I
can
also
see
what
other
users
your
are
on
the
file
which
it,
which
again
is
it's
pretty
helpful.
A
I
could
see
my
other,
my
other
account,
there's
viewing
it
and
then
I
can
click
on
it
and
see
like
oh.
This
is
what
they're
looking
at
and
I
think
that's
it's
pretty
pretty
useful.
So
even
with
async
or
even
synchronous,
you
have
the
ability
to
kind
of
work
in
here
and
see
what
others
are
working
on
and
work
together
on
some
files
and
examples.
So
anyway,
I'll
take
a
breath.
I
flew
through
that
any
any
questions.