So thatsgavin requested a tutorial on how I made these (I'm sorry this took so long omg):
Level: intermediate (requires general gif making knowledge)
So we're going to do Geoff's because I need to make his anyway and I may as well make a tutorial out of it :3
First the name gif. This is quite time-consuming but reasonably straight forward if you're already familiar with simple gif making.
You start with the background you want, I'm using just a pale grey background
Then add whatever title you want. In this case, name.
Then we're going to add the the text you want:
Then right click on the text layer and click rasterize type. You then need to cut out each letter individually by using the marquee tool and making a layer via cut.
Once you've finished that, you should have these as your layers:
Then you need to create two more groups of letters, with the same amount as that in the original word. So for this one we need two groups of 11 letters also rasterized and cut into individual layers.
The first random group you need to set to an opacity of 24% (or similar). Let's call this group 1
The second random group needs to be set to an opacity of around 60%. This is group 2
Now for the frames. On the first frame you make the first letter of group one visible. Then duplicate frame,
make the first letter of group 2 visible and the first letter of group 1 invisible. Then duplicate frame and make the first letter of group 2 invisible and the first letter of the Geoff group visible. You may have to jiggle the letters around a little to make sure they're all in the same place.
This will have to be repeated for every letter but of course just leave all the letters in the Geoff group visible as you go along.
To make it a different color, you find a texture that you like, such as this one:
And then after you have converted frames to timeline and condensed all your layers into a smart object as you usually would, you just copy and paste this over the top of your layers and set to screen.
And that's all there is to it.
Next gif is the AKA one or whatever you want to do with it. So you just repeat the first few steps: use the same background and add a title. I'm actually going to demonstrate this with Michael's because thatsgavin specifically asked how I did the bear. So you have this:
I just found a running bear gif, linked here and on the original post. You save the gif and open it in photoshop and turn it into a smart object. (You do this by converting the frames into timeline animation then selecting all layers, right click and convert to smart object). You then need to drag the object onto your active canvas (note: copying and pasting it won't work, you have to get it into a new window and drag it on.) then just resize and move around as you please. Then add texture, sharpen etc
For the attributes one we start with this basic layout
Then you add the personality traits you want
(If anyone's interested i'm using the orator std font for these and the other font that "mogar" is in is nexus bold)
You will need for layers for each check mark so 24 new layers all together but you will need 25 frames because the first will be blank. Go to the first frame and make sure all the check mark frames are invisible. Then duplicate frame, make the first layer visible and draw part of the cross
and then duplicate frame, make the second layer visible and add the next part.
and repeat twice more
And then you just repeat this for every check mark.
For the final one, the "special skill" I generally just do a very simple little animation. You start with this basic layout:
Then find a relevant picture, for me it's this:
Then you duplicate the image five times. For the first frame just leave it as it is. For the second frame, you just rotate it by ten degrees or so to the left. For the third frame, another ten degrees.
Then duplicate frames and reverse back to the starting position. Then add another two rotating slightly to the right instead. This produces the appearance of it just waggling from side to side.
And that's all there is to it. Any questions, hit me up!












