Your Graphic Buddy
Nicholas Boonrug Schatzki!
Gif Image Slideshow Part 1
Gif Image Slideshow Part 2
Return to top
To the tutorial
Nicholas Boonrug Schatzki!
GIF-image-slideshow Gimp tutorial
This tutorial has two parts. You are on page 1 of 2.
What does it take to turn your images into GIF slideshow? - This is a step-by-step guide to "DO-IT-YOURSELF"
The tutorial will help you learn how to stack up your images as layers, optimize and convert them into one GIF file.
-All through using GIMP - the free graphic editor software.
GIF-Image-Slideshow Gimp tutorial. No-javascript is needed. From Gif animation to picture slideshow. Do-it-yourself the easy way.
Help! My mom hijacked my page! Just kidding! Only a few months ago my mom still asked me to help with GIMP. Now she's become an expert, -alright, not quite, but she's getting closer every day.
This tutorial will bring you to another level of animation. Please try it out and let me know. I will still be the one answering your questions and requests, though. Don't be shy, just let me know! If you still don't feel confident, my service is available for your design needs. :-D
GIF-Image-Slideshow Gimp tutorial. No-javascript is needed. From Gif animation to picture slideshow. Do-it-yourself the easy way.
Help! My mom hijacked my page! Just kidding! Only a few months ago my mom still asked me to help with GIMP. Now she's become an expert, -alright, not quite, but she's getting closer every day.
This tutorial will bring you to another level of animation. Please try it out and let me know. I will still be the one answering your questions and requests, though. Don't be shy, just let me know! If you still don't feel confident, my service is available for your design needs. :-D
Do-It-Yourself GIF Image Slideshow
1) We will take three sample pictures. When you get to yours, edit and clean up as you like. We will ask GIMP
to optimize our GIF image at the end, so it is your choice whether you'd like to pre-optimize each picture
before you stack them onto layers. What I did with these images was that I resized them -all JPG format- to smaller size,
and, all three new sizes are the same. (Picture 1)
2) Open Menu: File > New. Designate the new frame to the size of your images, in the sample, I set the new size to width 250 X Length 188 pixels.
Now we will start stacking the images: Stack the last one first and the first one last - or, buttom-up.
But, First, let's get our Layers box open. Click Menu: Windows > Dockable Dialogs > Layers. -The "Layers, Channels, Paths,..etc." box will open.
Go to the image that you'd like to put on the bottom. In the sample, it is image #3.
2) Open Menu: File > New. Designate the new frame to the size of your images, in the sample, I set the new size to width 250 X Length 188 pixels.
Now we will start stacking the images: Stack the last one first and the first one last - or, buttom-up.
But, First, let's get our Layers box open. Click Menu: Windows > Dockable Dialogs > Layers. -The "Layers, Channels, Paths,..etc." box will open.
Go to the image that you'd like to put on the bottom. In the sample, it is image #3.
Copy image #3 (Picture 2) and paste it on the new frame. (Picture 3) Look in the Layers Box, you will see two layers with the one on the bottom being the background,
and the top one is the image that you just paste. -It will say "Floating Selection. Pasted Layer".. (Picture 4)
Left click to highlight (blue), then right click and the pull-down menu will appear, select "New Layer"
-where the white info box will say, "Create a new layer and add it to the image.". (Picture 4)
Right click on the same image -which is now called "Pasted Layer",
and on the same pull-down menu, select "Merge down". This way, the pasted layer
will join the blank background layer. (Picture 5)
Congratulations! You have successfuly created your first layer. (Your picture #3, which is referred to, here, as "background layer".)
3) Copy and paste image #2. Please never forget to turn floating selection into pasted layer by selecting "New Layer" on the pull-down menu. Go through the same process with image #1.
Congratulations! You have successfuly created your first layer. (Your picture #3, which is referred to, here, as "background layer".)
3) Copy and paste image #2. Please never forget to turn floating selection into pasted layer by selecting "New Layer" on the pull-down menu. Go through the same process with image #1.
Now you will have three layers, with the top one being "Pasted Layer#1",
the second one's called "Pasted Layer", and the one on the bottom is your "Background". (Picture 6)
If you use more images, the layer numbers will start to grow. You can use as many images as you'd like,
as long as you understand that the file will only get larger. My three images as one finished GIF image is 87.5 KB.
It's a very nice size comparing the size of a video/slideshow, but, at the same time, a GIF
file is larger than a regular JPG file.
(Picture 7)
**Please note the "eye" symbol on the left side of each layer. If all is selected, you will see the top image. If you de-select the "eye" on the top image, you will be able to view the next layer down. If two eye icons on the top two layers are de-selected, the bottom layer will show.**
Please click to continue to Gif Image Slideshow part 2
**Please note the "eye" symbol on the left side of each layer. If all is selected, you will see the top image. If you de-select the "eye" on the top image, you will be able to view the next layer down. If two eye icons on the top two layers are de-selected, the bottom layer will show.**
We have our three images in layers. Now we are ready to make GIF slideshow!
Please click to continue to Gif Image Slideshow part 2
HTML Comment Box is loading comments...
Gif Image Slideshow Part 1
Gif Image Slideshow Part 2
Return to top
To the tutorial
Hello: This is Nicholas' mom Pradichaya. I was inspired from Nicholas' latest GIMP tutorial on Animation.
I followed his instruction and started making my first animation from my own drawings.
-It went so well that I ended up with two sets of GIF illustrations for Nicholas' sister,
Kaitlyn, for her story page.
I also am in charge of putting the whole La CoffeeMelodie Suite together and am constantly looking for ways to improve the Web site. After a while of
playing with animations on GIMP, I realized that if I delayed the speed between images to 2 1/2 - 3 seconds, I've got my simple version of photo slideshow!
I saved the space and bandwidth, plus the time, by not having to build a video slideshow, and I didn't have to use any javascript.
I ran my idea through Nicholas and he liked it enough to ask me to share it with you. Although, there are quite a bit of GIF Slideshow services offered online, but, unlike doing it yourself, you don't have the freedom and the control to edit and display just the way you like it.
I ran my idea through Nicholas and he liked it enough to ask me to share it with you. Although, there are quite a bit of GIF Slideshow services offered online, but, unlike doing it yourself, you don't have the freedom and the control to edit and display just the way you like it.
Subscribe To This Site
