next »

[maruki]

Hi everyone!
I'm LOSTⒶLLOY's artist Maruki, and this is Aftertile's devlog.

Quick info list:

Name: Aftertile Genre: floatvania Platform:pc, mac, linux

Team: @MarukiHurakami (art) @SugoiDev (code and sfx) Dustin van Wyk (songs, with additional tracks by Thomas Hartmann and Paul Zimermman)

Devlog also on IndieDB

We have a Patreon!

Screenshots and GIFs:














Aftertile's proof of concept was done in 72hr during LD35.
PLAY THE JAM VERSION HERE!
(The first devlog entry, which was here previously, can be read on my personal tumblr)

[Crabby]

Saw this on Twitter during LD time. Looked interesting. I'm excited to see what's to come!

[maruki]

Saw this on Twitter during LD time. Looked interesting. I'm excited to see what's to come!

Thanks! I won't disappoint you!

I divided into two models of devlog: should I just update here constantly as I make new stuff or keep it in a more edition basis (devlog #1, #2, and so on)?

[nnyei]

Oh, I really like the art style for this; really cute and charming. I'll be following.

I divided into two models of devlog: should I just update here constantly as I make new stuff or keep it in a more edition basis (devlog #1, #2, and so on)?

I personally don't have a preference (as long as the devlog updates somewhat regularly, i.e. updates more frequently than once every 6 months or so), and I think you should stick to what you're most comfortable with.

[maruki]

Right! Thanks for the reply!
I think I'll go with a mix of both, to keep batches of changes a bit organized. :D

[Moth]

Looking really interesting and cute, will be following!

[maruki]

I’m spending these days refining the already existing sprites and animations, and drawing concepts to set the mood and atmosphere for the game.
Albeit I had already done two pieces of concept, I was yet to make one specifically for the main character. So I painted one.


Ghosty Ghost profile:
Name: Ghosty Ghost
Age: deceased
Current place of residence: AfterComet
Body features: white and greenish soft ectoplasm, triangle hat, green eyes
Favorite food: lol wut
Mission: Find a place to rest, like all the other souls there

More concepts:





As I said in Aftertile’s LD post-mortem, the concept for the ghost at that time was pretty simple.


That’s more like a coffee-break sketch


So now I had plenty of freedom to make the ghost as ghosty as I wanted, which resulted in changing the sprite.
The colors in the middle represent his ectoplasm. As written in the design documentation: “the ectoplasm should behave as an inner fluid, almost always moving, to show that the ghost is alive”.



This is how the two designs, old and new, compare in a screenshot with the already existing tiles:



I’ve also made these tiny orbs. They are ectoplasm orbs that will be gathered by the player, and they will be essential for completing the mission. We plan to have them behave as a swarm around Ghosty, but I’m still not sure if I should keep them animated: it might be too distracting.


Original size is 16x16


Finally, I worked a bit more on the entering-walls animation:




This one still needs a bit of work, though. I hope I can finish all the other entering/coming out of walls animations as soon as possible so I can work on new stuff! :D
Any feedback is very welcome! Thanks for reading!

This entry can also be read on Maruki’s tumblr.

[chrilley]

I'm really digging the fluid animations. The one entering the wall is great!

[maruki]

Looking really interesting and cute, will be following!

I'm really digging the fluid animations. The one entering the wall is great!

Thanks a lot, guys! :D

[nnyei]

With the new sprite update did you get rid of his little triangle crown? Or does it work like a powerup in the sense that it's not always there? Anyway, I'm really digging the sprite update. Just with the phasing-through-the-wall animation, I feel like the it's a bit slow when it comes to the ghost opening its eyes. But that might just be the gif conversion when you uploaded it to the web. Lord knows it's a pain to upload gifs at their proper speed.

[bdsowers]

Eghads, that wall entering animation is about the cutest thing I've seen this year, only narrowly being beaten by a video I saw of a dog eating a watermelon while sitting inside it.

I think that's the best promotional item yet.

[maruki]

With the new sprite update did you get rid of his little triangle crown? Or does it work like a powerup in the sense that it's not always there? Anyway, I'm really digging the sprite update. Just with the phasing-through-the-wall animation, I feel like the it's a bit slow when it comes to the ghost opening its eyes. But that might just be the gif conversion when you uploaded it to the web. Lord knows it's a pain to upload gifs at their proper speed.

The hat will always be on the ghost's head, but I'm haven't got to it yet.
The slow down is not the gif conversion, I've done it that way. See if you find it better now:

Eghads, that wall entering animation is about the cutest thing I've seen this year, only narrowly being beaten by a video I saw of a dog eating a watermelon while sitting inside it.

I think that's the best promotional item yet.

Thanks!! And... I WANT TO SEE THAT VIDEO @v@

EDIT: I FOUND IT!! squeeee

[nnyei]

I personally like the second one there best. And I'm sorry for being vague last time; let me clarify. I meant to say that the opening of its eyes felt slow because as a player, I have to see this animation every time the ghost phases through a wall, and it looks from your animation that the player can't control the ghost in that time, meaning that it's time you have to spend waiting for your character to move again. That can turn annoying really fast. In that sense, the animation of it opening its eyes felt slow. So I'd personally kill a few frames there so the animation as a whole is faster. Gif 2 and 3 perfectly line up at the moment, so both are equally slow and the waiting time for the player is the same. And between those two I find gif 2 to be cuter. Anyway, that's just my 2 cents.

The hat will always be on the ghost's head, but I'm haven't got to it yet.

[maruki]

@nnyei

I see. Thanks for the input! The 3rd is actually 1 frame shorter, hahaha (doesn't make much of a difference, though).
I'll see what I can do!

[maruki]

I’ve got a request, and thought answering it could be interesting for others into pixel art and animation.
Request: Share the progress of that fluid thingy
Reply: oh yeah @v@
Disclaimer: I’m a beginner myself, so almost everything I do is achieved by trial and error. I also keep a note open on my monitor with the 12 principles of animation and a short explanation for each while I’m working - I think it helps me think outside the box when I’m tired.

tl;dr gif version:





I work on Aseprite. I started with the ghost as a base, and laid out the new colors according to the new concept. I also separated the eyes into a new layer, as they will be now on top of the inner fluid.

I work on Aseprite.
I started with the ghost as a base, and laid out the new colors according to the new concept. I also separated the eyes into a new layer, as they will be now on top of the inner fluid.Once I was happy with it, I made the ghost almost invisible and started drawing the inner goo in a new layer on top of the ghost’s layer.



Previously, I had done a bit of research on how floating fluids behave. I watched videos of water on space, for example, and came across lava lamps! Yes! After a bit of research, I found these two animations I ended up using as reference:






Animating this goo took a while, but it was fairly simple. The only complicated part is really watching out for the blobs volume: they can squash and stretch, but they don’t grow in mass!

After that I replaced that blue color, which I used only to make it more visible.


The movement looked nice, but the ghost in general looked weird. That’s because in the concept there’s a subtle transition between the ghost’s white mass and its inner fluid.


I needed more colors to give this effect. I created this layer I called “protection” (naming things is hard, no wonder one of my cats was first named “Kitty”), and inside on it I used the shape of the ghost to create a sort of skin that “thins out” in the middle, with few thick spots remaining:


I also wanted to express that the inner fluid is actually INSIDE the ghost, instead of it being a moving texture. Reducing the opacity helped.



Then I created another layer at the bottom, but still on top of the ghost’s main body, and filled it with a transitional color.



Then I created another layer at the bottom, but still on top of the ghost’s main body, and filled it with a transitional color.
As you know, I began remaking these assets using the x11 color names palette and the gbc palette preset that comes with Aseprite. That leaves me with 178 colors, and room to create more, if needed, until I reach 256. For this sprite, I created one color, and, following the x11 scheme, I named it “morning dew” (“you just wanted to name a color, maruki”). So, the colors used were:

#B8FFF1 Morning Dew
#F0FFF0 Honey Dew
#66CDAA Medium Aquamarin
#7FFFD4 Aquamarine
#20B2AA Light Sea Green
#008080 Teal
#FFFFFF White



In the end, I also wanted to animate the “tail”. I made that in a separate file, then pasted it into the main body timeline, where I replaced the colors and added the shadows.
If I make more ghosts (which is the plan, because, you know, NPCs), I’ll basically shift the colors according to the ghost personality. Maybe.
Hope you enjoyed it! :D Thanks for reading!!

(edit: I had mistaken the HEX of a color)

[brantkings]

This is really nice! Interesting how lava lamps can lead to ghostly things. I really liked too that you are talking about the colors you are using, that's really useful information to check out how people make their palettes.

Maybe its just me, but it feels like that the ghost's silhouette is a little bit too static. BUT yeah, I know how costly that would be.

Wanting to see more!

[Mr Bazooka]

I really love the art and the animation.
Keep up the good work.

[maruki]

This is really nice! Interesting how lava lamps can lead to ghostly things. I really liked too that you are talking about the colors you are using, that's really useful information to check out how people make their palettes.

Maybe its just me, but it feels like that the ghost's silhouette is a little bit too static. BUT yeah, I know how costly that would be.

Wanting to see more!

Yay, thank you! :DD And no, it's not just you, I too think his whole outside shape is a bit static. I didn't make any changes to it for two main reasons: first is because the floating animation will be more dynamic, second because it's a ghost, so it doesn't breath or blink, or anything other alive beings normally do - basically it's being a design issue. I might add eye blink and a slight hover to him besides the moving inner fluid and tail.

I really love the art and the animation.
Keep up the good work.

Thank you! <3

[maruki]

These last two weeks were busy and design-heavy here in the HQ (it’s a two computer office, but I like to call it that :D). We’ve started tackling game design issues and we’re on the path to solving all of them – at least for the first two stages which will probably be on a playable demo. As soon as we have our notes organized, I’ll write a post about it.

Code wise, Fausto has finished writing all the tests and the build script; now we have one-click build (we’re using Unity, in case I haven’t mentioned it before).

Graphics wise, I’ve run a poll on twitter with a few entering-wall animations, asking people which one they preferred and refining according to feedback. I ended up reducing a few frames from the passing stage per se and keeping the eyes still a bit slower due to this kind of impression it caused on some people: “looks like they're a little uncomfortable while phasing though the wall, but perfectly fine when they get settled in”. The reason why this makes sense has to do with the game’s lore: in that world, souls go to that place to rest as tiles on the wall; the comfortable place for them is inside the walls, amidst other tiles, and entering the wall is a kind of rite of passage for the souls.

The animation though is still a mockup for the final one. According to our most recent design choices, we are going to add an intermediate stage there.







I’ve also dedicated hours to practicing making tilesets. I’ve got little to no experience on that, so I decided to study a bit – and I quite liked the results of my studies. I’m going to make the ones below available as public domain. It was a good practice and I’m happy with the result! Someone might need something like this for a prototype or for a jam, so I’m more than happy to release it :D



You can get them at the following links:

• purple rocks
• sunset sky

Finally, I started the design of another set of tiles, the sleeping tile ones, which will compose the safest environment for the place to navigate:




I’m already preparing a sort of long post about storyboard and level design to come up next. Thanks for reading!!

[FK in the Coffee]

Wow, the art and animation here is incredibly fluid and charming! Definitely looking forward to seeing more.

(Also, just curious: is your username/Twitter handle a play on this guy's name by any chance?)