Axure学习笔记:TIM扫描

#交互#   Axure


TIM的扫一扫功能,主要用于扫描对方二维码添加好友,其中在这界面也提供了读取相册二维码功能,以及显示用户的二维码的功能。

界面的背景,直接显示为相机取景内容,视野较广。但是对于较多元素的场景时,界面视觉不太友好,会显得界面比较凌乱,而且最顶部的图层的空间也极有可能难以找到。


效果如下:

Axure学习笔记:TIM扫描_第1张图片

流程如下:

1. PS中打开TIM扫描二维码界面,先绘制一个750*1334,填充#000000,不带边框,不透明度为10%的矩形。

Axure学习笔记:TIM扫描_第2张图片

2. 绘制扫描框内的白色边框矩形(不填充,边框#FFFFFF,510*510)。

Axure学习笔记:TIM扫描_第3张图片

3. 复制白色边框图层,修改矩形参数(不填充,边框#06A9EB,540*540)。

Axure学习笔记:TIM扫描_第4张图片

4. 栅格化蓝色边框图层。

Axure学习笔记:TIM扫描_第5张图片

5. 使用矩形选择工具,删除多余的蓝色边框。

Axure学习笔记:TIM扫描_第6张图片

6. 栅格化黑色遮罩矩形图层。

Axure学习笔记:TIM扫描_第7张图片

7. 使用举行选择工具,删除黑色遮罩图层上扫描框内的区域

Axure学习笔记:TIM扫描_第8张图片

8. 绘制扫描框内的蓝色扫描线。生成png图片

Axure学习笔记:TIM扫描_第9张图片

9. 黑色遮罩png图片导入Axure中,绘制界面其他内容。

Axure学习笔记:TIM扫描_第10张图片

素材:

TIM 灰色遮罩扫描图层

Axure学习笔记:TIM扫描_第11张图片

你可能感兴趣的:(Axure学习笔记:TIM扫描)