制作你的第一个原型
在你的电脑上安装并打开 ProtoPie之后,你现在已经准备好开启创建第一个原型的旅程了!
为了快速开始这个过程,让我们来看看几个关键步骤:
导入你的设计:学习如何将你的设计无缝导入 ProtoPie。这样你就可以把现有素材带入原型制作环境。
创建交互:通过构建你的第一个交互,发掘 ProtoPie 的强大能力。释放你的创造力,用交互元素和引人入胜的用户体验让原型鲜活起来。
测试你的原型:借助 ProtoPie 的预览模式,你可以在构建过程中实时查看原型效果。
分享你的原型:当你对作品满意后,就可以把原型分享给他人了。探索 ProtoPie 提供的不同分享方式,展示你的成果并收集有价值的反馈。
要创建逼真的原型,理解 ProtoPie 独特的概念模型至关重要。这个模型是 ProtoPie 的基础与核心,决定了交互是如何被创建和实现的。
还没安装 ProtoPie?免费试用 ProtoPie!
1. 导入你的设计
首先,使用各自对应的 ProtoPie 插件,将你在 Figma、Sketch 或 Adobe XD 中的设计导入到 ProtoPie。

将画板或顶层框架导入为场景,并保留与 Figma、Sketch 和 Adobe XD 中相同的图层层级、位置和约束关系。
了解更多有关导入设计的信息。
2. 创建你的第一个交互
要创建你的第一个逼真交互,理解 ProtoPie 独特的概念模型非常关键。一旦你理解了它的工作方式,只需组合合适的组件,就能让你的交互生动呈现!
理解概念模型
概念模型是 ProtoPie 的基础与核心。它基于现实世界中物体的运动方式。
要创建一个原型,你需要创建交互。要创建一个交互,需要组合对象、触发器以及一个或多个响应。

在 ProtoPie 中,对象指的是受某个动作影响的图层。这种影响可以通过触发器或响应发生。触发器是触发一个或多个响应的动作,而响应则表示由触发器带来的变化。

这是 ProtoPie 触发器和响应的可视化展示,灵感来自元素周期表。每个触发器和响应都有其独特的功能和属性。
你可以选择的触发器和响应种类非常丰富。使用 ProtoPie 进行原型设计,本质上就是组合触发器和响应——来创建你能想象的任何交互!
来看这个示例:当你点击绿色矩形后,它会向右移动。这是由一个交互实现的,该交互由 Tap 触发器和 Move 响应组成,并且都被分配到绿色矩形图层。
当然,你也可以创建更复杂的交互。你可以:
在一个交互中设置多个响应。
在单个交互中将触发器和响应分配给不同图层。
控制每个响应的时长和延迟。
使用公式动态控制图层。
创建跨多个屏幕和设备的交互
3. 测试你制作的内容
利用预览窗口查看你的交互如何生动呈现。此功能可让你在与他人分享前识别并修正原型中的错误。
默认情况下,每当你更改图层或交互时,预览窗口都会自动更新。如果你希望在启动 ProtoPie Studio 或在不同原型间切换时默认隐藏预览窗口,只需在“偏好设置”菜单中将其关闭。
另一种方式是使用 ProtoPie Player,它是 ProtoPie Studio 的免费配套应用。你可以在 iOS、iPadOS 和 Android 上无缝查看、体验并测试原型。
了解更多有关 ProtoPie Player 的信息。
4. 分享你的第一个原型
将你的原型上传到云端,并把链接分享给利益相关者。根据原型类型,利益相关者可以在桌面浏览器、移动浏览器或 ProtoPie Player 中预览。

利益相关者可以使用存储在云端的原型进行可用性测试,并将其分享给其他利益相关者。
涉及敏感工作内容?为你的原型启用密码保护。
了解更多有关分享原型的信息。

准备好了解更多了吗?
通过以下课程加深你对 ProtoPie 的理解。
向他人学习
加入我们的社区,向其他 ProtoPie 用户学习。参与交流、提问并分享你想到的任何内容。发现其他用户之前分享的技巧、诀窍和解决方案。
如果你在制作 Pies 时遇到困难,或有希望我们讲解的特定主题,请在这里给我们留言:询问 ProtoPie。


