GameBox Clicker: Build a Modular Magnet Key Game Console (Arduino)

by wjddnjsdnd in Workshop > Laser Cutting

157 Views, 2 Favorites, 0 Comments

GameBox Clicker: Build a Modular Magnet Key Game Console (Arduino)

20260110_110102.jpg
20260110_110047.jpg

GameBox Clicker is a small DIY game console built around a 2×3 fidget clicker.

This project is a follow-up to my previous 2×2 Fidget Clicker project.

While the first project focused on creating a tactile button device,

GameBox Clicker takes that idea one step further—turning the clicker into a real game controller.

The concept is very simple:

  1. Use a 2×3 fidget clicker as physical keys
  2. Connect it to a small OLED display
  3. Play three classic mini games on a tiny, handmade console

Currently, the console includes:

  1. Pong
  2. Snake
  3. Stair Game (inspired by the mobile game Infinite Stairs, but simplified)

Why I Made This

This project is not about powerful hardware or complex graphics.

Instead, it explores:

  1. How far we can go with very limited input
  2. How simple buttons can still create fun gameplay
  3. How small DIY projects can grow into new ideas

The games are intentionally simple.

The hardware is intentionally minimal.

My hope is that:

Someone will see this project
and build something even better, different, or unexpected from it.

What’s Next?

You can:

  1. Add more games
  2. Change the button layout
  3. Improve graphics or sound
  4. Design a completely new enclosure

This project is meant to be remixed.

Supplies

20260109_222416.jpg
20260110_113820.jpg

This project uses simple and affordable components.

Most parts are easy to find online or can be replaced with similar alternatives.

Housing & Mechanical Parts

  1. 5mm EVA Foam Sheet
  2. Small Hinges × 2
  3. (Used to open and close the GameBox)
  4. Neodymium Magnets (1 × 2 mm) × 30
  5. (For magnetic key mechanism)
  6. Gold Eyelets × 2
  7. (Decorative + functional detail)
  8. Keyring Chain × 1

Input (Keys)

  1. Magnetic Shaft Keys × 6
  2. Keycaps × 6
  3. A3144 (A3114) Hall Sensors × 6

Electronics

  1. Arduino Nano × 1
  2. OLED Display (SSD1306, I2C) × 1
  3. TP4056 Li-ion Charging Module (with protection circuit) × 1
  4. MT3608 DC-DC Step-Up Converter (2A) × 1
  5. 3.7V Li-ion Battery 380mAh × 1

Miscellaneous

  1. Coil Copper Wire0.1mm
  2. Solder & soldering tools
  3. Glue (hot glue or foam-safe adhesive)
  4. Cutter / hobby knife

Laser Cutting the EVA Foam Layers

20260116_154643.jpg
20260116_155949.jpg
20260109_185732.jpg

In this step, all enclosure parts are prepared by laser cutting EVA foam sheets.

Each layer is provided as a separate SVG file.

All engraving files are designed to be used after cutting, without removing the part from the laser bed.

🔹 plate00.svg – Bottom Plate

  1. This is the bottom layer of the enclosure.
  2. Material: 2mm PVC foam board (Forex / Foamex)
  3. Can be:
  4. laser cut
  5. or manually cut with a knife

🔹 plate01.svg – Layer 1 & 2

  1. This file contains Layer 1 and Layer 2 together.
  2. First, cut the shape normally.
  3. Then, without moving the material, reduce the laser power and engrave:
  4. plate01_wire.svg

This engraving is used as a wire routing guide.

🔹 plate03.svg – Electronics Cover Layer

  1. This layer covers the electronic components.
  2. First, cut the shape using plate03.svg.
  3. Then, without removing it from the laser bed, engrave:
  4. plate03_text.svg

This adds labels(GameBox Clicker).

🔹 sensor_cover_screen.svg – Hall Sensor Cover Door

  1. This file creates a small door covering the Hall sensors.
  2. First, cut the shape.
  3. Then engrave:
  4. sensor_cover_screen_groove.svg

