🧵 OK, it's been a while but it's time for a GAME DEV THREAD
This one will end up spread over several weeks as I'm pretty busy
I've always liked physics games, and Penga turned out well, so let's do another one!
The idea this time is to build a tower rather than pull it apart.
I've started off by setting up Planck.js similar to Penga, rendered with DIVs positioned relative to a point at bottom-centre. Got a few blocks falling onto a static platform; modern browsers should cope fine with dozens of objects
1rem in the CSS represents 1 unit in the physics engine, so I can easily rescale everything and only need to flip the y coordinate value
When a box is created, it's set up both in the HTML and the physics engine. 60 times a second the physics is calculated then boxes are repositioning/rotated
How I'm thinking gameplay might work:
You're given a set of different items to pick, drag them into place, then when that set's cleared the tower's measured and you get more
Breaking it up like that gives the game more structure & reduces issues with players quickly piling up iffy collapsing towers
I've set up a bar that blocks can be dragged from, obviously not very interesting when they're all the same size/shape, that's next thing to tackle
On phones I might need to position the dragged object above your finger if that helps with visibility
Yep that's getting more interesting, and I can vary density/bounciness/friction & have wonky compound shapes
Next: How should measuring work? How should the game deal with the tower filling the screen?
So, my idea is that when you've used the shapes you place a special item that triggers measurement. These special items can be 'residents' of the tower, so it makes sense you put them on top & its their elevation that matters
It also means the tower has to be stable for a while to count
Yep, that works!
I could make it so the game only ends if one of the special items falls in the muck... but then players would casually throw away awkward shapes. So you're going to have to keep everything muck-free
Speaking of muck, here's my idea for the game's theme:
STYSCRAPER 🏗️🐷
Help posh pigs rise high above the muck by building a tower out of junk
It's a stupid pun but I think it works as a setting, certainly far better than some characterless Tower Builder thing
(generally, the more serious the simulation the more mundane/descriptive/ungimmicky the branding/theme should be; so something like Tower Builder would be more appropriate if it involved realistic materials & engineering)
I've refined the measurement process so that if the highest special item is moving downwards there's a longer delay and the line moves more slowly
That way, a sliding item or collapsing tower is less likely to ‘unfairly' increase your score, and it adds a little suspense
OK, how to deal with the tower being bigger than the screen?
Penga is simply taller than the browser & lets you use native scrolling, I'm going to try the same here. Only worry is the possibility of glitches when extending game height & adjusting scroll position at precisely the same time
If you code your own scrolling it never feels the same, people are very sensitive to the precise behaviour of the touch/wheel scrolling they use all day
Current thinking:
- When measurement ends, extend game with enough space above highest item, but scroll down by same amount so change isn't seen
- Smoothly scroll up to give enough visible space above highest pig (not junk)
So it always keep the top pig in view, but there's room to build on top item
Seems to work well, it scrolls to position the red square at the bottom, then the last movement is me scrolling up to show spare space created due to red square not being at the top of the tower
I'll need to keep an eye out for glitches later when there's lots going on, graphics, etc
Added transition effects & cursor offset so the shapes seem to be pulled directly out of the bar; even at this early graphics-free stage it makes a huge difference to the feel
Spent a bit more time on this
Refactored how items are set up and tried to work out playable sizes/shapes. Currently they're all still boxes (some will be irregular) but it's working OK as a game, it's got that thing of being slightly frustrating but it's so quick & easy to play you have another go
I think I need graphics next, and that means deciding who should do them
If I hire someone, that not only requires money, I'll also have to carefully document everything and supply measurements and/or dummy graphics to make sure sizing & collision areas are right. And I'll need to limit fine-tuning
If I do it myself, it'll remove a load of uncertainty/faff/expense but add a different set of problems. I'd never call myself an illustrator, but I can sometimes fake it as a passable one if I pick the right style & the key images work out OK. It's a slog though
Tricky decision...
Originally I thought the game needed to be 'fair' in what items it offers, so I considered a tightly-controlled sequence or introducing trickier items gradually... but it turns out the fun of it is in being forced to try new approaches from the start, gives it that "one more go" thing
(That tower only works because they're all boxes, it'll be trickier once some are other shapes)
Currently each stage picks 4 'easy' items, then sets random one to a pallet to increase no. of those, then sets random one to 'difficult' item. From stage 5 onwards it's reduced to 3 & no difficult item
I'm sure that'll change before launch, but it's working pretty well
Graphics update: I've rummaged down the back of the sofa and found enough loose change to hire the first illustrator I thought of for this (they've drawn things with similar structures AND animals), it's going to look amazing
Sneak preview of Doc Hackenbush's colourful, characterful work
You can see why he came to mind for a game involving animals & constructing towers
Styscraper graphics DONE! This week I'll group them into sprite sheets and refine how the background works, then next week I might have time to get on with finishing the game
OK, after some fiddly measuring of sizes & positions I've got the item graphics in there, BUT...
...they're all boxes. Which, with a bit of a 'dead zone' around the edges, is fine for some things (the 2 items on the right) & no good for others (the 2 on the left). I'm going to have to do lots more fiddly measuring to switch their physics shapes to one or more convex polygons
The pigs have a variety of poses, but dynamically changing the physics shape would be bad for simulation stability (& gameplay fairness!), so I've got to find a common boundary that works OK for all poses, seems to be possible
Custom polygons are working nicely; I'm keeping them as simple as possible, so hopefully they won't harm performance
The centre of gravity of the chair has shifted rightwards, if you casually drop it it'll tend to bounce & tip over, that's initially surprising but then feels right
The pigs now also have a custom hexagonal shape, I've tried to make it reasonably generous in terms of flat spots on their heads & bellies
Next, I need to refine the actual gameplay, tweaking physics properties & how items are dished out, and make the pigs look around
I think this little screenshot sums up the strategic element really nicely; you're given all these different things and have to find ways to combine their heights & shapes to create stable structures, rather than just dumping it all into a messy pile. And it's completely different every time
I can tell you one thing now - you're going to HATE the binbag
One more screenshot for now; this started off as 3 ridiculous piles but somehow managed to bring it together