Makecode Arcade Cabinet
Build Instructions
Project Description
Welcome! This is an instructions deck on how to build your very own arcade cabinet with youth using three layered cardboard called Triwall and off the shelf arcade components. Triwall is very forgiving material for novice builders and supports project access for younger makers.
The arcade uses a Raspberry Pi Zero with a custom operating system compatible with the Arcade Makecode Editor. To learn more about the set up visit these helpful links:
Custom games are then made on the Makecode editor. This web based platform supports block based coding which may be familiar to those already familiar with Scratch. The editor also requires no software installation and can run offline after the initial page loading.
This project is a great way to introduce physical computing and computer science in an engaging and constructivist way.
Please reach out to loreto@zeroday.camp with any questions or suggested edits.
Process Overview
Creating Custom Games
Games are created using the web based Makecode Arcade editor and loaded onto the Raspberry Pi using the available USB port.
Cabinet Construction
The cabinet is designed using Triwall cardboard and construction methods using wooden dowels/ 3D printed nails, glue, and hot glue.
Completed cabinets can be painted and designed as desired with finished projects being coated with a varnish for durability.
Hardware Preparation
The firmware is downloaded and installed on an SD card with is then loaded into the Raspberry Pi Zero processing board.
The joystick and buttons are then wired into the header pins on the board along with the monitor.
Cabinet Construction
Safety Notice!
This project utilizes cardboard carpentry techniques using three ply cardboard called Triwall. Although it is more user friendly than wooden carpentry, it does require the use of sharp and hot tools.
Ensure that participants are closely supervised during tool use and that you review safety principles prior to building.
Construction Overview
The cabinet is custom built around the dimensions of the monitor available to you.
Depending on the cutting accuracy of your participants, you may want to measure and cut as you construct and NOT follow the provided measurements.
A 3D model of the cabinet construction is available at this link for exploration. Please note the model is NOT to scale.
Screenshot of the Fusion360 webpage for the arcade cabinet
Notes on materials and tools
Rendering of 3D printed nail
Cardboard Carpentry Construction Steps
Apply hot glue
1
Push Together
2
Pierce Hole
3
*Make sure you go through both cardboard pieces
Squeeze Glue
4
*Continue squeezing until it oozes through the flutes
Hammer Nail
5
Equipment Needed:
Cardboard Construction Edging and Finishing Steps
Apply liquid glue
1
Spread glue
2
Wrap edges
3
Snip and fold
4
Water seal
6
Paint
5
Equipment Needed:
Print and tape side panel pattern
1
Download and print the side panel pattern on 4A paper size.*
Lightly tape the paper to match overlapping lines.
Once correct placement is established, reinforce the seams with additional tape.
Cut and Trace
2
Cut the pattern following the outer lines of the pattern.
Trace 2 sides of the pattern onto the Triwall ensuring it is orientated with the top and bottom along the flutes of the cardboard for durability.
Measure, Cut, and Connect Bottom Front Panel
3
Measure the width of the monitor you will be using and add about 2” of padding to each side.
This will be the width measurements to be used throughout the instructions.
Cut the bottom front panel as follows:
Width x 4.75”
Using the construction steps, connect the sides and bottom front panels.
Measure, Cut, and Connect Top Front (Marquee) Panel
3
Measure and cut the top front panel as follows:
Width x 4.75”
Using construction steps, insert and attach the panel as shown in the illustration here.
Measure, Cut, and Connect Top Panel
3
Measure and cut the top panel as follows:
Width x 6.5”
Using construction steps, insert and attach the panel as shown in the illustration here.
Prepare the monitor panel frame
3
Measure and cut the monitor front panel following the diagram here.
You will need to trace the outline of the monitor into the panel.
width
17”
Center and trace the monitor on the panel at about 3” up from the bottom
~3”
Measure and cut out the monitor opening allowing for coverage of any of the monitor’s frame.
Attach the Top and Bottom Monitor Holders
3
Use the cut portion of the monitor frame to build the holders.
Cut and attach two pieces for the top and bottom. The height of the pieces should be:
depth of monitor + ¾”
*Ensure the monitor’s snug fit between the panels.
Attach the Back Monitor Holders
3
Cut and attach the back of the monitor holders.
The length of these panels will depend on the layout on the back of your monitor. Attempt to make these as long as possible.
Ensure access to the power cable and any other connectors and buttons.
Insert and Attach the Monitor Panel
3
Insert and attach the monitor panel into the cabinet. Tilt to the desired visual angle.
Ensure that you have ample room for the joystick and buttons at the front.
*Monitor is inserted here.
Layout and Cut the Button and Joystick Holes
3
Using a pencil and cardboard cutout circles of arcade button (28mm) and joystick diameter (9mm), layout the locations of the following buttons:
You may want to use a router drill bit to create the holes.
Measure, Cut, and Attach the Back Panel
3
The back panel may be fashioned after completing the wiring process and ensuring the monitor and USB connections are operational.
A hole may be drilled or cut to allow access to the power and USB cables.
The panel dimensions should be:
Width x 21 ½”
[Optional] Measure, Cut, and Attach the Bottom Panel
3
This panel is optional as it will eliminate access to the components if any modifications are needed.
The panel should measure:
Width + 1” x 17 ¾”
Hardware Preparation
Materials List
Materials needed for most minimal layout for one player and menu + exit buttons
3
1
2
4
5
6
7
8
9
*Not compatible with RPi 2
Hardware Setup Notes
Prepare SD Card and Install the OS
1
1. Erase the SD card using FAT32 (Windows) or MS-DOS (Mac) formatting.
2. Download and unzip the Makecode Arcade Firmware from the Adafruit website. Select the “arcade-cardboard.zip” option.
3. Select and drag all the files in the folder into the formatted SD card.
Insert the SD Card
2
Gently insert the formatted SD card into the slot on the Raspberry Pi.
Do not force it! If the card doesn’t slide in, you may need to flip it over.
Insert the HDMI Adapter and HDMI cable
3
1. Insert the HDMI adapter into the available slot on the Raspberry Pi
2. Insert the standard HDMI cable connecting the monitor.
Connect the power cable
3
1. Insert the Micro USB power cable into the slot labelled “PWR”.*
2. Plug in the power cord to an outlet and you should view a bootup sequence appear on the attached monitor.
*The second slot is reserved for data transfer. We will be using it to transfer games to the cabinet.
Simple Circuit with a Switch
*
We will be connecting a set of switches to each pin on the Raspberry Pi that corresponds to an event such as button A pressed, joystick up, etc.
Each button will need to be connected to a ground and input pin. When the button is pressed, the circuit is closed as is illustrated in the animation here.
Sample wiring for player 1 button A. Please note wire colors do not impact functionality.
Pin Connection Overview
4
When powering up the RPi for the first time, you should see this configuration screen.
The GPIO pins on the RPi correspond to each of the buttons on the arcade which follow the arcade.cfg file. Settings can be changed if desired.
Up to 4 player joysticks may be added. Each player has an A [A] and B [B] button along with Left [L], Up [U], Right [R], Down [D] joystick motions.
ground pins
voltage pins
Caution: Do not allow wires from the ground and voltage pins to cross
Wiring Diagram for 2 Players
*
GND
IN
GND
L
R
D
U
GND
L
R
D
U
GND
IN
GND
IN
GND
IN
GND
IN
GND
IN
GND
IN
Player 1 Ground Hub
A
B
A
B
Reset
Exit
Menu
Operations Ground Hub
Player 2 Ground Hub
Button Overview
5
The arcade buttons have two legs with one corresponding to the signal (NO for normally open) and the other ground (COM for common).
The circuit in this button remain open until the top button is depressed to close and complete the circuit, sending a signal to the RPi.
The button is then inserted into the arcade button housing (see video).
Stripping a wire
5
Because we have a limited number of ground pin, you will need to strip some of the header wires to create a grounding hub.
Using wire strippers, you will need to cut and strip one of the ends of the ground connections.
Connecting a button
7
Following the Pin Connection Overview diagram, to connect Button A:
1. Insert the male end of the jumper wire to the button wire connected to NO.
2. The female end will connect to the corresponding pin on the RPi.
3. For the COM wire, cut a male/ male jumper wire in half and strip the end. Insert the male end into the COM wire.
Repeat this step of each button (A, B, Reset, Menu).
1
2
3
Join the Ground wires and connect to the RPi (1 of 2)
8
1. Twist all the Ground/COM wires from each button together.
2. Cut and strip a female end of a jumper cable.
1
2
Join the Ground wires and connect to the RPi (2 of 2)
8
1. Twist the additional female wire with the COM bundle
2. Connect the female end to any of the ground pin on the RPi.
Note: If you are familiar with soldering, this is a great place to do so. Otherwise, be sure to wrap the bundle tightly with electrical tape.
1
2
Joystick Overview
6
The joystick combines 4 buttons into one housing with each button activated as the joystick is tilted.
The output on the joystick has 5 pins. Four correspond the signal leg of the button and 1 to the ground.
The orientation of the joystick will not matter until you begin to connect them to the RPi.
GND
L
R
L
R
D
D
U
U
Connect the Joystick Wiring
9
1. Using female/ female jumper wires, insert one end to the joystick.
2. Connect the wires that correspond to each joystick button the the desired pin indicated in the Pin Connection Overview.* Test the connections by moving the joystick to ensure proper wiring.
*Ensure that the GND pins between the joystick and RPi are correctly connected otherwise the joystick will not activate in any direction.
GND
L
R
D
U
Complete the Initial Configuration
10
Once you established proper wiring of your A, B, Reset, Menu, and joystick:
Press in sequence
ABABAB
This will bring you to the main arcade menu with some of the prebuilt games ready to go.
You are now ready to build and port your own games.
Fasten with Electrical Tape
11
Wrap each joint from the buttons and joystick with electrical tape to decrease the likelihood of detached wiring.
You may also hot glue the connections into place being careful not to damage the wiring.
Troubleshooting
Game Development
Overview & Equipment Needed
Equipment Needed:
Code your game using Makecode Arcade web editor.
Download the game on your computer.
Transfer the game to the Raspberry Pi.
Connect the Micro USB cable
1
Connect the Micro USB cable to the inner port on the board.
Connect the other end to your computer’s USB port.
The arcade should then appear as a mounted drive on your computer.
*Be sure you are using a data cable! USB cables that are charging only cannot be distinguished from data cables.
Create a simple test game
2
Navigate to the Makecode Arcade website to create a simple project that tests the button presses, joystick movements, and audio functionality.
Alternatively, open and download this Button Tester project.
Download the game to your computer
2
Click the “Download” button on the Makecode IDE (Integrated Development Environment).
Once downloaded, click the Done button to close the confirmation window.
a.
b.
Click and drag the file to the arcade
3
Navigate to the location of the downloaded file. It will have a .uf2 extension.
Select and drag the file into the “Projects” folder within the arcade drive.
Confirm the file transfer and test
4
On your arcade, navigate through the games menu. Your new game should now be visible.
Click “A” to initiate the game and test out the buttons and joystick controls.
Customizing the Main Menu
5
Video on how to remove the animation in the main menu and customize the logo
Needed Links
Open:
https://arcade.makecode.com/beta
Import:
https://github.com/microsoft/pxt-arcade-cabinet-menu
Accessible Gaming
Adding Switch Access to the Arcade
Users with physical disabilities may not be able to use the joystick and buttons as they are.
The arcade can be modified to add audio jacks that connect to each switch.
This will allow the player to plug in their own custom switch for game play while maintaining the original access method.
Front of arcade cabinet with jack inputs and accessibility switch that plugs into the jack.
Wiring Diagram for Adding Jacks for Switch Access
*
GND
IN
GND
L
R
D
U
GND
IN
GND
IN
GND
IN
GND
IN
Player 1 Ground Hub
A
B
Reset
Exit
Menu
Operations Ground Hub
Up
Down
Right
Left
This project was made in collaboration with the Brooklyn Public Library as part of its Incubator project pairing librarians with community partners.
Zero Day Camp (EIN: 81-4645962) is a Brooklyn based computer programming and robotics non-profit working to improve youth critical media literacy through direct services as well as development of instructional materials and tools. Learn more at https://zeroday.camp.
This work © 2024 by Zero Day Camp is licensed under Attribution-ShareAlike 4.0 International