How to make an SWF background (static, animated, and/or 16/9) (2 Viewers)

[SyntaxTerror]

How to make an SWF background,
static, animated and/or 16/9.
Tutorial and tools

​

Note: I am going to rewrite this tutorial soon to cover all types of SWF backgrounds: static, animated and/or 16/9 (HD).

I left the old tutorial in a spoiler below and I put the code created by sby that allows the flashing precum to cover the whole screen.

import SDTMods.*;
import flash.system.ApplicationDomain;

registerMod(background);
modName = "";
modCreator = "";

var SDT = ApplicationDomain.currentDomain;
var g;

try
{
    g = SDT.getDefinition("g"); //Vanilla
    finishinit();
}

catch(ex)
{
//We're in loader, wait.
}

function initl(l) : void
{    
    g = l.g; // Loader
    finishinit();
    l.borders.alpha = 0;
    l.unloadMod();
}

function finishinit()
{
    g.screenEffects.whiteFlash.scaleX = 1.6028;
    g.screenEffects.whiteFlash.x = -211;
    g.screenEffects.whiteout.scaleX = 1.6028;
    g.screenEffects.whiteout.x = -211;
}

This code has simply to be added to the main settings of the FLA and makes the precum flashing 1122×700, with its origin at x=-211 ; y=0, thus covering the whole screen, both in Vanilla and the Loader. It also sets to 0 the value of bordersEnabled in the Settings.txt file, making transparent the borders that appear on the Loader.

If you make 16/9 SWF backgrounds before this tutorial is written, you can use this template: Background template.fla
You may want to use this PDN template for Paint.net also: Background template 1122x825.pdn
They have a 1122x825 rectangle with extra lines for the "normal" 700x825 backgrounds and guide layers with Her and Him in rest and blowjob position to help see the result ingame (also for a smaller 700x600 background if the image/animation is too small). The FLA has been stripped of everything unnecessary and the template is already registered in the action settings.

If you don't want to use this template for some reason, I advise to make backgrounds 1122×825 px, because if the game is put in full screen with the top of the window and the menu bars, the image is actually a bit wider than 16/9.

Spoiler: outdated tutorial

This tutorial shows how to make an animated background for Vanillla or the Loader using an animated GIF image and Adobe Flash Animate CC (formerly Flash Pro CC, I assume it also works with CS versions).
With some knowledge of Flash, you may extrapolate and make you own animations with classic/motion/shape tweens for example.

Prior to continue reading this tutorial, you should understand the basics of SDT backgrounds by consulting my Static Background Tutorial. ModGuy's tool presented there can also help you to choose the right image or video to use.

This tutorial assumes that you already have an animated GIF or a video that can be set to make an infinite loop, sized 700x825 px (or at least 700x600px, but it will not be able to be zoomed). It must not have too many frames, because it will impact the game frame rate (FPS).

To make, rezise, crop, optimize, add effects or split an animated GIF, you can use ezgif.com, that is a wonderful online tool for this (however, I had a problem with a transparent background that was showing different plain colours in Animate CC, I had to choose another online GIF editor on that time). It can also convert videos to GIF.
To cut or crop a video, you can use online-video-cutter.com, that is a good online tool for this. It supports all formats and is multilanguage.

You also need Flash Pro CS/CC or Animate CC (available here, 30 days trial) and Konashion's modding template: Flash CS3, CS4 or Flash CS5, CS6, CC.
You may download my Background Template.fla that contains only the necessary things from Konashion's template to design backgrounds (but the SDTMods folder), plus a layer containing an image of him and her on an alpha background to directly see the render ingame.

Example of him & her on alpha background.​

When everything is ready (click the images to see them full size):

1. Open SDTMod.fla.
2. Change the workspace to Animator (you can choose another, but this one will be used in the tutorial. Sorry that my Animate CC version is in French, but the layout will be the same for every language and my explanations use the English terms) and reduce the Color panel.
   
3. Import your GIF: File / Import / Import in Library.
4. Select the GIF in the Library panel.
5. Right-click its layer in the Scenario panel and Copy it.
6. Select the Background Template in the Library panel.
   
   
7. Right-click the Background layer and choose Paste layers to paste your GIF. Its top left corner should be aligned with the little cross automaticaly and thus be at the right place.
   
8. Delete the Background layer.
9. Choose Loop (Shift+Alt+L) in the Scenario panel.
10. Select all the frames of the GIF in the Loop in the Timeline.
11. Select Main.
    
