you will need:

The Video (the video should be in MOV, AVI, MPG, MPEG, OR MP4 format)

Photoshop (i used CS5 in this tutorial)

final result:

import the video to Photoshop. i discussed the steps on how to import videos here.

Open Photoshop. Then go to File > Import > Video Frames to Layers

a dialog box will open and will let you select the video (the video should be in MOV, AVI, MPG, MPEG, OR MP4 format)

I used Set Fire to the Rain by Adele.

then a window will open:

there are two options: From Beginning To End & Selected Range only. select the second one. And make sure the Make Frame Animation box is checked.

go to the part of the video you want to gif and highlight the part you want. the process was elaborated here.

your workspace will look like this: (depends on the video ofc)

crop the photo. set your desired height.

i set the height to 300 px

now import another part of the video using the same method above and crop it again with the height same as the first gif.

so as you can see i have two gifs.

now check if they have the same number of frames.

so as you can see, the first gif has 41 frames while the second one has 54 frames.

they should have the same amount of frames so that they’ll start and end at the same time so what we will do is delete frames so that the have equal number of frames.

i want 30 frames so in the first gif, we will highlight frames 31-41 and drag them to the trash bin icon (delete)

do this one the second gif.

now they have the same amount of layers.

group the layers so it will be easier for us to work.

do this by selecting all layers and press Ctrl + G (windows) or Cmd + G (mac)

now to put them in one canvas. select all the frames of the second gif and copy the frames.

now go to the first gif. highlight the frames and paste the frames of the second gif.

a dialog box will appear. select “paste over selection.” and click ok.

now you can see that the 2nd gif is on top of the first gif.

since we grouped the gif a while ago, the layers panel has two groups. select the group for the second gif and move it to the right.

to add the diagonal slice effect, select the pen tool and set it to Paths.

Just make a diagonal path on the canvas and enclose the second gif inside.

right click on the canvas (with the pentool still selected) and select Create Vector Mask

now you should see the diagonal slice.

now drag colorings to the group. MAKE SURE THE COLORING IS ON TOP OF ALL LAYERS INSIDE THE GROUP.

now the gif is done.

you can adjust the image size or crop it or anything you like.