设计稿和真正跑在产品里的 UI，一直是两个世界：设计师在 Figma 里画完， 工程师在引擎里"照着重画"一遍。figo 把这两个世界合成一个。
所有输入归一到同一个中间表示 canvas.json，由核心库渲染或导出—— 一条管线，进口是设计，出口是运行中的界面。
运行时路径：节点树 → ThorVG 场景图 → SwCanvas → RGBA8888 像素缓冲（直通 alpha）→
引擎后端上传为纹理绘制；滚动 / 转场不重建场景，脏区重绘。
UI 半透明区域可透出下层游戏画面。
组件实例与变体切换、约束 + auto-layout 响应式重排、渐变 / 阴影 / 模糊、
多语言富文本与字形级字体回退、clipsContent 裁剪。
点击 / 长按 / 滑动 / 惯性滚动 / 吸附选择器、页面导航转场、可编辑文本、 slider 绑定、design token 一键换肤（light / dark）。
ui.bindList 数据绑定、ui.navigateTo 转场、
fetch() / localStorage / 定时器齐全，改 .js 热重载。
Figma 式操作的本地编辑器，内嵌 MCP 服务器——AI 可以直接读改图层、 截图自检，和你共享同一条撤销历史。
figmapack 把一个 app 工程打成 Windows 可执行、
Web（wasm）、Android APK——三端共用同一份设计和逻辑。
以 Claude Code 插件交付：脚手架 → AI 在编辑器里设计 → 写逻辑 → 截图自验 → 审美评审，整条闭环打包成技能。
最快的路径是 Claude Code 插件——完整闭环已经打包成技能； 也可以直接用命令行工具手动走每一步。
装好后先跑一次 figo:setup 安装 / 验证工具链
（Windows 下载预编译二进制，macOS / Linux 源码构建）。
/plugin marketplace add nowasm/figo /plugin install figo@figo
对 Claude 说"做一个天气 app"即可触发 figo:new-app：
从能跑的模板起步，AI 通过 figoedit 的 MCP 直接搭建界面（你随时 Ctrl+Z），
再写 app.js 逻辑。手动路径：
# 从模板生成工程（tab-shell / list-detail / form） python tools/figmanew.py myapp --template list-detail # 打开可视化编辑器改设计（AI 经 MCP 同步操作） figoedit myapp/design.json
逻辑就是普通 JavaScript，完整 API 见 include/figo/script.h。
figoplay 运行中改 .js 热重载。
// app.js ui.setResizeMode("reflow"); ui.bindList("portfolio-list", coins.length, (item, i) => { item.find("Heading").child(0).text = coins[i].symbol; }); ui.onClick("Card", (node) => { ui.navigateTo("Coin Info", "slideLeft", 0.28); });
figoplay myapp # 运行 figoplay myapp --shot out.png # 截图自验（AI 的眼睛）
作为独立 app 一键三端打包；或者导成引擎工程，把 UI 融进现有游戏。
python tools/figmapack.py myapp -t all # Windows / Web(wasm) / Android APK figo2godot design.fig out --prefabs # Godot 4 工程（.tscn + 组件预制体） figo2unity design.fig out # Unity UGUI 预制体 figo2cocos design.fig out # Cocos Creator 3.x 预制体
核心库与引擎完全解耦，raylib 参考后端约 200 行。C++ 侧全部 API：
auto ui = figo::FigmaUI::fromFile("menu.fig"); ui->onClick("btn-start", [&](figo::Node&, float, float) { startGame(); }); figo::RaylibFigmaView view(*ui); while (!WindowShouldClose()) { view.update(); // 输入 + 脏区重绘 + 纹理上传 BeginDrawing(); drawGameWorld(); // UI 半透明区域透出游戏画面 view.draw(); EndDrawing(); }
从一句话需求到跑起来的 app：设计 → 逻辑 → 自验 → 多端交付。
以下截图全部由 figoplay 实时渲染输出——它们不是设计稿，是正在运行的程序。
每个 app 就是一个目录：design.json + app.js + app.json，
源码都在仓库 examples/apps/ 下。
figo 的产品关系很简单：核心库负责渲染与运行，开源免费； 转换插件负责把设计导成引擎原生资产，按引擎单独商业发布。 插件与核心共享同一条渲染管线，导出的产物和设计稿逐像素一致。
C++ 矢量 UI 库：.fig 直接加载渲染、响应式布局、JS 脚本运行时（figoplay）、 可视化编辑器（figoedit）、独立 App 一键出包（figmapack：Windows exe / Web wasm / Android APK）。 免费用于任何项目。
在 GitHub 上获取 →Unity 编辑器插件：.fig → UGUI 预制体（.prefab + 贴图 + .meta）， 嵌套组件预制体、字体匹配、Gamma / Linear 色彩空间。
.prefab + 贴图 + .meta，拖进 assets/ 直接打开； UUID 内容派生，重跑输出稳定、diff 干净。
完整 Godot 工程输出：.tscn 场景 + 去重贴图 + 组件 PackedScene 预制体， React/HTML 页面也可一条命令直达。
figmapack（独立 App 出包）属于开源核心的一部分，随 figo core 免费提供； 三个转换插件与核心库共享渲染代码，插件仅在"导出到对应引擎"这一步收费。
figo