next »

[Ishi]

Have been continuing the improvement to core mechanics. This weeks focus...

Tubes

I originally showed tubes in the devlog around a year ago, and to be honest I've barely made any use of them in my level design experiments since. They were a bit limited in terms of gameplay and also a total pain to place in the level editor, so I have totally changed the way they work (it's all brand new code).

Past Tubes

The old tubes were basically an entrance and exit point which were linked, but there was no concept of actually travelling along the tube. In the editor I had to manually place the visible tiles, and then place entry and exit game entities on top of that, and finally give the entry and exit points ID numbers so they knew how they should link together.



This meant a single tube required different info on 3 different layers, so it was really awkward to make changes or move them around the level.

Plus, since the game entities were just teleported from the entrance to the exit - with a fixed delay period - you don't really get a sense of the entity moving through the tube. It also didn't cope with multiple entities being in the tube at the same time.



The camera has to move quickly to keep up with Leilani when she suddenly appears at the exit of the tube.

Present Tubes

The new tubes are inspired by Mario 3D World's clear pipes.

I started the new tube implementation by deciding how I want to edit the tubes in the editor. (This is always a good way to start a new feature as making the editing easier is always worth it in the long run, even if it means more code work right now). Drawing lines to represent the tubes seemed to be the easiest way. So there's a new layer called Tubes, and any lines drawn on there will be turned into tubes automatically!



