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

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

Avatar for Hiroki Tani Hiroki Tani
June 29, 2025
Design
900
1

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

Avatar for Hiroki Tani

Hiroki Tani

June 29, 2025

More Decks by Hiroki Tani

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

Other Decks in Design

See All in Design
CULTURE DECK／Creative Director
Avatar for M-HAND,Inc. mhand01
0
1.5k
エンジニアでも捗る デザイナー的思考入門(bitA Edit 新ver)
Avatar for Tsubasa SEKIGUCHI tinykitten
0
280
怖くないアクセシビリティ -カウンターカルチャーとしてのアッカン東京-
Avatar for Yu Morita securecat
1
230
The Art of Caring
Avatar for Klemens klemens
0
380
「バイブコーディングって何？」から始まった、 AIとの一年間と、その先のこと
Avatar for 瀬戸英晴 seto
0
1.1k
Frontier
Avatar for Renny Wang rwang05
0
190
デザインとフロントエンドの境界が融ける Claude Code × Figma
Avatar for littlebusters littlebusters
2
3.3k
凡庸を落とすハーネス
Avatar for Hiromi Maeo hiromimaeo
1
760
kintone開発における​ライターの役割の変化​〜AI活用を添えて〜 / Changes in the Role of Writers in Kintone Development
Avatar for keroyama keroyama
0
160
Техники структурирования беседы с собой, заказчиком и командо
Avatar for Andrew Shapiro ashapiro
0
250
2026-04-06 CMU School of Design "Vision-Driven Design"
Avatar for Hiroshi Ishii ishii_mit
0
130
test deck title
Avatar for Shota Matsuo shotamatsuo
0
1.5k

Featured

See All Featured
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
28
2.7k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
56
3.4k
Chasing Engaging Ingredients in Design
Avatar for Sebastian Deterding codingconduct
0
270
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
191
12k
Writing Fast Ruby
Avatar for Erik Berlin sferik
630
63k
How to Talk to Developers About Accessibility
Avatar for Jason CranfordTeague jct
2
510
The Art of Delivering Value - GDevCon NA Keynote
Avatar for David Neal reverentgeek
16
2.1k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
528
40k
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
234
17k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
11
990
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
515
110k
How to build an LLM SEO readiness audit: a practical framework
Avatar for Nick Samuel nmsamuel
1
860

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