#交互# Axure
设备预览界面,对于首次进入设备预览界面的手机,需要输入设备的验证码解锁完成后预览界面才展示监控画面。
预览画面底部的 功能栏,会适配设备显示不同的功能。
界面底部展示其他的服务信息。
效果如下:

流程如下:
1. 绘制界面基本的框架、Navigation

2. 绘制预览画面

3. 绘制预览画面底部功能栏(适配设备,显示不同的功能按钮)

4. 绘制常用的功能栏(适配设备,显示不同的功能按钮)

绘制底部增值服务
5. 用PS绘制图标后导入Axure中,与打钩图标居中对齐

6. 导入图标,绘制背景矩形为渐变颜色

7. 复制TabBar中萤石的Icon,修改填充颜色为#c9d5e5

8. 添加文字

9. 添加标题栏

10. 绘制增值服务的内容

11. 底部服务的整体效果~~然后发现没有绘制“立即开通”按钮

12. 绘制172*47,渐变填充圆角矩形(渐变色#fd9768,#fe7537,渐变效果为上浅下深)

13. 添加按钮文字,字体大小26px,字体颜色#ffffff

14. 添加矩形边框、阴影效果

15. 放置按钮位置后的效果图

16. 完成~~

素材:

分享icon

设置icon

锁icon

播放icon

音量icon

全屏icon

对讲icon

截图icon

录像icon

云icon
