CIS 421Photoshop >Video Layers

More Photoshop Video Layers

Warped Video in a layer

Video that is loaded into a single layer can be manipulated in the timeline version of the Animation palette.

The image below shows a video and its timeline. The length of the video has been shortened by dragging the beginning and ending points in the timeline.

This video was converted to a smart object.

Then a warp transformation was applied to it.

Warped video in a single layer plus timeline in Photoshop

top

How to do it

  1. Open the video in Photoshop (File>Open)
  2. The entire video is in one layer in the layers palette.
  3. All the layers are visible in the timeline version of the animation palette.
  4. Play the video and decide if you want to cut frames off at either end.
  5. To warp the video or transform its display in other ways, click Edit>Transform> Warp
  6. Photoshop says it has to convert the video layer to a smart object in order to apply a transformation, so click OK.
  7. You can then warp the video by dragging its edges into various shapes, and the entire video will play in the shape.
  8. Play by clicking the play button in the timeline palette
  9. Save the PSD version.
  10. File>Export>Render video to create an FLV file that you can load into a Flash movie.

Examples of warped video

top

top

Dual Video in a layer

Another example in which the video was warped, duplicated and flipped.

How to do it

  1. Click File>Open & select a short video to open in a layer
  2. Create adjustment layers to modify the video
  3. Transform or Warp the shape of the video, following the directions at the top of this page.
  4. Click Image>Canvas Size and double the width of the the canvas size for the document -- click on the extender on either side of the image to allow space for the duplicated, flipped video.
  5. Open the layers palette, if it is not already open
  6. Right-click on the layer containing the video, and select Duplicate Layer
  7. Select one of the video layers and flip it over into the blank half of the file, and then adjust the two layers:
    Edit>Transform>Flip Horizontal
  8. Play the timeline.
  9. Save the PSD version of the file.
  10. File>Export>Render Video creates an FLV file that can be played from a SWF file.

Example of Dual video

top

Add animation to a still image

This example, based on a tutorial on the Adobe website involves editing the still image in a new layer the timeline version of the animation palette. The woman's hair is spread out by using the smudge tool and/or by painting with the paint brush to grow the hair out, frame by frame.

How to do it

  1. Open an image in Photoshop
  2. Doubleclick on the background layer in the layers palette to open the New Layer dialog box, which changes its name to layer 0, and unlocks the layer. Click OK to save the name change.
    1. When the layer is unlocked it can be open in the timeline
  3. For this exercise, the default time of 10 seconds and 30 fps needs to be shortened because adjustments to the still image are done frame-by-frame.
  4. Click the down triangle at the top right of the animation palette to open the popup menu, then click Document Settings
    1. Change the Duration to 0:00:05:00 (5 seconds)
    2. Change the frame rate to Custom and 10 frames per second.
    3. Click OK to see the change in the timeline
  5. On the Photoshop menu, click Layer>Video Layers>New Blank Video Layer, to create a new layer in the timeline and in the layers palette --
    1. The new layer is the same length as the timeline
    2. this is the layer in which the animation is added, frame by frame
  6. Drag the timeline indicator to second and select the new layer 1 in the layers palette so the changes are to that layer.
  7. Click the twistie to the left of layer 1 in the timeline to open it up, to see the new frames in Altered Video track

top

Make the frame-by-frame changes

To paint the changes

  1. Select a paint brush that is somewhat soft and not to large.
  2. Use the eyedrop tool to set the foreground and background colors to colors that are in the woman's hair.
  3. With the timeline marker at 1 second, and layer 1 selected, paint hair out from the existing hair.

To make changes with the smudge tool

  1. Select the smudge tool on the toolbar (a popout from the blur tool, which looks like a teardrop and is about halfway down the toolbar)
  2. In the tool options bar for the smudge tool
    1. Check the Sample All Layers checkbox
    2. Set strength to about 60%
  3. Drag the tool away from the hair to pull it out.
  4. Each consecutive frame will build on the previous frame

top

Add Duplicate video frames

  1. Set up a keyboard shortcut to add frames to make it easier (Edit>Keyboard shortcuts and choose Layers>Video Layers>Duplicate Frame
  2. Click the keyboard shortcut to add a new frame, which is visible in Altered Video track
  3. Extend the change in each of the previous frames until you reach the end of the timeline.
  4. Play the video by clicking the play button at the bottom of the animation palette.
  5. Save the PSD version of the file
  6. File>Export>Render Video converts the PSD file into an FLV file.
  7. Import the FLV file into Flash, add a skin if you want, and click Control>Test Movie to see the SWF file..
  8. Click File>Publish Preview to create the HTML page with the code to play the SWF file. Copy & paste the HTML code onto any page on which you want to play the video.
  9. Be sure to fix the <script> tags and delete the <embed> tag to make the page validate.
  10. Be sure to upload the javascript file, the flv file & the skin, as well as the swf file.

Example of growing hair

top