整个Web案例我们分为三阶段:
1. 导航栏
2. Banner
3. 嵌入视频 & 固定导航栏
从基本的点击跳转页面,状态样式,隐藏显示组件,到动态面板的使用,条件判断的使用等。
那么我们现在开始第一步“导航栏”:
STEP 1 . 拖放导航栏
导航栏底色:从组件库(Libraries)中拖出"Box 1"组件到画布中,并设置其样式(Style):坐标、宽、高、填充色、边框。
导航栏菜单:再来一个Box,设置为:
然后再复制几个,便成了这样:
加入图标,使用Axure RP 8自带的icons组件库(Apple、Search、Shopping Basket):
这样就感觉有模有样了。
STEP 2 . 增加鼠标进入样式
菜单按钮样式:选择所有菜单按钮,设置其"属性(PROPERTIES) > 交互样式(Interaction Styles) > MouseOver",Selected样式也可以设置:
这样,当鼠标进入菜单按钮时,就会触发我们设置的样式。
图标样式:同样,当鼠标进入icon时,也会触发新样式。设置方法相同,只不过icon不是改变字体颜色,而是填充色。
这样,我们的导航栏就完成了。
看视频可以看到,更多内容,更细节的操作哟。
工具能表现你的思考结果,甚至过程,过分依赖工具则会束缚你的思维。