fmcp-token-sync-orchestrator
Skill10 starsChanged 29 days agoMITView on GitHub
Figma design token'larını kod dosyalarıyla (CSS/Tailwind/Swift/Compose) platform-agnostic senkronize eder. Diff preview + onay + write akışı zorunlu. Her platformda çalışır. Condensed-first: Essentials bölümü %80 case'i kapsar, Advanced sadece edge case'lerde.
In this repository28 other files it gives its agents.
- ai-handoff-exportSkill
- apply-figma-design-systemSkill
- audit-figma-design-systemSkill
- code-design-mapperSkill
- component-documentationSkill
- design-drift-detectorSkill
- design-system-rulesSkill
- design-token-pipelineSkill
- ds-change-trackerSkill
- ds-impact-analysisSkill
- extract-contractSkill
- figjam-diagram-builderSkill
- figma-a11y-auditSkill
- figma-canvas-opsSkill
- figma-prototype-flowSkill
- figma-screen-analyzerSkill
- fix-figma-design-system-findingSkill
- fmcp-ds-audit-orchestratorSkill
- fmcp-intent-routerSkill
- fmcp-project-rulesSkill
- fmcp-screen-orchestratorSkill
- fmcp-screen-recipesSkill
- generate-figma-librarySkill
- generate-figma-screenSkill
- implement-designSkill
- inspiration-intakeSkill
- ux-copy-guidanceSkill
- visual-qa-compareSkill
The file
We split this skill into the rules it gives an agent
2 rules. About 0 are common, 1 is distinctive, and 1 is very specific to this project.
≈0
Common · estimate
Many files like this have a rule of this kind.
≈1
Distinctive · estimate
This author's own choices. Worth a look.
1
Very specific
Tied to their project's names, files or tools. Probably skip.
- Common
- Distinctive
- Very specific
- Very specific: line 161
Default path'i sor: "Bu platform için token dosyası <default> yoluna yazılsın mı?"
- Distinctive: line 197
Create → DRAFT banner + ikinci onay
≈ “Common” is an estimate: at least 1 in 5 of the 350,495 skill files we read have a rule of the same kind, not the same words. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.
Files
FMCP Token Sync Orchestrator
Essentials (Üst Bölüm — %80 Case İçin Yeterli)
Ortak Protokol (Condensed — full: agents/_orchestrator-protocol.md)
- Skill Registry açık — tahmin yasak
- Intent Routing — platform belirsiz → kullanıcıya sor (AskUserQuestion / düz metin)
- Cheap-First —
figma_get_variables(verbosity="summary")yeterli, full sadece eksik binding keşfinde - Cache-First — tokens için cache yok (hızlı değişir), opsiyonel
.claude/token-sync-log.md - User Onay — diff preview olmadan WRITE YOK (mutlak kural)
- Self-Audit — write sonrası binding coverage raporu (hardcoded kalan node sayısı)
- Skill Evolution — yeni platform için iki aşamalı onay
- Türkçe rapor — metrik bloğu sonunda
Skill Registry (Ref Only)
| Skill | Dosya yolu | Trigger | Common case lazım mı? |
design-token-pipeline | skills/design-token-pipeline/SKILL.md | Token export/import | HER ZAMAN (ana motor) |
code-design-mapper | skills/code-design-mapper/SKILL.md | Component ↔ Figma mapping | Sadece component mapping istenirse |
design-system-rules | skills/design-system-rules/SKILL.md | Platform-specific rule generation | Sadece rule generation istenirse |
Platform Routing
| Sinyal | Platform | Standard hedef path |
.css, :root, var(--...), tokens.css | CSS | src/styles/tokens.css |
tailwind.config.*, theme.extend | Tailwind | tailwind.config.js → theme.extend |
.swift, UIKit, SwiftUI, Color(...) | Swift | Sources/DesignTokens/Tokens.swift |
.kt, Compose, @Composable, MaterialTheme | Compose | app/src/main/java/.../DesignTokens.kt |
.scss, $token-... | Sass | src/styles/_tokens.scss |
| Hiçbiri net değil | — | AskUserQuestion (4 platform seçeneği) |
Diff Preview Before Write (Zorunlu Akış)
- Dry-run:
Read("skills/design-token-pipeline/SKILL.md")+ workflow'u çalıştır ama dosyaya yazma → çıktıyı buffer'a al - Mevcut dosya varsa: mevcut içerikle yeni içerik arası unified diff üret
- Diff'i sohbete yaz:
--- current tokens.css +++ new tokens.css @@ -12,3 +12,5 @@ --color-primary: #0066cc; - --color-secondary: #666; + --color-secondary: #4a4a4a; + --color-success: #10b981; - Onay al: AskUserQuestion / düz metin: "Bu değişiklikleri uygulayayım mı? (Evet / Hayır / Sadece bazıları)"
- Onay sonrası
WriteveyaEditile dosyaya yaz - Mevcut dosya yoksa: sadece yeni içeriği göster, onay al, sonra
Write
Self-Audit (Write Sonrası)
Binding coverage raporu:
- Toplam token:
figma_get_variablesile sayım - Binding oranı: senkronlanan / toplam (yüzde)
- Upgraded: hardcoded değerden variable binding'e dönüşen sayı
- Leftover: hâlâ hardcoded kalan node sayısı (ds-auditor'a yönlendir)
Rapor Formatı
## 🔄 Token Sync — <platform>
**Yön:** Figma → Kod | Kod → Figma
**Hedef dosya:** <path>
**Mod:** export | import
### Diff Özeti
- Eklenen: <n>
- Güncellenen: <m>
- Kaldırılan: <k>
### Binding Coverage
- Toplam token: <n>
- Binding oranı: <%>
- Hardcoded kalanlar: <k> node (ds-auditor ile detaylandır)
---
📊 Metrikler
- Kullanılan skill'ler: <liste>
- API çağrı sayısı: <n>
- Dry-run + write: tamamlandıAdvanced — Only Load If Needed
Bu bölümü Claude aşağıdaki koşullarda tarar:
- ⚠️ Multi-platform sync (aynı token'ları hem CSS hem Swift'e)
- ⚠️ Custom component mapping (code-design-mapper gerektiren)
- ⚠️ Platform default path kullanıcı için uygun değil (custom path gerekir)
- ⚠️ Kod → Figma yönünde sync (import mode, daha nadir)
- ⚠️ Yeni platform desteği (Flutter, Jetpack Multiplatform vb.)
Detay 1 — Multi-Platform Sync
Kullanıcı "hem CSS hem Tailwind hem Swift'e aynı token'ları export et" derse:
- Her platform için ayrı dry-run
- 3 ayrı diff preview sohbette (tek mesajda üç diff bloğu)
- Kullanıcı "hepsini onayla" veya "sadece X ve Y" diyebilmeli (AskUserQuestion çoklu seçim)
- Onaylananları yaz
- Binding coverage raporu 3 platforma göre ayrı
Detay 2 — Custom Component Mapping
Sadece token değil, component → component eşleştirme isteniyorsa:
Read("skills/code-design-mapper/SKILL.md")- Figma component isim/key → kod dosyası path eşleştirmesi
- Çıktı:
.codeconnect.tsveya benzeri mapping dosyası - Token'lardan bağımsız ama tamamlayıcı iş
Detay 3 — Kod → Figma Import Mode
Kod tarafında değişen bir token (örn. Git PR'da renk güncellemesi) Figma'ya geri yansıtılacaksa:
- Kod dosyasını parse et
figma_get_variablesile mevcut Figma değerlerini al- Diff: kod tarafı vs Figma tarafı
- Kullanıcıya göster: "Kod tarafında şu token'lar değişmiş, Figma'ya yansıtayım mı?"
- Onay →
figma_update_variable/figma_setup_design_tokensile yaz - Destructive mutation → ortak protokol madde 5 gate (kullanıcı onayı)
Detay 4 — Platform Default Path Override
Plan'daki defaultlar:
CSS → src/styles/tokens.css
Tailwind → tailwind.config.js
Swift → Sources/DesignTokens/Tokens.swift
Compose → app/src/main/java/.../DesignTokens.kt
Sass → src/styles/_tokens.scssKullanıcı'nın proje yapısı farklı olabilir. İlk sync'te:
- Default path'i sor: "Bu platform için token dosyası
<default>yoluna yazılsın mı?" - Kullanıcı alternatif verirse onu kullan
- İlk başarılı sync sonrası path
.claude/token-sync-log.md'ye kaydedilir (opsiyonel cache)
Detay 5 — Error Recovery
| Hata | Aksiyon |
| Dosya yazma permission | Kullanıcıya bildir, farklı path öner |
| Mevcut kod formatı tanınmıyor | Örnek satır göster, formatı doğrulat |
figma_get_variables timeout | verbosity="summary" zaten default, retry |
| Diff çok büyük (100+ değişiklik) | Özetle: "X color, Y spacing, Z typography token değişti, detay görmek ister misin?" |
Detay 6 — Platform-Specific Notes
Claude Code:
Write/Edittool'ları mevcut, doğrudan kod dosyasına yazılır- Cache:
.claude/token-sync-log.mdopsiyonel
Cursor:
- Aynı tool'lar mevcut, main context'te çalışır
.cursor/rules/fmcp-orchestration.mdbu orchestrator'ı referans eder
Claude Desktop:
- KRİTİK: Filesystem MCP eklenmediyse
Writetool'u yok → sadece diff gösterebilir, kullanıcı manuel kopyalar - İlk prompt'ta manuel skill referansı zorunlu
Claude Web:
- Filesystem yok → tamamen plan-only mod
- "Bu diff'i kopyala, tokens.css'e yapıştır" talimatı ver
Detay 7 — Yeni Platform Desteği (Skill Evolution)
Kullanıcı "Flutter için export" isterse (mevcut 5 platformda yok):
- Aşama 1: Gap'i açıkla, "Flutter desteği eklemek istiyor musun?" sor
- Aşama 2:
design-token-pipelineskill'ine Flutter eklentisi yap (edit) veya yeni bir skill (fmcp-token-flutter-pipeline) oluştur (create) - Create → DRAFT banner + ikinci onay
- Edit → diff preview + onay
Does it work?
Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.
No reviews yet
People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.
- It worked
- Partly
- It didn't
Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.
Your trail
Files you open will collect here, so you can find them again.
Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.
Now do this for your own.
Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