⚠️ The engraved area indicates a recessed groove.

This groove is necessary to mount the OLED display properly.

🔹 6clicker_holder.svg – Magnetic Key Housing

  1. This file is used to make the housing for the magnetic-axis keys.

🔹 6clicker_holder_holder_double.svg – Key Housing Support

  1. This is the outer support frame that holds the key housings together.

✅ Notes

  1. Laser settings will vary depending on your machine and foam type, so test on scrap material first.


Build the Charging & Power System

chargesys.png
20260109_230017.jpg

In this step, we build a compact charging and power system that provides 5V output and allows easy charging through a Type C Cable .

🔹 Components Used

  1. 3.7V Li-Po battery
  2. TP4056 lithium battery charging module (with protection)
  3. MT3608 DC-DC boost converter

🔹 Wiring Overview

  1. The 3.7V battery is connected to the TP4056 for charging and protection.
  2. The output of the TP4056 is connected to the MT3608 boost module.
  3. The MT3608 is adjusted to output 5V, which powers the entire system.

🔹 Assembly Tips

  1. The battery and TP4056 module can be fixed in place using a hot glue gun.
  2. This keeps the parts secure without adding screws or brackets.
  3. Make sure the MT3608 trim potentiometer is adjusted before final assembly.

🔹 Important Check

⚠️ Do not skip this step

Before moving on:

  1. Use a multimeter to verify:
  2. the battery is charging correctly
  3. the MT3608 output is stable at 5V

Confirming both charging and 5V output now will prevent problems later.

✅ Result

After this step, you will have:

  1. a rechargeable 3.7V battery system
  2. safe charging via TP4056
  3. stable 5V output for the Arduino and OLED


Wiring & Hall Sensor Installation

20260109_224045.jpg
20260109_224440.jpg
20260109_224650.jpg
20260109_225853.jpg
20260109_225905.jpg
20260109_230546.jpg
20260109_232800.jpg
20260109_232812.jpg
20260109_232821.jpg

In this step, we begin the main wiring process and install the A3144 Hall sensors.

Because magnetic strength varies depending on the magnetic key used, and

A3144 sensors also differ slightly in sensing distance, this part requires manual adjustment.

Unfortunately, this is unavoidable when working with non-standardized components.

🔹 Preparing the A3144 Sensor

Before soldering:

  1. Bend the legs of the A3144 by 90 degrees
  2. Make sure the wide flat face of the sensor is facing upward

This orientation is important for:

  1. correct magnetic sensing direction
  2. proper alignment with the magnetic key


🔹 Soldering the A3144 (SOT-23)

  1. The A3144 Hall sensor is soldered directly onto a SOT-23 breakout footprint.
  2. The sensor must be positioned so it can move slightly up and down before being fixed.
  3. This allows fine adjustment of the sensing distance.

Installation Method

  1. Place Layer 1 on a hard, flat surface.
  2. Position the SOT-23 board at the top side of Layer 1.
  3. Insert the A3144 sensor from above and push it down until it touches the surface below.
  4. While holding it in position, solder the sensor in place.

This ensures a consistent reference height for all sensors.

🔹 Wiring

  1. Use 1mm coil wire for all required connections.
  2. Thin, flexible wire is essential due to the limited space inside the enclosure.
  3. Take care to keep wires short and clean to avoid interference with the moving parts.

Assemble the Keys and Key Housings

20260110_081534.jpg
20260110_081544.jpg
20260110_081634.jpg
20260110_081713.jpg
20260110_081731.jpg

In this step, we assemble the magnetic keys and their housings.

These keys must be assembled before sensor testing.

🔹 Key Housing Structure

  1. Each key housing consists of two separate layers.
  2. Refer to the provided image to understand the orientation and alignment.

