实战：快速制作晶格化界面

晶格背景是界面中一种很常见的背景效果，在视觉上显得既丰富又具有很强的细节。晶格效果看起来比较复杂，但是制作方法还是很简单的，今天米醋就来给大家介绍一种快速制作晶格的简便方法。

制作圆形头像

启动PhotoshopCC 2017，按【Ctrl+N】组合键新建一个文件，将【文档类型】设置为【画板】，将【画板大小】设置为【iPhone6（750，1334）】。新建一个图层，并重命名为【渐变】，按【Alt+Delete】组合键随意用一种前景色填充该图层，然后双击【渐变】图层的缩览图，打开【图层样式】对话框，为其添加一个【渐变叠加】样式，接着设置一个从【黑蓝色-深蓝色】的渐变色（两个颜色的对比不要太强烈），最后设置【不透明度】为52%、【角度】为90°，如图4-30所示，渐变效果如图所示。

在【工具箱】中选择【椭圆工具】，然后按住【Shift】键绘制一个200像素×200像素的圆形（禁用描边），接着在【属性】面板中调整好圆形的坐标位置，如图所示。

将本例的素材拖入操作界面中，然后按【Ctrl+T】组合键进入自由变换模式，接着根据圆形的大小按住【Shift+Alt】组合键将其等比例缩小到合适的大小，如图所示，最后按【Ctrl+Alt+G】组合键将头像设置为圆形的剪贴蒙版，效果如图所示。

制作晶格背景

晶格背景不会使用Photoshop来制作，而是直接使用一款名叫TriangulateImage5的晶格插件来进行制作，这样可以节省很多操作时间。在使用TriangulateImage5插件之前，先要安装Java程序jdk-6u20-windows-i586才能运行插件。jdk-6u20-windows-i586程序和TriangulateImage5插件大家可以直接在网上进行下载。

安装好Java程序以后，使用鼠标左键双击下载好的TriangulateImage5.exe插件，如图4-35所示。运行插件以后，会弹出一个【Tools】对话框和一个【TriangulateImage5】对话框，如图所示。

双击运行插件

Tools对话框

TriangulateImage5对话框

在【Tools】对话框中单击第一个【CHOOSE AN IMAGE】按钮，打开本例的【头像.png】素材。打开的图像会显示在【TriangulateImage5】对话框中，如图所示。

在图像上单击鼠标左键生成关键点（晶格点），每单击一次便会生成一个关键点，点越多，生成的晶格就越密集，反之则晶格越稀疏，如图所示。

生成关键点

制作好关键点后，在【Tools】对话框中单击最后一个【WRITE TO PDF】按钮，将晶格图像生成为PDF文件，然后为其取一个名字，以便于识别，如图所示。保存好的PDF文件可以在Photoshop中打开，效果如图所示。注意，要想制作出一摸一样的晶格是很难的，因为生成的关键点位置不同以及关键点数量不同，都会影响到晶格的效果，只要符合设计要求即可。

包括晶格

晶格效果

将晶格图像拖入画板中，放在【渐变】图层的下一层，并将图层重命名为【晶格】，如图4-42所示，然后将【渐变】图层的【不透明度】降低到90%，使晶格效果融入到背景中，效果如图所示。

现在的晶格的颜色看起来比较乱，为了让晶格的颜色更统一，还需要调整一下晶格的饱和度。选择【晶格】图层，执行【图层>新建调整图层>色相/饱和度】菜单命令，创建一个【色相/饱和度】调整图层，然后在【属性】面板中将【饱和度】设置为-100，如图所示，效果如图所示。

制作界面细节

下面先制作头像的细节。选择【椭圆1】图层，按【Ctrl+J】组合键复制一个椭圆，将其放在【椭圆1】图层的下一层，并重命名为【圆1】，然后在【属性】面板中将圆形的大小设置为240像素×240像素，接着在选项栏中关闭【填充】功能，同时开启【描边】不能，将描边的大小设置为2像素，描边的颜色设置为青色，如图所示，效果如图所示。