Paint By JSON.

Paint By JSON

Paint By JSON 是一款 Figma 插件，让您用真实 API 数据替代设计稿中的占位文本。连接任意 JSON 端点，将实时数据映射到图层，确保原型在设计阶段就能反映真实产品的内容条件和边界情况。

产品亮点

• 真实 API 连接：支持任意 REST API 端点，可配置自定义请求头和身份验证，在插件内直接预览 JSON 响应。
• 智能数据映射：将 JSON 路径绑定至 Figma 图层名称，映射关系可跨文件和组件库复用，不受重构影响。
• 数据转换管道：支持文本截断、货币格式化、日期解析、条件分支等转换，在数据填入画布前完成格式处理。
• 可复用调色板：将完整的端点配置、请求头和映射关系保存为调色板，一键应用到任意画框。
• 隐私优先架构：所有 API 请求在本地插件沙箱中执行，响应数据和认证信息绝不离开您的设备。

应用场景

• 真实原型测试：使用真实用户名、商品标题和内容长度测试设计，提前发现截断和布局断裂问题。
• 设计系统文档：用真实数据样本填充组件库，展示设计在极端情况下的表现。
• 工程交付：将填充后的画框导出为 JSON、Markdown 或规格画框，同时交付视觉设计和数据结构。
• 动态内容验证：将数组响应迭代到重复组件实例，验证网格布局和列表行为。

目标用户

Paint By JSON 面向需要在交付前用生产数据验证界面设计的产品设计师、设计系统团队和 UX 专业人员。特别适合数据密集型应用团队，帮助解决占位内容无法揭示真实设计约束的痛点。