(By the way, the editor I use is http://www.mapeditor.org/)

So, the game reads in these lines and splits them into a number of straight tube segments. It forms junctions where the straight segments meet, and links them together. Entities now have a bespoke bit of code for travelling through tubes, during which they traverse along tube segments until they reach an end point. It's nice to build the idea of tubes into the core entity behaviour rather than hacking it in at a higher level like I did previously. It means any entity type in the game can potentially travel through tubes without requiring much more work from me.



The tube bulges to show where entities are inside the tube. I will need to improve the way the bulge is drawn - it's not very nice at the moment how it just disappears when going around a corner in the tube. I'm not sure how to approach that yet.

I'm pleased with how it turned out! I think this will be way more flexible for me to use, and more fun for the player too.

A little bonus feature.. the bulge in the tube can bump enemies and blocks that are next to the tube! You can see Leilani also get bumped by the tube in the previous gif.



Future Tubes

There are some other features I could add. I'm thinking of allowing Leilani to enter vertical tubes from the top (currently she can only roll into the side openings of tubes). Since she can dig into soil blocks from above, it seems silly that she can't enter tubes that way.

I could add three-way or four-way junctions where the player can hold directions to alter which path is taken. I could also add things like one-way tubes with gates on the end that prevent you from going back in (although in most cases just using a downwards-facing tube exit would achieve the same thing).

Finally I need to handle the case where two entities meet each other when travelling along the tube in opposite directions. I will probably just make them bounce off each other and reverse direction, unless a spiky enemy meets Leilani in which case it should also hurt her as normal.

Think I've written enough! Thanks for reading!

[Spennerino]

Another fantastically detailed update. Thank you so much for taking the time to write all of this information out!

The new tube mechanics look great and now I am imagining that the game will have a pipe land like Mario 3 covered with tube mazes.

-Spencer

[Superpowism]

Looks pretty good! I like the fact that traveling through a tube can bump things on top of it.
It could make for some interesting level sections.

[Ishi]

The new tube mechanics look great and now I am imagining that the game will have a pipe land like Mario 3 covered with tube mazes.

Yeah I have to include a level that really goes crazy with the tubes

[Raku]

Ahaa that's fantastic! Every time I come back to check this thread, there's some new whimsical thing you've implemented that makes me even happier! I really like how travelling through the tube can effect things touching it too. All these really nice details that make this game so interactive and special.

[r0ber7]

From one Island to another, great work! 

[Ishi]

Thanks guys!

Mid-air crouch

Earlier this week at CB2 Indies (a weekly indie dev meetup in Cambridge UK) I got some people to playtest a new level I made recently. One of the points that I wrote down while watching was about clearly indicating when Leilani is rolling, and when she's just crouching.

The way the controls work is that holding the roll button without moving will crouch. Then pressing left/right will start rolling. While Leilani is crouched, she can still jump.

Leilani can also start crouching by holding the roll button in mid-air: I added this because it was weird to have a situation where Leilani didn't react to the roll button being held. Leilani can only make the transition from crouching to rolling when she's on the ground (or bouncing on enemies, springs, etc).

I wasn't clearly indicating the difference between the crouch and roll states because I was using the roll animation - played slowly - when Leilani was crouching in mid-air. The normal sounds and particle effects for rolling were missing, but it still looks like she's rolling and that's confusing especially for new players. It's important to know whether you're rolling or not because it affects whether you can attack enemies and wall jump.

The solution was not to be lazy and add new animation frames for the mid-air crouch. So now in the finest Mario tradition, Leilani can do a weird-looking crouch jump!

Before |   After

[PypeBros]

This area tests some enemies of different types by using the springs to roll them into other enemies.

Very nice version of unit-testing ^_^

[Ishi]

Lava Level Graphics

Aloha all! Today I'm going to go through my process for creating backdrop / scenery graphics. I've been working on visuals for a vertical-scrolling lava-based level. It's not finished yet but I wanted to post the progress so far.

I'll also mention bits of code that I've added along the way.

1: The starting point.


This is the test environment I use for blocking things out without being distracted by how it looks. It's also really useful to be able to clearly see the number of tiles in each platform and gap.

2: Paintover.


It's a bit daunting to start trying to fill an entire screen's worth of graphics using pixel art. I prefer to grab a screenshot and then paint over it. I have a small A6 Wacom tablet and use ArtRage for painting. I didn't really do any prior concepting for this - it's just rocks and lava and it's mainly intended as a rough guide for colours and shapes. So I'm not too worried about the visual style at this point, generic rocks and lava is fine.

3: Placeholder background in-game.


The goal here is to get the background working in-game in a really rough form. I just rip out bits of the paintover, crop them to an appropriate size and put them into the game.

New code added for this step: the ability to flip background sprites (to create the left and right walls from the same graphic), and the ability to tie the position of background layers to the level of the lava. The lava rises throughout the level so the lava in the background will follow it.

4: Placeholder scenery tiles in-game.


Similar to the previous step, here I'm just setting up the various images and files required to get a new tileset into the game.

New code: Automatic tile selection. These tiles are more complicated than previous ones I've used in the game - they have specific variations for each combination of left/right wall, floor and ceiling. So rather than having to place these manually in the editor, I draw a single tile in the editor and the game automatically chooses which tiles to place.

5: First-pass scenery tiles.


Pixelling over the placeholder tiles to create something that looks roughly correct.

6: First-pass background.


I replace the placeholder background layers with something more like pixel art. The main thing is to make it look fairly neat, and reduce the blurriness and massive amount of colours that came from the hand-painted concept. Clean pixel art is necessary for the next step.

7: Colour rebalance.


I take a screenshot of what I've got so far and rebalance the colours. Because each background layer doesn't have many colours it's really easy to use brightness/contrast, colour adjustment and direct colour replacing tools to adjust how the overall image looks.

I made an effort to use the lightness / saturation to push the background further into the distance, and make the foreground pop more in front of it. The image overall looks more refined.

What's left?
The lava layers in the background are the most obvious thing that needs work. They might also be a bit too bright but I'm not worrying about that until I've given them some shape and definition. I want to try and give the impression of a single surface of lava rather than individual layers. The foreground lava also needs a revamp.

The style of the rocks is a bit inconsistent. The foreground tiles feel quite noisy so I'd like to simplify those a bit I think.

I'll also add a heat haze effect to the background.

Hopefully I can show the finished thing off sometime soon! Thanks for reading!

[Quicksand-T]

The foreground tiles feel quite noisy so I'd like to simplify those a bit I think.

I love them the way they are now.

[and]

I'm really looking forward to seeing the finished thing!

Thanks for sharing your process, it's really interesting to see how people work.

[TheGrandHero]

I don't like the lava-cave background that much, personally. It doesn't quite match the simplicity and style that makes the island background in other levels look so good.

[Ishi]

Thanks for the feedback, I think I need to take a few days away from it and look at it with fresh eyes. I'll focus on some other things for the time being (new enemies probably!).

[Hoj]

Thank you for sharing the process on the lava level, very interesting!

[MekaSkull]

Commenting to subscribe. Game looks super poppy and snappy and addictive 

[Ishi]

Machine Design

I've spent some time this week working on some improved designs for the machinery aspect of the game. The story/driving force of the game is that someone is invading the island with these machines, and building towers that drain energy from the island to charge batteries.

I haven't made much use of this stuff in levels so far so I wanted to iterate on the lacklustre designs and be more confident about making use of them.

The visual style of the new machinery bits is hopefully more unique and consistent. The purple and yellow colour scheme is my homage to Wario, and I think sits nicely against Leilani's pink and green colour scheme. The warning stripes evoke machinery, and contrast with Leilani's zig-zag patterns.

I'm also aiming for visual consistency for gameplay purposes. The old battery tower's weak spots were these weird blue animated energy pipes (?) which didn't really look like anything. It wasn't obvious that Leilani could destroy them. There's also the battery at the top of the tower which gives the biggest reward if destroyed (like reaching the top of the Mario goal pole), but it looked kind of spiky and intimidating, and also not obviously destroyable.

The idea with the revamped machinery is that all weak spots are indicated by exposed purple and yellow wires. This should make more sense as a weak spot, and will be consistent across all machinery-based things, whether it's the battery tower, destroyable scenery, robot enemies or bosses.

The image is work-in-progress so there are some experiments and things in here:


Expanded Camera View (debug feature)

I've also added this expanded camera view, for testing purposes. As the developer of the game it can be really useful to know exactly what's happening off the screen. In the screenshot here the red boxes are objects that haven't yet been activated because they're not on-screen.

In the future I want to review the rules for when objects are activated and deactivated in relation to going on/off the screen. This expanded view will prevent a lot of guesswork when I get around to that.

[Canned Turkey]

Loving the progress!
It's motivating to see someone work so often on a game as cool as this

[Bluebutton]

Awesome work as usual.

In regards to the machine designs, the cables are an improvement, but they still say danger to me. Have you considered having the weak points be metal panels as usual, but dented or scratched? Even animating like they're rattling? My first thoughts about the weak points from your image was the bits with smoke coming out.

Just a thought.

[quan]

This looks really cute, posting to follow

[Ishi]

Thanks for the responses!

In regards to the machine designs, the cables are an improvement, but they still say danger to me. Have you considered having the weak points be metal panels as usual, but dented or scratched? Even animating like they're rattling? My first thoughts about the weak points from your image was the bits with smoke coming out.

That's a good point, and I do want the weak spots in this case to be super clear. I'm at CB2 doing a bit of brainstorming about it and came up with this. Hot off the press!



Duct tape! Also more careful use of colour to make sure the weak spots are really highlighted. What do you think? A shiny animation on the duct tape would work pretty well I think, and it's a theme that could easily be applied to any bit of machinery in the game.