Welcome to Our Community

Wanting to join the rest of our members? Feel free to sign up today.

GIMP Tut -- Putting a Video on Your Sig

Discussion in 'The Design Lounge' started by iRAWR, Jul 1, 2007.

  1. iRAWR

    iRAWR rawrrr

    Joined:
    Jun 24, 2007
    Messages:
    765
    Likes Received:
    11
    Location:
    Ontario, Canada
    Wii Friend Code: 0000-0000-0000-0000
    0000-0000-0000-0000
    I DID NOT MAKE THIS TUT, THE "I's"IN THIS TUT IS NOT ME, SO...... BIG BIG THANKS TO ART FOR MAKING THIS NICE TUT

    [​IMG]

    In this tutorial, I will show you how to import video footage into GIMP using the GAP (GIMP Animation Package), which is a separate download from GIMP. We will create the the animated signature above using either the quicktime movie or avi file and the background that I have provided for your use. Don't misunderstand me....the sig we are creating is only an example, not something I consider to be incredible.

    Although this tutorial is very simple in nature, please keep in mind, importing movies using GAP is not limited to animated avatars and signatures. I'm only presenting it for sig creation right now because it's something that a lot of people are interested in and it's an easy format for web-based images. The possibilities are really endless. Using the features of GIMP and GAP, you could create wonderful home movies to share with friends and family. Just don't show them too many home movies or they'll probably not want to visit your home anymore!

    This tutorial is written for someone who has a pretty good use of GIMP features. The only thing we will be using GAP for is the conversion process. So, if you've never experimented with GAP or you've been afraid to, try this tutorial out. I'm sure you'll find it to be straightforward.

    I'm using GAP version 2.2.0 for Windows. This version contains the necessary programming implementations to convert video footage. So, if you don't have at least this version of GAP, I suggest you download it here: Windows Users (http://gimp-win.sourceforge.net/stable.html) and Linux users (http://gimp.org/downloads/).

    GAP has the ability to convert not just QuickTime movies (mov), but avis, mpgs, mpegs, and from what I've read, some dvd formats (vob files.) I've not been successful with the vob format, but I have with the others.

    Let's Begin:

    Step 1:

    In the main GIMP window, go to the Xtns Menu > Split Video Into Frames > Extract Videorange.
    [​IMG]

    Step 2:

    When the following window appears, we will be concerned with letter A-E in red below.

    A: This is where you tell GAP to look for your file. If you know the file path name to the video, type or copy/paste the pathname here.

    B: If you don't know the file path name, click this button and you'll be given a window with dropdown menus to search for it.

    Using A or B, go ahead and enter the file path name to the Quicktime movie (mov). You can experiment with the avi file later.


    C: Enter the the video frame range you want to convert. I already know that my video has 68 frames in it. So, go ahead and enter the number 68 in the "To Frame" area.

    D: If you don't know which frames you want to convert, click this button. You'll be given a preview window that will show you the number of frames in your video and you can watch the video as well.

    E: For this tutorial, we will just be telling GAP to make one multi-layer image. However, if you were going to do additional modifications in GIMP or GAP, you probably would want to leave this one deselected so that each frame was added to its own image. But, for this tutorial, go ahead and select it.

    [​IMG]

    Here's a screenshot of what the Video Range window looks like (Letter D above)

    [​IMG]

    You may also see this menu appear when opening up the Select Videorange window (Letter D). If you do, clicking either button is fine. I just chose yes. The window is pretty self-explanatory.

    [​IMG]

    Now, click OK to convert the video. Here's a partial screenshot of the imported video footage.

    [​IMG]

    IMPORTANT: When working on video footage in this fashion, it appears that the Undo capabilities are disabled. This could be very problematic if you make a mistake. However, one way to work around it, just in case you do make a mistake, is to have a good spare ready to go. To do that, go to the Image Menu > Duplicate (Ctrl+D) and GIMP will make an exact copy ready for use if you need it. Just make sure you're always working on the right copy! So, if you do make a mistake and there's no easy way to correct it, shut down the one with the error(s) without saving and start again fresh with the copy. Otherwise, you'll need to begin all over.

    Step 3:

    Now the next thing we need to do is resize the image to fit our sig background. Since I already know what the dimensions are, I'll give them to you here. For any sigs you do in the future, you'll need to figure out the best dimensions on your own.

    To scale the image, go to the Image Menu > Scale Image:

    [​IMG]

    and choose the following settings:

    [​IMG]

    I don't have a screenshot for the results of this last step, but your image should have be resized accordingly.

    Step 4:

    Now, let's resize the canvas so we can add our sig background. To do this, go to the Image Menu > Canvas Size

    [​IMG]

    and set the parameters as follows:

    [​IMG]

    Add the Width and Height of the sig background we want to add (Ours is 325 W and 110 H). I'm centering mine in the image, but it doesn't really matter because we're going to move it anyway. Click Resize.

    Here's the output. I've added a checkerboard to show that it has a transparent background.

    [​IMG]

    Step 5:

    To add the background sig, go to the File Menu > Open as Layer...

    [​IMG]

    And point GIMP to the location of the sig background in the window that opens and the background will be added to the image. Or, you can just drop/drag the sig background onto the frames.

    Step 6:

    The sig background needs to be moved to the bottom. To do so, we need to add an Alpha Channel to the very bottom layer or we won't be allowed to move the background to the bottom. To do this, go to the very bottom of the layer stack, right-click on the bottom layer, and choose Add Alpha Channel.

    [​IMG]

    Next, click on the sig background layer in the dialog window and drag it to the very bottom of the stack. Your layers should look like this:

    [​IMG]

    and your image window like this:

    [​IMG]

    Step 7:

    Now, we need to move the video into place. This would be very difficult to do each layer manually, and I was going to write a script for linking all the layers, but saulgoode at gimptalk.com told me you can link all layers just by clicking the chain next to the image and then doing a Shift+Click on the same layer. Thanks for the great tip, saulgoode!

    Click on the chain next to any frame to turn on the link button, then Shift+Click on the same frame to link all layers. Make sure you turn off the chain next to the background image or you'll be moving the background also.

    Here's two screenshots of before and after linking:

    [​IMG] [​IMG]

    Now, with any one of the linked layers highlighted (in blue as shown above), use your grab your move tool (4-headed arrow), make sure it's settings are as follows, and move the layer to a location similar to mine below. You can also use the arrow keys to nudge it in place.

    [​IMG]

    Here's a shot of the layers moved into their correct location:

    [​IMG]

    Step 8:

    Here's where we bring it to a close. Go back to the layer dialog window (the place that shows all your layers stacked up) and highlight the first layer up from the main sig background. (no screenshot for this).

    We need to merge this layer with the background:

    Go to the Layer Menu > Merge Down

    [​IMG]

    Step 9:

    Test out your animation. Filters Menu > Animation > Playback.

    If you're pleased with the result: You can try different optimization settings to reduce the filesize. I'll leave this up to you, but here's the menus you'll be interested in:

    [​IMG]

    AND

    [​IMG]

    If you want to add a pause in the final frame before it starts all over again, double-click on the very top frame and insert a larger number in the (xxxx ms) section. 1/2 second = 500 ms, 1 second = 1,000 ms, 2 seconds = 2,000 ms, etc.

    [​IMG]

    Step 10:

    Save as an animated gif.

    File Menu > Save or Save as.... Pick the name and add the ".gif" extension to the end. Here's the settings to use for the windows that appear:

    [​IMG]

    [​IMG]

    Again, your results should be something similar to this:

    [​IMG]

    I hope you enjoyed this tutorial. If you have any questions or comments, please send me a note here: http://fence-post.deviantart.com/

    Remember, GIMP and GAP are a lot more than sigs and avatars. This was only a primer for bigger and better things.I look forward to seeing your results.

    Cheers!

    Art
     
    • Like Like x 2
  2. Groves

    Groves Groves@live.com

    Joined:
    Dec 17, 2006
    Messages:
    244
    Likes Received:
    1
    Location:
    UK, Bristol
    Wii Friend Code: 7696-4877-2400-3016
    7696-4877-2400-3016
    Woah, I've always wanted to know how to make these.

    I'll try this tutorial out soon, and show you the result :).
     
  3. Monsteroids

    Monsteroids Psychedelic Snail

    Joined:
    Jan 19, 2007
    Messages:
    2,791
    Likes Received:
    39
    Location:
    BC, Canada
    Wii Friend Code: 6069-9016-3559-6279
    6069-9016-3559-6279
    Yesh!!!!!!!!!!!!!!!!!!!
     
  4. iRAWR

    iRAWR rawrrr

    Joined:
    Jun 24, 2007
    Messages:
    765
    Likes Received:
    11
    Location:
    Ontario, Canada
    Wii Friend Code: 0000-0000-0000-0000
    0000-0000-0000-0000
    BTW, dont rep me, i dont really deserve it, i didnt make it
     
  5. iRAWR

    iRAWR rawrrr

    Joined:
    Jun 24, 2007
    Messages:
    765
    Likes Received:
    11
    Location:
    Ontario, Canada
    Wii Friend Code: 0000-0000-0000-0000
    0000-0000-0000-0000
    oh i tried it, it worked, though i had a bit of trouble,

    RESULT: the quality somehow changed into crap, but he vid works
    [​IMG]
     
  6. XwiimasturX

    XwiimasturX Don't Mind Me. I'm Stupid

    Joined:
    Dec 22, 2006
    Messages:
    421
    Likes Received:
    5
    Location:
    Somewhere Over the Rainbow.
    thanks... i'm a complete gimp noob... (so i dont think i'll be putting videos in any time soon)

    as you can see... *looks at sig and is horrified*
     
  7. Monsteroids

    Monsteroids Psychedelic Snail

    Joined:
    Jan 19, 2007
    Messages:
    2,791
    Likes Received:
    39
    Location:
    BC, Canada
    Wii Friend Code: 6069-9016-3559-6279
    6069-9016-3559-6279
    The only part thats hard is finding a good colour palette to index it with. Sadly I used a C4d, grunge brushes, and a very crisp, perfect render. Too much to index.

    I don't work with simple stuffs and such, but ya must know that this is still very good to know.
     
  8. XwiimasturX

    XwiimasturX Don't Mind Me. I'm Stupid

    Joined:
    Dec 22, 2006
    Messages:
    421
    Likes Received:
    5
    Location:
    Somewhere Over the Rainbow.
    well... ive been more fooling around with it, as i havent completely figured out the program yet... (ive only finished two sigs and theyre both crap.)
     
  9. 6ix

    6ix rebmeM tahCiiW

    Joined:
    May 24, 2007
    Messages:
    308
    Likes Received:
    5
    What are the advantages of using this over ImageReady, because this seems much more complicated?
     
  10. ssbb_lover

    ssbb_lover Novocain Stain'd

    Joined:
    Jul 2, 2006
    Messages:
    7,743
    Likes Received:
    98
    Location:
    Georgia
    Wii Friend Code: 1234-1234-1234-1234
    1234-1234-1234-1234
    Because GIMP doesn't have ImageReady since it comes with Photoshop.
     
  11. Monsteroids

    Monsteroids Psychedelic Snail

    Joined:
    Jan 19, 2007
    Messages:
    2,791
    Likes Received:
    39
    Location:
    BC, Canada
    Wii Friend Code: 6069-9016-3559-6279
    6069-9016-3559-6279
    Photoshop confused me to oblivion. Took me 30 DAYS to figure it out. GIMP took me about 15min to get the hang of it. :yesnod:
     
    #11 Monsteroids, Jul 3, 2007
    Last edited: Jul 10, 2007
  12. ssbb_lover

    ssbb_lover Novocain Stain'd

    Joined:
    Jul 2, 2006
    Messages:
    7,743
    Likes Received:
    98
    Location:
    Georgia
    Wii Friend Code: 1234-1234-1234-1234
    1234-1234-1234-1234
    You would rather shave off 15 min. just to learn a program that's 100 times worse? If you have PS, you better be using it instead of GIMP, if not you can donate it to people who need it (everyone in teh whole wide world).
     
  13. Monsteroids

    Monsteroids Psychedelic Snail

    Joined:
    Jan 19, 2007
    Messages:
    2,791
    Likes Received:
    39
    Location:
    BC, Canada
    Wii Friend Code: 6069-9016-3559-6279
    6069-9016-3559-6279
    I don't see anything special 'bout PS *puts up flame shield* and I tried the trial. Too much to learn, crashed all the time when I pressed new pic, just a mess.

    Tooooooo BIIIIIIIIIIIIIIGGGG!!!!!!!!!!!! AHHHHHHHHHH!!!!!!!! I like PS converted tuts on GIMP anyways.
     
  14. ssbb_lover

    ssbb_lover Novocain Stain'd

    Joined:
    Jul 2, 2006
    Messages:
    7,743
    Likes Received:
    98
    Location:
    Georgia
    Wii Friend Code: 1234-1234-1234-1234
    1234-1234-1234-1234
    I'm not even going to respond to that...
     
  15. Gymdawg

    Gymdawg ~I Spy Hypocricy~

    Joined:
    Nov 4, 2006
    Messages:
    1,279
    Likes Received:
    24
    Location:
    Her arms
    Wii Friend Code: 5981-2669-3238-7379
    5981-2669-3238-7379
    God, I hate it when programs give me too many features to choose from.
    Damn you, Adobe! your program is too good!
     
  16. Monsteroids

    Monsteroids Psychedelic Snail

    Joined:
    Jan 19, 2007
    Messages:
    2,791
    Likes Received:
    39
    Location:
    BC, Canada
    Wii Friend Code: 6069-9016-3559-6279
    6069-9016-3559-6279

    :lol:
     
  17. Brawny

    Brawny Anglophobiphile

    Joined:
    Dec 15, 2006
    Messages:
    6,522
    Likes Received:
    129
    Location:
    Ann Arbor, MI, USA
    Wii Friend Code: 5385-4035-7079-0395
    5385-4035-7079-0395
    Hm.....wouldn't a linky to Gimptalk.com suffice? W/E

    Thanks for moving I suppose.
     
  18. iRAWR

    iRAWR rawrrr

    Joined:
    Jun 24, 2007
    Messages:
    765
    Likes Received:
    11
    Location:
    Ontario, Canada
    Wii Friend Code: 0000-0000-0000-0000
    0000-0000-0000-0000
    he didnt post this tut in gimptalk.com...i downloaded it from his deviant art
     
  19. Brawny

    Brawny Anglophobiphile

    Joined:
    Dec 15, 2006
    Messages:
    6,522
    Likes Received:
    129
    Location:
    Ann Arbor, MI, USA
    Wii Friend Code: 5385-4035-7079-0395
    5385-4035-7079-0395
    Hm.....I got the link from him on talk....weird.
     
  20. bubba-ga-nush

    bubba-ga-nush Im on more than you think

    Joined:
    Oct 22, 2006
    Messages:
    616
    Likes Received:
    6
    Location:
    Coolsville with scooby-doo
    Wii Friend Code: 3369-4758-4482-0967
    3369-4758-4482-0967
    That was easy than I thought. I know the sig is not much it was just to test and see if I can actually do it. [​IMG]
     

Share This Page

Search tags for this page

animated sig backgrounds

,
gimp sig video
,
gimp sig with video
,
gimp video sig
,
how to add background image to sig in gimp
,
importing videos to gimp by frame
,
my+wii+wont turn
,
sigs with videos