FigmaのFigmaファイルから学ぶTips & Tricks - Speaker Deck

FigmaのFigmaファイルから学ぶTips & Tricks

Speaker Deck

Share

Embed

Start on current slide

Slide 1

Slide 1 text

Hiroki Tani Designer Advocate Figmaの Figmaファイルから学ぶ Tips & Tricks

Slide 2

Slide 2 text

No content

Slide 3

Slide 3 text

figma.com/community

Slide 4

Slide 4 text

UI3: Figma's UI Kit → FigmaのUIに使われているコンポーネントを整理したUI Kit

Slide 5

Slide 5 text

Tips & Tricks - UI3: Figma's UI Kit

Slide 6

Slide 6 text

Tips & Tricks - UI3: Figma's UI Kit コンポーネント名の先頭に_や.をつけることで公開ライブラリから除外できる

Slide 7

Slide 7 text

Simple Design System → Figma公式で作成したデザインシステムのサンプル

Slide 8

Slide 8 text

Simple Design System コンポーネントセット (Variants)のレイアウトの線や背景の色を変えることができる。変えた背景色はAssetsパネルなどにも反映される。

Slide 9

Slide 9 text

github.com/figma/sds

Slide 10

Slide 10 text

Thank you! UI3: Figma's UI Kit Simple Design System (Figma file) Simple Design System (GitHub repo) x.com/hiloki