Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Figma Dev Modeで変わる!Flutterの開発体験
Search
watanave
November 20, 2024
Programming
0
3.9k
Figma Dev Modeで変わる!Flutterの開発体験
watanave
November 20, 2024
Tweet
Share
More Decks by watanave
See All by watanave
Flutter実践開発に書かなかったこと
watanave
0
23
Flutterビギナーのための Widget完全攻略
watanave
0
28
決めず、語らずのリーダーシップ
watanave
0
450
複数プロジェクトを横断するゆめみテックリードの戦略
watanave
0
120
Androidエンジニア目線のKMM / iOSエンジニア目線のKMM
watanave
0
340
Why does Activity die soon?
watanave
0
340
Anko試食会
watanave
0
2.4k
Other Decks in Programming
See All in Programming
ATDDで素早く安定した デリバリを実現しよう!
tonnsama
1
2.4k
GitHub CopilotでTypeScriptの コード生成するワザップ
starfish719
28
6.1k
Amazon Bedrock Multi Agentsを試してきた
tm2
1
220
Java Webフレームワークの現状 / java web framework at burikaigi
kishida
9
2k
[Fin-JAWS 第38回 ~re:Invent 2024 金融re:Cap~]FaultInjectionServiceアップデート@pre:Invent2024
shintaro_fukatsu
0
340
自動で //nolint を挿入する取り組み / Gopher's Gathering
utgwkk
1
170
Immutable ActiveRecord
megane42
0
120
EC2からECSへ 念願のコンテナ移行と巨大レガシーPHPアプリケーションの再構築
sumiyae
3
630
Vue.jsでiOSアプリを作る方法
hal_spidernight
0
120
PicoRubyと暮らす、シェアハウスハック
ryosk7
0
250
知られざるDMMデータエンジニアの生態 〜かつてツチノコと呼ばれし者〜
takaha4k
3
1k
はてなにおけるfujiwara-wareの活用やecspressoのCI/CD構成 / Fujiwara Tech Conference 2025
cohalz
3
3.2k
Featured
See All Featured
Understanding Cognitive Biases in Performance Measurement
bluesmoon
27
1.5k
Practical Orchestrator
shlominoach
186
10k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Reflections from 52 weeks, 52 projects
jeffersonlam
348
20k
How GitHub (no longer) Works
holman
312
140k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
7
600
Agile that works and the tools we love
rasmusluckow
328
21k
No one is an island. Learnings from fostering a developers community.
thoeni
20
3.1k
Adopting Sorbet at Scale
ufuk
74
9.2k
How STYLIGHT went responsive
nonsquared
96
5.3k
Code Reviewing Like a Champion
maltzj
521
39k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
52k
Transcript
Figma Dev ModeͰมΘΔʂ Flutterͷ։ൃऀମݧ Flutter Kaigi 2024
w ෦ཅଠʢΑʔͨΜʣ w גࣜձࣾΏΊΈऔక$50 w ஶॻ'MVUUFS࣮ફ։ൃ w !ZPIUB@XBUBOBWF ΑʔͨΜ
w גࣜձࣾΏΊΈɹσβΠϯςοΫϦʔυ w 6*σβΠφʔྺɹ'JHNBྺ w ظϓϩδΣΫτͰ'JHNBͷ৽ػೳʹΑΓഁյతͳΠϊ ϕʔγϣϯΛͨΒ͞Ε͕ͪ ಸྑྠເඒʢͳΒΘɹΏΊΈʣ O@ @
ZVNFNJ
w ੇܶʮגࣜձࣾͶΉΈͷৗʯ w ੇܶৼΓฦΓɻͦͯ͠'JHNBͱʜ w 'JHNBʹͰ͖ͳ͍͜ͱɺͦΕΛΓӽ͑Δώϯτ w 'JHNB͔Βιʔείʔυੜ Contents
ੇܶ גࣜձࣾͶΉΈͷৗ
None
None
w %FW.PEFͱͳʹ͔ w 'JHNBͱͳʹ͔ w ͜ΕΒΛ׆༻͢Δ͜ͱͱ w͜ͷυϥϚϑΟΫγϣϯͰɺגࣜձࣾͶΉΈՍۭͷا ۀͰ͢ɻ ੇܶΛৼΓฦΓɻͦͯ͠'JHNBͱ
w ΤϯδχΞ͚ͷใ͕ڧௐ͞Εͨ6* w ίʔσΟϯάʹཱͭػೳ w ϓϥάΠϯ ιʔείʔυੜ w 3FBEZGPSEFW'PDVTWJFX w
$PNQBSFDIBOHFT DevModeͱԿ͔
DevModeͱԿ͔
DevModeͱԿ͔
DevModeͱԿ͔
w 7BSJBCMFTͱ7BSJBOUʢΧϥʔͷׂɺऔΓ͏Δঢ়ଶʣ w 3FBEZGPSEFWʢσβΠϯͷεςʔλεʣ w $PNQPOFOUʢڞ௨8JEHFUͷઃܭʣ w 'SBNFͷ໊લʢઃܭҙਤʣ ੇܶͷதͰ'JHNB͔ΒΘͬͨใ
ੇܶͷதͰ'JHNB͔ΒΘͬͨใ
ੇܶͷதͰ'JHNB͔ΒΘͬͨใ
w 7BSJBCMFTͱ7BSJBOU w 3FBEZGPSEFWʢσβΠϯͷεςʔλεʣ w $PNQPOFOUʢڞ௨8JEHFUͷઃܭʣ w ֤'SBNFͷׂ ੇܶͷதͰ'JHNB͔ΒΘͬͨใ σβΠφ͞Μ͕͍͑ͨ͜ͱʂ
w σβΠφ͕σβΠϯ͢ΔɺઃܭΛՄࢹԽɾߏԽ͢Δπʔ ϧ w σβΠφͷҙਤΛΤϯδχΞઢʹมʢ%FW.PEFʣ͠ ͯ͑Δ w ͭ·ΓɺίϥϘϨʔγϣϯπʔϧ Figmaͱ
w σβΠφҙࢥΛ࣋ͬͨσβΠϯɺઃܭΛ͢Δ w 'SBNFͷ໋໊ɺ$PNQPOFOUɺ7BSJBOUͳͲ w ΤϯδχΞσβΠφͷҙਤΛίʔυʹөͤ͞Δ w σβΠφɾΤϯδχΞ͕ҙࢥૄ௨Λ͔Δ FigmaΛ׆༻͢Δ͜ͱͱ
w 'JHNBΛ׆༻ͨ͜͠ͱʹΑͬͯ w νʔϜͷҙࢥૄ௨͕͏·͍͘͘ w ϓϩμΫτͷޭʹ͔ͬͯίϥϘϨʔγϣϯͰ͖Δঢ় ଶʹͳΔ w ΤϯδχΞ8JEHFUઃܭΛσβΠφͱڞಉͰߦ͏͜ͱ ੇܶͰ͔͑ͨͬͨ͜ͱ
FigmaʹͰ͖ͳ͍͜ͱ ͦΕΛΓӽ͑Δώϯτ
None
w ΤϯδχΞͷՌΛσβΠφ͕ϨϏϡʔ͢Δػձ͕গͳ͍ w ·ͨλΠϛϯά͕͍ʢϓϧϦΫͷϚʔδޙʣ w ΤϯδχΞʢͷՌʣˠσβΠφใୡ͕ߴίετ w ϕʔλϦϦʔε w ϨϏϡʔରͷػೳ͕ਂ͍ͱ͜Ζʹ͋Δ
w ঢ়ଶΛ࡞ΓͮΒ͍ ࣄͷݪҼ
ίϥϘϨʔγϣϯ్͕ΕΔ σβΠϯͱઃܭ 🤨 ࣮݁Ռ
՝ͷղܾͷҰྫ σβΠϯͱઃܭ 🤝 WidgetBook
w 8JEHFU#PPL w 8JEHFUͷΧλϩάΛ࡞͢Δύοέʔδ w ༷ʑͳ݅Ͱ8JEHFUͷݟͨΠϯλϥΫγϣϯΛ֬ೝ w 8JEHFU#PPL$MPVE w 'MVUUFSϓϩδΣΫτ͚ͷίϥϘϨʔγϣϯπʔϧ
w ඇΤϯδχΞͱͷϨϏϡʔϓϩηεΛศརʹ͢ΔαʔϏε WidgetBookͱ
՝ͷղܾͷ͏Ұͭͷྫ σβΠϯͱઃܭ 🤝 Figma Rest API
Figma REST API w 'JHNB"1*Λఏڙ͍ͯ͠Δʂ w දతͳͷͭ w 1MVHJO"1* w
8JEHFU"1* w 3&45"1*
%&.0
FigmaΛӽ͑ͨίϥϘϨʔγϣϯ w 'JHNBΛӡ༻͢Δ্Ͱى͜Γ͕ͪͳ՝ͱͦͷղܾ๏ͷྫΛ հ wίϥϘϨʔγϣϯΛ్Εͤ͞ͳ͍ w ֎෦࿈ܞػೳΛར༻ͯ͠ίϥϘϨʔγϣϯͷύεΛิ͏ w 'JHNBϓϥάΠϯͰղܾ͢Δέʔε͋Δ w
σβΠϯఔʹϑΥʔΧεͤͣɺશମΛଊ͑ͯӡ༻ઃܭ
࠷ྑͳӡ༻Ұͭ͡Όͳ͍ w ࠷ྑͳӡ༻νʔϜϓϩμΫτɺ·ͨͦͷϑΣʔζʹΑͬ ͯมԽ͢Δ w ελʔτΞοϓͰσβΠϯϑΝΠϧΛࣺͯͳ͕Β࠷ Ͱ։ൃ͢Δ͜ͱ͕ඞཁͳ߹ w 'JHNBͰѻ͏σβΠϯɾઃܭͷϥΠϑαΠΫϧ͕͘ͳͬͯ ͖ͨΒɺ࣋ଓՄೳͳӡ༻ͷػӡ͔Εͳ͍
Figma͔Β ιʔείʔυੜ
DevModeͰͷίʔυੜ w J04"OESPJEͷ6*ίʔυɺ$44ͷੜ'JHNB͕αϙʔτ w 'MVUUFSͷίʔυੜαʔυύʔςΟͷϓϥάΠϯ͕ଟ w ϘΠϥʔϓϨʔτίʔυΛੜͯ͘͠ΕΔϓϥάΠϯ👍 w 8JEHFUΛੜ͢Δ߹ɺϓϥάΠϯͰෆेʁ
FigmaͱੜAIΛΈ߹Θͤͯίʔυੜ ը૾ͱ+TPO Dartίʔυ
CursorΤσΟλΛར༻ w $VSTPSͱ͍͏ੜ"*࿈ܞʹಛԽͨ͠ΤσΟλ w 74$PEF͕ϕʔεʹͳ͍ͬͯΔͷͰ'MVUUFS։ൃʹ⭕ w ϓϩδΣΫτͷίʔυɺίʔσΟϯάϧʔϧͳͲ"*ʹ͑Β ΕΔίϯςΩετ͕ଟ͍ʢଟ͘ͷίϯςΩετΛ͢ମݧʹ ༏Ε͍ͯΔʣ
None
None
None
ը૾͚ͩͰ·ͣ·ͣͷ݁Ռ
Cursor rules w ҎԼΛϧʔϧʹࢦఆ w ΞϓϦͷσβΠϯը૾ϑΝΠϧʹै͏ w σβΠϯը૾ϑΝΠϧΛ࣮ʹ࠶ݱ͢Δ͜ͱɻͦͷͨΊʹɺ ϑΥϯταΠζ༨നͳͲͷύϥϝʔλKTPOϑΝΠϧΛಡΈ औΔɻ
ը૾͚ͩͰ·ͣ·ͣͷ݁Ռ
࣮ํ๏͕͔͍ͬͯΔͳΒࢦࣔͰमਖ਼Մೳ
ͨ͘͞ΜͷใΛ༩͑ΔͱΑΓਖ਼֬ʹͳΔ
FigmaͱੜAIͰWidgetͷίʔυੜ w $POUFYUͷ༩Λ͢Εɺ֓ͶσβΠϯʹ͍ۙͷΛੜ ͢Δ͜ͱՄೳ w શͯΛσβΠϯ௨ΓʹҰܸͰੜ͢Δͷɺ·͍ͩ͠ w ඍௐ͢Δ߹ɺ࣮ํ๏ΛΒͳ͍ͱࢦࣔͰ͖ͳ͍߹
FigmaͱੜAIͰWidgetͷίʔυੜ w 'JHNBΛ׆༻͢Δͱ͍͏ҙຯͰɺσβΠφͷҙਤΛੜ"* ʹ͍͑ͯ͘ w $PNQPOFOUຖʹίʔυΛੜ w 7BSJBCMFTΛҰׅੜ͠ɺ$POUFYUͱͯ͠༩ w ͕࣌ؒղܾ͢ΔͰ͋Δɻࠓޙͷల։ʹظʂ
w %SFBN$BDIFSʢ(JU)VCʣ w %SFBN$BDIFS 'JHNB QBTTXPSESJWFSQBTUFUBXOZHMPX w
8JEHFU#PPL$MPVE ͜ͷηογϣϯͰར༻ͨ͠ϓϩδΣΫτ