How I Fixed the Camera in My 2D Platformer

 I've been working on ChainStaff since 2019! 

And while I finished Bumpy Grumpy and a few contract jobs in between, it's been a lot of good iteration and learning along the way to make a better platformer. 

One of the most important parts of a platformer for me is a good camera! And for me a good camera is one that you don't even notice. Check out my recent video here about how the camera works in ChainStaff. 

If you'd rather read than watch, then please read on!

Vistas

There a several special things I'm trying to do with the camera in ChainStaff. One of them is to create exciting fights and beautiful moments. 

Each level opens with a gorgeous vista of the new level. 

Level 4: Moss Islands

You get to soak it all in, the alien world, blowing leaves, lighting, nasty clouds, and creepy tongues swaying in the wind. Then when the player starts moving the camera picks up and starts following you. 

Another special camera I use is to have a vista combined with a big fight. The opening of level 2, the Dragon's Bridge has you launch straight into an epic battle with the Jet Dragon on a thin rock bridge. As you get closer to the dragon, the camera zooms into the action. If you run away, the camera backs up to capture you and the dragon in view. I like this a lot, but it's a bit unusual for 2D action games to pull back quite this far. I carefully designed several fights in the game to take advantage of these huge views, while still remaining fun and fair. 

The Dragon's Bridge: Look how tiny you are!

Less Is More

For most of the action of the game, the direction I give the camera is "only move if necessary". 

Basically I follow the Miyamoto method developed as far back as Super Mario World. 

There's some great videos on how he designed the camera there. I use similar direction in ChainStaff. If you are jumping up, the camera only moves up with you, if you actually jump up to a new platform. If you are simply hopping up and down, I don't follow the player up and down. If you make the game like that, the camera is really spazzy and it's hard to see what platforms or enemies you're going to land on! It's much better to keep it still unless you land on new ground. 

Swing Town

One tricky area for ChainStaff is making something that works with the wildly swinging grappling hook. 

You are attached to a grappling hook, and swinging left and right fast. If I simply follow the player, it's very hard to play.

The direction I use instead for the camera is to follow the attached point of the grappling hook. This works because its in between of where the player wants to be. The player can swing left/right fast, and its easy to focus on the action. As soon as they let go, the camera smoothly transitions to then following the player again. 

These are the three main areas and methods I use to make for a smooth camera experience for the platforming and shooting action in ChainStaff. Check out the video for more details, but also check and see how Miyamoto did it for Super Mario World. As usual, he's a master!

Thanks for reading and please wishlist ChainStaff, thank you!.

Bumpy Grumpy Tourney and PAX West Soon!

 

New York City Trip

Bumpy Grumpy is in residence in TWO prestigious arcade cabinets in New York City, so my wife and I decided to make New York City our destination for our family trip.
(Header pic: So much amazing cream cheese)

Was the Empire State Building visit awesome? Yes! Am I scared of heights? Well, you can see it in my eyes :D

New York City Arcade Scene Is Big!

Wonderville Arcade is in Brooklyn and it's got an amazing collection of "indie game arcade cabinets". These are often one-of-a-kind arcade experiences. If you are in the area, you've gotta check this place out!

Wonderville Arcade Home Page

Bumpy Grumpy Tournament Results!

I had organized a high score tournament for Bumpy Grumpy with Mark from Wonderville. So on the Saturday evening of our trip we took a subway ride from Manhattan over to Brooklyn for the tourney. Remember: the game is out on Steam so people can practice at home--but its very different to play on an arcade cabinet in front of a LIVE audience!

It went like this. We took sign-ups for all to play. Then each contestant got two runs. We went through all players once, then a second time. Mark wrote their scores on the whiteboard. And I got to commentate!

The end result was lots of Bumpy Grumpy games, lots of cheering, shouting, and screaming, and lots of fun! Congrats to the top 3: Nick, Blaze, and Mark!

Bumpy Grumpy and the NYU Game Center

We also got a tour of the NYU Game Center in Brooklyn. Gentle reader--let me tell you--their "library" was enviable. It works just like a regular library, but you get to check out GAMES instead of BOOKS! And the faculty there often give students assignments like "Your new game is similar to this one from 2002. Your weekend homework is to check out the game in the library and play it to see its design." How cool is that?

ChainStaff Demo at PAX West!

The honestly-fantastic publisher for ChainStaff, Null Games, is flying me out to Seattle to show off a demo of ChainStaff at PAX West.

If you've not already wishlisted ChainStaff on Steam, please do! It's a huge boost for me. Every wishlist helps me as it moves the game up through Valve's automated lists, which gets us in front of more people. And that means more sales and more weird games for you!

My next big game is an action-platformer with a transforming grappling hook.