🔹 Assembly Instructions

  1. Align the two housing layers carefully.
  2. Fix them together using double-sided tape.
  3. Make sure the inner space remains clean so the key can move smoothly.

🔹 Quantity

  1. You will need to assemble 6 key housings in total.

✅ Result

After this step:

  1. All key housings are ready
  2. You can proceed to sensor testing and fine adjustment


Sensor Adjustment and Final Fixing (Most Important Step)

20260110_083020.jpg
20260110_083329.jpg
20260110_083342.jpg
20260110_083413.jpg
20260110_085802.jpg
wire.jpg

This is the most critical step of the entire project.

Here, we adjust the Hall sensor positions and fix them permanently in the correct place.

🔹 Why This Step Is Necessary

  1. Hall sensors are installed on Layer 1
  2. Normally, Layer 2 would be placed on top before testing
  3. However, once Layer 2 is installed, it becomes very difficult to move the sensor PCB up or down

To solve this, we use a temporary test setup.

🔹 Temporary Test Setup

  1. Temporarily attach one extra layer to the key housing
  2. This simulates the exact height and distance as if Layer 2 were already installed
  3. This allows accurate testing before final assembly

This method produces the same result as testing with Layer 2 installed, but keeps the sensors adjustable.

🔹 Upload the Test Code

Before testing:

  1. Upload a simple Arduino test sketch
  2. When the power switch is ON:
  3. one red LED turns on
  4. When a Hall sensor is triggered:
  5. LED on pin 13 turns ON
  6. When the sensor is released:
  7. LED on pin 13 turns OFF

(The code itself is simple and not covered here.)

🔹 Common Test Results & How to Fix Them

During testing, you may see one of these behaviors:

1️⃣ LED turns ON just by placing the key housing

➡️ The sensor is too high

  1. Gently push the sensor PCB (SOT-23) downward
  2. Test again
  3. The LED should no longer turn on just by placing the housing

2️⃣ LED turns ON when pressed, but stays ON after release

➡️ The sensor is still slightly too high

  1. Lower the sensor PCB a little more
  2. Test again

3️⃣ LED never turns ON, even when pressed

➡️ The sensor is too low (this is rare)

This usually happens if:

  1. the sensor legs were not bent exactly 90°
  2. the PCB was not positioned correctly at the top of Layer 1

🔹 Correct Adjustment Goal

✅ The correct position is when:

  1. the LED turns ON when the key is pressed about halfway
  2. the LED turns OFF again at the same halfway position when released

Take your time here.

This adjustment defines the feel and reliability of the keys.

🔹 Final Fixing

Once the sensor position is correct:

  1. Flip Layer 1 upside down
  2. Apply a small amount of strong adhesive where:
  3. the PCB
  4. and the EVA foam
  5. are in contact
  6. Let it cure completely

After this step, the sensor position is permanently fixed.

✅ Result

  1. Sensors are perfectly aligned
  2. Key response is consistent
  3. The system is ready for final assembly


OLED Installation

20260110_100502.jpg
20260110_100516.jpg
20260110_101031.jpg
20260110_102107.jpg
20260110_102132.jpg
wire_oled.jpg
20260116_154747.jpg

In this step, we install the OLED display and prepare the system for the final firmware upload.

🔹 Preparing the OLED

  1. Use 0.1mm coil wire for all OLED connections.
  2. The OLED must have all header pins removed.
  3. The pins add thickness and prevent proper installation inside the enclosure.
  4. Carefully desolder or cut the pins before wiring.

🔹 Wiring the OLED

  1. Prepare four wires, each approximately 10 cm long.
  2. Solder the wires directly to the OLED pads.
  3. Refer to the provided image for the correct pin connections.

Leave some slack in the wires so the OLED can move freely with the cover.

🔹 Final Code Upload

After wiring is complete:

  1. Upload the final Arduino code.
  2. Turn the power switch ON.

🔹 Success Check

✅ If everything is correct:

  1. The OLED screen will display the startup screen shown in the image
  2. The system is now fully operational

