GARY'S WORKBENCH · WEBSITE-TO-CNC TEST
From Website Design to CNC: A Custom Arcade Test Panel
I wanted to put my arcade panel designer through a real test: design a custom panel on the website, cut the wood and plexiglass on my CNC, and see how closely the finished parts matched the previews. Everything came together exactly as I'd hoped.
This was my own test arcade panel, not a customer order. I was testing the journey from website design to cut parts, rather than building a wired, playable controller.
01 / Choices for this test panel
I designed this panel directly in the Gary's Hobbies arcade panel designer. I put a start button at the upper-left, a six-key Stream Deck-style opening at the upper-right, a joystick position at the lower-left, and a six-button action bank at the lower-right.
That's the useful thing about a custom panel: my outline, control positions and openings all belong to one design. I don't have to draw each material layer separately. In my layout screenshot, you can see the clearance overlays around the controls, which help show how much room each one needs.
For this test, I CNC-cut 3/4-inch wood, including the underside relief pockets, and a separate clear plexiglass layer. Here's how I set up this particular panel:
- Single-player controls: I chose one joystick position at lower-left, with six action buttons in two curved, staggered rows at lower-right. My separate P1 start sits at upper-left.
- A six-key area: I used a three-column, two-row Stream Deck-style arrangement at upper-right. I'll call it a six-key opening here, since the exact device model hasn't been confirmed.
- A shaped outline: I went with rounded front corners, rather than rounding every corner alike. You can follow that outline from my layout through to the cut wood.
- Two chosen materials: I used a 3/4-inch plywood layer underneath a clear plexiglass top.
- Layer-specific cuts: My wood has one full rectangular opening behind six individual square plexiglass key apertures, plus a shared scalloped underside relief pocket around the action buttons and a circular start-button recess. I've paired the previews with the actual parts below so you can compare them.
This is just the configuration I chose for my test, not a fixed template or a limit of the designer. You can choose custom sizing and symmetric outlines, independently placed joystick and button groups, start/coin buttons, spinners, trackballs, and rectangle, rounded-rectangle, circle, triangle or hexagon custom openings. I've covered the wider designer options below too, including positioning, materials and fabrication review. There's plenty of room to make a panel for your own arcade project.
02 / The wood, from the player's side
The Wood / Top Side preview shows my outline and the openings that go right through the panel. Beside it is the plywood I cut on my CNC: the start and joystick openings, six action-button holes, and the rectangular opening behind the six-key area. That's the player's side of the panel—but there's more going on underneath.
03 / The clearance is underneath
Turn my panel over and you can see the shared, scalloped relief pocket around the action buttons, rather than six isolated recesses. There's also a circular recess around the start-button opening. Both appear in the bottom preview and in the wood I cut.
These relief pockets remove material only where it's needed underneath. That can give component bodies and retaining hardware more room, or reduce the thickness they mount through, while keeping the player-facing surface intact around the openings. It's a useful detail when you're working with a thicker wood panel like mine.
Why does my bottom preview look reversed? It's showing the wood with its underside facing up. Left and right swap compared with the top view: my rectangular opening moves to the left and the start recess to the right. The website's wood machining output uses this bottom-side-up orientation, with the X mirror applied once and Y unchanged. The file is already set up that way, so don't mirror it again in CAM.
04 / Same panel, different plexiglass geometry
My clear top layer needs different cuts from the wood. I have one rectangular opening behind the six-key device area; the plexiglass has six individual rounded square apertures. Each layer does its own job within the same panel.
You can see that difference in my preview and in the clear part on the bench. The outside outline and circular control positions match the wood, while the key area keeps its own plexiglass geometry.
05 / Two layers, one aligned result
The Combined / Assembled preview brings my design back together: plexiglass over wood, circular openings lined up, and six key apertures above the wood's larger rectangular cutout. Beside it, you can see my finished layers aligned on the bench. Everything worked perfectly for this test—the website layout, the material previews and the CNC-cut parts came together exactly as I'd hoped.
CHECKING THE MATH, NOT JUST THE PICTURE
The checks behind the designer
Matching parts on my bench are one part of the story. The checks behind the designer also look at how measurements, positions and material openings become actual cutting lines. Here's how those safeguards help keep the design consistent from the screen to the file.
- One measurement system
- My design has one set of measurements underneath it: millimetres. Inch readouts use 25.4 mm per inch, so there isn't a second, separately rounded version of the panel. DXFs declare millimetres too. Automated checks cover conversions and exported hole coordinates. When you import a file into your machining software, check that those units are carried through.
- A layout that respects the panel
- When I add a control, my panel stays the size I chose. Placement checks consider safe edges, neighbouring components, relief pockets and the material left between openings. Tests cover rotation, two-group alignment, edge clearances and compact guided layouts. Where possible, the placement search finds room farther inward; otherwise the change is rejected rather than quietly making the panel bigger.
- Shared geometry, different layer jobs
- The material previews and fabrication DXFs share one geometry model—the same source for the cutting lines. That's why my layers can share an outside profile while keeping different openings. Tests cover six Mini key apertures in plexiglass against one body opening in wood, component-specific sizes and rotated cuts. Layout padding generally keeps space around a part without enlarging its hole; the spinner's physical cutout padding is checked separately.
- A deliberate underside transformation
- The reference corner is front-left, with Y increasing toward the rear. The designer converts screen positions into that system. For the single bottom-side-up wood setup, X′ = width − X and Y stays unchanged. Tests read the DXF positions back to check that this left-right mirror happens exactly once. That explains my reversed underside preview—and why the wood file shouldn't be mirrored again in CAM.
- Zoom is inspection, not scaling
- I can zoom in to inspect a detail without changing its size in the cutting file. Zoom and Fit only change the view. Tests compare the underlying SVG coordinates before and after magnification and a phone-sized resize, and check dragging at different zoom levels. A closer look still means the same-sized hole.
- Check the data before making a file
- Before a fabrication DXF can be made, the settings and geometry have to pass validation. For production orders, the design saved with the order must also be complete and match the requested stock. Tests check that missing geometry, malformed components and out-of-range sizes stop the file rather than being replaced with defaults. Valid saved geometry produces repeatable files.
Verified on October 10, 2026: As part of validating this workflow, 177 focused automated tests passed across nine test files covering unit readouts, fabrication geometry, per-component settings, frozen-order DXFs, alignment, relief placement, zoom and guided clearances. Those checks read actual DXF entities and their named layers, as well as checking the visual geometry.
What this successful test tells me: my cut wood and plexiglass aligned and everything worked perfectly. It's a successful workflow test, not a guarantee for every future cut: I didn't measure machine tolerances or verify installed hardware fit. Check your actual component dimensions, tooling, toolpaths and setup before machining.
BEYOND THIS BENCH TEST
Build the arcade panel your project needs
My test used a custom layout, wood top and underside previews, separate plexiglass geometry, and aligned CNC-cut layers. That's one way to use the designer. Here are the other choices you can explore for your own project.
Your outline. Your controls.
You don't have to follow my layout. Set your own panel width and depth, choose Rectangle, Vewlix or Pedestal Notch outlines, or edit a symmetric custom outline and corner rounding. Arrange independent joysticks and button banks, single start/coin buttons, spinners, trackballs and custom openings in rectangle, rounded rectangle, circle, triangle or hexagon shapes.
Stream Deck Mini is the currently certified option for new additions. Standard and XL are marked “Not certified — available upon request.” You'll find editable device and key-opening dimensions to compare with your own parts.
Place, inspect, refine.
Drag and rotate groups, edit positions and button spacing, center selections, and align two groups by their visual centers. Dimension overlays, panel-edge padding and component-clearance overlays make the layout easier to inspect. Safe-area and collision checks reject unsuitable placements instead of enlarging the panel for you.
Separate layout and fabrication zoom controls run from 50% to 400%, with Fit for the available screen. Magnification changes the view, not the cutting geometry. Layout clearance is not automatically a larger cutting hole; spinner cutout padding is a distinct control.
Start guided—or design directly.
The guided walkthrough collects panel size, game/control choices, stock thicknesses and which layers you'd like me to cut, then presents a review before creating the layout. Or use the custom designer directly. Requesting wood, plexiglass or both describes the cutting job; the two physical stock thicknesses still describe the assembled stack.
Current offered stock is Baltic Birch wood in 1/2-inch and 3/4-inch thicknesses, and plexiglass in 1/8-inch, 1/4-inch and 1/2-inch thicknesses. Those are the current stock choices for a cutting request; my test used the 3/4-inch plywood and clear plexiglass described above.
Review materials before cutting.
Switch between Plexiglass, Wood / Top Side, Wood / Bottom Side, and Combined / Assembled or Exploded views. The machining / x-ray overlay exposes underlying features. Component-specific material settings let you inspect the relevant openings and reliefs while the previews and fabrication DXFs draw from the same geometry model.
Alongside the assembled view I used here, you can explore an exploded view to see the layers apart, and read the generated setup notes as part of your cutting review.
Keep the design. Choose your next step.
Design and review for free. Work as a guest with a local browser draft. Export a re-importable JSON project file, download a clean or dimensioned PDF proof, and read or download setup notes. The free PDF proof is not a scale cutting template.
Save and share. Sign in to save designs to My Panels, reopen them later, and make a panel public for a read-only share link. Public sharing does not grant visitors editing or fabrication-download access.
Cut your own parts. Cut-ready downloads require sign-in, a saved panel and a one-time file purchase for that panel. The export menu includes separate wood and plexiglass DXFs, clean or dimensioned SVGs, and tiled 1:1 PDF templates in Letter, Tabloid, A4 and A3, with color or black-and-white options. Invalid fabrication geometry blocks fabrication DXFs. No subscription is required.
Ask me to cut it. Request a fabrication quote from your panel and select the requested layers and offered stock. Sign-in is required for a quote request; buying files is not a prerequisite to asking for a quote. Quote acceptance records approval, not payment. These are the options for your project; mine was my own workshop test.
Want me to cut yours? Here's how I make custom arcade control panels in wood and plexiglass.
More of your cabinet, made yours
If you're working on more of your cabinet, take a look at the screen-mask and bezel designer, custom arcade plexiglass, or request a custom arcade part. They're useful next steps beyond a control panel. For a complete cabinet transformation, see our Bucky O'Hare bartop retrofit.