ps切片工具-SliceIt：快速切片神器

ps切片工具-SliceIt：快速切片神器

前言

在进行网页设计时，切图是一个极其重要的环节。很多设计师会使用ps的切片工具进行快速切图，将一个大的设计文件分割为多个小的部分，这些部分可以是按钮、文字、图片等。本文介绍的是ps中的切片工具-SliceIt，它可以帮助设计师快速进行切图，减少了很多人工的工作量，提高了效率，也保证了切图的准确度。

1. SliceIt的基础功能

在ps中，切片工具位于左侧工具栏中，它的图标是一个矩形，如下图所示：

选择切片工具，点击开始切割。在“切片”选项中，选择“创建新切片”。

接下来，通过在画布上进行选取、命名和设置输出选项来分割文件。

通常情况下，设计师需要切出一些比较特殊的切片，例如圆形按钮、菜单三角形、被透明的多层图片等。这时，需要使用多边形和自定义切片功能。

例如，在切割下面这个图片时，我们想要将它的纽扣部分自定义为一个切片：

首先截出整件衬衫的一个大切片。然后，点击多边形工具，缩放至纽扣处，绘制多边形，再按回车键完成该切片。

2. SliceIt的高级功能

2.1 多层图片

设计师常常会遇到需要将一张图片分割为几部分再放置在页面上的情况。这时可以使用SliceIt的多层图片功能：

首先选择要分割的图片，点击“选择图层”按钮将它转成“智能对象”；将所有的切片都存储在同一个图层中，并在图层名字前添加“@”符号。

在此基础上，设计师可以将“智能对象”复制到新的文件中，用“智能对象”的复制件来进行编辑，最终把它们复合起来形成总体设计。

2.2 自动保存切片

对于设计师来说，最恼火的应该就是需要不停地导出切片。但是，在使用SliceIt时，设计师可以轻松实现自动保存切片的功能。

首先选择“存储为web和设备”选项，然后在“切片选择”选项面板中打开“存储到web”选项。接着，设计师可以设置保存的路径及文件名等选项。

2.3 使用JavaScript快捷键

对于常常需要使用SliceIt来切割图片的设计师来说，JavaScript快捷键可以让整个过程快速高效。

首先打开文件，选择切割工具，然后按下“Ctrl + Alt + Shift + S”来打开“存储为”对话框。在对话框中，可以通过JavaScript脚本来更好地管理图层和切片，并自定义保存选项。

结语

本文介绍了ps中的切片工具-SliceIt的基础功能和高级功能，希望能够对切图工作有所帮助。在实际操作中，设计师可以自己尝试这些功能，并根据自己的需求进行调整和优化。通过灵活运用SliceIt工具，设计师可以更快地切图，更好地完成网页设计工作。