Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

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

Avatar for Hiroki Tani Hiroki Tani
June 29, 2025
Design
960
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.9k
Building foundations 堅牢なデザイントークンの設計
Avatar for Hiroki Tani hilokifigma
3
5.9k
なぜ今必要？Figma×SmartHR×DMM.com×一休 エンジニア視点で考えるデザインシステム
Avatar for Hiroki Tani hilokifigma
2
1.6k
You Don’t Know Figma Yet
Avatar for Hiroki Tani hilokifigma
1
140

Other Decks in Design

See All in Design
Where Imagination Ends AI Begins
Avatar for R-524 r5ni4
0
510
分裂するデザイン、取り残される空間—インクルーシブデザインスタジオが建築をやる理由
Avatar for インクルーシブデザインスタジオCULUMU culumu
0
190
「惜しいデザイン」 を生み出さないための AIレビューループ
Avatar for Kazuhiro Tobita 0b1tk
3
4.8k
デザイン組織の"次の"強みづくり
Avatar for 井斉花織（いおり） isaikaori
2
360
AI-DLC AI駆動開発ライフサイクルとAI-DLC Worlflows V2のご紹介
Avatar for Atsushi Fukui fatsushi
4
2.1k
The ISO 25964 standard on Information and documentation — Thesauri and interoperability with other vocabularies
Avatar for AccessInnovations accessinnovations
0
480
Spectrum Tokyo Meetup #26「できることが増えた時、デザイナーは何に時間を使うべきか」
Avatar for Muture muture
PRO
1
390
RawrXD: The Sword
Avatar for Sean Natarajan seanvraj_arts
0
240
【CEDEC2026】『Shadowverse: Worlds Beyond』続編開発におけるUIデザイン・アニメーション演出の「超進化」 ～継承と挑戦を両立するデザイン手法～
Avatar for Cygames, Inc. cygames
PRO
4
5.6k
“なんとなくFigma”から一歩先へ。AI時代も活きるWeb制作フロー
Avatar for Ayumi Suzuki ayumidesign
0
300
Design_Harness_and_Loop.pdf
Avatar for 長津孝輔 nagatsu
0
150
ポートフォリオ_あやの
Avatar for ayano ngyenmazt1412
0
2k

Featured

See All Featured
Public Speaking Without Barfing On Your Shoes - THAT 2023
Avatar for David Neal reverentgeek
1
660
The browser strikes back
Avatar for Jono Alderson jonoalderson
0
1.9k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
672
58k
Kristin Tynski - Automating Marketing Tasks With AI
Avatar for Tech SEO Connect techseoconnect
PRO
0
590
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
239
140k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
1.4k
Code Review Best Practice
Avatar for Trisha Gee trishagee
74
20k
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
2
2.2k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
350
Tell your own story through comics
Avatar for letsgokoyo letsgokoyo
1
1.1k
Applied NLP in the Age of Generative AI
Avatar for Ines Montani inesmontani
PRO
4
2.6k
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
615
220k

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