不管是在PC端还是移动端,轮播图是常见的设计元素,一般产品的首页位置都会通过轮播图的方式来展示重点推荐的内容。本文作者介绍了如何用Axure实现轮播图效果的操作步骤,与大家分享。
案例展示:轮播图
工具:Axure RP9
一、轮播图设计构思
二、按部就班,逐个击破
1. 先画轮播图的整体的结构
如下图:动态面板(375*195)、圆(3个,10*10)、向左、向右按钮图片(40*40)
(1) 动态面板:给动态面板每一层面板填充颜色(因为有找图纠结症,哈哈哈)
(2)三个圆(专业术语:指示器):圆设置成选项组。(选项组作用:同一个选项组的元件,当其中一个部件被选中时,系统会自动取消选择其他部件。)
操作:同时选中三个圆(圆从左至右分别命名为“槽点1”、“槽点2”、“槽点3”),鼠标右键,点击【设置选项组】,给选选项组命名后,点击确定;
依次给每一个圆【添加交互样式】—【元件选中的样式】选择填充颜色。(注:第一个圆点要默认选择状态:“形状属性”— 勾选“选中”)
<