12. Delete the README layer.
13. Select the Mods layer.
14. Drag the Background Template in the main panel and give it a name in the Properties panel.
    
15. Right-click the first frame in the Timeline of the Settings layer and select Actions (F9).
    
16. Type "registerMod(<name of the Background Template>);" (case is important).
17. Choose a name for the mod and put your name in the actions "modName" and "modCreator".
    
18. Save as your mod and Publish it in a folder containing konashion's SDTMods folder with SDT Action Scripts: ModElements.as, ModPackage.as, ModTypes.as (available in these archives: SDTModding.zip (for Flash Pro CS3 & CS4) or SDTModdingCS5.zip (for Flash Pro CS5, CS6, CC & Animate CC)).
    
19. Try your new mod in SDT: load it from the Modding tab with the SWF... button.
20. If it is good, share it in the Background section of the forum and add it to the downloads of the Resource Manager!

Notes:

• In Konashion's Background Template layer, there are three rectangles. The top one is sized 700x600 px, which is the size used in the firsts versions of SDT, when zoom wasn't avalaible. You can still make backgrounds of this size, but zooming will have no effect. These three rectangles together mesure 700x850 px, but the correct size for a background is 700x825 px. With this size, zoom is possible: the bottom part of the image will be shown when zoomed in and its top when zoomed out.
• Changing the Frame Rate in the Flash editor seems to have no effect ingame. Thus, the only way to slow the ingame frame rate seems to be putting identical images in frames one after another. To accelerate, some images must be removed (e.g. remove one image every four images).

 

[SyntaxTerror]

RESERVED

 

[SyntaxTerror]

RESERVED

 

[Scoopy]

Tried rather hard to make an animated background following the above tutorial, whilst I appreciate your effort in putting it together I just can't seem to get any SWF fil created to actually work.

Every time the file is published it tells me there is an error or two.

Symbol 'Background Template', Layer 'Settings', Frame 1, Line 10, Column 22 1120: Access of undefined property ModTypes.
Symbol 'Background Template', Layer 'Settings', Frame 1, Line 16, Column 28 1120: Access of undefined property ModElements.

If you understand what that says please tell me where I might be going wrong. Only have 6 days on CC trial so would appreciate a fairly quick reply!

 

[SyntaxTerror]

Every time the file is published it tells me there is an error or two.

Symbol 'Background Template', Layer 'Settings', Frame 1, Line 10, Column 22 1120: Access of undefined property ModTypes.
Symbol 'Background Template', Layer 'Settings', Frame 1, Line 16, Column 28 1120: Access of undefined property ModElements.

You also need [...] Konashion's modding template: Flash CS3, CS4 or Flash CS5, CS6, CC.

=> You have to publish it in a folder containing konashion's SDTMods folder with SDT Action Scripts: ModElements.as, ModPackage.as, ModTypes.as (available in these archives: SDTModding.zip (for Flash Pro CS3 & CS4) or SDTModdingCS5.zip (for Flash Pro CS5, CS6, CC & Animate CC)).
I edited the tutorial accordingly.

By the way, this tutorial needs to be rewritten, because I found simpler methods since I wrote it.

 

[Scoopy]

Appreciate the very quick reply! Will have a go tomorrow.

 

[Scoopy]

Spoiler: Don't bother reading.

Ok, my understanding has improved a little but still getting problems even after following the instructions. The latest 2 errors are the same;

"5001: The name of package 'SDTMods' does not reflect the location of this file. Please change the package definition's name inside this file, or move the file."

I've tried renaming the individual mod files to have the background name, the file path and folder itself. Bit of a head scratcher.

Never mind, worked it out.

When 'saving as' you need to save over the original fla file. I was saving the fla file with a new name and thus having 2 fla files screwing things up.

Thanks again.

 

[stuntcock]

I've tried renaming the individual mod files to have the background name, the file path and folder itself. Bit of a head scratcher.

I would encourage you to undo these changes if possible, or revert to a backup if you made one. Shotgun debugging will sometimes fix the current problem, but it tends to create extra confusion and problems at a later stage.

Flash wants the SDTMods subfolder (containing three plaintext source files with the .as file extension) to appear in the same folder as your FLA source file. That's all. It doesn't want you to copy the *.as files into the same folder as your FLA file. It doesn't care what your FLA file is named. It doesn't expect you to perform extensive tinkering with project filepath settings. It doesn't expect you to rename any files in order to conform to the names of your animation/video source files. It doesn't require you to move any files; it's entirely possible to have a Flash project whose reference images (or audio files) are stored on a different drive partition or a different physical drive.

