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
TOPOSTOPOS
Avatar for Shohei Yoshida shoheyey
0
110
「使いやすさ」だけでは、「勝てる」サービスにはならない。〜KPIとUXの分断を埋める、サービス戦略という「指針」〜
Avatar for 株式会社NIJIBOX nbkouhou
2
560
Saving_the_King_-_Storyboard.pdf
Avatar for Terence Basart terencebasart
0
260
Rethinking IFUs: What Board Game Rulebooks Contribute to IFU Usability
Avatar for Chris Hass deadlinepoet
0
350
セブンデックス プロジェクト事例 / innovation Scenes
Avatar for セブンデックス sevendex
1
1.6k
Frontier
Avatar for Renny Wang rwang05
0
190
保育現場にAIを 〜人と技術に橋を架けるデザインで考えてきたこと〜 uiuxcamp2026-hoiku-ai-design
Avatar for Takahiro Yamaguchi hiro93n
1
360
再設計される業務 - AIにより再設計される "デザインワークフロー" / AI Ops Lab #2 Redesigned orkflows
Avatar for kgsi kgsi
0
810
エンジニアでも捗る デザイナー的思考入門(bitA Edit 新ver)
Avatar for Tsubasa SEKIGUCHI tinykitten
0
280
AIスライドデザインを生成する仕組みを社内共有する
Avatar for 太田賢一 kenichiota0711
7
5.9k
kintone開発における​ライターの役割の変化​〜AI活用を添えて〜 / Changes in the Role of Writers in Kintone Development
Avatar for keroyama keroyama
0
160
デザインとフロントエンドの境界が融ける Claude Code × Figma
Avatar for littlebusters littlebusters
2
3.3k

Featured

See All Featured
Believing is Seeing
Avatar for Spiro Bolos oripsolob
1
190
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
Avatar for Andy Polaine apolaine
1
390
Color Theory Basics | Prateek | Gurzu
Avatar for Gurzu gurzu
0
420
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
31
3.3k
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
22k
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
615
220k
AI in Enterprises - Java and Open Source to the Rescue
Avatar for ivargrimstad ivargrimstad
0
1.4k
The SEO Collaboration Effect
Avatar for Kristina Bergwall kristinabergwall1
1
520
The Limits of Empathy - UXLibs8
Avatar for Cassini Nazir cassininazir
1
600
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
Avatar for Eileen M. Uchitelle eileencodes
141
35k
Neural Spatial Audio Processing for Sound Field Analysis and Control
Avatar for NII S. Koyama's Lab skoyamalab
0
410
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
25
2k

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