The VG Resource

Many people asked me how I ripped the sprites from Marvel: Avengers Alliance, so I decided to make this tutorial to help other rip sprites/images from any Flash game.
(if you find any mistake on my text, please tell me so I can fix it)

But first I want to ask something: Why do you want to learn?

• *To post spritesheets on the web --> not necessary, I am committed to rip every character in the game and once I've started, it's better to keep to upcoming chars in the same pattern...
  *To post the sprite on MAA Wikia --> not necessary, there are several adms doing it and no big demand; better trust on them.
  *To make edits with these sprites --> it's easier use the spritesheets I've done, but OK.
  *To rip sprite from other game --> that's why I'm doing this!
  *Just to gain knowlegde --> fair enough...

Sprite ripping of web flash games consists in two main steps:

• *find the .swf files on your bowser cache
  *extract the images from it, using an appropiate software

OK, tutorial finished Let's go futher into these steps.

Finding the .swf files

• *Recomended software: Internet Explorer 8 (or lower)

First, you have to access the game, open the game in the bowser. Then you have to go to the cache folder and get the files. The cache location depends of the bowser you used, I won't teach how to do it with every available bowser, but don't worry, it's easy to find on the web. Hint: more modern the bowser, more protected are the cache; that's why I recomend IE 8, it's really easy to find the files.
Now, there's some particularities on Avengers Alliance and other "social games". They are big, at least bigger than most Flash games. To avoid long "loading times", developers made separated files instead of a single file containing all the game content. So if you just open the game, you won't be able to get all its content. For example: if you want to rip the sprites from Dr Doom, you will have to acess his file, it means that you will have to face him on the game.
Let me show you:
First: clear your cache. This will remove inespecific files.
Open the game and do a battle.
Notice that I've used Valkyrie and Gambit, against Loki. Now I've acessed the swf files of these characters and I can rip their sprites.
I go to the cache folder (you must know how to do it on your bowser/operating system) and search the files (they must be the bigger ones).
Copy the files to another folder.


Extracting the images

• *Recomended software: Flash Decompiler Trillix

There are lots of software that extract images from swf files, so choose your favorite. FD Trillix is my favorite because I can use it to see the sprites "in motion" (this helps me a lot to organize the spritesheets).
There isn't much to say about this, just open the file and extract the images!

Working if the images

You may ask: "Why is everything separated? How can I find this image?"

You may noticed in my spritesheets that the sprites from Avengers Alliance comes in separated parts and have some differences from what you see in game. Developers do it to decrease the size of the files (very appropiated for a web game), so they use the Flash features to display the assembled sprites when we are playing (and some other resources). Valkyrie is a perfect example of what I'm saying.
The assembling is 80% move, 15% rotate and 5% scale. Hint: use FD Trillix, acess the "sprites" section of the file and take a snapshot to use as template.

---

Custom sprites

To process of making and edit or custom sprite is very personal. Don't consider the following text as a guide, but as an example. You will need YOUR creativity to make custom sprites, but you may take some useful tips from me.
One of the major dificulties of making an custom sprite, it's to make it looks like an original sprite. I mean, you need to follow the same style. The easiest way of do that, it's using images from that game (or similar) as base. We call that "Frankenstein Sprite Editing".
In this example I will try to make Venom! I started this text before starting the editing, I think I'll succed because there are good bases for all what I intent to do.
First, let's take a look at him:
Main characteristics: big, strong, huge mouth full of sharp teeth, big tongue, dark-blue/black skin, white spider on chest and back. So, I will use as base:

• *A big and strong body: could be Thing, Hulk, Ironclad or Abomination. The best choice is Abomination, he has no clothes and has pointed nails, like Venom. Hulk is too popular and this is an disadvantage, I don't want that people recognize Hulk before recognizing Venom; they should notice your char first, then figure out what you used...
  *Black Suit Spider-Man: obviously...
  *Mouth and tongue: Incascia and Toad

Looks like we got what we need.

I use GIMP, but I'm pretty sure Photoshop has all the tools I will use, maybe with different names. Choose your favorite software.
With the Healing and Smudge tools, I removed the stripes from Abomination's skin.

For the head, with some Erase, Scale and Rotate it's easy to get this:
+ =
Back top the body, let's remove the original head and trun green into black (adjusting lightness and saturation):