Flash will become unhappy if the SDTMods subfolder has been renamed to "sdtmods" or "SDTMods-background-animation-project" or "SDT modding template files" or "this folder was extracted by WinZip trial version, please register now!" or anything like that. It will also become unhappy if you've manually moved or renamed any of the *.as files within the SDTMods subfolder. You're expected to leave those files completely unchanged.

Suggested fix:

1. close any Flash projects that are currently open
   
2. create a backup of your FLA source file (just in case it accidentally gets misplaced or overwritten during this process)
   • if your FLA file is still named "ExampleMod.fla" then please take this opportunity to rename it to something else, such as "BgAnimationTest.fla"
3. extract the SDTModdingCS5.zip file into a new folder
4. explore the newly-created folder; find the newly-created ExampleMod.fla file
   
5. copy-paste your FLA source file into the same place as the newly-created ExampleMod.fla file
6. open your FLA source file (which you've just pasted into its new home)
   
7. try to publish your project

 

[Scoopy]

I would encourage you to undo these changes if possible, or revert to a backup if you made one.

Appreciate the expanded explanation SC. Made sure that the template fla was copied form the original and put into it's own folder for each animation planned. have in fact now made two so far, all rather easy once you know how.

Mind you there's another problem now. Made a rather ambitious third gif to create another background out of and CC won't let the GIF be pasted from the library into the background layer (whereas this was not encountered before). My guess would be that the GIF file is too large or CC is fucked in some way. Or I've ticked a box somewhere that's buggered CC.

Anyway, will be sure to upload whatever I can come up with after the CC trial is over.

 

[SyntaxTerror]

Mind you there's another problem now. Made a rather ambitious third gif to create another background out of and CC won't let the GIF be pasted from the library into the background layer (whereas this was not encountered before). My guess would be that the GIF file is too large or CC is fucked in some way. Or I've ticked a box somewhere that's buggered CC.

Actually, you can import the GIF directly into the scene, it is easier.
Be careful that if the GIF has too many frames (more than 50), SDT's FPS rate will drop a lot and make the game very slow, and Animate CC will become buggy, unless you hav a very fast computer and a good graphic card.

 

[Scoopy]

Did it.

 

[SyntaxTerror]

Scoopy : Nice work, but if I may give you some advices:

• In the dungeon and tentacles backgrounds, the GIF play too slowly and look quite jerky. Usually, most GIFs paly at the right pace if there is only one frame per image in the timeline. You have two options:
  • remove surplus frames on Animate CC. This can be a bit tricky as it is difficult to select several frames.
  • make your GIF faster with an GIF editor. This is the option I prefer, it is faster and all your images will be on only one frame each.
• In the spaceship background, it is necessary to zoom in to see the animation. It is usually better to put the most important part of a background in the bottom 600 pixels, so it will be seen whatever the zoom is.
• Do not forget to add tags to your dowloads, it will make their search easier. The basic tags I put on animated backgrounds are animated, animated background, background, sdt, vanilla, (you can copy these tags and paste them directly).

Good luck.

 

[Scoopy]

SyntaxTerror Thank you!

Will play about with the tentacle one at some point, though OrcDungeon has been upgraded as it was a very quick job of just deleting loads of frames. Tentacles will be a bit of a fuck about.

Whilst I was pleased with the spaceship one as you see the effect once zoomed in (That wasn't intentional...) however I can see that would not be to everyone's taste. Did have another background to be given the warp treatment mind you which will have a more central view.

Also will add tags. Cheers Syn.

 

[SyntaxTerror]

Did have another background to be given the warp treatment mind you which will have a more central view.

Sorry, but I do not understand well what you are meaning.

Also will add tags.

I already added the most obvious ones. You can add some others if you want.

 

[Scoopy]

Sorry, but I do not understand well what you are meaning.

There is another picture with the window in the centre, I will use that for the next warp animation.

I already added the most obvious ones. You can add some others if you want.

Thank you.

 

[betahyes]

RESERVED

I use Animate 19, all clear:
-I opened the background fla file.
- I imported my gif into the library
- then?
I deleted the "drawing: white window" mod that appears in the drawing window, and pasted my gif symbol in the center.
- I went into shares I renamed
_modname "name of the gif"
_modecreator "name of the gif"
_ and added the gif name after background

I am left with an 1 error: the syntax one, rightparen is expected before _gif

I would like some help, so as to create other backgroud and maybe share them to give support