点击此处返回

每日可免费学习1个教程

立即登录>

软件入门平面设计 3D数字 C4D教程 Blender教程短视频制作影视动画摄影艺术室内设计绘画插画海外教程电商教程产品精修办公职场编程开发考证·外语品牌设计综合教程 UI设计兴趣生活

详情图文教程训练营推荐

UI设计

Sketch-资讯类社交APP界面设计

2807人学过难度:初级练习软件:Sketch

评论(31) 收藏课程已收藏下载视频

关注人数：694

现任集团高级交互设计师，从事云计算、云安全及大数据产品设计。擅长APP UI、用户体验设计及用户研究

如何设计好产品充值页（下）

3226人已学

如何设计好产品充值页（上）

7588人已学

课程综合评分：9.8分

评论可是有底线的

本节教程练习

1.本节课为大家带来社交APP页面的设计，具体内容【如图所示】。

2.打开【Sketch】，这是我们要设计的一个原型稿，【如图所示】。

3.【A】新建画板，【R】矩形工具，画矩形，关闭描边，从标尺拉出参考线，【Ctrl+D】再复制一个出来，同样拉出参考线，【如图所示】。

4.在画板下方用【矩形工具】画矩形，拉出参考线，在矩形内部再画一个矩形，在画板两边画出矩形，同样拉出参考线【如图所示】。

5.导入预设好顶部状态栏，【矩形工具】画矩形，导入预设图片，同时选中矩形和图片，【右键】选择蒙版【如图所示】。

6.【矩形工具】画一个与图片大小相同的矩形，关闭描边，填充为黑色，调整不透明度，【如图所示】。

7.【T】文字工具，打字，【Ctrl+D】复制，【矩形工具】画矩形，【T】打字，调整位置和大小【如图所示】。

8.【矩形工具】画矩形，【T】文字工具打字，导入图标素材【如图所示】。

9.【矩形工具】画矩形，【T】文字工具打字，【Ctrl+D】复制文字，按住【Shift】直接拖拽，【矩形工具】画几个小矩形，填充颜色，增加阴影，【T】输入文字信息，【如图所示】。

10.按住【Shift】直接点击矩形可以进行拖拽，【T】文字工具打字，【O】椭圆工具画圆，使用插件自动复制图片，【如图所示】。

登录后学习完整图文教程

虎课APP离线下载免流量

70000+教程，每天免费学一课

一键打开