Join, the head and body (left image). Then adjusted the colours (lightness, saturation, etc; the right image):

Now, the chest "tatoo" I picked from Spidey:
I did some Scale and Rotate, and changed its layer mode to Value:

I had to remove his toes, in this step I used Paintbrush tool and A LOT of Healling and Smudge tool.
Then I added Toad's tongue. I didn't modify it (I could make it thicker, if I wanted to), just put it there.
Then, some minor adjustments and here's the ruthless Venom, desired by so many players:

Ok Playdom, now you do the rest.... lol

The head on that is stretched and resized and really pixelized.

One thing, it's easy to access the cache in Firefox via "about:cache?device=disk" in the address bar. They're not really protected at all.

I do all of my cache 'ripping' via Firefox, I wouldn't even touch IE.

Flash Compiler Trillix is Shareware and very limited in terms of export, are there any other tools to extract a swf file?

SWFTools is a range of utilities for multiple SWF stuff, one of them being SWFExtract which can extract MovieClips and other stuff, probably as images. There's also a whole list of various decompilers here, most are based towards decompiling the code but some can extract images as well.

I haven't tried SWFTools yet or any of the others but I'm sure you should find something.

I've tried SWF tools and can't find an .exe. I've also read that it's stuff that works with command lines and I have no idea how do anything with it.

Sorry for the delay Davy, I use "SWF Picture Extractor" to extract the images faster.

(03-04-2013, 06:51 AM)Davy Jones Wrote: [ -> ]I've tried SWF tools and can't find an .exe. I've also read that it's stuff that works with command lines and I have no idea how do anything with it.

I'm a bit late here, but here goes:
Generally what you do is install the tools via the exe found here to install SWFTools.

After this it seems you may need to add the folder to your path so cmd will know where to look for the exes. To do this, open the "My Computer" folder and right click anywhere, selecting Properties. Select "Advanced System Settings", followed by "Environment Variables".

Look for "PATH" under "User variables for YourUserNameHere", select it, then click "Edit". If there's nothing in your PATH environment variable, you can just place "C:\Program Files\SWFTools\" into it, but if there's something else already there, you'll need to separate the two with a semicolon, like so (my own PATH):


Note the ";C:\Program Files\SWFTools". Anyway, once this is done you'll need to open a CMD window in order to access the command line.

To open up a cmd window via the "Run..." option in the start menu (or just hit WinKey+R) and type "cmd", followed by Enter. This will give you a black window that should start in your Home directory, assuming Windows 7 ("C:\Users\Phaze" in my case).

What you do from here is navigate to the directory where your SWF file is located (cd "C:\path\to your\SWF") and run swfextract like so:


It'll output the IDs of objects inside the SWF (I wonder why it doesn't just automate this...) and the required 'switch' in order to access them.


If I wanted the sound, I'd run "swfextract Gaston.swf -s 4" and I'd get "output.mp3".

Phaze, I cant access the SWFTools site, it's working for you?

Also, I have a problem with FDTrillix. Some swf files just can't be openned in this software, I don't know why.
This file, for example, can't be opened on FDT 5.3.1370. A friend of mine said she could open it on 4.2.0.880 version, but I want to look for alternatives before installing older versions. Do you know something about it?

I can extract the images with "SWF Picure Extractor", but I like to open it on FDT because I can see to sprites "in motion".

(05-05-2013, 06:58 PM)Cyrus Annihilator Wrote: [ -> ]Phaze, I cant access the SWFTools site, it's working for you?

It loads for me, at least!

The site is here now.

Challenge to swf rippers:
Extract Image 868 from this file.

Looked at it in a .zip and it appears that it doesn't have an image counterpart (maybe made up of vector lines or something?). For the same reason can I guess that 866 and 867 can't be extracted either?

Yes, those ones can't be extracted either.
Do you know a way to convert these vector/shapes/sprites in "pixel" images?

No, but it does intrigue me. I'll look around later today and see if I can find something useful. Of course, it's possible that they aren't any type of image at all and simply contain some other kind of data.

EDIT: OK, well I looked around and it looks like it's probably possible to draw these into bitmap ("pixel") images. I can't find a program that can do it, and although I probably could make one (there are some AS3 libraries for SWF format reading) my hands are pretty full right now.
Once I have more time I'd be glad to give it a shot though. I can't promise anything of course, but it would be awesome if I could make something for this.