AxureRP作为一款原型图软件,本身功能非常强大了,遗憾的是暂时还不能添加本地视频。于是我们只能够用其它的方式去引用视频。

在这里,笔者推荐2个平台:bilibili和优酷。

AxureRP引入优酷视频教学

你可以将视频文件上传到B站上,然后由AxureRP软件引入。

具体操作步骤如下:

视频上传

(如果会上传,可以直接看axure操作部分)

1.首先,先将视频上传到Bilibili。登录bilibili后,点击右上角“投稿”按钮:

2.然后点击“上传视频”按钮,上传你的视频素材:

3.审核可能要稍等一会,等待审核通过后,可以在的“内容管理”,“稿件管理”,“已通过”中看到已过审的视频素材。

4.我们点击已过审的素材,进入到播放界面。在视频下方,找到分享按钮,然后单击“嵌入代码”图标(当前的bilibili版本是点击后,就直接复制了)。

5.不要心急,复制的代码并不能直接使用,需要经过截取部分,才能使用。我们将复制的代码,找个编辑器,或者粘贴在微信里,就可以看到代码内容了:

上面的代码中,我们只需要取其中一部分,只需要引号内的部分,如下图所示(从双斜杠的后面开始,到page=1):

 

复制上面蓝色部分的的代码,下一步,进入axure中操作。

Axure中操作部分

1.首先说明一下,由于AxureRP 8、9、10或其它版本,基本操作都是一样的,本案例以axure9版本演示。

首先,从默认元件库中,拖拽一个“内联框架”元件,到画布中。你可以根据需要显示的视频大小,自定义内联框架的宽高。

2.双击内联框架,双击后会出现一个操作弹窗,如下图所示。勾选“链接一个外部的URL或文件”,然后将刚才bilibili复制的代码,粘贴进来。

注意,很重要,需要保留https://

 

粘贴后,效果如下(请仔细检查,这里必须是https://开头的):

3.预览后,可以看到,已经能够正常显示了:

4.其它优化设置,其实到这里已经可以做完了,但为了追求完美的同学,还想知道怎么细节优化,比如这个视频怎么取消边框?

答案如下图所示,选中内联框架,然后“样式”,勾选“隐藏边框”,即可将视频的边框取消。

5.如何尽量减少顶部和底部的黑边?我们看下图,视频的顶部和底部,都有黑边:

其实很简单,相信有的小伙伴已经猜到了:拉宽内联框架就可以了,慢慢微调内联框架的长宽比,即可最大程度的减少黑边出现。

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

评论(1)