Welcome to the second installment of my code experiments! This time we’re gonna look into the weird effect used in the background of messages in Ecco the Dolphin for the Sega Genesis (or MegaDrive, if you’re asking someone outside the Americas). I got the idea from Twitter user @Foone who helpfully reverse engineered the game ROM (with Twitter user @Reaper_man02) to figure out how it works and wrote an implementation in Python. Then I went ahead and adapted it in p5.js.
Read the replies for some explanations.
it won't look great here (THANKS, TWITTER)— foone (@Foone) November 27, 2019
but I've finished reverse engineering the Ecco the Dolphin background distortion effect.
This is the output of the script provided here:https://t.co/oPUb3tJJAC pic.twitter.com/UQtW4ZyTKu
Turns out it’s pretty simple: there’s a table in ROM, it’s basically how much each line should be shifted in the x axis. Then for each frame we shift the values around so it looks like it’s scrolling.
p5.js code for the above canvas, part 1
This function basically computes a table of offsets for the current frame by adding the line number with the frame number, mod 256. Then a bit of initialization code:
p5.js code for the above canvas, part 2
And now this is where it gets interesting. For each line we call the
image function which crops a 320x1 portion of the image with the appropriate x offset we calculated earlier. Note that the original image is 384x224.
p5.js code for the above canvas, part 3
We can also completely forego the
generate_for_offsets function and make it simpler:
p5.js code for the above canvas, version 2
Now that huge array is a bit unwieldy, maybe you can compress it? Sure thing.
Let’s transform that stupid array into something better
p5.js code for the above canvas, version 3
From there, there’s a lot of tricks to compress your code so it goes a bit faster. With that much code, we went from something that looks complex into something simple, which is pretty cool. Well, that’s all for today, hope you learned a bit with that :)
All content owned by their respective owners: game, data and assets by Novotrade International, code by Foone and adapted by myself licenced under GPL3.