关于软件Axure的思考和一些探索

目录

一、关于Axure的一些思考

二、关于用例的动作顺序探索

三、关于动态面板的理解和小技巧

四、关于“下拉同步放大”效果的函数探索

五、用浏览器预览Axure做的原型时,老是出现闪屏(特别是有交互动作的)怎么改善?


一、关于Axure的一些思考

        对于交互设计师而言,输出各种文档和图是工作的一项重要内容,为了提高工作效率,现在市面上有很多设计软件可以做图,每个软件都有自己的特色,我们在选择软件时应该根据使用目的去选择软件,在正确的时间选择正确的设计⼯具,而不能人云亦云

        Axure是一款老牌软件了,近年来市面上出现的sketch和Adobe XD都可能取代它,并且还在不断的出现新的设计软件,比如今年3月份公布的 Invision studio(目前只上线了mac版,不久后会上线win版),这些软件都有它们特有的优势,但是就目前来说,Axure仍然拥有很多交互设计师用户群,可以用它完成制作流程图、线框图、可交互原型、中(高)保真、动效设计等工作。

        在制作可交互原型Demo时,使用Axure比较麻烦,上手较难,现在市面上的principle(仅mac版)和protopie(有mac和win版)这类主打动效交互的软件可以简单快速的制作出Demo,并且软件上手容易,学习成本低,它们把常见的交互动效都提炼出来了,需要用时直接添加就可以使用。那我们还需要用Axure吗?Axure所有的交互动效都需要自己去设置动作、去构思,正是由于它的自定义程度高,因此可以用Axure做出绝大部分的交互动效效果,甚至我们还可以自己原创市面上没有的交互动效,利用它完成我们的创意。还是那句话:根据目的在正确的时间选择正确的设计工具


二、关于用例的动作顺序探索

        每一个交互用例下都可以添加很多个不同的动作,每个动作都需要设置动画时间,那这些动作的执行顺序是怎样的?我们到底设置多长时间是合适的?怎么设置合适的动画时间和顺序来保证交互动效是流畅且自然的?

我遇到这个问题之后进行了简单的探索,下面是视频解说


关于用例的动作顺序探索

测试用的Axure文件见文末百度网盘链接(关于用例的动作顺序探索.rp)

结论:对于同一个用例下的动作执行顺序

1、从单击开始动作同时执行,由设置的动画时间长短决定动作结束时间

2、“等待”这个动作是一个分界点,后面的所有动作要在“等待”动作执行完毕后才开始执行,也是同时执行

3、动作持续多长时间要根据动效效果来决定


三、关于动态面板的理解和小技巧

当我们在Axure中设置用例时,经常会先把元件转为动态面板,那动态面板是什么呢?

我想了一个形象的比喻来形容动态面板。动态面板就类似一间有窗户的屋子,屋子里面可以放很多不同的东西(元件),当我们在屋子外面时,只能通过窗户看到一部分区域的东西,还有一部分东西看不到。我们可以把屋子进行装修,放不同的东西,这就类似于动态面板的状态。

1、动态面板可以添加不同的状态,每个状态页面内可以添加很多不同的元件

2、动态面板可以设置内容尺寸,在动态面板所处的页面只会显示出该动态面板尺寸区域内的东西,区域外的不会显示出来

3、动态面板移动了,那在动态面板各个状态中的元件也会同时移动

4、动态面板多了,有时候添加用例就会乱,一般我们可以把要添加用例的元件都放在同一个层级(即同一个动态面板的同一状态中)

5、只有动态面板这个元件有“载入时”这一交互用例,当我们需要用到自动执行的动作时需要这个用例


四、关于“下拉同步放大”效果的函数探索


下拉同步放大效果

要实现向下拖动动态面板时,顶部图片同步放大;向上拖动时,顶部图片同步缩小;并且图片在放大缩小的过程中不变形,图片和下方界面之间无空隙,这样的完美交互效果就意味着动态面板下移100像素,图片的高度必须增加100像素,图片缩放时宽度和高度的比例不能变化来保证图片不变形。

怎么写设置尺寸动作的函数来达到效果呢?

动作设置图

案例效果Axure文件见文末百度网盘链接(下拉同步放大(公式3 完美).rp)

我探索了几种函数,为了节省时间,用手写代替了

公式2的效果:


下拉同步放大效果(不完美)

公式3的效果(完美):


下拉同步放大效果(完美)

通过尝试不同的公式,发现用公式3得到的下拉同步放大效果是最完美的。


五、用浏览器预览Axure做的原型时,老是出现闪屏(特别是有交互动作的)怎么改善?

这个问题我没有查到解决方案,只能优化原型。

因为浏览器是按照顺序载入显示元件的,顶层的先载入,底层的后载入,如果这时你顶层的元件要从隐藏变成显示,就会出现闪屏了。

优化方法:把要由隐藏变成显示的元件一开始就放在底层,逐渐把顶层的元件由显示变隐藏,这样就不会出现闪屏这样不好的体验了,事先考虑清楚元件出场顺序和在动态面板中的顺序。

_____________________________________________________________

本文用到的Axure文件百度网盘链接

链接:https://pan.baidu.com/s/1JKczP3kVqTVZrS6pLMKVbQ 密码:3t18

你可能感兴趣的:(关于软件Axure的思考和一些探索)