A complete free course for creating original MUGEN characters and custom stages. Draw sprites, write code, build a stage, design sound effects, customise screen packs, and put it all into a playable fighting game.
Understand what MUGEN is and gather the four tools you need to start building.
MUGEN is a free, customisable 2D fighting game engine created by Elecbyte. It lets you build your own roster of fighters, stages, and screen packs all from scratch or downloaded from the community.
The two most common versions are MUGEN 1.0 and MUGEN 1.1. Make sure your content matches your engine version.
What you'll need to get started
A sprite editor Aseprite, GraphicsGale (free), or Piskel (browser-based)
A text editor Notepad++, VS Code, or even Notepad
Fighter Factory 3 the standard tool for packing sprites and editing animations
A copy of MUGEN 1.0 or 1.1
MUGEN itself doesn't require any installation just extract the zip and run mugen.exe.
✏️
Fill in the Blanks
+15 XP
MUGEN is a free 2D game engine created by .
🧠
Knowledge Check
+15 XP
Which of these is NOT needed to start making a MUGEN character?
AA sprite editor like Aseprite or Piskel
BFighter Factory 3
CUnity or Unreal Engine
2
🎨
Drawing Your Sprites
Learn sprite rules and the minimum frame set
Locked
🎯
Goal for this step
Know the sprite rules and the minimum set of animations your character needs.
Sprites are the individual images that make up your character's animations. Before touching any MUGEN tools, you need to draw them.
Sprite rules
Draw at a consistent resolution (e.g. 100x120 pixels per frame)
Use a magenta background (#FF00FF) MUGEN makes this colour transparent
Keep your character centred on a consistent axis point across all frames
Name files logically: idle_01.png, walk_01.png, punch_01.png
Minimum sprite set to get started
Animation
Frames
Group
Idle stance
4-6 frames
0
Walk forward
6-8 frames
20
Jump
3-5 frames
40
Light punch
3-5 frames
200
Light kick
3-5 frames
400
Getting hit
2-3 frames
5000
Portrait
1 frame
9000
Start with the idle animation just 4 frames of subtle breathing movement. Get that working first before adding more.
⚡
True or False
+15 XP
You should use a magenta (#FF00FF) background on your sprites for transparency.
You need at least 20 different animations before you can test your character.
The idle animation is Group 0 in MUGEN.
🧠
Knowledge Check
+15 XP
What colour background should you use on your sprites so MUGEN treats it as transparent?
ABlack (#000000)
BMagenta (#FF00FF)
CWhite (#FFFFFF)
3
📦
Packing Sprites into an SFF
Bundle all images into one file with Fighter Factory 3
Locked
🎯
Goal for this step
Pack your sprite PNGs into a single .SFF file using Fighter Factory 3.
The .SFF (Sprite File Format) bundles all your character's images into one file that MUGEN can read. Each sprite is stored with a Group number and an Image number.
Open Fighter Factory 3 and click File → New
Go to the Sprites section and click Add to import your PNG files
For each sprite, set the Group and Image number (Group 0 = Idle, 20 = Walk, 200 = Punch)
Set the axis point for each sprite — click the crosshair tool and place it at the character's feet
Save as yourcharacter.sff
Use View → Show Guidelines to see the floor line. Every character's axis point should sit exactly on this line this is what stops them from floating or sinking.
Wrong axis points are the number one cause of characters floating above the ground. Take your time setting them correctly for every sprite.
🔢
Put It In Order
+15 XP
Click these SFF packing steps in the correct order:
Set Group and Image numbers for each sprite
Save as yourcharacter.sff
Open Fighter Factory 3 and click File → New
Set axis points at the character's feet
Go to Sprites section and click Add to import PNGs
🧠
Knowledge Check
+15 XP
What does the .SFF file contain?
AAll your character's sprites packed into one file
BSound effects and music
CThe character's health and speed stats
4
📁
The File Structure
Understand the six files every MUGEN character needs
Locked
🎯
Goal for this step
Know the six core files and write your character's .DEF config.
Every MUGEN character is a folder containing six files. Here's your mychar.def template the master config that links everything together:
; mychar.def edit names to match your character[Info]name = "My Character"displayname = "My Character"author = "Your Name"pal.defaults = 1
[Files]sprite = mychar.sff
anim = mychar.air
cmd = mychar.cmd
cns = mychar.cns
stcommon = common1.cns
sound =
stcommon = common1.cns points to MUGEN's built-in states file. Don't create it it already exists inside MUGEN's data folder.
Your complete character folder structure:
MUGEN/chars/mychar/mychar.def
mychar.sff all your sprites
mychar.air animation sequences
mychar.cmd button commands
mychar.cns stats and move logic
✏️
Fill in the Blanks
+15 XP
The file is the master config that links all other files together. Sprites are stored in the file.
🧠
Knowledge Check
+15 XP
What does stcommon = common1.cns point to?
AYour character's custom moves file
BMUGEN's built-in shared states file (already exists)
CA file you need to create from scratch
5
🧪
Importing & Testing
Get your character onto the select screen
Locked
🎯
Goal for this step
Add your character to MUGEN and see them on the select screen.
Place your entire character folder inside MUGEN/chars/
Open MUGEN/data/select.def in a text editor
Find the [Characters] section and add your folder name on a new line: mychar
Save select.def and launch mugen.exe
Your character should appear on the select screen!
Common issues
Problem
Fix
Not on select screen
Check select.def folder name must match exactly (case-sensitive)
Character invisible
.AIR has wrong Group/Image numbers check against .SFF
Character frozen
Action 0 (idle) is missing or has wrong sprite numbers
Floats/sinks
Axis points wrong re-align in Fighter Factory 3
MUGEN crashes
Missing file in .DEF or typo in .CNS/.CMD check the error log
FF3 has a built-in "Run in M.U.G.E.N." button set your MUGEN path in Options and click Run to test instantly without manual copying.
🔮
Predict What Happens
+15 XP
You place your character folder in MUGEN/chars/ but forget to edit select.def. What happens when you launch MUGEN?
AMUGEN crashes with an error
BThe character appears but with no sprites
CMUGEN runs fine but your character isn't on the select screen
🧠
Knowledge Check
+15 XP
Where do you add your character's folder name so it appears on the select screen?
AIn MUGEN/data/select.def under [Characters]
BIn your character's .DEF file
CIn MUGEN/data/mugen.cfg
⚙️ Part 2 — Fighter Factory 3
Master Your Toolkit
6
⚙️
What is Fighter Factory 3?
The all-in-one MUGEN editor
Locked
🎯
Goal for this step
Understand what FF3 does and download it.
Fighter Factory 3 (FF3) is a free, all-in-one editor for MUGEN content. It replaces multiple separate tools with a single visual interface the go-to standard for the MUGEN community.
Edit and pack sprites into .SFF files
Create and preview animations (.AIR) in real-time
Built-in editors for .DEF, .CMD, .CNS with syntax highlighting
Import and manage sound effects (.SND)
Set axis points visually
Preview characters with hitboxes visible
Download: Go to virtualltek.com and download FF3 (3.0.1) or FF Studio for your OS. No installer needed just extract and run FighterFactory.exe.
Choose the Neo interface mode on first launch it has the clearest layout for beginners.
⚡
True or False
+15 XP
Fighter Factory 3 can edit sprites, animations, sounds, and code all in one tool.
FF3 requires a paid licence to use.
🧠
Knowledge Check
+15 XP
What file format does Fighter Factory 3 pack sprites into?
A.PNG sprite sheets
B.GIF animated files
C.SFF (Sprite File Format)
7
🖼
Importing Sprites in FF3
Add PNGs and set axis points
Locked
🎯
Goal for this step
Import all your sprite PNGs into FF3 and set correct axis points.
Open FF3 and click File → New to start a fresh .SFF project
Go to the Sprites editor tab
Click Add (or drag-and-drop) to import your PNG files
For each sprite, set the Group and Image number in the panel
Click the crosshair tool and click at the character's feet to set the axis
Enable View → Show Guidelines to check alignment against the floor line
Save with File → Save As → name it mychar.sff
Use Add → select multiple files for batch import. FF3 auto-increments the Image number for you.
🔢
Put It In Order
+15 XP
Click these FF3 sprite import steps in the correct order:
Click Add to import your PNG files
Set axis points at the character's feet
Open FF3 and click File → New
Set Group and Image numbers for each sprite
Go to the Sprites editor tab
🧠
Knowledge Check
+15 XP
Where should you place the axis point for each sprite?
AAt the centre of the character's head
BAt the character's feet
CAt the top-left corner of the image
8
🎬
Building Animations
Create .AIR animation sequences
Locked
🎯
Goal for this step
Build your character's idle animation in the Animations editor.
The Animations editor is where you build your .AIR file sequences of sprites that play as actions. Each animation is an "Action" with a number.
Switch to the Animations editor tab
Right-click the action list → Add → set the action number (e.g. 0 for idle)
Click Add Frame → pick sprites from your .SFF list
Set the Ticks field for each frame (6-8 ticks = smooth, 1 tick = 60fps)
Hit Play or press Space to preview
; .AIR format (you can also edit this as text)[Begin Action 0]; idle animation0,0, 0,0, 7; Group,Image, X,Y, Duration0,1, 0,0, 70,2, 0,0, 70,3, 0,0, 7; loops back to start
Use Loopstart on the frame where the loop should begin. For idle, that's usually the first frame.
✏️
Fill in the Blanks
+15 XP
Each line in a .AIR file has five values: , Image, X, Y, and .
🧠
Knowledge Check
+15 XP
What does the "Ticks" value control in an animation frame?
AHow long each frame is displayed (duration)
BThe sprite's horizontal position
CThe hitbox size for that frame
9
🎯
Collision Boxes
Define hurtboxes and hitboxes
Locked
🎯
Goal for this step
Understand Clsn1 and Clsn2 boxes and add them to your animations.
Collision boxes define where your character can be hit (Clsn2) and where their attacks deal damage (Clsn1).
CLSN2 Hurtbox
The area where your character can be hit. Draw it around the body. Every frame needs at least one.
CLSN1 Hitbox
The area where your character deals damage. Only draw these on attack frames.
Use Clsn2 Default to set one hurtbox for an entire animation
Add Clsn1 boxes only on the frames where the attack is active
Toggle Show Clsn in the preview to visually verify your boxes
Keep hitboxes slightly smaller than the visual attack it feels fairer to opponents and more fun to play.
🔮
Predict What Happens
+15 XP
You forget to add a Clsn2 (hurtbox) to your idle animation frames. What happens when an opponent tries to hit your character while idle?
AMUGEN crashes when the opponent attacks
BYour character is invincible on those frames
CMUGEN auto-generates a default hurtbox
🧠
Knowledge Check
+15 XP
Which collision box type should you ONLY add to attack frames?
AClsn1 (Hitbox) — deals damage
BClsn2 (Hurtbox) — receives damage
CBoth should be on every frame
10
🔊
Adding Sounds in FF3
Import WAV files and build your .SND
Locked
🎯
Goal for this step
Import sound effects into FF3 and save a .SND file.
The Sounds editor builds your .SND file. Each sound gets a Group and Sound number, just like sprites.
Switch to the Sounds editor tab
Click Add and import WAV files
Set Group and Sound numbers (see table below)
Click Play to preview each sound
File → Save As → name it mychar.snd
Group
Type
0, X
Punch & kick impacts
1, X
Character voice lines / grunts
2, X
Special move effects
3, X
Super move effects
10, X
Win / loss quotes
Need free sound effects? Try freesound.org search for "punch hit", "ki energy", "sword swing".
✏️
Fill in the Blanks
+15 XP
MUGEN only accepts format for sound effects. Punch impacts go in Group .
🧠
Knowledge Check
+15 XP
Which sound Group number is used for character voice lines?
AGroup 0
BGroup 1
CGroup 10
11
💻
Code Editors & Testing
Edit .CNS states and test from FF3
Locked
🎯
Goal for this step
Write a basic attack state in .CNS and test it directly from FF3.
FF3's built-in code editors handle .DEF, .CMD, and .CNS files with syntax highlighting, auto-complete, and error checking.
To test directly from FF3: set your MUGEN path in Options, then click Run in M.U.G.E.N. no manual file copying needed.
The workflow is: Save → Run → See problem → Fix → Repeat. Don't be precious about it iteration is the process.
⚡
True or False
+15 XP
movetype = A means the state is an attack.
ChangeState is used to return the character to idle after an attack.
You must manually copy files to test — FF3 cannot launch MUGEN directly.
🧠
Knowledge Check
+15 XP
In a .CNS state, what does ctrl = 0 mean?
AThe character's speed is set to zero
BThe character's health is zero
CThe player cannot input new moves during this state
🎉🏆🎉
Workshop Complete!
You've finished all 11 steps of the MUGEN Workshop. You now know how to build a character from scratch sprites, animations, hitboxes, moves, sounds, and specials.
Learn to build a multi-layer parallax stage with animated torches. A complete walkthrough using the Dungeon Arena as the example project template .DEF file included to download.
Stage Creation Step 1 of 5
How MUGEN Stages Work
A MUGEN stage is a stack of background images (layers) that scroll at different speeds as the camera moves. Far layers move slowly, close layers move fast this is called parallax scrolling and it makes a flat 2D stage feel three-dimensional.
Each layer has a delta value that controls its scroll speed relative to the camera.
Files you need:
.DEF file stage config defining layers, camera, music
.SFF file all background images packed together
Background art your layer images (PNG or PCX)
.SND (optional) background music or ambient sound
You need Fighter Factory 3 to pack your background images into the .SFF — the same tool used for characters.
Stage Creation Step 2 of 5
The Parallax Layer System
The Dungeon Arena uses 5 layers at different depths. Each layer has a delta value lower = further away, higher = closer.
delta: 0.1
Cavern wall / lava glow
Deep background barely moves
delta: 0.4
Stone pillars + chains
Mid-ground slow scroll
delta: 0.7
Torch brackets
Closer details medium
delta: 1.0
Arena floor fighters stand here
Ground level matches camera
delta: 1.3
Foreground bars / dust
Foreground faster than cam
delta = 0, 0 means the layer is completely fixed and doesn't move at all good for a very distant sky.
Stage Creation Step 3 of 5
Writing the Stage DEF
The stage .DEF defines every layer, the camera bounds, and player start positions. Here's the Dungeon Arena floor layer as an example:
Download the full dungeon.def template below it has all 5 layers, camera settings, and player positions ready to use.
Stage Creation Step 4 of 5
Adding Animated Elements
Use type = anim instead of type = normal to make a layer play a looping animation. Perfect for flickering torches, dripping water, or lava bubbles.
; Define the animation in your stage .DEF[Begin Action 10]10,0, 0,0, 6; bright frame10,1, 0,0, 4; dim frame10,2, 0,0, 6; bright again10,1, 0,0, 3; dim — loops; Then reference it as a background layer[BG TorchFlicker]type = anim
actionno = 10
start = -80, 50
delta = 0.7, 0.7
mask = 1
Animation ideas for the dungeon:
Effect
Frames
Difficulty
Flickering torches
3–4 alternating brightness
Easy
Lava glow pulse
2–3 fading orange
Easy
Swaying chains
4–6 subtle swing
Medium
Dripping water
5–8 droplet frames
Medium
Floating dust
6–10 drifting particles
Hard
Stage Creation — Step 5 of 5
Import & Test Your Stage
Create MUGEN/stages/dungeon/ and place dungeon.def and dungeon.sff inside
Open MUGEN/data/select.def and find [ExtraStages]
Add a new line: stages/dungeon/dungeon.def
Save and run mugen.exe — your stage appears in VS mode stage select
Move characters left and right to test the parallax scrolling
Troubleshooting:
Problem
Fix
Black screen
Check dungeon.sff exists and spr= path in [BGdef] is correct
No parallax
Check each [BG] has different delta values
Coloured blocks
Set mask = 1 on transparent layers, or use SFF v2 with PNG alpha
Fighters float
Adjust start Y on your floor layer or tweak [PlayerInfo] p1starty
Anim not playing
Check type = anim and actionno matches your [Begin Action N]
🖥 Part 4 · Screen Packs & Menus
Customise Your MUGEN's Look
Screen packs control everything you see outside the fight title screens, character select grids, life bars, and menus. Learn how to install, edit, and personalise them.
Screen Packs Step 1 of 5
What Are Screen Packs?
A screen pack controls everything you see in MUGEN that isn't the actual fight the title screen, character select grid, VS screen, life bars, combo counter, win screen, and all the menus.
It's defined in system.def and uses its own .SFF for graphics and .SND for menu sounds.
The four main screens:
The title screen your game's logo, menu options, background art
The select screen character grid, portraits, cursor, stage selector
The VS screen face-off display before a fight starts
The fight HUD — life bars, power meter, timer, combo counter (controlled by fight.def)
Changing your screen pack is the single fastest way to make your MUGEN build feel like a completely different game.
Screen Packs Step 2 of 5
File Structure
All screen pack files live in MUGEN/data/. Here's what each one controls:
File
Controls
system.def
Title screen, select screen, VS screen, options menu layout
system.sff
All graphics for the above screens
system.snd
Menu sounds (cursor move, select, cancel)
fight.def
Life bars, power bars, combo counter, round display, timer
fight.sff
Graphics for all fight HUD elements
fight.snd
Fight sounds (round call, KO, time over)
mugen.cfg controls which screen pack is loaded via the motif = data/system.def line. Some packs use a subfolder.
Screen Packs Step 3 of 5
Installing a Screen Pack
Back up your entire MUGEN/data/ folder somewhere safe
Download a screen pack from mugenarchive.com, mugenfreeforall.com, or deviantart
Extract the ZIP you'll get system.def, system.sff, system.snd, fight.def, fight.sff, fight.snd
Copy the new files into MUGEN/data/, replacing the existing ones
Checkmugen.cfg make sure motif = data/system.def points to the right place
Launch mugen.exe you should see the new title screen!
Always back up before changing screen packs. One wrong file can break your entire MUGEN. Keep a clean copy of data/ somewhere safe.
Screen Packs Step 4 of 5
Editing system.def
Open system.def in a text editor to customise the title and select screens.
Change menu.pos to move the menu around the screen
Adjust columns/rows to fit your roster size
Rename menu.itemname entries to anything you want
Swap graphics by opening system.sff in Fighter Factory 3 and replacing sprites
The title screen background is defined in [TitleBGdef] it works exactly like a stage with layers and delta values. You already know how to build those!
Screen Packs — Step 5 of 5
Fight Bars & HUD
The fight HUD is controlled by fight.def — a separate file from the menu screens.
Section
Controls
[Lifebar]
Health bars position, size, colours, name display
[Powerbar]
Super meter fill animation, level count (Lv1–3)
[Round]
"Round 1 FIGHT!" text, timing, animations
[Combo]
Hit combo counter position, font, display time
[WinIcon]
Round win markers under the health bar
Best practices:
Start by modifying someone else's pack don't build from scratch yet
Match your resolution 320×240 packs look broken on 640×480 MUGEN and vice versa
Test after every single change screen pack editing is trial and error
Custom fonts are .fnt files the Font Factory tool lets you create them from any TrueType font
🔊 Part 5 · Sound Design Workshop
Make Your Fighter Sound Great
A hands-on workshop using free tools. Record, edit, and add sound effects to your character impacts, voice lines, and move effects.
Sound Workshop Step 1 of 5
Why Sound Matters
A fighting game without sound feels lifeless. Think about the crack of a fireball, the thud of a heavy kick, a character shouting their attack name those sounds are 50% of the impact.
The three categories you need:
Impact SFX punch hits, kick connects, blocks. These give attacks weight. A weak punch needs a different sound than a heavy one.
Voice Lines grunts, attack shouts, win quotes. These give your fighter personality. Even a simple grunt makes a difference.
Move Effects whooshes, energy charges, explosions. These make special moves feel powerful.
Your character will work without sound, but adding even 5–6 basic effects transforms the feel completely.
Sound Workshop Step 2 of 5
Tools You'll Need (All Free!)
Audacity free audio editor. Record, cut, layer, and export sounds. This is your main workshop tool. Download at audacityteam.org
Freesound.org free sound library with thousands of CC-licensed effects. Search for "punch", "sword swing", "grunt", "explosion"
Fighter Factory 3 pack your WAV files into a .SND file. You already know this tool.
Sound checklist create at least one WAV for each:
Category
Sounds to Make
Group
Impacts
Light hit, heavy hit, block sound
0
Voice
Attack grunt, heavy shout, "oof" on hit, win celebration
1
Effects
Punch whoosh, kick whoosh, special charge, super impact
2–3
Sound Workshop Step 3 of 5
Recording & Editing in Audacity
Record or import click the red Record button for voice, or File → Import for downloaded WAVs
Trim the silence select empty space before/after and press Delete. Impact sounds should be 0.1–0.3 seconds
Normalise select all (Ctrl+A) → Effect → Normalize. Makes all sounds a consistent loudness
Add punch try Effect → Bass Boost for heavier impacts, Effect → Reverb for echo, Effect → Change Pitch to deepen voices
Layer sounds import a "whoosh" and a "thud" on separate tracks. They play together = one satisfying hit
Export File → Export → Export as WAV. MUGEN needs WAV format
Pro tip: A great punch sound = a deep thud + a sharp crack + a subtle whoosh. Layer all three in Audacity for a professional result.
Vary your attacks: Light attacks = quick, higher-pitched. Heavy attacks = slower, deeper, more bass. This helps players feel the difference.
Sound Workshop Step 4 of 5
Packing into .SND
Open Fighter Factory 3, switch to the Sounds editor tab
Click Add and import all your WAV files
Set Group 0 for impacts, Group 1 for voice, Group 2+ for effects
Number each sound within its group (0, 1, 2, 3…)
Preview each sound with the Play button
File → Save As → mychar.snd
Update your .DEF file: sound = mychar.snd
MUGEN only accepts WAV format. If your sounds are MP3 or OGG, convert them first in Audacity (File → Export → Export as WAV).
Sound Workshop Step 5 of 5
Triggering Sounds in Your .CNS
Sounds don't play automatically — you need a PlaySnd controller inside your attack states in the .CNS file.
; Play a grunt when the punch starts[State 200, Attack Grunt]type = PlaySnd
trigger1 = AnimElem = 1 ; frame 1 = wind-upvalue = 1, 0 ; Group 1, Sound 0; Play impact when fist connects[State 200, Hit Sound]type = PlaySnd
trigger1 = AnimElem = 2 ; frame 2 = hit framevalue = 0, 0 ; Group 0, Sound 0channel = 1 ; separate audio channel
Channels: Use different channel numbers so sounds play simultaneously (grunt + impact together). Same channel = previous sound stops.
Workshop activity (30 minutes):
Record 3 voice sounds: a quick grunt, a shout, and a win celebration
Find 3 impact sounds on Freesound.org: a light hit, a heavy hit, and a block
Trim, normalise, and export all 6 as WAV
Pack into .SND in Fighter Factory 3
Add at least 2 PlaySnd controllers to your .CNS
Test in MUGEN do they play at the right moments?
📦 Downloads
Everything Free to Download
Guides, cheat sheets, project briefs, a quiz, screen pack & sound design workshops, and the Dungeon Arena .DEF template. All free no sign-up needed.
📊PPTX Slides
MUGEN Beginner's Guide
9-slide presentation covering sprites, SFF packing, file structure, and importing into MUGEN. Great for teaching sessions.
Use these free browser tools alongside this workshop to create custom sprites, sounds, levels and colour schemes for your game. No installs. Free forever.