欢迎光临
我们一直在努力

Axure炫技:如何让你的原型图动起来

1 1208 Axure炫技:如何让你的原型图动起来

 

下面我来介绍一下,如何在Mac上制作视频原型图

目录

一、使用工具介绍

二、制作原型图步骤&方法

  • 第一步,设计草图
  • 第二步,设置事件
  • 第三步,视频录制
  • 第四步,排序整理文件
  • 第五步,加入交互、文字说明
  • 第六步,附加音乐
  • 第七步,导出视频

三、总结

一、使用工具介绍

Mac系统下使用工具: Axure、 Final cut pro / iMovie、QuickTime Player

Win系统下使用工具:Axure、绘声绘影x6、xbox

先用Axure做原型并加上事件,然后用QuickTime Player/xbox进行录屏,录好后将视频分类命名整理,最后用 Final cut pro或iMovie进行制作打包即可

二、制作原型图步骤&方法

2.1  第一步,设计草图

本篇文章主要是讲如何让原型图动起来,所以不详细说明原型图怎么画哈~1 2149 Axure炫技:如何让你的原型图动起来

 

画一个带壳的原型图即可,然后将其他的原型图按照需要显示的顺序,叠加在带壳的原型图上。

2.2 第二步,设置事件

将画好的原型图,设置事件

1 3133 Axure炫技:如何让你的原型图动起来

 

2.3 第三步,视频录制

开始录屏了,为了视频能够流畅,录屏之前将原型先导出来,然后再打开index.html

1 4123 Axure炫技:如何让你的原型图动起来

 

2.4 第四步,排序整理文件

1 5101 Axure炫技:如何让你的原型图动起来

 

用数字排序后,直接导入视频编辑软件内方便合成视频做排序

2.5 第五步,加入交互、文字说明

1 688 Axure炫技:如何让你的原型图动起来

1 773 Axure炫技:如何让你的原型图动起来

1 862 Axure炫技:如何让你的原型图动起来

 

2.6 第六步,附加音乐

1 953 Axure炫技:如何让你的原型图动起来

 

如果觉得原型图视频太枯燥可以加一点音乐,实在不知道加什么音乐可以去…(你的作品给谁看呢?客户?老板?)那么你就去他们的朋友圈逛逛,有没有分享的音乐,然后下载放入即可~(加音乐的方式与加文字的方式是一样的)

2.7 第七步,导出视频

1 1047 Axure炫技:如何让你的原型图动起来

三、总结

这个技能也不是产品经理必备的,不过我倒感觉挺加分的,比如一些外包公司,需要给客户提供一些方案,这个时候给一个能动的原型不是更有胜算吗?也方便客户理解,对于外行人来说,毕竟看一个原型图是比较费脑的,如果再配上设计师的高保真的UI做这个的话,效果更赞

 

作者:Bass小南

来源:人人都是产品经理

赞(0)
未经允许不得转载:电商之家 » Axure炫技:如何让你的原型图动起来

登录

找回密码

注册