静态模型图在某些情况下是可行的——直到它不再可行。尤其是在金融科技领域，实时洞察至关重要，简单的图片无法满足需求。要打造真正沉浸且逼真的用户体验，你需要动态的实时数据。想象一下，你原型中的支出图表和财务数据像成品一样实时更新。
在本教程中，我们将通过分步指南带你了解如何将 Google Sheets 与你的 ProtoPie 原型集成。本指南将展示如何直接从电子表格中提取数据，以创建强大的数据驱动型原型。
第 1 部分：获取你的 Google Sheets 数据
第一步是将 Google Sheets 中的数据导入 ProtoPie。我们将使用 ProtoPie Connect 及其内置的 API 插件来实现这一点。
步骤 1：在 ProtoPie Connect 中设置 API 请求
在 ProtoPie Connect 的 API 插件中，你需要使用以下详细信息创建一个新请求：
方法：GET
URL：URL 由你的 Spreadsheet ID、你想导入的数据范围以及你唯一的 Google API 密钥组合而成。
请求头：无
请求体：无
步骤 2：找到你的 Spreadsheet ID
Spreadsheet ID 是你的 Google Sheet 的唯一标识符。
你可以直接在 Google Sheet 的 URL 中找到它。它是位于 /d/ 和 /edit 之间的一长串字符。
步骤 3：定义数据范围
接下来，你需要告诉 ProtoPie 要抓取哪些数据。范围用于指定你要导入的单元格。
这可以是一组列（例如 A:C）或整个工作表。
你可以使用 Sheet1!A1:D1 这样的格式来指定工作表名称和范围，或者只填写工作表名称以导入其全部数据。
步骤 4：生成你的 Google Sheets API 密钥
该密钥用于授权 ProtoPie 访问你的表格数据。
在顶部菜单中创建一个新项目。
在搜索栏中查找“Google Sheets API”，并为你的项目启用它。
导航到左侧的Credentials（凭据）选项卡。
点击Create Credentials（创建凭据），然后选择API key（API 密钥）。
你的密钥将被生成。复制它并将其添加到 ProtoPie Connect 中的 URL。
步骤 5：测试并排查问题
组合好 URL 后，在 ProtoPie Connect 中测试该请求。如果出现错误，最常见的问题是你的 Google Sheet 共享权限设置。
关键提示：请确保你的 Google Sheet 共享设置从“Restricted”改为“Anyone with the link.” 受限表格需要 OAuth 授权；如果你希望数据保持受限但仍在原型中使用，可以采用这种方式。不过，本教程不会涵盖该类型授权。
第 2 部分：在 ProtoPie 中解析数据
当 API 请求成功后，ProtoPie 会从你的表格中接收到一长串原始数据。现在，我们需要解析这些数据（将其拆分），以便在原型中使用。
来自 Google Sheets 的数据按“values”组织，这些值代表电子表格中的各行。第一行通常包含列标题（例如“Name”“Date”“Amount”），后续行则包含实际数据。
步骤 1：使用 parseJson 解析基础数据
parseJson() 公式是访问特定信息片段的关键。我们来看一个用于获取元数据的基础示例：
公式：parseJson(metaData "values."+ (ID+1)+".0")
**metaData：**这是你用于存储 API 调用原始数据的变量。
"Values."：这会告诉公式在数据的“values”部分中查找。
(ID+1)：这用于选择你想要的行。我们使用 +1 是因为第一行（第 0 行）通常是标题行，我们要访问的是其后的实际数据行。因此，要获取第一条数据行（即表格中的第二行），就需要查看第二组数据。
**".0"：**这用于选择该行内的具体项。每行中的数据项索引从 0 开始，所以 .0 是第一项，.1 是第二项，以此类推。
步骤 2：用于动态图表数据的高级示例
有时，Google Sheets 返回的数据结构并不适合直接解析。例如，如果你的月度支出是按年份逐年列出，那么查找某个月的支出就需要一些变通方法。
公式：parseJson(googleSheet,"values."+((year*12)+ monthID +1)+".2")
这个公式看起来可能很复杂，但它其实只是通过数学计算来精确定位我们需要的数据。
我们使用变量来表示目标年份和monthID。
(year*12)：这部分是核心计算。如果你的数据每年有 12 个月，这个计算会按每 12 行为一组向下跳转，从而定位到正确年份。
+ monthID：找到正确年份后，再加上月份编号以定位到正确行。
+1：这同样是为了跳过标题行。
".2"：这将获取该行中的第三个数据项（例如支出金额）。
总结一下！
就是这样！通过将 Google Sheets 连接到 ProtoPie，你可以超越静态设计，构建出像真实产品一样动态且响应迅速的原型。现在你可以拉取实时数据来驱动图表、列表和其他组件，从而打造更丰富、更具说服力的用户测试。
现在轮到你来试试了。记得生成你自己的 Google API 密钥，并正确设置表格权限。祝你原型制作愉快！
