UI-闹钟界面设计

1. 本课主要内容如图示。

2. 【打开】Sketch软件，【新建】合适大小的画布。具体效果如图示。

3. 使用【矩形工具】绘制画布大小矩形，【填充】合适的渐变颜色。具体效果如图示。

4. 【拖入】导航栏至画布，放置合适的位置，按【Ctrl+L】打开标尺。具体效果如图示。

5. 使用【矩形工具】绘制矩形参考对象，放置合适的位置。根据矩形参考对象拖出参考线至合适的位置，【删除】矩形参考对象。使用【矩形工具】绘制菜单栏，【填充】合适的颜色，调整透明度，【拖入】菜单ICON素材，放置合适的位置。具体效果如图示。

6. 【拖入】时针参考图片，放置合适的位置。使用【椭圆工具】和【形状工具】根据参考图片绘制图案，【填充】对应的颜色，调整形状属性。具体效果如图示。

7. 【选择】关联图层，按【Ctrl+G】编组，【重命名】图组，调整图层顺序，调整椭圆颜色的细节。具体效果如图示。

8. 使用【钢笔工具】绘制形状对象，【选择】形状对象关联椭圆，【单击】剪去顶层多余的部分。【复制】顶圆图层样式，【粘贴】至关联对象，调整渐变颜色角度和透明度。具体效果如图示。

9. 使用相同的方法给剩余的圆添加相同的效果，使用【矩形工具】绘制矩形，调整圆角至合适的角度，单击【旋转复制工具】，具体参数如图示。

10. 单击中间点，按Shift键拖动至合适的大小。【选择】关联图层，按【Ctrl+G】编组，【重命名】图组。具体效果如图示。

11. 调整刻度矩形的位置细节，根据光影规律，按Alt键【复制】底部圆，调整图层顺序，【描边】1PX，【填充】无，调整描边至合适的颜色。具体效果如图示。

12. 【重命名】图组，根据光影规律，使用相同的方法，给其他的圆添加合适的高光效果。具体效果如图示。