Anyone here have experience working with video game sprites?

[CaptainRichard]

I'm a Twitch streamer and I'm looking to go from using a static follower alert to an animated one using some Aliens sprites as an animated gif. Basically, every time someone follows me, it shows their name and it plays some gun sound effects from the movie Aliens and I usually grab my prop gun and pretend to shoot things. LOL

Anyway, what I'd like to do is get some animated Aliens running in and getting gunned down to go along with the sound effects. I figured a few sprite from the Alien vs. Predator arcade game would work well, such as this example here:

​

Ideally, it would be kind of like the sequence starting at 0:50 in this Youtube video:

I know about sprite sheets and found one for these guys, but I'm not terribly knowledgeable in the world of working with sprites and gifs in Photochop. If anyone is interested in giving me a hand with this, that would be awesome.

Aliens Sprite Sheet: http://www.spriters-resource.com/resources/sheets/23/25157.png

Thanks!

 

[Annitias]

That will be pretty awesome once done.

 

[Wakapedia]

Found this if it helps anyone. Looks like a few different animation frames from the alien above.
http://i.imgur.com/ey1tecG.jpg

this one has the death animation frame by frame http://i.imgur.com/wue0pmB.png

This afternoon i'll work on creating a GIF or video

 

[Wakapedia]

Ok here's a 1st draft I guess. I'm not the best at this. I made it easy to chroma key and so far it's only 5 seconds long with 1 alien animation with some of the aliens running slower or faster than others. A few of them have a hit effect for blood splatter.
https://drive.google.com/file/d/0B1AqXA1nwxwwZUc5ckoxQ0tiUW8/view?usp=sharing

 

[CaptainRichard]

Holy shit, Waka. This is exactly what I was looking for! Friggin' awesome.

The only thing is it needs to be a GIF versus an MP4 video. I'm going to hit you up after I get off work and send you the Twitch overlay template I use for follower alerts. I'm hoping the video can be converted to GIF without too much hassle.

 

[Wakapedia]

Not a problem. other stuff can be added if you need a section to frame someone's name when they follow. Also I should add a couple seconds of lead in time before they start running in so you have time to pick up your gun lol.

 

[CaptainRichard]

Nice. So the last step here is somehow adding the animated gif to the template NightDev provides when you want to do a custom pop-up alert.

Here is the link for their template: http://www.nightdev.com/followalert/template.psd

I don't think the template has to be the same size as what they provide, but I'm guessing in order to have the name show up, the text box needs to be in there somewhere. Maybe a little trial an error?

But seriously, thanks a ton dude. You're creating exactly what I had in mind. :D

 

[Wakapedia]

hmm as far as I can tell I can't get nightdev follower alert to work with animated GIF files. only uses the 1st frame of the animation

https://www.nightdev.com/hosted/follower-alert/?channel=wakapedia&type=custom-centered&alert=https://i.imgur.com/ay9OsX4.gif&preview=true

actually 1 sec, i'm editing the CSS I may have it

 

[CaptainRichard]

Hmmm...I will read the NightDev forums and see what I can come up with.

 

[Wakapedia]

ok here's my workaround solution lol.

remake the follower page on nightdev using the animated gif provided above. Select "use my own - text centered"

Step 1: get the url for your nightdev follower page.
Step 2: chrome or firefox extension called Stylish
Step 3: create a new style in Stylish and select the nightdev follower page in the applies to section
Step 4: copy the code below into the code section in Stylish
Step 5: save and check the follower page again.

::-webkit-scrollbar {
  visibility: hidden;
}
body {
  background-color: rgba(0, 0, 0, 0);
  margin: 0px auto;
}
#follower-alert {
    width: 1700px !important;
    height: 300px !important;
}
#new-follower {
  margim: 0px !important;
  padding: 0px !important;
  width: 700px !important;
  position: absolute !important;
  top: 240 !important;
  left: 250 !important;
}

 

[KingNewbs]

Nice work!

 

[CaptainRichard]

OK, cool. It's working now. I might need to crop the gif a bit so it will fit the "Show Region" zone of my streaming software, but I think I can tackle that.

I'll record a demo and post it as soon as I can!

 

[Wakapedia]

You can move around the follower text by editing the bottom 2 fields in Stylish if you want
top: 240 !important;
left: 250 !important;

changing the 240 and 250 as pixel counts

Also I can resize the whole GIF in 2 seconds if you need. narrower or shorter or however

 

[Wakapedia]

OK. Much tinkering. Many crys. Such smarts.
edit your follower url like this
http://zippy.gfycat.com/AntiqueBogusChinchilla.gif

Step 1: Use the url above to replace the image url section of your nightdev follower url

mine looks like this

https://www.nightdev.com/hosted/follower-alert/?channel=wakapedia&type=custom-centered&alert=http://zippy.gfycat.com/AntiqueBogusChinchilla.gif&preview=true

I believe it's imgur's caching that's screwing it up. I lowered the gif size to half the original by removing colours it doesn't need and I uploaded it to gfycat.com and it worked 100% of the time I refreshed the page. Still for some reason the 1st time it loads it doesn't always play but every time I refresh it does.

OK after reloading a few dozen times this caches as well and doesn't restart the animation. I think it's just how it is everywhere.
I think if you ran the URL in an incognito window it may work

Some people also use sub alert. Program that runs on your computer and not through the browser.
http://www.twitch.tv/subalert
I tested it and it worked every time as well. Runs the gif and audio right off your comp. Very configurable. Somewhat crashy.
If all this fails in the end I might just make it loop forever and maybe that will help

 

[CaptainRichard]

Alrighty, I'll try the new link tonight, then check out SubAlert this weekend!

 

[Shive]

WoW Waka, now we know who to go to for stuff like this :D