发布时间:2023-8-24 分类: 电商动态
绘制APP原型的交互当主PM绘制APP原型时,它通常会纠缠是否绘制交互。这通常是因为它觉得这幅画很麻烦,而且不知道如何画画。
基于我多年的产品经验,我整理了大多数应用程序将使用的交互,并使用Axure绘制最简洁的实现步骤。
如果您的上级希望您绘制交互式APP原型或需要向客户端演示它,请参阅此文章以获取备份。
页面跳转
页面跳转意味着您可以从一个页面跳转到另一个页面,或者您可以返回到原始页面。
步骤:首先绘制一个页面,然后选择需要跳转的页面中的热区,最后将交互事件设置为它;从当前页面打开一个新链接,详细步骤如下:
所谓的热区意味着当您单击时,您将跳转到新页面。通常是图形按钮或文本按钮。
至于为什么要绘制页面跳转,可以参考旧文章《如何正确地画出页面流程图》
显示多屏幕内容
显示多屏幕内容的交互意味着当页面很长时,手指向上滑动以显示更多内容。
步骤:生成页面内容的动态面板,设置显示高度并根据需要显示滚动条。
导航
上部导航交互意味着当滚动页面时,上部导航仍然固定在移动电话屏幕的顶部。
步骤:选择正确的导航组件并右键单击以生成动态主控,然后将邮件修复到浏览器并设置相关参数。
向下导航
下面导航的交互意味着当滚动页面时,导航仍然固定在移动电话屏幕的底部。然后单击每个下方导航按钮以跳转到相应的导航页面并显示所选的按钮效果。
步骤:上一个效果与上部导航相同,后续步骤使用单个选项和页面事件。
吐司
Toast交互是指在需要提醒用户时在页面上显示Toast,然后在一段时间后自动消失。
操作步骤:模仿吐司风格,然后触发一定条件,显示吐司组件,设置等待3秒,然后隐藏组件。
壳层
子弹层的交互是指需要提醒用户执行重要操作,在页面上显示子弹层,然后用户决定是继续还是取消操作。
步骤:触发条件后,显示图层,然后单击按钮以隐藏图层或执行其他操作。
行动清单
操作列表的交互是指当需要提醒用户执行不同操作时,显示上拉列表,然后用户选择不同的操作或取消操作。
步骤:触发条件后,操作列表从页面底部向上显示,并部分遮盖以覆盖以下页面。然后单击按钮以下拉图层或执行其他操作。
总结
以上是我总结的APP原型中常见交互的Axure图,后续内容将会更新。
除了页面和交互之外,建议主要PM学习这种方法以更好地理解APP原型。至于您是否应该花时间在实际工作中绘制这些交互,请遵循您的项目要求。
当然,如果您将上述交互内容添加到APP组件库中,则可以快速将其应用到您自己的Axure RP项目中。
AxureRP源文件下载地址https://www.jianguoyun.com/p/DaXJp44Qu4zdBRjzoz4
专栏
浪子,商业总监,浪子PRD系列51prd.com,公共号码langzisay。
本文最初由@浪子发表。未经许可,禁止复制。
该地图来自unsplash,基于CC0协议