0:00
Hello friends welcome to tutorial point
0:09
In this video we are going to learn Slice tool in Adobe Photoshop
0:14
Friends, the Slice tool in Adobe Photoshop is used to divide an image into smaller and more manageable parts
0:21
It's allowing you to export each section as a separate image file
0:25
Now this can be useful for creating a web graphics where its slice can be used for creating a web graphics where each slice can be
0:30
be saved as a separate file and then combine on a web page to create a larger image
0:36
Now the Slice tool allow you to define the size and shape of each slice and to specify the file
0:43
format and other export setting for each slice. So friends, you can get a Slice tool over here
0:50
in a toolbar. Okay? So just long press over here and you can see Slice tool over here
0:56
By pressing a C you can activate this Slice tool. Okay, and if you are already in a crop tool and if you want to go to a slice tool then you can press
1:06
Shift plus C so as you can see it will moving from one tool to another
1:11
So like this I'm just getting my Slice tool. So friends as I am already told you Slice tool is mostly used for dividing an image into a smaller and a more manageable parts
1:24
So in this example we are going to use Slice tool on this image
1:28
So friends, first of all, you can use a Slice tool by dragging this
1:33
For example, I am selecting this part. So this is a manual part which I am selecting myself and the other part is auto generated
1:42
If I'm zooming, you can see this is a first slide. As you can see there is a number over here
1:48
1, 2, 3, 4, 5. So my image is divided into 5 parts and this third part is created by me
1:58
That's why it is a manual slice and the other are an automatic slice
2:04
So friends if I want to move this slice then you can see an option select slice tool
2:10
So with that you can select your slice like this as you can see right now I'm selecting
2:15
my slice also you can increase and decrease the slice like this
2:21
Just select here and you can change the size or you can adjust the slice
2:26
So manually I am just selecting this face. This is a created by me and rest is automatically created Now friends if you want to save this slice okay For that you need to export this slice For that you need to go to file and here you can see export and here you can select save
2:47
for web. For shortcut you can use alter plus shift plus control plus s
2:54
As I'm already told you this is very useful for creating a web graphics where each slice
2:58
can be used as a separate file and then they are combined. combine a web page to create a larger image
3:05
So I'm just selecting save for web. Now here you can just zoom out this image to see all the slice
3:14
As you can see I'm selecting this slice. These are our manual slice and these rest are automatic slice
3:21
So friends now I'm showing you how you can save these all slice as well as you can save
3:27
the selected slice. So first I'm showing you how you can save this selected
3:32
slice so I'm just selecting this slice and I'm just pressing save so friends after
3:38
placing the save the dialog box is game okay here you can give your location to
3:43
save this slice here you can give a name for example I am giving manual
3:49
slice okay because right now I'm just going to save the slice which I'm already
3:55
selected okay here you can apply image only if you want an HTML code then you can
4:01
select HTML only or if you want image plus HTML file then you can use HTML and image
4:07
right now I just want images then I'm just selecting images only now friends the most
4:13
important is slice okay if I'm selecting the selected slice then the only the face
4:19
slice is save okay I'm just pressing save okay now the manual selected slice is
4:26
safe for that I need to go to my location where I'm saved this
4:31
So friends as you can see in my location the by default one folder is created called images
4:37
Okay this will be created by Photoshop itself. I'm just open it now friends now what we are going to do we are going to save all this slice
4:47
Okay what is the slice name? There is a five slice we are going to save for that again we need to go to file export
4:55
and here you can select save for web okay and just press save okay
5:01
setting if you want a GIF format or any format also you can change from here but they
5:06
are also giving you another dialog box where you can change the setting and the location so friends as you can see the previous slice is already here I just deleting this folder for now okay now my slice tool folder is
5:20
already empty now again I'm going to do all slice fine and here I am selecting
5:28
all slice okay and press save so after saving this if I'm going to my folder
5:38
location as you can see again one folder is created called images and here you can see all
5:45
our image are here okay these are our manual slice and these are automatically created
5:51
slice so friends like this you can use a slice tool for a web graphics as I'm already
5:59
told you the graphics where each slice can be saved as a separate file like this and
6:05
then the web designer combined this all the slice and created a larger image so this is very useful for creating
6:14
our web pages in our website development now friends now we are going to see some
6:19
properties of this slice tool okay for that I'm just reset this slice tool
6:26
okay just control Z to undo these all the things okay I'm just unlocked this
6:32
footage and once I'm selecting this slice tool like this You can see there are some option. First option is style. Okay. Right now it's normal
6:43
Means we are just selecting the slice like this and it will be selecting manual slice and
6:49
rest will be created automatic slice. This is just for your size for the slice. Now here you can
6:55
see next is fixed expect ratio. You can apply a fixed expect ratio for width and height
7:01
For example I want 5 by 5 slice and once I am selecting these and
7:07
and as you can see it creating a perfect square because my width and height is same okay
7:14
if I'm selecting my width to two and as you can see it will be created rectangular
7:21
slice so friends like these you can also apply an fixed expect ratio to a slice
7:28
now this a fixed size now if you want your slice should be 600 by 400
7:37
pixel okay so as you can see it will be automatically created that slice you no need to
7:43
drag from your mouse just click on the image and it will be created that slice okay so friends as you can see I selecting a multiple slice over here okay there are a lot of slice the total number of
7:59
slice is 73 okay now what we are going to do we are going to save as I'm told
8:06
you for the save you go to Windows export and here you can select save for web
8:12
or else you can also use a keyboard shortcut control our shift and S okay while you are pressing all these buttons these save for
8:23
Vagd by lock boxes coming okay here you can just zoom out and check your all the
8:29
slides as you as I'm already told you there are total 73 slice over here okay
8:34
you can select all the slice manually like this okay and once you are done I'm just
8:40
pressing save and here they are again showing me the option if I want a selected one
8:45
or if I want all the slice okay so this is going to be of too many images in my
8:52
folder so first of all I'm just deleting this folder okay to just show you now
8:59
the slice tool automatically created one folder inside my slice tool folder and all
9:05
the slice will be going inside this images so I'm just typing this name all
9:12
slice fine and press save It will take some time because we have a more than 70 slice over here
9:21
That's why it's taking some time to make all the slice. And here you can see all the images
9:32
So friends, the slice tool is very useful to create our web pages
9:38
So friends, as I'm already told you, slice divide an image into a smaller images that are
9:44
reassembled on web page using an HTML table or a CSS layer now by dividing the
9:51
image you can assign a different URL link to create a page navigation or
9:57
optimize each part of an image using its own optimization setting okay so in
10:03
web pages what programmer is doing they are giving link for the each slice so
10:09
that they can combine all slides together to create a big image
10:14
So friends that's all about a Slice tool in Adobe Photoshop. Thank you so much guys. See you in the next video