逼真的原型是每位设计师的愿望清单上的目标。然而，很多时候，设计师都会在如何让原型更进一步这件事上遇到一些困难。事实上，只要掌握一些数学知识和实践，创建动态且逼真的原型就会变得更容易。实际上，我并不是指你在学校里学过的纯数学，而是更接近于基于数字计算的艺术或技术，从而获得一种更具数学性的思维方式。
我将通过循序渐进的方式来讲解这个主题，并给你一些关于在 ProtoPie**.** 中使用变量和公式的小技巧。
你说的是变量和公式吗？
这些是 ProtoPie 的独特功能，能够释放交互的潜力，让它们更加动态和逼真。这些功能的魅力在于你可以定义自己的变量并创建自己的
，在其中你可以使用算术运算、变量和函数。基本上，这会给你无限的可能性去创建任何你想要的东西。
让我们从一些示例开始。
滑块
你可以使用Drag触发器和Scale响应轻松构建一个滑块。你可以拖动滑块的边缘并调整其高度。
你肯定想看到它达到了多少百分比，或者在拖动滑块时百分比的变化。在很多情况下，滑块的高度并不正好是 100 px，或者不是与百分比 1:1 对应的高度。所以，你需要一些数学计算来实现这个效果。让我们看看这个比例表达式。
例如，如果你在高度为 530 像素的滑块上拖动了 40 像素，那么你达到的百分比是 7.547%。非常简单，对吧？这里你可以使用一些函数来更好地显示百分比值：
ceil：向上取整到整数位。例如，ceil(7.547) = 8
round：四舍五入到整数位。例如，round(7.547) = 8
floor：向下取整到整数位。例如，floor(7.547) = 7
最后，你可以尝试使用以下公式来展示百分比。
需要加上“%”才能以“000%”的格式显示。
距离显示
想象一下触摸屏上有一个圆形控件，而你想知道拖动距离。当然，只要你能看到拖动前起点和终点的 Y 坐标，获取距离相对容易。但是，如何获取这些值呢？你需要研究拖动行为来解决这个问题。你的手指触碰屏幕并开始拖动，拖动结束后离开屏幕。所以，我会说你在起点触碰屏幕，在终点离开屏幕。就是这样！
Touch Down（在起点）→ Drag → Touch Up（在终点）。
你需要理解Touch Up和Touch Down触发器之间的区别。另外，你需要两个变量。在触摸屏幕时将圆的 Y 坐标赋给第一个变量，在抬起触摸时赋给第二个变量。你可以计算这两个变量的差值，也就是拖动距离。
距离值为正表示向下移动，为负表示向上移动。如果你只想显示距离值而不显示负号，可以使用 abs 函数。
滑动计数器
如果屏幕上没有可见的控制器，但你仍想知道拖动距离怎么办？例如，你可能想在手机上通过“盲操作”界面设置房间温度。听起来太复杂？这里有一个简单的解决方案：ProtoPie 提供了一些预定义变量。
$touchY：触点的 Y 坐标
$touchVelocityY：单位时间内移动的距离和方向
Touch Velocity 不仅显示速度，也显示方向（速度本质上是单位时间内的位移）。向下拖动时显示正值，向上拖动时显示负值。是的，你已经快完成了。
最后，你可以创建一个计数器：每当你向上拖动达到一定距离时计数加一，向下拖动时计数减一。
旋钮计数器
许多旋钮是按一定的旋转量工作，而不是按某个固定角度。想想汽车中控屏上用于调节温度的旋钮。
你需要两个变量来记录旋钮旋转时的初始角度和最后角度。差值为正表示顺时针旋转，差值为负表示逆时针旋转。在这个示例中，很重要的一点是：在计数器增减之后，要把初始角度变量更新为最后角度，以便进行下一次计算。
旋转时变量被赋值的过程。
计时器
数字助手或家电通常都有计时器，用于提醒通知或任务完成。
你可以像制作计数器一样制作计时器。不过我们通常看到的是时钟格式，例如 1:30（1 小时 30 分钟），而不是 90 分钟。好吧，让我们回到课堂，看看除法。如果你用 90 除以 60，商是 1，余数是 30。
你也可以用下面的表达式来说明。
Mod（取模）运算可以帮助你得到如下的余数。
因此，你可以使用除法和取模运算将 Counter 转换为 Timer 格式。
还有一件事，你可能希望分钟始终显示两位数，比如“05”分钟。你可以使用 lpad 函数在数字左侧补“0”，从而得到 2 位数字。lpad (5, 2, “0”) 返回 “05”。
下面是一些你今天可以通过应用我展示的技巧实现的示例！
我列出了一些基于数学的技巧和提示。你当然不需要成为火箭科学家或数学家。只要你能释放自己的想法，并用正确的方式表达出来，就已经非常足够了。如果你还有这里未列出的更多技巧，欢迎在评论区留言。
