Mockplus原型交互跟我做之3 - 认识“链接点”

UI / UI设计教程 / UI视频教程 /      

小m
其他 / 四川 成都

来源:jongde   作者:小m

关键词

上两次,我们已经快速地做了一个可以实用的交互(自动消失的消息框),还做了一个花哨但没用的东西,旋转的风车。

暂时缓缓往下走,我们先来了解点“基本知识”,Mockplus几乎不需要学习,不过呢,如果多了解一点,上手更快。

Mockplus能够快速设置交互,其中有一个东西,你必须熟悉,就是“链接点”。

选中一个组件,组件的右上方,会出现一个小圆点,如图:



把鼠标移动到小点之上,会弹出一个工具条,如图:


当我们需要做页面链接的时候,按住这个小圆点,不放开鼠标,往项目树上拉动,到达一个页面上后,放开。这样,就在按钮和目标页面之间做了一个链接,这个链接表明,当我点击按钮时,会跳转到目标页面。如图:


按下F5,进入演示,点击这个按钮,此时,你看到页面跳转了。

当我们需要做页内的组件交互时(比如,点击按钮,图片往右移动),按住这个小圆点,不放开鼠标,往图片上拉动,到达图片后,放开(之后,会弹出一个选择交互命令的对话框)。这样,就在按钮和图片页面之间做了一个链接,这个链接表明,当我点击按钮时,会让图片移动。如图:


看到对话框,选择“移动”,之后确定。

按下F5,进入演示,点击这个按钮,此时你可以看到图片移动了。





好了,歇歇。

关于链接点和链接小工具条,还有些是可以了解的,不过,以后碰到我们再说。

喝杯咖啡先。


 收藏