Video + Audio Conversion Tool [Showcase]

Arcade Show & Tell
1

:clapper_board::musical_note: Video + Audio Converter for MakeCode Arcade

Hey everyone!

I’ve built a browser-based tool that converts videos AND audio into MakeCode Arcade format. Drop in a video clip, and get ready-to-paste code with both the frames and polyphonic audio!

Great for:

  1. Recording your own audio and getting it into MakeCode Arcade
  2. Creating your own video cutscenes
  3. Record your own videos and audio and get them into MakeCode Arcade!
  4. Using video clips with their real audio

Not great for:

  1. Projects intended to be flashed on a device like a Meowbit as the files will be too big.

:link: Try it here: LINK

:laptop: Demo Project:

arcade-Video-and-Audio-Converter
arcade-Video-and-Audio-Converter512×424 58.5 KB

What it does

Video → MakeCode Frames

  • Converts to MakeCode’s 16-color palette

  • Three dithering modes (Floyd-Steinberg works great!)

  • Handles aspect ratio conversion (16:9 YouTube → 4:3 Arcade)

  • Configurable FPS and dimensions

Audio → Polyphonic Sound

  • Uses spectrogram analysis with 20 frequency bands

  • Outputs code using queuePlayInstructions()

  • Actually sounds like the original audio (not just beeps!)

  • Works with video audio tracks OR standalone MP3/WAV files

Flexible Workflow

  • Video + Audio: Full conversion with synchronized playback code

  • Audio-only from video: Skip the frames, just get the audio

  • Export as WAV: Extract audio clips from videos

  • Direct audio upload: Convert MP3/WAV/OGG files directly

Quick Demo

  1. Open the tool

  2. Drag & drop a short video clip (under 10 seconds works best)

  3. Adjust settings if needed

  4. Click Convert

  5. Copy the code into MakeCode (under the Javascript editor)!

Tips

  • Keep clips short — 5-10 seconds is the sweet spot for memory and processing

  • Floyd-Steinberg dithering gives the best results for most videos

  • Increase gain if your audio sounds too quiet in MakeCode

Credits

The audio spectrogram approach was inspired by HomeAssistantTycoon’s Audio-to-MakeCode-Arcade project, forked from @UnsignedArduino . I wrapped it into a browser-based tool with video support and a bunch of extra features.

Feedback Welcome!

This is my first release, so let me know if you run into any issues or have ideas for improvements. Would love to see what you create with it!

The source code is on GitHub: HERE

Happy converting! :video_game:

13 Likes
2

This is a great compilation of tools!! :smiley:

7 Likes
4

WOW, instant bookmark! I can’t believe this! Now I can finally make off brand YT on makecode!!

5 Likes
5

You would not believe how long I’ve been waiting for this.

3 Likes
6

This is awesome. Of course it glitches my workspace with the big code for longer videos, but i gotta say:

IMG_0530
IMG_0530600×450 54.1 KB

3 Likes
7

wach this! https://arcade.makecode.com/S28941-84717-25861-22807

4 Likes
8

this is sick!!!

4 Likes
9

That’s awesome! Now you’ve got an array of the frames into the editor, you could always do something like: record the ball bounce, cut the ball out from each of the frames by tidying them up or resizing them, and then have it as a sprite-kind over the top of your game. Maybe a giant tennis ball comes crashing through Makecode arcade’s pixel town?

Have a play around with some of the features like this one when you convert your video, and the other dithering tools there too:

image

4 Likes
10

Enable dithering:

image

Results much good-er :stuck_out_tongue:

5 Likes
11
2 Likes
12

you should add ostromoukhov dithering

2 Likes