美文网首页
Axure8 交互设计

Axure8 交互设计

作者: CallMeRaymon | 来源:发表于2020-07-26 19:20 被阅读0次

    目录(稍后给醋索引)

    1.鼠标悬停

    场景:甲方爸爸说鼠标悬停后可以切换样式,那么像这样简单的case就用如下办法解决就可

    学点:理解交互样式

    绘制一个框框,选中,在图1.1右边找到"鼠标悬停",点击后出现图1.2

    图1.1 图1.2

    交互样式触发的事件类型只有四个,控制的元件属性也比较少

    2.鼠标悬停时改变文字内容

    场景:甲方爸爸说鼠标悬停后切换颜色(这个功能用上面方法1即可解决,下面的改变文字实际上是对上面的效果功能进行迭代)还要改变文字,显然比上面那个复杂了一丢丢,那么采用以下办法解决,也就是类似规则编辑器(也可以拿ow地图工坊的规则编辑器作比方)

    学点:理解交互动作

    绘制一个带文字的框框,选中,选择右边的"鼠标移入时",弹出"用例编辑"设置框,如图2.1

    图2.1

    这里的case是系统识别到动作的归属者的差异性,即组件A的状态1是case1,组件A的状态2是case2,泛全局有效差异(即整个系统都是对组件A的状态1是case1,组件A的状态2是case2,切出去再对组件B进行设计时,会从case3开始编排)

    在弹出的"用力编辑"框框中,点击"设置文本"。,如图2.2

    图2.2

    勾选"当前文件",将"值"更改成要更改的的内容

    图2.3

    3.一级交互联动式改变效果内容

    场景:甲方爸爸说 我不要鼠标亲自触碰框框从而达到改变效果,要在"无触碰"下改变效果 

    学点:初步理解交互联动

    思路:引进一个小伙伴C让其充当我们的开关,我们通过开关控制实现无接触改变效果

    绘制一个带文字的框框,选中,选择右边的"鼠标移入时",弹出"用例编辑"设置框,如图3.1

    图3.1

    对蓝色方块选中,点击“鼠标移入时”,弹出方框,选择 "触发事件",选择作用对象,再选择鼠标移入时,完成 移入的触发。

    接着,按照一样的办法,完成 移出的触发。

    图3.2

    完成上面两步 的触发后,就完成啦。点击preview预览效果吧。

    4.指示器+面板=金刚区

    场景:场景不多说 就是淘宝/美团中间的"金刚区"或者说是 banner区,与指示器配合使用

    学点:掌握dramtic panel的使用

    联系:就是墨刀软件中的局部滚动

    思路:选中跟不选中,交互样式+交互逻辑

    如图4.1所示,完成局部滚动的效果

    图4.1

    指示器的思路就是 选中则黄,不选中则灰度。图4.2是第一个指示器的规则,其他两个指示器道理同。

    每个指示器在交互样式那里 选择  选中就填充黄色。

    此外,指示器是肯定有一个默认显示的,一般也是取第一个状态为默认状态,即第一个状态的指示器是显示黄色的。

    图4.2

    5.TabHost的制作

    场景:底部导航栏

    学点:交互

    只需要改图中的那些东西就行,其他不用改 不然就会乱,如图5.1

    图5.1

    最终总结

    1.每个元件都需要命名,以免后面乱了。

    2.逻辑想清楚,多操作!

    相关文章

      网友评论

          本文标题:Axure8 交互设计

          本文链接:https://www.haomeiwen.com/subject/owtglktx.html