• Log InLog In
  • Register
Liquid`
Team Liquid Liquipedia
EDT 21:09
CEST 03:09
KST 10:09
  • 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
[ASL21] Ro4 Preview: On Course12Code S Season 1 - RO8 Preview7[ASL21] Ro8 Preview Pt2: Progenitors8Code S Season 1 - RO12 Group A: Rogue, Percival, Solar, Zoun13[ASL21] Ro8 Preview Pt1: Inheritors16
Community News
Weekly Cups (May 4-10): Clem, MaxPax, herO win1Maestros of The Game 2 announcement and schedule !10Weekly Cups (April 27-May 4): Clem takes triple0RSL Revival: Season 5 - Qualifiers and Main Event12Code S Season 1 (2026) - RO12 Results1
StarCraft 2
General
MaNa leaves Team Liquid Weekly Cups (May 4-10): Clem, MaxPax, herO win Code S Season 1 - RO8 Preview Behind the Blue - Team Liquid History Book Weekly Cups (April 27-May 4): Clem takes triple
Tourneys
2026 GSL Season 2 Qualifiers $5,000 WardiTV Spring Championship 2026 Maestros of The Game 2 announcement and schedule ! SC2 INu's Battles#16 <BO.9> Master Swan Open (Global Bronze-Master 2)
Strategy
Custom Maps
[D]RTS in all its shapes and glory <3 [A] Nemrods 1/4 players
External Content
Mutation # 525 Wheel of Misfortune The PondCast: SC2 News & Results Mutation # 524 Death and Taxes Mutation # 523 Firewall
Brood War
General
(Spoiler) Interview ASL Ro4 Day 2 Winner Data needed Flashes ASL S21 Ro8 Review ASL Tickets to Live Event Finals? Pros React To: Leta vs Tulbo (ASL S21, Ro.8)
Tourneys
[ASL21] Semifinals B [Megathread] Daily Proleagues [ASL21] Semifinals A [BSL22] RO16 Group Stage - 02 - 10 May
Strategy
[G] Hydra ZvZ: An Introduction Simple Questions, Simple Answers Fighting Spirit mining rates Muta micro map competition
Other Games
General Games
Warcraft III: The Frozen Throne Stormgate/Frost Giant Megathread Nintendo Switch Thread Starcraft Tabletop Miniature Game PC Games Sales Thread
Dota 2
The Story of Wings Gaming
League of Legends
Heroes of the Storm
Simple Questions, Simple Answers Heroes of the Storm 2.0
Hearthstone
Deck construction bug Heroes of StarCraft mini-set
TL Mafia
Vanilla Mini Mafia Mafia Game Mode Feedback/Ideas TL Mafia Community Thread Five o'clock TL Mafia
Community
General
Russo-Ukrainian War Thread US Politics Mega-thread UK Politics Mega-thread YouTube Thread European Politico-economics QA Mega-thread
Fan Clubs
The IdrA Fan Club
Media & Entertainment
[Manga] One Piece Anime Discussion Thread [Req][Books] Good Fantasy/SciFi books
Sports
2024 - 2026 Football Thread McBoner: A hockey love story Formula 1 Discussion
World Cup 2022
Tech Support
streaming software Strange computer issues (software) [G] How to Block Livestream Ads
TL Community
The Automated Ban List
Blogs
How EEG Data Can Predict Gam…
TrAiDoS
ramps on octagon
StaticNine
Funny Nicknames
LUCKY_NOOB
Customize Sidebar...

Website Feedback

Closed Threads



Active: 4284 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 States24772 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
PiGosaur Cup
00:00
#81 (TLMC 22 Edition)
PiGStarcraft459
CranKy Ducklings9
Liquipedia
[ Submit Event ]
Live Streams
Refresh
StarCraft 2
PiGStarcraft459
RuFF_SC2 46
CosmosSc2 39
StarCraft: Brood War
GuemChi 6139
Artosis 656
Dota 2
monkeys_forever711
NeuroSwarm115
LuMiX1
Counter-Strike
fl0m4257
Super Smash Bros
hungrybox539
Other Games
summit1g10646
Day[9].tv915
shahzam821
C9.Mang0514
Maynarde87
ViBE48
Organizations
Other Games
gamesdonequick741
StarCraft 2
Blizzard YouTube
StarCraft: Brood War
BSLTrovo
[ Show 16 non-featured ]
StarCraft 2
• Hupsaiya 70
• davetesta53
• CranKy Ducklings SOOP2
• AfreecaTV YouTube
• intothetv
• Kozan
• IndyKCrew
• LaughNgamezSOOP
• Migwel
• sooper7s
StarCraft: Brood War
• Pr0nogo 5
• BSLYoutube
• STPLYoutube
• ZZZeroYoutube
Other Games
• Scarra1820
• Day9tv915
Upcoming Events
Replay Cast
7h 51m
Replay Cast
22h 51m
The PondCast
1d 8h
OSC
1d 8h
Replay Cast
1d 22h
RSL Revival
2 days
OSC
2 days
Korean StarCraft League
3 days
RSL Revival
3 days
BSL
3 days
[ Show More ]
GSL
4 days
Cure vs herO
SHIN vs Maru
BSL
4 days
Replay Cast
5 days
Replay Cast
5 days
The PondCast
6 days
Liquipedia Results

Completed

Proleague 2026-05-12
WardiTV TLMC #16
Nations Cup 2026

Ongoing

BSL Season 22
ASL Season 21
IPSL Spring 2026
KCM Race Survival 2026 Season 2
Acropolis #4
KK 2v2 League Season 1
BSL 22 Non-Korean Championship
SCTL 2026 Spring
RSL Revival: Season 5
2026 GSL S1
Asian Champions League 2026
IEM Atlanta 2026
PGL Astana 2026
BLAST Rivals Spring 2026
IEM Rio 2026
PGL Bucharest 2026
Stake Ranked Episode 1
BLAST Open Spring 2026
ESL Pro League S23 Finals
ESL Pro League S23 Stage 1&2

Upcoming

Escore Tournament S2: W7
YSL S3
Escore Tournament S2: W8
CSLAN 4
Kung Fu Cup 2026 Grand Finals
HSC XXIX
uThermal 2v2 2026 Main Event
Maestros of the Game 2
WardiTV Spring 2026
2026 GSL S2
BLAST Bounty Summer 2026: Closed Qualifier
Stake Ranked Episode 3
XSE Pro League 2026
IEM Cologne Major 2026
Stake Ranked Episode 2
CS Asia Championships 2026
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 © 2026 TLnet. All Rights Reserved.