Here is the Null Booth info for PAX West. Null Games has a great collection of games coming out in addition to ChainStaff and Null always has AMAZING SWAG for giveaways, so please stop by.

Player Animation Progress

And finally I'll leave you with a recent video I made on the player animations in ChainStaff!
Happy swinging.

Building an Arcade Cabinet, Part 5: Panels Galore!

In my last post I talked about finishing the all-important side panels. These are important because they are the defining shape of the cabinet! We had to match the iconic Occidental Designs style of the big curve on top.
Wait, did I say I was finished with cutting them? Yeah, right! I was only getting started. 

Because I hand cut them with a jig-saw and measured with a circular saw (as opposed to a CNC machine doing it with computer accuracy), my two side panels, which need to be identical were a bit off. 

So I spent several days in December cutting them and refining them some more.

Here the two panels are compared to each other. You can see the back one is higher than the near one.
I need the edge to match as closely as possible.

I clamped them together to carefully compare them.
Straw bales were actually really helpful to hold things upright!

Here is the tricky inside curve. You can see slight discrepancies between the two panels. I used a power sander to smooth them down to match each other.

Cross Panels

While the side panels are usually an interesting shape, the cross panels are pretty boring. They are probably all rectangles all the same width, but of different heights. They are the horizontal pieces and include obvious things like the control panel (where the buttons and joystick is), the front kick plate, the back panel for access, and the top. 

The middle is the side view, the left and right are all the rectangles that form together to make the horizontal parts of the cabinet.

The cross panels are easy to cut once you get everything clamped down nicely. It still takes me about 15 minutes to make a cut each time, because I keep checking it, lining it up, clamping it. You really want to take your time on all these cuts. It makes a big difference. 

I actually got to take one large piece of melamine and cut it long ways down the middle, into half. My cabinet is 24" wide. The board is a touch over 48". This made it easy. But I had to be very careful ripping the board all the way down the middle to get the cut perfectly straight. 

If some of my cross panels were 24", but some were 23.5" across, then it would make the cabinet wonky. 

Some of the bigger panels, all labeled.

Here are some of the not as tall panels (all still 24" wide).

Getting ready for a cut. Everything is clamped down. The table that splits apart was very handy to have a steady working area.

Checking the size.

Handing Over the Batons

I needed lots of little wooden "batons" to connect all the cross panels to the side panels. I bought some pine trim board that was 1"x2", by 12 feet long. I then measured and chopped these up to the proper lengths. After it was all said and done I should have bought 3 boards of 12 foot long (not just two boards like I started with).

The screws I used were 1.25" and 1.5" depending on how much it could connect to. It is very important to pre-drill all the holes so no material bulges out or breaks as you drill the screws in.

The lighter colored rectangles are the trim board chopped up. This is me comparing the size and seeing how much space will be on the edges when it is all put together.

Don't get excited yet--this is just dry-fitting all the pieces! I lay them all out, no screws, no glue, to make sure it all makes sense.

 

I then spent lots of time actually adding the panels for the base, kick plate, and back side parts, to one of the side panels. It took a while to line up and to clamp as I drilled and screwed. Also I used the pocket hole jig a lot, to drill in from the inside, to the outer panels so no drill heads will show. 

 

Here is a specialty "locking vice c-clamp". It reaches way out and inside, to grip things in situations just like this. It's easy to open and unlock then re-lock quickly to exactly the spacing you just had it at.

The inside baton that will hold the TV platform was hard to do! I had to tape it, and ensuring both batons matched each other took a lot of measuring and checking.

I bought a "pocket hole jig". Totally worth the extra bit of cost to get sunken, long holes to connect screws at an angle.

The oval cut on top on the right is where you put the screw into it. You can see the screw protruding. I'll screw it into a panel and get a very nice fit!

Slowly coming together.
If you can get another person to help you on this day, it's great!

Pocket Jig magic!

Perfect December day in the Midwest :D
Gloomy and cold!

Closer still.

How do we get the one piece with all the panels connected to the other side? At first I thought it would be good to lay it on its side, but this was dumb. 

Instead, with my son, we tipped both panels up. Some of the cross panels drooped a little bit, but as we held it together by hand, and slowly screwed everything together but it was a bit tricky.

Screwed and glued. Mega clamps for the win.

That’s when I remembered that, long ago, I had seen some giant clamps on the farm. My dad has done lots of carpentry work over the years, including building our house back in the 1980's! He has lots of tools laying about the farm. It took some time to locate the clamps. But they were excellent and it would be tough for me to think the project would go so well without them.

Once I clamped those onto the sides, seeing the gaps draw in close was a wonderful feeling. And then getting the screws into the panels and see it all draw up tight, it was so exciting. 

All panels are connected!

 That's it for this installment. 

Lots of drama and laughs are coming soon to the next post! Stay tuned.