If the screen does not turn on:

  1. recheck wiring
  2. confirm 5V output
  3. verify I2C connections


Final Assembly

20260110_102243.jpg
20260110_102335.jpg
20260110_102639.jpg
20260110_102835.jpg
20260110_103432.jpg
20260110_103446.jpg
20260110_103848.jpg
20260110_104631.jpg
20260110_105223.jpg
20260110_105236.jpg
20260110_110009.jpg
20260110_110047.jpg

In this step, we assemble all layers and complete the physical build of the GameBox Clicker.

🔹 Layer Assembly (Using Double-Sided Tape)

  1. Do NOT use glue to assemble the layers.
  2. Use thin double-sided tape instead.

Why?

Because this allows the device to be disassembled later for repair or modification.

If you’ve ever disassembled a smartphone, you’ll recognize this method:

  1. very thin double-sided tape
  2. strong enough to hold
  3. but still removable

Assembly Tips

  1. Align the outlines carefully.
  2. Do it slowly.
  3. You can peel and reattach the layers multiple times until everything fits perfectly.
  4. Use your own judgment for tape placement, based on the reference images.

🔹 Installing the Magnets

  1. Use 1 × 2 mm neodymium magnets.
  2. Each EVA foam layer is 5 mm thick, so:
  3. stack 5 magnets per hole
  4. Make sure the polarity is consistent across all keys.

Fixing the Magnets

  1. Insert the stacked magnets into the holes.
  2. Apply a small amount of strong adhesive only to the visible magnet.
  3. No need to glue the entire stack.

🔹 Covering the Exposed Sensors

The Hall sensors are still visible from the outside.

To finish the look:

  1. Use black plastic straws (6 mm diameter).
  2. Cut them into 5 mm long pieces.
  3. Prepare 6 pieces in total.

Insert each piece into the sensor holes.

  1. Gluing is optional
  2. Avoid glue if possible:
  3. glue can look messy
  4. The holes were designed slightly tight, so:
  5. friction alone is usually enough to hold them in place

🔹 For the remaining parts

please refer to the images.

Visual reference is the best guide for this step.

Tinkercad & Web Simulation

In this step, I’d like to introduce two ways to explore and experience the GameBox Clicker digitally.

🔹 Tinkercad Project

You can view the full Tinkercad project here:

👉 Tinkercad link

https://www.tinkercad.com/things/55P5W52bIUp-gameboxclicker

Tinkercad is widely accessible, so you can inspect the overall structure and components easily.

🔹 Web Simulation (Three.js)

I also created a web-based simulation of the GameBox Clicker:

👉 Simulation page

https://stringphoto.kr/indexgameboxmaking.html

This simulation was built using three.js and represents the GameBox Clicker in 3D.

How to use the simulation

  1. Press the Space bar to open the lid
  2. The key box will move into the correct position
  3. The key layout matches the real device exactly, so you can practice before building

🎮 Game Controls Overview

The w,s keys are used to select games.

Menu

  1. Game selection is done using the q key

Pong (2-player game)

  1. This is a two-player Pong game
  2. Controls:
  3. Left paddle: q & a keys
  4. Right paddle: e & d keys
  5. As rallies continue:
  6. paddle size decreases
  7. ball size decreases
  8. ball speed increases
  9. Final stage:
  10. paddle size: 2 pixels
  11. ball size: 1 pixel
  12. Very challenging!
  13. Return to menu:
  14. s key

Snake

  1. Arrow-shaped keys(w,a,s,d) control movement
  2. Return to menu:
  3. e key

Stair

  1. a key: change direction
  2. d key: climb
  3. Return to menu:
  4. s key

⚠️ Each game uses a different key layout, just like a real arcade device.

💬 Leave a Comment

There is a guestbook on my website:

👉 https://stringphoto.kr

If you leave a comment about GameBox Clicker, I would really appreciate it!