![中文版Photoshop平面广告设计与制作全视频实战228例](https://wfqqreader-1252317822.image.myqcloud.com/cover/443/31794443/b_31794443.jpg)
第6章 矢量绘图
本章概述
矢量图是由线条和轮廓组成,不会因为放大或缩小使像素受损,从而影响清晰度。钢笔工具与形状工具都是典型的矢量绘图工具。在平面设计制作过程中,尽量使用矢量绘图工具进行绘制,这样可以保证在适应不同尺寸的打印要求时,对图像缩放不会使画面元素变得模糊。除此之外,矢量绘图因其明快的色彩、动感的线条也常用于插画或者时装画的绘制。
本章重点
⃟熟练掌握钢笔工具的使用方法
⃟熟练使用形状工具的使用方法
/佳/作/欣/赏/
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P124_1.jpg?sign=1739005275-ZkUJTf7Lwxa8ruPXvlvSxeLYXMIxUCVm-0-f14cde36ceefce1fc91361ac1bc7fdd9)
实例064 使用钢笔工具制作APP标志
文件路径 第6章\使用钢笔工具制作APP标志
难易指数 ★★★☆☆
技术掌握
●钢笔工具
●路径的运算
●文字工具
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P125_1.jpg?sign=1739005275-cz4tP1motok8RpO33UDLlVGkFYbMcuc5-0-c26a08e379dd68221222facf8bfea00a)
扫码深度学习
操作思路
钢笔工具可以绘制“路径”对象和“形状”对象。本案例使用钢笔工具在画面中绘制形状,最后在形状上方输入文字,完成标志的制作。
案例效果
案例效果如图6-1所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P125_2.jpg?sign=1739005275-hr4l5GI5UidIdL9u1KJ2pxWufyixVPj8-0-779b2d6c168817321b8274293fd237cb)
图6-1
操作步骤
01 执行菜单“文件>新建”命令,在“新建文档”对话框中设置“宽度”为1200像素、“高度”为702像素、“分辨率”为72像素/英寸,“颜色模式”为“RGB颜色”、“背景内容”为“白色”,单击“创建”按钮完成设置,如图6-2所示。单击工具箱中的“前景色”图标,在弹出的“拾色器(前景色)”对话框中设置颜色为蓝色(R:183、G:239、B:255),单击“确定”按钮完成设置,如图6-3所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P125_3.jpg?sign=1739005275-NZf9u5x1V0AWqYyrYdbOq5XAXRhv8rMG-0-7d91df04b10f28ab7dbfbf9eca16248e)
图6-2
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P125_5.jpg?sign=1739005275-9PpRXohV1yaMvKCjTLtYWiVUrqb1oCE2-0-a6cdb1bf12bf4475c87cb283697da665)
图6-3
02 使用前景色(填充快捷键为Alt+Delete)填充画布为蓝色,如图6-4所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P125_6.jpg?sign=1739005275-sDVEE5c8fTyrpzeaQEfUlZP4mngUDenu-0-3502f4ec09620c27cb6a14e09b55eec6)
图6-4
03 选择工具箱中的(钢笔工具),在工具选项栏中设置绘制模式为“形状”,单击“填充”图标,在下拉面板中设置颜色为粉色,使用钢笔工具在画面中多次单击绘制折线形状,如图6-5所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P125_7.jpg?sign=1739005275-hnkB1ZZTcv9pIKZjPE1IBIgqg9BFvxFT-0-4c80f1152b5488563bbcd35fb3d7338e)
图6-5
04 在工具选项栏中单击“路径操作”按钮,在下拉菜单中选择“减去顶层形状”,单击“矩形工具”按钮,如图6-6所示。然后在折线中绘制一个矩形,使这部分被删除,此时画面效果如图6-7所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P125_8.jpg?sign=1739005275-rnHCO06DJ2acVwPcD1BOSWoL2yiYBVje-0-3d2b93fc6c2e47c7cf5504212c2a73ec)
图6-6
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P126_1.jpg?sign=1739005275-cjwcTomj0r0ieF6u0HudirBDaTxwOIAr-0-81306b2c684f50c4a3339d1c00122a7e)
图6-7
05 选择工具箱中的横排文字工具,然后在工具选项栏中设置适合的“字体”和“字号”,设置填充颜色为白色,然后在画面中单击并输入文字,此时画面效果如图6-8所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P126_2.jpg?sign=1739005275-5Zqgv51iUy5IF4UCNGyK1FD2N4g6vqYD-0-0460324afa65a9105b0c2bdb85f016ee)
图6-8
提示 终止路径绘制的操作
如果要终止路径绘制的操作,可以在钢笔工具的状态下按Esc键完成路径的绘制。或者选择工具箱中的其他任意一个工具,也可以终止路径绘制的操作。
要点速查:路径的运算
选区可以进行运算,路径同样也可以进行运算。首先绘制一个形状,如图6-9所示。默认状态下,工具选项栏中的“路径操作”按钮为(新建图层)。单击该按钮,在下拉菜单中选择一种运算方式,如图6-10所示。图6-11所示为不同运算方式产生的运算效果。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P126_4.jpg?sign=1739005275-ELxMgzyiBI9z3u4XubTlXgLBBqqm1XUa-0-f040f30037e5965079ad2cb10c7b23ec)
图6-9
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P126_5.jpg?sign=1739005275-zjb4KnAfwY5OKndfQNLdPaLgvPNeRZCm-0-0f20dcf25c1ac633f3ab8b49151e0b78)
图6-10
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P126_6.jpg?sign=1739005275-0IcZU9Rf3zWobawHCId2E3H771P3iBg0-0-7cd9c0deb76cb502d2183f4c610e4af3)
图6-11
实例065 使用钢笔工具抠图制作购物APP启动页面
文件路径 第6章\使用钢笔工具抠图制作购物APP启动页面
难易指数 ★★★☆☆
技术掌握
●钢笔工具
●将路径转换为选区
●图层蒙版
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P126_7.jpg?sign=1739005275-JWBtEhGQ0rOoam2yYAcAcP3obkMKsZih-0-a3b0ad162eea6f524444ee3bbd6c37c8)
扫码深度学习
操作思路
本案例使用钢笔工具在人物周围绘制路径,并将路径转换为选区;使用图层蒙版将选区外的部分隐藏,此时画面出现新的背景。
案例效果
案例效果如图6-12所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P126_8.jpg?sign=1739005275-McXqGyE99O2OPDb4TlbepHiToGI2sjrM-0-9d421ff708381e94d2a1e8dffbf4efaa)
图6-12
操作步骤
01 执行菜单“文件>打开”命令,或按Ctrl+O快捷键,在弹出的“打开”对话框中选择素材“2.jpg”,单击“打开”按钮,如图6-13和图6-14所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P126_9.jpg?sign=1739005275-jGrtPj4STzFhE2TG1xDZH5wqOLJVXm3G-0-27c88ca213a322ac85ac43ec0bd68f59)
图6-13
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P126_10.jpg?sign=1739005275-F1l0QOVRfdvBx3eyhCCOdn5mKQQd4vz7-0-666e8e27bf2f80b74b69c0e3b1afc296)
图6-14
02 执行菜单“文件>置入嵌入的智能对象”命令,在弹出的“置入嵌入对象”对话框中选择素材“1.jpg”,然后单击“置入”按钮,如图6-15所示。将人物素材调整到合适大小,然后按Enter键完成置入。选择素材图层,执行菜单“图层>栅格化>智能对象”命令,将该图层栅格化为普通图层,效果如图6-16所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P127_1.jpg?sign=1739005275-7EmnZVK3MOnSWP9NiG3ZZFf3qH5BpnDc-0-f5756ffed2828d3ad4fb11df893148d8)
图6-15
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P127_2.jpg?sign=1739005275-IF3K8D11OHIYwCO9Do0RmyfU51xfcki2-0-9afe8041ebaf798a684defb35d3b83da)
图6-16
03 选择工具箱中的钢笔工具,在工具选项栏中设置绘制模式为“路径”,在画面中人物边缘按鼠标左键单击拖曳绘制路径,如图6-17所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P127_3.jpg?sign=1739005275-Y4OOewJ3sga33g6332FCVuTozJPdJX79-0-08fe97162d714e2a45bf473bc6c375de)
图6-17
04 选择工具箱中的直接选择工具,然后框选人物头上的锚点,将锚点拖曳到人物边缘上,如图6-18所示。选择工具箱中的(转换点工具),然后将光标移动到锚点上,按住并拖曳使路径完全符合人物轮廓,如图6-19所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P127_5.jpg?sign=1739005275-7fLoeHgh1SMWePresLW92QH6ZiEVhyBo-0-ac7a2b8bfeb08226e4f50ee1be68b712)
图6-18
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P127_6.jpg?sign=1739005275-rOAE9WTAT0EFC93q5UME36y8QxVl5cz2-0-93ce910df81f4a65ba9b26098f3416a2)
图6-19
05 使用同样的方法,调整其他锚点,如图6-20所示。调整完成后使用Ctrl+Enter快捷键将路径转换为选区,如图6-21所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P127_7.jpg?sign=1739005275-OdhKHlx9i5nNOkr6ODFqGNnP5BXZK5dx-0-fe963f5f2972fa69f379460f37fd1445)
图6-20
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P127_9.jpg?sign=1739005275-ux3PuY9zZ6Nhp1ydQ3TnTP2VaUNaeShG-0-872158c4f1d5510eec321a52f8067c43)
图6-21
提示 基于选区添加图层蒙版
如果当前图像中存在选区。选中某图层,单击“图层”面板底部的“添加图层蒙版”按钮,可以基于当前选区为任何图层添加图层蒙版,选区以外的图像将被蒙版隐藏。
06 选中人物图层,在“图层”面板中单击“创建图层蒙版”按钮,如图6-22所示。使选区以外的部分隐藏,画面效果如图6-23所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P127_10.jpg?sign=1739005275-ujvrmYzU2Nx9uWvhAk2nVnNcBplC8DYq-0-e54d89dc33ff35fe0eb2a5c783860f0d)
图6-22
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P127_11.jpg?sign=1739005275-O0kvrhlUJ73qViX3Gmsi8tYYke5EtBkm-0-6f1a691dd3a1d1f7792627d15d03cb4e)
图6-23
提示 蒙版的使用技巧
要使用图层蒙版,首先要选对图层,其次要选择蒙版。默认情况下,添加图层蒙版后就是选中的状态。如果要重新选择图层蒙版,单击图层蒙版缩览图即可。
实例066 使用形状工具与形状运算制作引导页
文件路径 第6章\使用形状工具与形状运算制作引导页
难易指数 ★★★☆☆
技术掌握
●形状工具
●形状运算
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P128_1.jpg?sign=1739005275-ZeFQr7Spn51GDoHdRsgSt5RPVB5yQLB2-0-a872f168bba118a2a2ea13ff2790824d)
扫码深度学习
操作思路
本案例主要使用工具箱中的各种形状工具在画面中绘制图案,在绘制过程中要合理使用形状运算,利用形状运算的特征制作外形奇特的图形。
案例效果
案例效果如图6-24所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P128_2.jpg?sign=1739005275-yX70xlNqRjSnAwqQJM4G3nCPOj7ouMks-0-a964b7653769c07c77b84dcc4a7b4ce1)
图6-24
操作步骤
01 执行菜单“文件>新建”命令,创建新文档。单击工具箱中的“前景色”图标,在弹出的“拾色器(前景色)”对话框中设置颜色为蓝色,单击“确认”按钮完成设置,如图6-25所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P128_3.jpg?sign=1739005275-lPnc3PAHplGWLPuMGcrjlMU4ggkC7nxX-0-06ee2866f41fcd7a3f8ca35b245ec9f2)
图6-25
02 使用前景色(填充快捷键为Alt+Delete)填充画布为蓝色,如图6-26所示。右击工具箱中的形状工具组,在工具组列表中选择椭圆工具,在工具选项栏中设置绘制模式为“形状”,单击“填充”图标,在下拉面板中选择填充颜色为红色,按住Shift键并按住鼠标左键在画面左侧位置拖曳绘制圆形,如图6-27所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P128_4.jpg?sign=1739005275-Frqm6XNntxLxCeS316USAPGj5Ak07cBY-0-1ce47606064955b70ee87d1b2c0f435f)
图6-26
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P128_5.jpg?sign=1739005275-7aYhcKIoxIlTQ3xC6wRtPE0WgfDNrnWF-0-7b97dc1d16e6966c02ccd19d54fedda2)
图6-27
03 在“图层”面板中选中形状图层并将其拖曳到“创建新图层”按钮上,进行复制,如图6-28所示。选择复制的图层,在工具选项栏中设置“填充”为绿色,然后将复制的圆移动到红圆右侧,此时画面效果如图6-29所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P128_7.jpg?sign=1739005275-5Ge5FCADsqyEEpadAvifxB6uyyOpdhB8-0-c33ac552710bda8389576b4a9ce9da59)
图6-28
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P128_8.jpg?sign=1739005275-m9fJFHKSnHcZ3A8ZNerftAhA76IGGi2I-0-82c78be4d87c1a4031dc3ffca52849a8)
图6-29
04 使用同样的方法,制作蓝色正圆,如图6-30所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P128_9.jpg?sign=1739005275-3rIyero8eQ0b1ulfoEXtXW2sHPO1N5M3-0-92aa828742253cf2fb3318c8b5454b8f)
图6-30
05 选择工具箱中的(钢笔工具),在工具选项栏中设置绘制模式为“形状”,单击“填充”图标,在下拉面板中选择填充颜色为白色,在画面中绘制形状,如图6-31所示。继续使用钢笔工具,将工具选项栏中的形状“填充”改为蓝色,然后在右侧白色图形下方绘制三角形,如图6-32所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P128_11.jpg?sign=1739005275-fC5uaSCPUEhHB0yebLaA3wPJC4L1xLI8-0-1fcdf918c418f396d4d50625c3f99bc7)
图6-31
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P128_12.jpg?sign=1739005275-juWwQi6qHQD2HNYpJQaofUZZ2xme3C7M-0-1da54d81ba5c85cb0f63da690f06715e)
图6-32
06 在选择钢笔工具的状态下,在工具选项栏中设置绘制模式为“形状”,单击“填充”图标,在下拉面板中单击“渐变”按钮,然后编辑一个蓝色系的渐变颜色。在画面的左下角绘制一个三角形,如图6-33所示。选择工具箱中的椭圆工具,在工具选项栏中设置绘制模式为“形状”,单击“填充”图标,设置“填充”颜色为白色,按住鼠标左键并拖曳绘制圆形,然后在其选项栏中单击“路径操作”按钮,在下拉菜单中选择“合并形状”,再绘制其他椭圆,同样的方法依次绘制两个椭圆,如图6-34所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P129_1.jpg?sign=1739005275-WwXoH4qAUVRHmzqbNf1ni4PWV6ZEdZdF-0-92b2e7dc232aa78acb9501a8192dd830)
图6-33
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P129_2.jpg?sign=1739005275-IQVSHXkrUkFgt925EDVH4C7BlB11Xftr-0-5875657676b99c7f32413163a83fe8ac)
图6-34
07 继续在当前图层操作,在工具选项栏中单击“路径操作”按钮,设置为“减去顶层形状”,然后选择工具箱中的矩形工具,在工具选项栏中设置绘制模式为“形状”,单击“填充”按钮,设置“填充”颜色为白色,在白色图形的下方按住鼠标左键并拖曳绘制矩形,如图6-35所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P129_3.jpg?sign=1739005275-Uorr6xvzEUO93xcjo7wMPI5p9vCWwR0L-0-d15f4188a0034dffce4e4ded9922c358)
图6-35
08 再次使用椭圆工具在云朵图形下方绘制深蓝色正圆,并将其复制,如图6-36所示。在“图层”面板中按住Ctrl键选中多个深蓝色正圆图层,在工具选项栏中单击“垂直居中对齐”按钮,在弹出的下拉菜单中选择“水平居中分布”,此时画面效果如图6-37所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P129_4.jpg?sign=1739005275-6Ijz2wWc7IkpRUihf3VM368KWKDT7sTy-0-df9b3425acf203214def6613dd4c5dfd)
图6-36
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P129_5.jpg?sign=1739005275-IzQeW7zi2Frwxhhzf9D01P52xBa46mPZ-0-621749437f2bb2ed6c9be329f59afa19)
图6-37
09 在“图层”面板中选择一个椭圆图层,然后设置工具选项栏中的“填充”为白色,此时该圆变成白色正圆,如图6-38所示。在工具箱中选择横排文字工具,在工具选项栏中设置适合的“字体”和“字号”,设置填充颜色为白色,然后在画面中单击并输入文字,如图6-39所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P129_6.jpg?sign=1739005275-XgsxyqVlCweD42ELkZXPOP0XookaGwos-0-b42ef966ce8a6543f061e3d2edd91625)
图6-38
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P129_7.jpg?sign=1739005275-BS1p6vOpQXHmiRq2ccFQP1OcBuKWr4C5-0-dbd2b06ee693f3fff4ea74236df6580e)
图6-39
10 执行菜单“文件>置入嵌入的智能对象”命令,在弹出的“置入嵌入对象”对话框中选择素材“1.png”,然后单击“置入”按钮,如图6-40所示。将素材调整到适合位置,按Enter键完成置入,最终效果如图6-41所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P129_8.jpg?sign=1739005275-9nOWhkbhF2ljjMtnrBnJ6N6M7XVFjvPT-0-7b2f8ec79dc7af0b7bea13b416ff9170)
图6-40
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P129_9.jpg?sign=1739005275-8QJ9kjGDapqHIlpXk3lsZ6b678uFvu7V-0-01cd1eb2d6ae8c83fc0b9b5ba39506d8)
图6-41
实例067 使用椭圆工具制作画面创意效果
文件路径 第6章\使用椭圆工具制作画面创意效果
难易指数 ★☆☆☆☆
技术掌握
●椭圆工具
●横排文字工具
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P130_1.jpg?sign=1739005275-t837HNUlBBskS5jdDgopxX2S6cGuNU2m-0-38a0e04cc2e9f95258e3ea94c4144f69)
扫码深度学习
操作思路
本案例主要使用椭圆工具在画面中按住Shift键的同时按住鼠标左键拖曳绘制矢量圆形,然后在上方输入合适的文字,完成最终的操作。
案例效果
案例效果如图6-42所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P130_2.jpg?sign=1739005275-W4tOp88K5bSGWkcFTYopdyDjdS9JLWP1-0-5d5be0ba7cdede5b5c21d554ab63eedc)
图6-42
操作步骤
01 执行菜单“文件>打开”命令,打开素材“1.jpg”,如图6-43所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P130_3.jpg?sign=1739005275-COxuSm1zCxHNrQTKqLrauZMgcjT1VPLi-0-b413bde603aef9035f432a4ec2d39473)
图6-43
02 选择工具箱中的(椭圆工具),将工具选项栏中的绘制模式设置为“形状”、“填充”为白色、“描边”为无,在画面中按住Shift键绘制一个白色正圆,如图6-44所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P130_5.jpg?sign=1739005275-fYVXw87lUMOfgDq6ljYiqosC60soaJsu-0-0456c206200961838299b709c7a28d37)
图6-44
03 接下来在画面中绘制文字部分。选择工具箱中的(横排文字工具),在工具选项栏中设置合适的“字体”“字号”和“颜色”。然后在画面中单击,输入文字。输入完成后单击工具选项栏中的“提交当前所有操作”按钮
,即可完成操作。将文字放置在正圆内部,如图6-45所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P130_8.jpg?sign=1739005275-p7BDgbVrfhPAldjR1h5efWCn6ACH0dNs-0-0f160d402a64c69669bbaa4459e506d5)
图6-45
04 变换“字体”“字号”和“颜色”,继续在圆形下方输入剩余文字,最终效果如图6-46所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P130_9.jpg?sign=1739005275-b4BR4GyfQU49ss3YKRrbYnlNZlENWv2y-0-416cb56a71be2e905c21093db8bf3dba)
图6-46
实例068 极简风格图标设计
文件路径 第6章\极简风格图标设计
难易指数 ★★★☆☆
技术掌握
●圆角矩形工具
●钢笔工具
●自定形状工具
●图层样式
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P130_10.jpg?sign=1739005275-yrY5qYLBhkAEi6Aooyuj3KiwTdLMmLBc-0-c6e98fd284f07f13b1f95243784ec25c)
扫码深度学习
操作思路
本案例首先使用圆角矩形工具制作图标背景部分,其次运用钢笔工具绘制矢量的蓝色形状,最后使用自定形状工具添加其他元素。
案例效果
案例效果如图6-47所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P130_11.jpg?sign=1739005275-9VFPztDExbtz6aBR6GaDNwQ2HLQm0ZcZ-0-9939c354f2d0b92ca13791356f8c16f0)
图6-47
操作步骤
01 执行菜单“文件>新建”命令,在弹出的“新建文档”对话框中设置“宽度”为1600像素、“高度”为1400像素、“分辨率”为72像素/英寸,设置完成后单击“创建”按钮,如图6-48所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P131_1.jpg?sign=1739005275-6WPjSdRD2U1Jg4zalhZCseS4BkI502mE-0-b8d4b0498b3db771e8d26417a493bdb0)
图6-48
02 绘制按钮底色。选择工具箱中的(圆角矩形工具),在工具选项栏中设置绘制模式为“形状”、“填充”为蓝灰色、“描边”为无、“半径”为80像素,在画面中按住鼠标左键绘制正圆角矩形,如图6-49所示。然后执行菜单“图层>图层样式>投影”命令,在弹出的“图层样式”对话框中设置投影的“混合模式”为“正片叠底”、颜色为黑色、“不透明度”为60%、“角度”为120度、“距离”为5像素、“扩展”为0%、“大小”为8像素,设置完成后,单击“确定”按钮,如图6-50所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P131_2.jpg?sign=1739005275-mOJKvz0Aa2KOQUPSgNOGcIU2ZcwVCSyO-0-23c8b039cbbc9ffefbad913ab54dff7f)
图6-49
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P131_3.jpg?sign=1739005275-51mBGTTIusfzzHQtQHjLImE9Sv9qpYHB-0-861df80630a6298e8a0a0345872aa8c7)
图6-50
03 此时效果如图6-51所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P131_5.jpg?sign=1739005275-eDx997mYWPHuudW46FvaA2cxm54P1cwJ-0-33f59c16d9cd9f0c24dc00674a5a8cf8)
图6-51
04 选择工具箱中的(钢笔工具),在工具选项栏中设置绘制模式为“形状”、“填充”为蓝色、“描边”为无,设置完成后,在圆角矩形框上方绘制一个多边形,如图6-52所示。使用同样的方法,在多边形右上角绘制一个三角形,将“填充”改为深蓝色,如图6-53所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P131_6.jpg?sign=1739005275-eIYJ24TDg5xOPofHp2fUcptBZMiQWFhs-0-59bc96a28e143e02d8998299736aa1a5)
图6-52
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P131_7.jpg?sign=1739005275-WFKVKgjxgx2FAe6ASY8e81fpIqmzye8S-0-d92b53b0691aec06cab78b913744016c)
图6-53
05 选择工具箱中的(自定义形状工具),在工具选项栏中设置绘制模式为“形状”、“填充”为白色、“描边”为无,单击“形状”按钮,在下拉面板中选择一个音符形状,然后在画面中按住鼠标左键拖曳进行绘制,如图6-54所示。最后将得到的形状图层移动至三角形图层下方,效果如图6-55所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P132_1.jpg?sign=1739005275-Pys3dAHecXridpd8WmloExTVzD2z0gBD-0-07dd646deed4cf1274254a6d5f2762e4)
图6-54
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P132_2.jpg?sign=1739005275-kb7v1kVImsBbfhr33nTOZZ1kqvtM3097-0-d26456bdb250d7f9b6a4c3ba7d608294)
图6-55
06 单击“图层”面板底部的“创建新组”按钮,创建一个图层组。将多边形图层、音符图层和三角形图层拖曳至该组内。选择图层组,执行菜单“图层>图层样式>内发光”命令,在弹出的“图层样式”对话框中设置内发光的“混合模式”为“滤色”、“不透明度”为40%、“杂色”为0、颜色为白色、“方法”为“柔和”、“源”为“边缘”、“阻塞”为0%、“大小”为40像素、“范围”为50%、“抖动”为0%,设置完成后,通过勾选“预览”复选框进行查看,如图6-56所示。此时画面效果如图6-57所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P132_4.jpg?sign=1739005275-fEGgAdsMgdfiTABF0suzJbaLipLr6lZ5-0-cf1858f3fea9232115524299d913666a)
图6-56
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P132_5.jpg?sign=1739005275-gtXjVOi0R2vUAyrQSI2OYN8lAO7Rqkd5-0-8b49da77cb98ba4a1caafce49c54719d)
图6-57
07 在“图层样式”对话框中,勾选“投影”复选框,然后设置投影的“混合模式”为“正片叠底”、颜色为黑色、“不透明度”为60%、“角度”为120度、“距离”为5像素、“扩展”为0%、“大小”为8像素,设置完成后,单击“确定”按钮,如图6-58所示。最终画面效果如图6-59所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P132_6.jpg?sign=1739005275-lxOUD6PQsa9HGg67FOZW4VwmQYhgbPWe-0-c71f713b9250b2d773f2aac5c13c2ac9)
图6-58
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P132_7.jpg?sign=1739005275-AFHkzj9gXPPOvMMzm48OCIvl2IGH7eGB-0-717400c7c4b7da22db63650977c4d8b0)
图6-59
要点速查:建立选区的方式
绘制路径的目的往往是抠图或填充颜色。当路径绘制完成后,使用Ctrl+Enter快捷键即可得到选区。也可以在路径上右击,在弹出的快捷菜单中执行“建立选区”命令,如图6-60所示。然后在弹出的“建立选区”对话框中可以进行选区“羽化”的设置,如果想要得到的是精确的选区,那么“羽化半径”设置为0像素即可。想要得到边缘模糊的选区,则可以设置一定的羽化数值,如图6-61所示。设置完成后,单击“确定”按钮,可以得到选区如图6-62所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P133_1.jpg?sign=1739005275-BqJqfCEG9F56Wxz1xPSxLjO0ZFXpVjyk-0-17ae65f6d1000dd36ed8e4e615d79f1a)
图6-60
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P133_2.jpg?sign=1739005275-oeSGSlh9ZNO8IuEZsdb0EawKEHEZhl1H-0-5c28bf31f60a2b64c4e902b25f817de6)
图6-61
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P133_3.jpg?sign=1739005275-0s7AoclOIGPLcFyqQVTpSLiPoASVjUrF-0-4dd32f6b5a0505fed042627cdbe56bff)
图6-62
提示 将路径转换为选区
使用Ctrl+Enter快捷键可直接将路径转换为选区。
实例069 使用形状工具制作质感按钮
文件路径 第6章\使用形状工具制作质感按钮
难易指数 ★★★☆☆
技术掌握
●形状工具
●渐变工具
●椭圆工具
●钢笔工具
●图层样式
●图层蒙版
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P133_4.jpg?sign=1739005275-KKb9gnh4ar8ZIjSFwVfMGpUKTadRSiFQ-0-41da2d3ad58f89bab5523e0f1d26458f)
扫码深度学习
操作思路
本案例在操作中多次运用到形状工具,使用该工具绘图时要注意形状的运算和工具选项栏中的绘制模式。
案例效果
案例效果如图6-63所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P133_5.jpg?sign=1739005275-WnfU2pj1jkzhKaGfIFI9QHwHjsgVLSJE-0-3ffbec04de859f76be83078bb6bf1083)
图6-63
操作步骤
01 执行菜单“文件>新建”命令,在弹出的“新建文档”对话框中设置“宽度”为2604像素、“高度”为2413像素、“分辨率”为72像素/英寸,设置完成后单击“创建”按钮,如图6-64所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P133_6.jpg?sign=1739005275-rlaSNprls6sLLngblGtx9mSbngdiW9DM-0-bc3e9967bdb8609961d7fd1a16bbb634)
图6-64
02 选择工具箱中的渐变工具,单击工具选项栏中的渐变色条,在弹出的“渐变编辑器”对话框中编辑一个蓝色系的渐变颜色,设置完成后单击“确定”按钮,如图6-65所示。然后在工具选项栏中设置渐变类型为“线性渐变”,最后使用渐变工具在画面中按住鼠标左键由下至上拖曳进行填充,效果如图6-66所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P134_1.jpg?sign=1739005275-c3tcQax9sa4Pg4KUG0WNh9lTUhyB9L9y-0-24fe9a08d5cfdee8f26027d0e3984058)
图6-65
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P134_2.jpg?sign=1739005275-ZRzCjEA0fXtxG3YUR2QExZ9v701ozPOv-0-9ba5c5904a609346db7048b68d37a01c)
图6-66
03 选择工具箱中的(椭圆工具),在选项栏中设置绘制模式为“形状”、“填充”为深蓝色、“描边”为无,然后在画面底部按住鼠标左键绘制椭圆,如图6-67所示。在“图层”面板上将该图层的“不透明度”设置为20%,如图6-68所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P134_4.jpg?sign=1739005275-Xcc1xGf41F7iXRSDnicUrV67vJAB0mQU-0-d9f5da75adeefbc0b7a72dca74d057c9)
图6-67
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P134_5.jpg?sign=1739005275-jXYmvH1zwyo9GOZ00VqMUl1ac5KuDJQT-0-4102e85aa919b2802b2e263711225ec4)
图6-68
04 选择工具箱中的(自定义形状工具),在选项栏中设置绘制模式为“形状”、“填充”为绿色、“描边”为无,单击“形状”按钮,在下拉面板中选择一个会话形状,然后在画面中按住鼠标左键拖曳进行绘制,如图6-69所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P134_7.jpg?sign=1739005275-LsFI5fYJ7uIa8gKnV0x7QvLEqQYlm3Mx-0-1087ad208973491e9069c8e445cca506)
图6-69
05 选择工具箱中的(椭圆工具),在工具选项栏中设置“绘制模式”为“形状”、“填充”为白色、“描边”为无,然后在对话形状上面按住鼠标左键并按住Shift键绘制正圆,如图6-70所示。在“图层”面板上设置该图层的“不透明度”为35%,效果如图6-71所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P134_9.jpg?sign=1739005275-Y4lUz07y8nRezJuL5jNDVCru8dnxEtyl-0-b4b192cae12e3892a8a2b90951d6952c)
图6-70
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P134_10.jpg?sign=1739005275-62BMRjtgcR9qT199UhZ68LT6eRIscx0b-0-72f1e49c2a1b295f53616d0fff50665a)
图6-71
06 选择正圆图层,单击“图层”面板底部的“添加蒙版”按钮,为该图层添加图层蒙版。选择工具箱中的(画笔工具),在选项栏中单击打开“画笔预设”选取器,在画笔预设选取器中选择一个柔边圆画笔,设置画笔“大小”为1500像素,如图6-72所示。将前景色设置为黑色,设置完成后,在画面下方位置按住鼠标左键拖曳进行涂抹,效果如图6-73所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P134_12.jpg?sign=1739005275-JjKwH22AVQfidexCacsnCk0tfoiKkNEm-0-c67a2dbc9d652b4536c57d06b168da71)
图6-72
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P134_13.jpg?sign=1739005275-fBygaIo992C2FrXP7Jiint6EhPUpceLS-0-22a3a0b9f7de4e2b051464d0bdd0a694)
图6-73
07 在“图层”面板中选择正圆图层,使用Ctrl+J快捷键将形状进行复制,单击复制图层的图层蒙版缩览图,选择工具箱中的画笔工具,将前景色设置为白色,然后按住鼠标左键在画面下方涂抹,在“图层”面板上设置“不透明度”为90%,效果如图6-74所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P134_14.jpg?sign=1739005275-MDwD3tgIe2F8M7HAiWQvNmL07tE3HNR3-0-91544fe44cc9517bb14c55b657c83f06)
图6-74
08 选择工具箱中的(钢笔工具),在选项栏中设置“绘制模式”为“形状”、“填充”为白色、“描边”为无,设置完成后,在会话形状右侧绘制一个月牙形状,如图6-75所示。为该图层添加图层蒙版。然后选择工具箱中的画笔工具,在工具选项栏中打开“画笔预设”选取器,在画笔预设选取器中选择一个柔边圆画笔,设置画笔“大小”为1500像素,将前景色设置为黑色,设置完成后,在画面下方位置按住鼠标左键拖曳进行涂抹,效果如图6-76所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P135_1.jpg?sign=1739005275-CYZ6BMadaREn4GDvo9ZhstEVIHcGa43G-0-6fc535a3fd6b5c5d03a60a045dc0235f)
图6-75
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P135_2.jpg?sign=1739005275-yq7VA5ocAekUd5RnA5Lqu3NzbjkBdLTz-0-456d9328572216e12ff2e68d88185bb7)
图6-76
09 绘制声音形状。选择工具箱中的自定义形状工具,在工具选项栏中设置绘制模式为“形状”、“填充”为白色、“描边”为无,单击“形状”按钮,在下拉面板中选择一个“声音”形状,然后在正圆上边按住鼠标左键拖曳进行绘制,如图6-77所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P135_3.jpg?sign=1739005275-Iu00QNPRgUX2MZnL5lwsp4CT03M7pLUW-0-2c44ea2db7cc1c321ced04a22d20e1aa)
图6-77
10 选择声音形状图层,执行菜单“图层>图层样式>斜面和浮雕”命令,在弹出的“图层样式”对话框中设置斜面和浮雕的“样式”为“内斜面”、“方法”为“平滑”、“深度”为100%、“方向”为“上”、“大小”为10像素、“软化”为0像素、“角度”为-48度、“高度”为21度、“高光模式”为“滤色”、颜色为白色、“不透明度”为75%、“阴影模式”为“正片叠底”、颜色为黑色、“不透明度”为30%,设置完成后,单击“确定”按钮,如图6-78所示。最终效果如图6-79所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P135_4.jpg?sign=1739005275-hCNB4xo3koec6YqpjYEPil4hQjptHHKT-0-e4eb6c06ecd96bd0ed09205ad2d83731)
图6-78
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P135_5.jpg?sign=1739005275-t6XFDCltpBV9PAu9o27AWZgyLZRbF82Y-0-14c74ed6d8944d837f2674443fe6364e)
图6-79
实例070 使用矢量工具制作活动标志
文件路径 第6章\使用矢量工具制作活动标志
难易指数 ★★★☆☆
技术掌握
●转换点工具
●自定义形状工具
●钢笔工具
●矩形工具
●横排文字工具
●自由变换
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P135_6.jpg?sign=1739005275-1qOHajsF37a0ewLbIzG8faIHQJFVxe8y-0-a23527a85ee2cbef5063d6302f748fd9)
扫码深度学习
操作思路
转换点工具可以调节路径的弯曲度。本案例利用这一特征将直角五角星转换为圆角的五角星,然后使用钢笔工具绘制五角星的内部图案,最后在其上方输入文字。
案例效果
案例效果如图6-80所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P135_7.jpg?sign=1739005275-8NN9BRx2PIa7Wn3bngnjSUYdFh4B8fwR-0-092af999dd5400fc8354813ff51f1c4b)
图6-80
操作步骤
01 执行菜单“文件>新建”命令,在弹出的“新建文档”对话框中设置“宽度”为1500像素、“高度”为1500像素、“分辨率”为72像素/英寸、“颜色模式”为“RGB颜色”、“背景内容”为“白色”,如图6-81所示。单击工具箱中的“前景色”图标,在弹出的“拾色器(前景色)”对话框中设置颜色为深蓝色,单击“确定”按钮完成设置,如图6-82所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P136_1.jpg?sign=1739005275-c8IiYCSz0s9vwFGwNBWpVpiOdqU9hKnJ-0-414df7f5b5f7bf648cf6ee090771c07c)
图6-81
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P136_2.jpg?sign=1739005275-s3aizWbg8ZIrMil0ZQtDaksNndUskNMP-0-78d6783b8a216bd61af4900f2a11525d)
图6-82
02 使用前景色(填充快捷键为Alt+Delete)填充画布为深蓝色,如图6-83所示。使用鼠标右击工具箱中的“形状工具组”,在工具组列表中选择自定义形状工具,在工具选项栏中设置“形状”为五角星,然后在画面中按住鼠标左键进行拖曳,完成五角星绘制,如图6-84所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P136_3.jpg?sign=1739005275-b5ERfbJrS1KAqb9x7YsLThAnPgVFEAWI-0-5015aeb70c13aea10cdbe73f4c852d55)
图6-83
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P136_5.jpg?sign=1739005275-uI5nKO4en6Ioj8dHgZcVvMqRlTmJ3v6d-0-6dda535f004cc7e84f11b84d1251fbf2)
图6-84
03 在工具箱中右击“钢笔工具组”,在工具组列表中选择(转换点工具),按住五角星的一角进行拖曳,改变五角星一角的形状,如图6-85所示。使用同样的方法,制作其他角,如图6-86所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P136_6.jpg?sign=1739005275-uKNMRL3J0nOsqR8AcGLQ84FTLnJigSi4-0-f38672a781510e4aa2a6021922774913)
图6-85
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P136_7.jpg?sign=1739005275-t5eStPiaDZkpn6vN00HFJFxnkYrvVwEP-0-96e9cab0044da88e4987ad6fa39bc97f)
图6-86
04 执行菜单“文件>置入嵌入的智能对象”命令,在弹出的“置入嵌入对象”对话框中选择素材“1.jpg”,然后单击“置入”按钮,如图6-87所示。将素材进行旋转调整到合适位置,按Enter键完成置入,并执行菜单“图层>栅格化>智能对象”命令,此时画面效果如图6-88所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P136_8.jpg?sign=1739005275-DYJN8yE7BeXgatQocx8sQdVYVFU7MCGu-0-9ef2b7eb49ec1301c0b9da53ceeace10)
图6-87
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P136_9.jpg?sign=1739005275-DlhGYrzdTpXYAxC5ZLub7ZOGcJO6a9lx-0-a2ac0995bf99745e8b5a27aad72ca934)
图6-88
05 在“图层”面板中选择素材“1.jpg”所在图层,右击该图层,在弹出的快捷菜单中执行“创建剪贴蒙版”命令,如图6-89所示。此时画面效果如图6-90所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P137_1.jpg?sign=1739005275-SvgmLl5JZAYmU5WtcV1mdwTPvHEqANqk-0-6d6833ebc93881c8c75aabc92117bada)
图6-89
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P137_2.jpg?sign=1739005275-l7Ot3fKrZk4r2g00shiwXTYwUwGgRHOS-0-d075683f446f4a6126cd5c7222368d94)
图6-90
06 选择工具箱中的矩形工具,在工具选项栏中设置绘制模式为“形状”、“填充”为深蓝色、“描边”为无,然后在星形中下部按住鼠标左键拖曳绘制矩形,如图6-91所示。使用Ctrl+T快捷键调出界定框,然后将矩形旋转一定角度,使用Enter键完成变换,效果如图6-92所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P137_3.jpg?sign=1739005275-z7sk9xIUPeEbtpwhNnV8OsmZvGuJg3jC-0-9f4f6888de5a2149fff5b7020df9cf18)
图6-91
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P137_4.jpg?sign=1739005275-NJ4qSIAJgb5K1T35pyHzmMV8WiBJI6F2-0-7b45e7b3e36eb3f0f91ec7dcab8ec835)
图6-92
07 选择工具箱中的(钢笔工具),在工具选项栏中设置绘制模式为“形状”、“填充”为黄色,使用钢笔工具在画面右上角绘制三角形,如图6-93所示。然后在“图层”面板中选中该图层,设置“不透明度”为30%,如图6-94所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P137_6.jpg?sign=1739005275-PfMn9io4AfQn1Fxs89l32nswKFwqHYdr-0-90a26a329e41145473c657f94d82f534)
图6-93
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P137_7.jpg?sign=1739005275-tKZO4Wib121hT85M7ukqDGmfupZONm2E-0-9a82a349d1013c8afdb6d48bb43f74f3)
图6-94
08 在“图层”面板中选中三角形图层,然后将其拖曳到“创建新图层”按钮上进行复制,如图6-95所示。使用Ctrl+T快捷键调出界定框,然后将其进行适当的旋转、缩放,并将其拖曳到适当位置,如图6-96所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P137_9.jpg?sign=1739005275-AsEdZOak5RheJ2X1HNC7DlyJ3EGr1nR5-0-2b11ea483c9c8846a55a726bc18ef141)
图6-95
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P137_10.jpg?sign=1739005275-E32p6a1axkPuxTqIMSWkuaKOXAEWm8Zn-0-df3c8cd6eef8471fcd88f8487354b2f4)
图6-96
09 使用同样的方法,再制作另外一个三角形,如图6-97所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P137_11.jpg?sign=1739005275-ZtuTEqJ56DZptWC4vKne575xedD7MBzf-0-479e9d7a8cb515bea20cd861a96ac0ee)
图6-97
10 选择工具箱中的(钢笔工具),在工具选项栏中设置绘制模式为“形状”,单击“填充”图标,在下拉面板中设置颜色为橘红色,使用钢笔工具在画面中绘制形状,如图6-98所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P137_13.jpg?sign=1739005275-ClSxmIp7HwPX0fVc09CZdOImpPNjXHYz-0-2cb8e11eb4898b387f0d29d4de9c42e3)
图6-98
11 选择工具箱中的横排文字工具,在工具选项栏中设置适合的“字体”和“字号”,填充颜色设置为白色,在画面中输入文字,如图6-99所示。同样的方法输入右侧的文字,如图6-100所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P138_1.jpg?sign=1739005275-E1KoNP9Yk5zt1TtRmqXvlCDczUfIahq6-0-5136c31acee4c2e6dd3b44c48b150940)
图6-99
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P138_2.jpg?sign=1739005275-ESaa9Bsk5wSRvBsZTcCkYV2xhaYWVE2A-0-f67c4911b82167b7169423ba12298486)
图6-100
12 按住Ctrl键单击加选3个文字图层,使用Ctrl+T快捷键调出界定框,然后进行适当的旋转,如图6-101所示。继续使用横排文字工具在画面中输入相应的文字,效果如图6-102所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P138_3.jpg?sign=1739005275-1RGlpll6lVDFVEnX5GHyByr3SCiRSZtv-0-0280508a59515f528bd234240e9cec04)
图6-101
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P138_4.jpg?sign=1739005275-soaoZe9eIR1JfIqX9bgOMIofjJQW6JJT-0-bcbf8e43fee26473bd077e30b84e0892)
图6-102
13 选择工具箱中的矩形工具,在工具选项栏中设置绘制模式为“形状”,单击“填充”图标,在下拉面板中设置填充颜色为灰色,然后按住鼠标左键拖曳绘制圆形,如图6-103所示。使用Ctrl+T快捷键对矩形进行自由变换,将矩形旋转一定角度,按Enter键完成变换,如图6-104所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P138_5.jpg?sign=1739005275-1peR1LJAv14aaiyP9ZAlUlDY3oNQayH9-0-5dd55049bf21901cdcfeecc10092b048)
图6-103
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P138_6.jpg?sign=1739005275-3Fr9EGVbxejhQhDhvlDHMzhNAhlZsOSA-0-885fe084c573ce0a045321212b34f5f7)
图6-104
14 再次绘制一个稍小一些的五角星,然后将其移动到合适位置并适当旋转,如图6-105所示。使用同样的方法,复制一个五角星,并移动到合适位置,如图6-106所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P138_7.jpg?sign=1739005275-aZSZeB3Aa5qMHmRbZTSxSXCuartXcGli-0-c4c1c9763548a86074f45c4f1d411491)
图6-105
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P138_8.jpg?sign=1739005275-PsdeUd41oeYyXu7E1P5NZTflhPFRE4B1-0-bc095653298255e6ba905a90aec432b9)
图6-106
实例071 天气时钟小组件界面设计
文件路径 第6章\天气时钟小组件界面设计
难易指数 ★★★★☆
技术掌握
●形状工具
●横排文字工具
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P138_9.jpg?sign=1739005275-Xhe4y3YDOTQ66d0oc4ontz4K7MfPNYRh-0-023ad8fccc13f04423d3bf2cc0f5c8ee)
扫码深度学习
操作思路
本案例主要使用形状工具绘制矢量小组件图形,在绘制时要注意调整图层的混合模式,最后在画面中合适的位置输入文字,从而制作出天气时钟小组件界面。
案例效果
案例效果如图6-107所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P139_1.jpg?sign=1739005275-9vunbP4JfaeZHzukTK1L1IDkhYflI5M2-0-19d13e92604408a38e311f38d68995a7)
图6-107
操作步骤
01 执行菜单“文件>新建”命令,在弹出的“新建文档”对话框中设置“宽度”为1200像素、“高度”为702像素、“分辨率”为72像素/英寸,“颜色模式”为“RGB颜色”、“背景内容”为“白色”,如图6-108所示。选择工具箱中的(渐变工具),单击工具选项栏中的渐变色条,在弹出的“渐变编辑器”对话框中编辑一个灰色系的渐变,设置完成后,单击“确定”按钮,如图6-109所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P139_3.jpg?sign=1739005275-VFyeOJAKVvZqxA94ZgvQksGjVVPSVvPP-0-c2fade485809e3f3715bc8e801c9e32e)
图6-108
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P139_4.jpg?sign=1739005275-60zu4sqNZ3XruslnEg0bK7pgauqeNT88-0-73a37b053c2b6acc9a58ef92eea6e4bc)
图6-109
02 在画面中按住鼠标左键由左至右拖曳填充渐变,如图6-110所示。新建一个图层,右击工具箱中的“矩形工具组”,在工具列表中选择圆角矩形工具,然后在工具选项栏中设置绘制模式为“形状”,单击“填充”图标,在下拉面板中单击“渐变”按钮,然后编辑一个蓝色系的渐变颜色,“半径”为40像素,在画面的中间位置绘制一个圆角矩形,如图6-111所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P139_5.jpg?sign=1739005275-iTNgPpfGRpy2St8QXkURpUkSuizTJS92-0-52800f89138d339aa27e839a21727c07)
图6-110
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P139_6.jpg?sign=1739005275-Dr4RguxcO1cW09dOI63DokcoYWbQGM4b-0-6e4fbb41888e5fc6713c462c375a964d)
图6-111
03 在“图层”面板中选择蓝色圆角矩形图层,执行菜单“图层>图层样式>内发光”命令,在弹出的“图层样式”对话框中设置内发光的“混合模式”为“滤色”、“不透明度”为60%、发光颜色为蓝色、“大小”为18像素、“范围”为50%,如图6-112所示。继续勾选“投影”复选框,设置“混合模式”为“正片叠底”、阴影颜色为深灰色、“不透明度”为15%、“角度”为120度、“距离”为6像素,“大小”为1像素,单击“确定”按钮,完成设置,如图6-113所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P139_7.jpg?sign=1739005275-o47p9yHASs8VHqwIdyCAV34uHbQKwnC3-0-9645146c114442fb341f23801a86b961)
图6-112
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P140_1.jpg?sign=1739005275-cjK1KsqblralrYuap5QAnfoOMqKZrxOb-0-be16ee27f890750214d9b1e4c1774eee)
图6-113
04 此时效果如图6-114所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P140_2.jpg?sign=1739005275-gXl5r6EJliCAYrg24KEkDikb4GJ4Zf53-0-4936731b85dc37ab4d6a17882610140d)
图6-114
05 新建一个图层,选择工具箱中的矩形工具,在工具选项栏中设置绘制模式为“形状”,单击“填充”图标,在下拉面板中设置“填充颜色”为灰色,在相应位置按住鼠标左键拖曳绘制矩形作为分割线,如图6-115所示。在“图层”面板中选中灰色矩形图层,然后设置其混合模式为“柔光”,如图6-116所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P140_3.jpg?sign=1739005275-P8hPJMFFZXvJlaDHD7KhJ7MN3ap25ucD-0-ac7b9404f45900e3106f831a675d2930)
图6-115
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P140_4.jpg?sign=1739005275-sA0hD3STqd3Cg8tcEHltvQw7aJ4GAmGA-0-eca25599d62213ff8483fe47874c5f85)
图6-116
06 在选中“矩形1”图层的状态下,执行菜单“图层>图层样式>投影”命令,在弹出的“图层样式”对话框中设置投影的“混合模式”为“正片叠底”、阴影颜色为灰蓝色、“不透明度”为15%、“角度”为120度、“距离”为3像素、“大小”为1像素,设置完成后,单击“确定”按钮,如图6-117所示。效果如图6-118所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P140_5.jpg?sign=1739005275-mgU9uJrRBxle6I1mFGjJ3nXzSvQLdHXD-0-17ce04d503635505d5388684df0667ea)
图6-117
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P140_6.jpg?sign=1739005275-7b4oxdF6OUtMzvWkCyEgrD5Kmj964Nt3-0-2f55bfc0eb5c5adf0f3bf8da58ec2232)
图6-118
07 此时要绘制位于画面左下角的卡通太阳。选择工具箱中的椭圆工具,在工具选项栏中设置绘制模式为“形状”,单击“填充”图标,在下拉面板中选择“填充颜色”为淡黄色,然后在相应位置按住Shift键的同时按住鼠标左键拖曳绘制正圆形,如图6-119所示。绘制太阳的“红脸蛋”。继续使用椭圆工具,然后在工具选项栏中设置“填充颜色”为粉色系渐变,在相应位置按住Shift键的同时按住鼠标左键拖曳绘制圆形,效果如图6-120所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P140_7.jpg?sign=1739005275-uffjRFOCdMKBsSIwaW6Yxkj1oR5jCWHI-0-c38659601382326443b0748e92ecaff2)
图6-119
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P140_8.jpg?sign=1739005275-n7Vcwl3xmXxZkApIlrM13sPHBgPoqOo3-0-9e374d6a9fbd0dcaa926be8d552d1e9e)
图6-120
08 在“图层”面板中选中圆形图层,然后将其拖曳到“创建新图层”按钮上进行复制,并移动到右侧脸颊处,如图6-121所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P140_10.jpg?sign=1739005275-KjWZNuNKibBnhBsi2W2Bc9eAnNLoxgtN-0-47912898fd03b9e0a02b4d3051983672)
图6-121
09 最后要绘制太阳的“眼睛”。在选择椭圆工具的状态下,将“填充颜色”设置为黑色,然后在相应位置按住Shift键的同时按住鼠标左键拖曳绘制圆形,如图6-122所示。在“图层”面板中选中该圆形图层,然后将其拖曳到“创建新图层”按钮上进行复制,并将其移动至黑圆右侧,效果如图6-123所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P140_12.jpg?sign=1739005275-5ZVGhQp8tRJ17QP9aYdWHkFCSZBg2It9-0-3d25c63570d5453714c5a9b52f34722e)
图6-122
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P141_1.jpg?sign=1739005275-6ZMkzwdxuzkWezVTOWjXdyPWADUviAqq-0-c8c671ce8e043dc81371b9514a1668f4)
图6-123
10 新建一个图层,选择工具箱中的(钢笔工具),在工具选项栏中设置绘制模式为“形状”,单击“填充”按钮,在下拉面板中单击“渐变”按钮,然后编辑一个浅蓝色系的渐变颜色,在画面的右上角绘制一个云朵,如图6-124所示。选中“云”图层,执行菜单“图层>图层样式>内发光”命令,在弹出的“图层样式”对话框中设置内发光的“混合模式”为“滤色”、“不透明度”为75%、发光颜色为黄色、“大小”为18像素、“范围”为50%,单击“确定”按钮,完成设置,如图6-125所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P141_3.jpg?sign=1739005275-pvoGzFA6nnLuZJdXPTiNd78YIuMVeytT-0-140b4df4badb2d9e9edb392526f5fcef)
图6-124
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P141_4.jpg?sign=1739005275-nBdBYO1TaTBTAhtWmobsWRUN1tR4NOMT-0-f1759b2f54b93d3d46408ffa7127f712)
图6-125
11 此时云朵效果如图6-126所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P141_5.jpg?sign=1739005275-va9uYH7aaizRQ4IValJ0eMeU2e71pDiW-0-41443b6b406610e02aed05a7172d9270)
图6-126
12 在“图层”面板中选中云朵图层,然后将其拖曳到“创建新图层”按钮上进行复制,如图6-127所示。使用Ctrl+T快捷键调出界定框,进行适当的缩放,并拖曳到合适位置,如图6-128所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P141_7.jpg?sign=1739005275-8Bpyfik2dMrzHmj84uX0n6whBJkVrhU5-0-d7ccb81a17551293b3579bb2082f2c8c)
图6-127
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P141_8.jpg?sign=1739005275-FCY2LEzY9ly66Rli6Xam04Jxt92S6t0T-0-8524f8897cab915cd312f6f2b44d1812)
图6-128
13 使用同样的方法,依次复制其他云朵,此时画面效果如图6-129所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P141_9.jpg?sign=1739005275-SOUZRf57x0fgGOzJp44DzWxDpwkmDlzK-0-f8a8e392db900d3980eaf3d501b2368b)
图6-129
14 选择工具箱中的自定义形状工具,然后在工具选项栏中设置绘制模式为“形状”、“填充”为白色、“形状”为音符,在画面中按住鼠标左键进行拖曳,完成音符绘制,如图6-130所示。选择工具箱中的钢笔工具,在工具选项栏中设置绘制模式为“形状”,单击“填充”图标,在下拉面板中设置“填充颜色”为浅蓝色,在画面的右上角绘制一个雨滴,如图6-131所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P141_10.jpg?sign=1739005275-BN2mQPt4l1rLiEZPK8H7VRYAR921utZO-0-4e755be97773aa17cca8b80e565702c4)
图6-130
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P142_1.jpg?sign=1739005275-dQ3bGefFUSplj2p12N1DMdxg1CXPd4MF-0-7e8d3f05b6472f0bf16f40d26d5aa004)
图6-131
15 在“图层”面板中选中雨滴图层,然后将其拖曳到“创建新图层”按钮上进行复制,使用Ctrl+T快捷键调出界定框,将复制的雨滴进行适当的缩放,并拖曳到适当位置,如图6-132所示。使用同样的方法,依次制作其他雨滴,此时画面效果如图6-133所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P142_2.jpg?sign=1739005275-gf3aEm59df5M0Gsm8mjYxvN1gVJAk5Lx-0-167ed2f8c33f8297c2767e204d031994)
图6-132
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P142_3.jpg?sign=1739005275-FqewnDWHPAMlmxtECFvfVjJLQMHEv1YC-0-672e15a6b9963ddedd6e658e96f865b0)
图6-133
16 选择工具箱中的横排文字工具,在工具选项栏中设置适合的“字体”和“字号”,填充颜色为白色,在画面中单击并输入文字,如图6-134所示。继续使用横排文字工具在画面其他位置输入不同的文字,此时画面效果如图6-135所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P142_4.jpg?sign=1739005275-bdus9TRFnyJRpTNwAp4ForWOpscjvLCK-0-6e9c7d89c39ab32958ef7f40ffb99fe0)
图6-134
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P142_5.jpg?sign=1739005275-5P28ok7hCojSAoQLF26mWymXr4t0PqTi-0-1a8e375961cd1b2286b3751964601435)
图6-135
17 执行菜单“文件>置入嵌入的智能对象”命令,在弹出的“置入嵌入对象”对话框中选择卡通素材“1.png”,单击“置入”按钮,如图6-136所示。将素材放置在适当的位置,按Enter键完成置入,最终画面效果如图6-137所示。
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P142_6.jpg?sign=1739005275-M1cLnvqOVSLNqJ4SseT7WHaG12GbtZfa-0-827bda58ae1198b08ce961a25b86ed44)
图6-136
![](https://epubservercos.yuewen.com/6EC9EE/17214367904800106/epubprivate/OEBPS/Images/Figure-P142_7.jpg?sign=1739005275-aFX7qMZHlgEbhdf16vpQ7EgygujpaC8r-0-11bbd129f15cb8f2a8bc029251ff7040)
图6-137