• Log InLog In
  • Register
Liquid`
Team Liquid Liquipedia
EDT 17:55
CEST 23:55
KST 06:55
  • Home
  • Forum
  • Calendar
  • Streams
  • Liquipedia
  • Features
  • Store
  • EPT
  • TL+
  • StarCraft 2
  • Brood War
  • Smash
  • Heroes
  • Counter-Strike
  • Overwatch
  • Liquibet
  • Fantasy StarCraft
  • TLPD
  • StarCraft 2
  • Brood War
  • Blogs
Forum Sidebar
Events/Features
News
Featured News
[ASL19] Finals Recap: Standing Tall9HomeStory Cup 27 - Info & Preview18Classic wins Code S Season 2 (2025)16Code S RO4 & Finals Preview: herO, Rogue, Classic, GuMiho0TL Team Map Contest #5: Presented by Monster Energy6
Community News
Flash Announces Hiatus From ASL51Weekly Cups (June 23-29): Reynor in world title form?12FEL Cracov 2025 (July 27) - $8000 live event16Esports World Cup 2025 - Final Player Roster16Weekly Cups (June 16-22): Clem strikes back1
StarCraft 2
General
Statistics for vetoed/disliked maps The SCII GOAT: A statistical Evaluation The GOAT ranking of GOAT rankings How does the number of casters affect your enjoyment of esports? Esports World Cup 2025 - Final Player Roster
Tourneys
Korean Starcraft League Week 77 Master Swan Open (Global Bronze-Master 2) RSL: Revival, a new crowdfunded tournament series [GSL 2025] Code S: Season 2 - Semi Finals & Finals $5,100+ SEL Season 2 Championship (SC: Evo)
Strategy
How did i lose this ZvP, whats the proper response Simple Questions Simple Answers
Custom Maps
[UMS] Zillion Zerglings
External Content
Mutation # 480 Moths to the Flame Mutation # 479 Worn Out Welcome Mutation # 478 Instant Karma Mutation # 477 Slow and Steady
Brood War
General
BGH Auto Balance -> http://bghmmr.eu/ Flash Announces Hiatus From ASL Player “Jedi” cheat on CSL Unit and Spell Similarities Help: rep cant save
Tourneys
[Megathread] Daily Proleagues [BSL20] Grand Finals - Sunday 20:00 CET Small VOD Thread 2.0 [BSL20] GosuLeague RO16 - Tue & Wed 20:00+CET
Strategy
Simple Questions, Simple Answers I am doing this better than progamers do.
Other Games
General Games
Stormgate/Frost Giant Megathread Nintendo Switch Thread Path of Exile What do you want from future RTS games? Beyond All Reason
Dota 2
Official 'what is Dota anymore' discussion
League of Legends
Heroes of the Storm
Simple Questions, Simple Answers Heroes of the Storm 2.0
Hearthstone
Heroes of StarCraft mini-set
TL Mafia
TL Mafia Community Thread Vanilla Mini Mafia
Community
General
US Politics Mega-thread Things Aren’t Peaceful in Palestine Trading/Investing Thread Russo-Ukrainian War Thread The Games Industry And ATVI
Fan Clubs
SKT1 Classic Fan Club! Maru Fan Club
Media & Entertainment
Anime Discussion Thread [Manga] One Piece [\m/] Heavy Metal Thread
Sports
Formula 1 Discussion 2024 - 2025 Football Thread NBA General Discussion TeamLiquid Health and Fitness Initiative For 2023 NHL Playoffs 2024
World Cup 2022
Tech Support
Computer Build, Upgrade & Buying Resource Thread
TL Community
Blogs
Culture Clash in Video Games…
TrAiDoS
from making sc maps to makin…
Husyelt
Blog #2
tankgirl
StarCraft improvement
iopq
Trip to the Zoo
micronesia
Customize Sidebar...

Website Feedback

Closed Threads



Active: 626 users

[Tutorial] Animated gifs

Blogs > BigFan
Post a Reply
BigFan
Profile Blog Joined December 2010
TLADT24920 Posts
December 20 2014 23:58 GMT
#1
Hi everyone,

With this tutorial, I hope to be able to teach a few TL members how to create animated gifs. I decided to write this tutorial after I had several questions about how I create them so this is my own personal method of doing it. By no means is this method the only way to make animated gifs though since there are other programs that can be used however this produced the results I wanted. It can be fairly simple to make an animated gif after this method has been followed several times. With that said, let's get started!

[image loading]
IT'S OVER 9000!!!!!!!!!!!!!!

Step 1- Copying the scene:
It goes without saying that if you want to make an animated gif, then you already know what you want to make it from. Depending on many factors, it can take a lot of space. To solve this problem, there are options that can be tweaked in some programs but the best thing to do is to chose a short scene to make the animated gif of. In other words, an animated gif of a 5 second scene is smaller than a 10 second one if we assume that all of the other settings (resolution, bitrate etc...) are the same.

For this tutorial, I'm going to make an animated gif from an anime called Unlimited Blade Works which is pretty popular. I decided to pick a scene from one of the recent episodes of everyone's favourite character, Shirou which had great effects in play. Having chosen the scene, I need to make a copy of it since it's easier to make an animated gif from the copy instead of using the whole video clip and having to navigate/trim the rest out. This can be done using video editing software such as avidemux. Make sure to download this by clicking the download button on the right side of that website then choosing what build you would like (x86 or x64). Once it's been downloaded and installed, we'll first open the video then make a copy of the scene:
1. File -> open and then navigate to the video clip that you want to use and double-click it.
2. Scroll to the scene that you want to make an animated gif of using the scroll bar.
3. Click A (or [ on the keyboard) for the beginning of the scene.
4. Scroll to the end of the scene and click B (or ] on the keyboard)

[image loading]
Various buttons to click!

Notice that after clicking A and B, the time near the A and B boxes under Selection in the bottom right corner will change depending on the time of the scene so you can see how long the scene is from that and then adjust it:

[image loading]
10 second scene.

Now it's time to make the copy:
1. Click the disk button which is right under Recent (shown in image above).
2. Save it under a name that you can recognize.
3. Let avidemux do the rest then click ok once its finished.
4. Check out the new video file you created to make sure it's working and that it copied the whole scene. Of note that depending on the source used, the sound might be a bit messed up aka not in sync with the video but with animated gifs, there's no sound so it's not an issue. Also, at times, you may have an extra 0.5 seconds or so in a scene depending on how avidemux cut it.

Step 2- Creating the animated gif:
There are several ways to create animated gifs from this point:
1. Photoshop then you can use this tutorial or many of the others out there to guide you.
2. SUPER which is a free video converter program which has the functionality. Download SUPER from that site by going to the bottom, clicking 'Start Downloading SUPER' then click download on the next page. Make sure to uncheck any added packages with it when you install it. The program used to have nothing bundled with it but seems like they started including them in the last several builds.

After downloading and installing SUPER, it'll look for updates which you can bypass by clicking the ok button. Once you see the user interface, proceed with the following steps:
1. Drag and drop the video file that you made in step 1 in the box towards the bottom.
2. Close the Multimedia Analysis Box that pops up.
3. Change the output container to 'GIF '

[image loading]
Right side of picture is zoomed in on output container.

Before we decide to make the animated gif, we'll take a look at the settings that we can tweak. With SUPER, we are a bit limited in terms of the settings that can be changed to what's shown in the image below. If you use photoshop (trial or full version), you should have access to many options that you can play with to make the size smaller while maintaining good quality.

[image loading]
Lower resolution, frame per second and bitrate rate lead to lower size.

4. Change the resolution to something that maintains your clips' aspect ratio. I went with 480:272 for 720p video clip.
5. Change the frame/sec. I prefer 25 or higher to prevent lag. You may chose 30 or even 23.95, up to you.
6. Consider cropping or using other options on the right side if you want to (I personally don't).
7. Right click in the box from step 1 and choose 'Output File Saving Management' then change save options if need be.
8. Click the Encode (Active Files) button which is below the box in step 1.
9. Enjoy the gif!

[image loading]
TADA! :D

Other relevant information:
- Some hosting sites like photobucket have size limits so consider using http://gfycat.com/ if the gif can't be uploaded to them.
- Want to make a gif of a game you played? Consider using Xsplit (or fraps) to record the game. If it's for BW, use fold's guide to set up Xsplit. Once you finish recording, use the above steps with the recorded file to make the animated gifs from.
- Consider playing around with avidemux and SUPER settings to see if better combinations work for you. Try the trial version of photoshop as well since it'll give you many other settings that you can tweak and it's a good and fun learning experience.

And with that, it's a wrap! If anyone has any questions or comments, feel free to ask below. Hope to see more animated gifs pop up after this

****
Former BW EiC"Watch Bakemonogatari or I will kill you." -Toad, April 18th, 2017
micronesia
Profile Blog Joined July 2006
United States24666 Posts
Last Edited: 2014-12-21 00:36:21
December 21 2014 00:35 GMT
#2
Thanks, this is one of those things that's a pain in the ass to figure out (I've done it before) so it's really sweet of you to give detailed instructions for others to use.

The problem is that these guides and their associated methods for creating gifs are entirely dependent on the functionality of the software chosen, and software is constantly changing. The methods I used 5 years ago for making gifs are no longer practicable. The methods we will use in 5 years will probably render this guide obsolete. In the meantime, I hope people take advantage of this guide.

edit: btw I recall Unlimited Blade Works being a ~2 hour movie adaptation of the Unlimited Blade Works storyline of Fate Stay Night.... has an actual anime also come out since then?
ModeratorThere are animal crackers for people and there are people crackers for animals.
BigFan
Profile Blog Joined December 2010
TLADT24920 Posts
Last Edited: 2014-12-21 01:35:38
December 21 2014 01:27 GMT
#3
On December 21 2014 09:35 micronesia wrote:
Thanks, this is one of those things that's a pain in the ass to figure out (I've done it before) so it's really sweet of you to give detailed instructions for others to use.

The problem is that these guides and their associated methods for creating gifs are entirely dependent on the functionality of the software chosen, and software is constantly changing. The methods I used 5 years ago for making gifs are no longer practicable. The methods we will use in 5 years will probably render this guide obsolete. In the meantime, I hope people take advantage of this guide.

edit: btw I recall Unlimited Blade Works being a ~2 hour movie adaptation of the Unlimited Blade Works storyline of Fate Stay Night.... has an actual anime also come out since then?

Thanks for reading it yes, it's quite a pain in the ass to do and took me a while before I figured out this method. Good part is that it works really well and is pretty quick too.

yes, I agree. The guide isn't going to last for many years. It'll probably last until either software is unavailable or the functionality changes so that you can't follow it like my instructions above. Let's not forget if there's much easier and faster software that comes out and makes it seems that tedious lol. I was hoping that this will spur people to make more BW and SCII gifs from the many games out there considering the guide is easy to use.

yes, there's an anime currently airing this season for UBW. It has amazing quality and the story is interesting so far. I recommend you visit TLADT and check it out. First link is for episode 0, an hour (as I recall) starter episode and the second link is for the series.
http://myanimelist.net/anime.php?id=27821
http://myanimelist.net/anime/22297/Fate/stay_night:_Unlimited_Blade_Works_(TV)

BTW, there's some pretty cool fights in that same episode (from last weeks, today there's a new one out) but I decided that it's too long to make it a gif
Former BW EiC"Watch Bakemonogatari or I will kill you." -Toad, April 18th, 2017
NeThZOR
Profile Blog Joined November 2010
South Africa7387 Posts
December 21 2014 11:42 GMT
#4
really efficient way to create gifs, thanks a bunch for showing a step-by-step guide on how to do these.
SuperNova - 2015 | SKT1 fan for years | Dear, FlaSh, PartinG, Soulkey, Naniwa
Toadesstern
Profile Blog Joined October 2008
Germany16350 Posts
December 21 2014 14:57 GMT
#5
Can I use this method to make moe gifs, like the Mio moe moe kyun-scene or does it only work with UBW?

On a more serious note, thanks I'll probably try this one out sometime later and spam irc with some things :3
<Elem> >toad in charge of judging lewdness <Elem> how bad can it be <Elem> also wew, that is actually p lewd.
BigFan
Profile Blog Joined December 2010
TLADT24920 Posts
Last Edited: 2014-12-21 17:00:18
December 21 2014 17:00 GMT
#6
On December 21 2014 20:42 NeThZOR wrote:
really efficient way to create gifs, thanks a bunch for showing a step-by-step guide on how to do these.

np, hope it helps

On December 21 2014 23:57 Toadesstern wrote:
Can I use this method to make moe gifs, like the Mio moe moe kyun-scene or does it only work with UBW?

On a more serious note, thanks I'll probably try this one out sometime later and spam irc with some things :3

lol so silly I say spam away! Wouldn't be a bad idea to actually make several gifs per anime as a "review" or something. Also, you mean this?
[image loading]

Pretty easy to find. So moe T.T
Former BW EiC"Watch Bakemonogatari or I will kill you." -Toad, April 18th, 2017
Toadesstern
Profile Blog Joined October 2008
Germany16350 Posts
Last Edited: 2014-12-21 17:56:18
December 21 2014 17:52 GMT
#7
On December 22 2014 02:00 BigFan wrote:
Show nested quote +
On December 21 2014 20:42 NeThZOR wrote:
really efficient way to create gifs, thanks a bunch for showing a step-by-step guide on how to do these.

np, hope it helps

Show nested quote +
On December 21 2014 23:57 Toadesstern wrote:
Can I use this method to make moe gifs, like the Mio moe moe kyun-scene or does it only work with UBW?

On a more serious note, thanks I'll probably try this one out sometime later and spam irc with some things :3

lol so silly I say spam away! Wouldn't be a bad idea to actually make several gifs per anime as a "review" or something. Also, you mean this?
[image loading]

Pretty easy to find. So moe T.T

yeah that's it but couldn't make it as I'm on my laptop right now... so only animu that airs on fridays or saturdays over here.
I thought about making a looped gif of slutty elemental girls dancing instead, lina in particular but that scene seems to be too short as I always get something around 5 seconds long rather than just the 1 or 2 seconds I want looped
Edit: Oh no, it just always starts somewhat earlier for some reason oO
<Elem> >toad in charge of judging lewdness <Elem> how bad can it be <Elem> also wew, that is actually p lewd.
BigFan
Profile Blog Joined December 2010
TLADT24920 Posts
Last Edited: 2014-12-21 18:09:05
December 21 2014 18:08 GMT
#8
On December 22 2014 02:52 Toadesstern wrote:
Show nested quote +
On December 22 2014 02:00 BigFan wrote:
On December 21 2014 20:42 NeThZOR wrote:
really efficient way to create gifs, thanks a bunch for showing a step-by-step guide on how to do these.

np, hope it helps

On December 21 2014 23:57 Toadesstern wrote:
Can I use this method to make moe gifs, like the Mio moe moe kyun-scene or does it only work with UBW?

On a more serious note, thanks I'll probably try this one out sometime later and spam irc with some things :3

lol so silly I say spam away! Wouldn't be a bad idea to actually make several gifs per anime as a "review" or something. Also, you mean this?
[image loading]

Pretty easy to find. So moe T.T

yeah that's it but couldn't make it as I'm on my laptop right now... so only animu that airs on fridays or saturdays over here.
I thought about making a looped gif of slutty elemental girls dancing instead, lina in particular but that scene seems to be too short as I always get something around 5 seconds long rather than just the 1 or 2 seconds I want looped
Edit: Oh no, it just always starts somewhat earlier for some reason oO

yes, depending on when you cut it, it can start right from the beginning of the scene or give it an extra 0.5 sec or so. It's variable though since I've had times where it doesn't do that and other times that it does lol. You can always do the cut then use photoshop to take out the extra stuff before making it into a gif. That should work

hmm well, you cann always try to use SUPER and see if there's an option under extra options on the side for trimming. I usually do the first step of just making copy of the scene to make it a simpler process.
Former BW EiC"Watch Bakemonogatari or I will kill you." -Toad, April 18th, 2017
Toadesstern
Profile Blog Joined October 2008
Germany16350 Posts
Last Edited: 2014-12-21 20:14:35
December 21 2014 18:11 GMT
#9
On December 22 2014 03:08 BigFan wrote:
Show nested quote +
On December 22 2014 02:52 Toadesstern wrote:
On December 22 2014 02:00 BigFan wrote:
On December 21 2014 20:42 NeThZOR wrote:
really efficient way to create gifs, thanks a bunch for showing a step-by-step guide on how to do these.

np, hope it helps

On December 21 2014 23:57 Toadesstern wrote:
Can I use this method to make moe gifs, like the Mio moe moe kyun-scene or does it only work with UBW?

On a more serious note, thanks I'll probably try this one out sometime later and spam irc with some things :3

lol so silly I say spam away! Wouldn't be a bad idea to actually make several gifs per anime as a "review" or something. Also, you mean this?
[image loading]

Pretty easy to find. So moe T.T

yeah that's it but couldn't make it as I'm on my laptop right now... so only animu that airs on fridays or saturdays over here.
I thought about making a looped gif of slutty elemental girls dancing instead, lina in particular but that scene seems to be too short as I always get something around 5 seconds long rather than just the 1 or 2 seconds I want looped
Edit: Oh no, it just always starts somewhat earlier for some reason oO

yes, depending on when you cut it, it can start right from the beginning of the scene or give it an extra 0.5 sec or so. It's variable though since I've had times where it doesn't do that and other times that it does lol. You can always do the cut then use photoshop to take out the extra stuff before making it into a gif. That should work

hmm well, you cann always try to use SUPER and see if there's an option under extra options on the side for trimming. I usually do the first step of just making copy of the scene to make it a simpler process.


apparently it can only start at i-frames, whatever that means
The scene I thought about has the last one 3 sec before it... I'll wait until back at my place and think of something else

+ Show Spoiler [madoka :3] +
[image loading]
<Elem> >toad in charge of judging lewdness <Elem> how bad can it be <Elem> also wew, that is actually p lewd.
BigFan
Profile Blog Joined December 2010
TLADT24920 Posts
December 21 2014 22:05 GMT
#10
On December 22 2014 03:11 Toadesstern wrote:
Show nested quote +
On December 22 2014 03:08 BigFan wrote:
On December 22 2014 02:52 Toadesstern wrote:
On December 22 2014 02:00 BigFan wrote:
On December 21 2014 20:42 NeThZOR wrote:
really efficient way to create gifs, thanks a bunch for showing a step-by-step guide on how to do these.

np, hope it helps

On December 21 2014 23:57 Toadesstern wrote:
Can I use this method to make moe gifs, like the Mio moe moe kyun-scene or does it only work with UBW?

On a more serious note, thanks I'll probably try this one out sometime later and spam irc with some things :3

lol so silly I say spam away! Wouldn't be a bad idea to actually make several gifs per anime as a "review" or something. Also, you mean this?
[image loading]

Pretty easy to find. So moe T.T

yeah that's it but couldn't make it as I'm on my laptop right now... so only animu that airs on fridays or saturdays over here.
I thought about making a looped gif of slutty elemental girls dancing instead, lina in particular but that scene seems to be too short as I always get something around 5 seconds long rather than just the 1 or 2 seconds I want looped
Edit: Oh no, it just always starts somewhat earlier for some reason oO

yes, depending on when you cut it, it can start right from the beginning of the scene or give it an extra 0.5 sec or so. It's variable though since I've had times where it doesn't do that and other times that it does lol. You can always do the cut then use photoshop to take out the extra stuff before making it into a gif. That should work

hmm well, you cann always try to use SUPER and see if there's an option under extra options on the side for trimming. I usually do the first step of just making copy of the scene to make it a simpler process.


apparently it can only start at i-frames, whatever that means
The scene I thought about has the last one 3 sec before it... I'll wait until back at my place and think of something else

+ Show Spoiler [madoka :3] +
[image loading]

ah I see, never heard of this i-frame before. So, the final gif had 3 seconds before the scene?

lol nice. Don't recall seeing this before, likely from the movie then.
Former BW EiC"Watch Bakemonogatari or I will kill you." -Toad, April 18th, 2017
esdf
Profile Joined December 2012
Croatia736 Posts
December 22 2014 00:40 GMT
#11
i would suggest this tool, http://blog.bahraniapps.com/gifcam/ it's by far the easiest i ever used.
why do you not believe it? the legend has alived!
BigFan
Profile Blog Joined December 2010
TLADT24920 Posts
December 22 2014 15:51 GMT
#12
On December 22 2014 09:40 esdf wrote:
i would suggest this tool, http://blog.bahraniapps.com/gifcam/ it's by far the easiest i ever used.

Pretty cool tool. Thanks for sharing. More fun stuff to play with
Former BW EiC"Watch Bakemonogatari or I will kill you." -Toad, April 18th, 2017
NeThZOR
Profile Blog Joined November 2010
South Africa7387 Posts
December 25 2014 12:42 GMT
#13
On December 22 2014 09:40 esdf wrote:
i would suggest this tool, http://blog.bahraniapps.com/gifcam/ it's by far the easiest i ever used.

Thanks
SuperNova - 2015 | SKT1 fan for years | Dear, FlaSh, PartinG, Soulkey, Naniwa
Please log in or register to reply.
Live Events Refresh
Next event in 5h 5m
[ Submit Event ]
Live Streams
Refresh
StarCraft 2
Nina 190
JuggernautJason137
ProTech80
StarCraft: Brood War
Calm 2465
Dewaltoss 126
ZZZero.O 33
NaDa 22
MaD[AoV]16
Shine 12
Dota 2
capcasts137
NeuroSwarm44
League of Legends
JimRising 635
Counter-Strike
flusha476
taco 362
Foxcn333
Heroes of the Storm
Liquid`Hasu570
Other Games
summit1g7562
Grubby2977
tarik_tv2311
FrodaN1841
fl0m784
ZombieGrub215
Pyrionflax145
ViBE138
mouzStarbuck61
Sick53
PPMD30
Organizations
Other Games
BasetradeTV46
StarCraft 2
angryscii 23
Blizzard YouTube
StarCraft: Brood War
BSLTrovo
sctven
[ Show 19 non-featured ]
StarCraft 2
• RyuSc2 65
• davetesta50
• LUISG 17
• IndyKCrew
• sooper7s
• Migwel
• AfreecaTV YouTube
• intothetv
• LaughNgamezSOOP
• Kozan
StarCraft: Brood War
• STPLYoutube
• ZZZeroYoutube
• BSLYoutube
Dota 2
• masondota21383
League of Legends
• Doublelift4229
• Jankos2681
Other Games
• Scarra1505
• imaqtpie902
• Shiphtur316
Upcoming Events
Korean StarCraft League
5h 5m
CranKy Ducklings
12h 5m
RSL Revival
12h 5m
ByuN vs Cham
herO vs Reynor
FEL
18h 5m
RSL Revival
1d 12h
Clem vs Classic
SHIN vs Cure
FEL
1d 14h
BSL: ProLeague
1d 20h
Dewalt vs Bonyth
Replay Cast
3 days
Sparkling Tuna Cup
3 days
The PondCast
4 days
[ Show More ]
Replay Cast
5 days
RSL Revival
5 days
Replay Cast
6 days
RSL Revival
6 days
Liquipedia Results

