Devlog 37 - Menu Tweaks, Shop Rework

Published: June 18, 2022

I miss the weeks when I would just crank out two levels over the course of the week...that really made it feel like I was making a lot of concrete progress towards finishing the game. Instead, this week I ended up getting zero work done on levels (oops) and worked on a few other things instead.

I suppose it's just as well, since I'm still mulling over what to do with the levels in world 4. My current plan is to have world 4 wholly feature the water zones, but 5 levels seems like slightly more than enough to explore that mechanic's design space (?). I could also try to bring in speed zones (or combo enemies) to world 4, but I think having 5 levels to introduce both of those mechanics is simply too few!

Legal/Accounting Stuff

That's right, everyone's favorite thing to deal with! (laughs) For a multitude of reasons I decided to form an LLC (limited liability corporation) to sell my game, as opposed to having it just be tied to me as an individual. This is pretty standard practice and if you deal with some form of side-business on a regular business it's often recommended to keep business accounting separate from your personal money.

I'm happy to report that most of that is now finally set up, and my Steam app (along with my iOS account, etc) are now tied to "DDRKirby(ISQ) LLC", and I also have a business banking account tied to that. Hooray! I won't drill into the boring step-by-step details of how I did all of this, but I'll gloss over some tips and learnings that I got out of the journey in case anyone else finds themselves in a similar position.

First, stick to A-Z letters and don't use parentheses in your LLC name like I did, lol. (we'll ignore the fact that "DDRKirby(ISQ)" was never the best alias to begin with) This worked just fine for my state's registry but various other systems strip out / don't allow symbols, so better to just not deal with that.

Second, a common question is when to form the LLC? The downside of forming an LLC too early is that you need to pay annual fees on it, so that's just wasted money if you're not actually earning revenue (your game isn't done yet) or tracking expenses. The downside of forming the LLC too late is that it's a bit of a hassle to change tax/legal information after the fact. For example, with Steam you need to make an entirely new Steamworks partner account, then set up a transfer for the app from the old account to the new one. Importantly, you need to pay the $100 Steam Direct fee AGAIN for the new account. This is probably less than the annual LLC fee (depends on state), though. So I think this is roughly the right timing for me.

Often people will recommend third-party services to help with filling out forms for establishing the LLC, as well as providing an on-file business contact (in lieu of yourself personally). The forms for registering the LLC were quite easy to self-fill, though, so I don't think this is necessary, though I think it can be useful to have access to some form of legal / accounting advice (whether that be from a CPA, a friend, or whoever).

UI Layout Scaling

Okay, back to stuff that I can post images about :)

Last time we left off, the main menu looked like this:

The overall structure has stayed the same, but everything is bigger now:

You might be wondering why I chose to do this, given that the old version looks more or less fine. The new version might look a little too cramped, actually, since everything is so big! The answer is to deal with multiple resolutions! Because I (by default) maintain integer pixel scaling to avoid scaling artifacts, the portion of screen space that the UI covers actually depends on the screen size. Here's the old version of the menu, but this time at the resolution of an iPhone in landscape view:

See how the UI feels like it has too much empty space around it now? The UI can't scale up any more without extending beyond the edges of the screen. The new, bigger UI layout fixes this issue, and looks perfect at the same scale factor:

When you maintain fixed integer scaling, your UI is never going to look perfect for all screen resolutions. I was previously designing mainly for 1000x600 resolutions, but that resulted in other resolutions having too much empty border space. Now, I've redone the menus to use up as much of the 480x300 base canvas size as reasonable, so that it looks fine even with some extra padding. Most common resolutions (720p, 1080p resolutions) will involve some amount of padding, so this works out. As an added bonus, everything feels easier to tap on for mobile as well.

Note that there are other ways to handle this issue -- for example, instead of having a fixed base canvas size with integer scale, you could build your UI proportionally (use percentage-based anchors) and then use 9-slice assets so that your buttons and menus resize dynamically. (Of course, the easiest solution is just to not use pixel-art and avoid the problem altogether.....)

Aspect Ratio Handling

I also tweaked how the game handles screens of different aspect ratios. Previously, the camera and UI only looked at the height of the screen (not the width) when deciding scale. This means that in order to support 4:3 and 5:4 aspect ratios (I know it's hard to believe, but some of us still use these...), I had to ensure that the UI fit safely into the lowest aspect ratio (5:4). This typically meant that most screens had a lot of empty padding on the left and right:

I've since modified the scaling code so it uses a 16:10 "safe area" to determine scaling. This means I can safely lay out my UI for a wide aspect ratio...

And if you're playing on a 4:3 or 5:4 display, it'll compensate by adding more vertical space, instead of chopping off the left and right sides:

Shop Rework

Astute readers will notice that in the screenshots of the new main menu above, the "Shop" button is curiously missing! In my experience with playtests, the shop menu was too out of the way for people to notice while playing. You have to drill all the way back out to the main menu in order to shop, so most people just continued to play levels without ever spending any coins (unless I explicitly pointed it out).

My current experimental redesign for addressing this by placing shops in each world as part of the level select flow:

The idea here is to funnel people to the shop after they've completed some levels (and thus should have collected a good number of coins to spend). I like that this keeps the shop out of the way at the beginning of the game -- I want the player experience from boot-up to starting level 1-1 to be as free of "clutter" as possible. It also ties into the "quest" theming of the game. Initially I placed one shop in each world between levels 2 and 3, but I've since moved them to the end of each world after level 5. I guess the idea right now is that you get a nice place to spend all of your money at the end of each world before going to the next one? This is still something I need to think about some more.

One other nice thing about this is that having per-world shops gives me a nice logical way to expand the shop inventory over the course of the game (especially important for bonus levels, which will vary in difficulty and featured mechanics). I'm not sure yet whether all shops will share the same inventory or whether you'll have to visit particular shops in order to purchase various items...

Of course, this new system isn't without its downsides compared to just having a global shop button. For one thing, it's more awkward to just jump to the shop from boot-up. It's also a bit clumsy having to scroll to the end of the world each time you want to purchase something new. In the end I might just end up nixing the entire idea and just have a shop button on the level select screen...(but that would be awkward to fit in the UI and also be accessible via keyboard...). It's something I still need to feel out and test some more.

<< Back: Devlog 36 - Level 3-2 Revisited
>> Next: Devlog 38 - Level 4-2