Play在移动端设计可交互原型

因此Play希望打破端坐在电脑前才能进行产品设计的现状，期望设计工作者可以直接通过移动端便捷快速的创建原型方案及演示Demo，让设计方案更接近设备上的真实效果。

在推出iPhone、iPad端后，Play团队目前正在内测功能更加强大的macOS版本。

本篇主要介绍其移动端体验，晚些时候再更新下篇分析下macOS版本的体验。

通常原型制作软件的通用架构中，除了中间最重要的画板区域，左右两侧包含图层、图层设置，布局设置模块，若将场景挪到竖屏移动端，这些操作和信息需要如何处理？

进入项目，选中单个画板进行编辑后，可以左右滑动并在出现的浮层中处理图层、调用组件，图层属性设置则在选中画板中的某一图层后通过底部浮层面板的方式出现。

图形属性设置中，包含设置（Settings）、图层属性（Layout、APPearance）、交互行为（Interactions）操作，Play采取了底部导航覆盖在半浮层上的方式，通常在国内的产品设计中我们很少会见到这样的设计，仔细体验后会发现底部导航能够快速定位需要调节的属性分类，同时在浮层的上方支持快速切换选中的图层，降低切换左浮层选图层带来的效率降低。

同时画板能够随着浮层的出现和上移自动缩放，整个体验十分丝滑。浮层面板支持拖拽到任意高度，让调节操作变得更加自如。

题外话：

Play底部导航盖在底部浮层上的设计在国内并不常见，相似的结构让我想到了照片编辑产品，通常滤镜的选择只允许横滑，如果想要查看更多必须跳转新的页面，或者拉起一个盖住当前照片、底部栏的浮层，这对于选择困难症来说效率着实有点低。

试想一下，这里有没有可能借鉴Play中通过浮层面板进行照片设置的操作呢？

在图层设置操作中，Play尽量使用滑动操作来完成设置，并且在调节滑块时的细节体验也处理得十分用心：

首先是触发滑动设置行为后，底部浮层面板会消失，画板全屏，确保用户能看清设置过程中所选的图层的变化；

用户通过手指操控时难免会产生微小位移，此时整个滑块组件会完全跟随手指定位垂直位置；

当手指左右移动变缓，滑块会立刻变为精细的刻度调节；

Play主打iOS的原生应用体验，支持添加多种可交互组件，包括：文本、开关、滑块、选择器、日历、视频、地图等，在动画上也使用原生iOS应用程序相同的技术渲染，帮助用户免去重复绘制过程。

在移动端绘制原型

Play支持绑定Figma账号，创建新项目后，可以通过粘贴链接的方式从Figma导入，能够识别Figma文件中的组件，同时Play也内置了多种模板供选择，包含基础导航、瀑布流、地图服务、相册、表单等。

因此Play团队原本设想的在移动端进行原型和交互制作更适合用在对原型精细度要求较低的设计冲刺、头脑风暴场景，通过快速调用内置组件进行概念方案创作。

视频为1.6倍加速效果Play可能也意识到了这个问题，不仅于22年推出了iPad端，并在近期开放了MacOS版本的内测邀请，横屏的大空间解决了iPhone竖屏空间不足的问题，可以避免制作复杂原型时因屏幕空间受限，不得已的切换和浮层降低效率，同时iPad上的修改可以实时同步到iPhone上进行体验。

Demo制作虽然原型制作体验不佳，但Play带来的动效制作体验令人惊喜。从Play提供的能力来看基本覆盖了包含点击、移动、滚动、长按、拖拽、监听等常用的触发行为。Play中的交互事件涵盖转场、图层属性设置、位移、状态、旋转、文本框交互、相机、播放等较为全面的诉求，基本可以替代现有的交互原型制作工具。

在官方透露的macOS页面中，除了和Figma等产品一样的无限画布体验，Play的特色在于切换iPhone尺寸后可实现所有页面的自适应，并且在手机设备上实时同步效果。

Demo制作能力上保持了和iPhone端相同的思路，但显然更大的画布有利于管理多个交互事件。

另外其团队从20年开始就承诺的支持导出为Xcode代码能力也将在macOS版本兑现。

对比市面上的原型产品，Play的表现已经十分亮眼。其团队仿佛并不甘心只做类似Principle或者Protopie的角色，而是从更极致的iOS原生体验、快速搭建可交互原型的角度去差异化。不论一开始发力移动端制作原型的方向是否正确，从Play每个版本和端呈现给用户的能力来看，其团队真的愿意沉下心提供深度的交互能力，并在产品理念、产品设计上保持一定的创新。从目前路透的功能来看，我个人非常看好即将到来的macOS版本，其与iOS设备的联动也弥补了Figma、Protopie等产品对可交互原型覆盖场景的不足。非常适合设计师现场演示设计方案，并根据讨论和建议及时调整交互效果。甚至可作为用户测试的工具。作为目前还在免费的设计工具，Play的出现也会更加利好基于iOS工作的独立开发者。就让我们拭目以待吧～