Axure教程:怎样做低保真轨迹追踪与回放
原型设计对于互联网审计系统及公安系统来说,终端的轨迹与回放的意义在于实施随时追踪和记录终端行为轨迹,其目的是为了监控和抓捕嫌疑人。其实,在很多的场合我们都应用到,像共享经济项目(共享单车、滴滴等)都会采集到终端的数据,以至于在平台进行管控。
具体设计如下:
(说明:文中所涉及数字分别为X、Y、W、H)
顺序为:底稿——state1(轨迹按钮及轨迹列表的制作——动态面板1(轨迹列表)——动态面板2()底稿地图+三个水滴显示(动态地图,按照鼠标按下与主页面进入进行用例设置)-动态面板(轨迹线)),state1中包含6个动态面板,其中3个是属于水滴,一个属于轨迹列表,一个属于轨迹线,state1进入即是一个动态页面(此页面用来设置底稿及轨迹按钮)。
预览效果图
制作底稿
制作底稿的目的是为了放置动态面板和按钮部件。
拖入两个矩形,先拖如底稿矩形部件,然后在头部拖入一个矩形部件,底稿为0,40,1000,460,头部为0,0,1000,40,使其处于统一位置即可,我这属于参考;然后,拉入文字标签部件,写:追踪。
底稿,其实就是一个动态面板的state1,在state1下放置的地图,如下:
轨迹底稿及轨迹回放按钮制作
拖入动态面板,并命名为:轨迹,尺寸为:0,40,1000,460(与主页底稿保持一致);然后,命名一个单页的动态页面名称:state1(防止遗忘);
(此举等有了地图后再做,以便有个参考)在当前的底稿上(地图),拉入按钮部件,并命名为:轨迹回放。
制作轨迹素材
从百度地图或高德地图处截图插入到当前页面,已地图作为底稿,拖入动态面板,并建立三个水滴标志,然后,将水滴标志改为动态面板,设置不同颜色;并设置用例:
轨迹点及底稿图
用例设置如下(三个水滴点统一设置,当拖动时的动作):
添加轨迹线
在轨迹点及底稿图中三水滴位置插入动态面板,拖入两根先并进行设置,两根线设置为粗显,颜色任意;短线为:0,0,179,158;长线为:179,0,281,225;然后推出至轨迹/State1位置。
轨迹条件设置
轨迹回放按钮:用例设置——鼠标单击时,并在用例中设置限制如下:
短线设置
长线设置
完成按钮的设置后,即可预览,其中,水滴可在页面中进行移动。
建议
按照整体思路:先放置好动态面板,然后再进行添加素材,最后根据放置水滴的位置再放置轨迹线的动态页面,其中轨迹线的动态页面需在水滴的范围内,轨迹线不能超出动态页面的范围;具体如下:
1、放置动态面板及按钮和下拉部件,使首页先固定;如图:
2、在动态页面state1,插入动态页面及底稿,其中底稿为地图图片素材;(注意:水滴的动态页面需要先放置水滴以后再设置为动态页面,并记录水滴放置的坐标,此坐标有利于轨迹线的显示);如图:
3、轨迹线的放置与设置(具体的设置已经在上面提到)
-
微信创始人张小龙首次公开演讲(官方无删减版)
微信创始人张小龙首次公开演讲(官方无删减版) -
如何通过APP看到产品战略层面
产品经理拿到一款产品的时候,不能只能看到表面信息,而是要能看到产品背后的信息。 -
基于用户的“真需求”创新产品
产品创新是保证企业在竞争激烈的市场上长久生存的关键,今天,我们就围绕产品创新和用户研究分享一些看法。 -
有一种交互设计研究验证叫“设计走查”
如何在最短的时间内对自己的产品做出检验,确保其在定位、设计、营销计划等多个环节,在可视范围内是正确的,需要一套比较科学、完善的方法去做出检测。 -
你为什么离不开微信?
张小龙说用完即走,你却爱不释手; 到底是什么让你离不开微信? -
移动互联时代APP的发展方向
现在我们已经走上了移动互联网时代,无论是企业还是公司,都会经过网络竞争中争取有利的优势,较为传统的产品竞争逐渐向互联网竞争转型,出现了很多数据云大数据等等 -
AI 时代产品经理的机遇和挑战
AI 时代产品经理的机遇和挑战 -
前1%与前10%的产品经理差距在哪?
前1%与前10%的产品经理差距在哪? -
你有哪些策略应对不断的需求变更?
你有哪些策略应对不断的需求变更? -
如何运营天猫【十亿俱乐部】商家页面?
如何运营天猫【十亿俱乐部】商家页面?