Completed

Proleague 2025-06-28
HSC XXVII
Heroes 10 EU

Ongoing

JPL Season 2
BSL 2v2 Season 3
BSL Season 20
Acropolis #3
KCM Race Survival 2025 Season 2
CSL 17: 2025 SUMMER
Copa Latinoamericana 4
Championship of Russia 2025
RSL Revival: Season 1
Murky Cup #2
BLAST.tv Austin Major 2025
ESL Impact League Season 7
IEM Dallas 2025
PGL Astana 2025
Asian Champions League '25
BLAST Rivals Spring 2025
MESA Nomadic Masters
CCT Season 2 Global Finals
IEM Melbourne 2025

Upcoming

2025 ACS Season 2: Qualifier
CSLPRO Last Chance 2025
2025 ACS Season 2
CSLPRO Chat StarLAN 3
K-Championship
uThermal 2v2 Main Event
SEL Season 2 Championship
FEL Cracov 2025
Esports World Cup 2025
StarSeries Fall 2025
FISSURE Playground #2
BLAST Open Fall 2025
BLAST Open Fall Qual
Esports World Cup 2025
BLAST Bounty Fall 2025
BLAST Bounty Fall Qual
IEM Cologne 2025
FISSURE Playground #1
TLPD

1. ByuN
2. TY
3. Dark
4. Solar
5. Stats
6. Nerchio
7. sOs
8. soO
9. INnoVation
10. Elazer
1. Rain
2. Flash
3. EffOrt
4. Last
5. Bisu
6. Soulkey
7. Mini
8. Sharp
Sidebar Settings...

Advertising | Privacy Policy | Terms Of Use | Contact Us

Original banner artwork: Jim Warren
The contents of this webpage are copyright © 2025 TLnet. All Rights Reserved.