Upgrade to Pro — share decks privately, control downloads, hide ads and more …

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

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Hiroki Tani Hiroki Tani
June 29, 2025
Design
0
790

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

Avatar for Hiroki Tani

Hiroki Tani

June 29, 2025
Tweet

More Decks by Hiroki Tani

See All by Hiroki Tani
結びながら、ひらく - にじむ境界のデザイン
Avatar for Hiroki Tani hilokifigma
3
1.4k
Building foundations 堅牢なデザイントークンの設計
Avatar for Hiroki Tani hilokifigma
2
4.7k
なぜ今必要？Figma×SmartHR×DMM.com×一休 エンジニア視点で考えるデザインシステム
Avatar for Hiroki Tani hilokifigma
1
1.4k
You Don’t Know Figma Yet
Avatar for Hiroki Tani hilokifigma
0
98

Other Decks in Design

See All in Design
Franks Myth
Avatar for George Frank Hayford-Taylor gfht1
1
410
2026年、デザイナーはなにに賭ける？
Avatar for Kazuhiro Tobita 0b1tk
0
480
はじめての演奏会フライヤーデザイン
Avatar for Kaito Kikuchi chorkaichan
1
220
公開スライド）熊本市様-電子申請中級編
Avatar for @Garyuten garyuten
0
830
アクセシビリティ推進を続けられるようにするヒント - Accessibility Conference CHIBA 2025
Avatar for uto usui uto
0
180
2026年の勢い / Momentum for 2026
Avatar for bebe bebe
0
350
アイデアを加速させる！Firefly ボードで発想の幅を広げよう
Avatar for コネクリ connecre
1
310
Connpass-Xperia_Camera_App_by_HCD.pdf
Avatar for ソニー株式会社 sony
0
490
Goodpatch Tour💙 / We are hiring!
Avatar for Goodpatch Inc. goodpatch
31
1M
Shaolin_Showdown
Avatar for Sol Metts solmetts
0
290
From the Visible Crossroads: Turning Outputs into Outcomes
Avatar for takai_kanako takaikanako
2
1.1k
チームをデザイン対象にする / Design for your team
Avatar for 株式会社カミナシ kaminashi
1
550

Featured

See All Featured
More Than Pixels: Becoming A User Experience Designer
Avatar for Michelle Schulp Hunt marktimemedia
3
320
BBQ
Avatar for Matthew Crist matthewcrist
89
10k
Utilizing Notion as your number one productivity tool
Avatar for Mfonobong Umondia mfonobong
3
220
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
273
21k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
54
Primal Persuasion: How to Engage the Brain for Learning That Lasts
Avatar for Mike Taylor tmiket
0
250
The untapped power of vector embeddings
Avatar for Frank van Dijk frankvandijk
1
1.6k
The innovator’s Mindset - 
Leading Through an Era of Exponential Change - McGill University 2025
Avatar for Jean-Marc De Jonghe jdejongh
PRO
1
93
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
21k
New Earth Scene 8
Avatar for Sydney Stone popppiees
1
1.5k
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
Avatar for Andy Polaine apolaine
0
180
No one is an island. Learnings from fostering a developers community.
Avatar for Antonio thoeni
21
3.6k

Transcript

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

  2. None

  3. figma.com/community

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

  5. Tips & Tricks - UI3: Figma's UI Kit

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

    できる

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

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

  9. github.com/figma/sds

  10. Thank you! UI3: Figma's UI Kit Simple Design System (Figma

    file) Simple Design System (GitHub repo) x.com/hiloki