Share this project

Done

Share this project

Done
Play as an alien plant and escape from a scientific facility, full of secrets and dangerous experiments.
Play as an alien plant and escape from a scientific facility, full of secrets and dangerous experiments.
5,953 backers pledged $144,960 to help bring this project to life.

Current development status and new pixel art animation techniques

Posted by Asthree Works (Creator)
82 likes

Hello everyone! Long time no see since our last update. First of all, we feel the necessity to say that this is going to be one of the most challenging updates to write down, both in terms of development and content. We found ourselves in a point where we can’t post much graphic stuff since newer enemies, stages, and scenes enter the spoiler territory and could potentially ruin the surprises of the story.

The last few months have been particularly difficult regarding the game's progression for multiple reasons. On one side, I faced some health issues that have led me to slow down and avoid pushing myself too hard with the project. Having only one person in the studio in charge of the animation process is really hard, more so considering the level of detail put into every element in motion. I’ve spent most days working almost 12 hours in front of the monitor, and finally reached a point that compromised my well-being (with all the pressure of the delay as the cherry on top).

The team got a little preoccupied about it (I even had to go to rehab for severe back problems) and urged me to spend less time at work while they helped me with some of my pending tasks as much as they could. Now I can say that I’m in better shape and conscious about when to take longer breaks from the project, but this will inevitably resent the development process and the possibility to end milestones ASAP.

The other significant setback has been the final boss, which resulted in a challenging experience both in terms of design and animation. The scenery, traps, and almost every element that takes place in the final stage it’s humongous and led us to rethink specific mechanics and find new animation techniques due to its size.

Another graphic challenge was the reverse map. Remember the inverted castle that can be visited in Symphony of the Night after fighting Richter? Well, we are doing something similar, but instead of turning everything upside down, we are changing the assets of all the backgrounds and adding entirely new wall decorations, platforming surfaces and an all-new set of enemies due to an event that takes place after the player has visited the entire map. We think that this infuses new life into the game’s last act, expanding both the narrative and gameplay experiences.

The downside of this process is none other than the time-consuming labor of matching the new aesthetic elements with the already designed backgrounds and gameplay structures. Sigrid is working on the color-adjustment for this stages while finishing the assets that modify the gameplay structure.

On his part, Carlos is fine-tuning the code and testing bosses, menus and everything else that runs on the back.

Release date

And now onto the most asked question: “When will I be able to play the game?”. We know that you are eagerly waiting for it, but a realistic decision from our part will be to move the release window to 2019 (no specific date yet). We’d love to give you an earlier date but this is the state of things as of now. If we are capable of speed things up we’ll keep you informed.

With all dev-related matters out of the way, we can show you some exciting things and techniques that could also help other pixel artists when facing the same problems as we did. Check them out.

Working on the final Boss

The design and size of this boss ended up being more complicated than expected, and as much as we’d love to give away all the specifics that surround this character, it would be a bad idea to reveal its entire appearance (clearly for story-wise purposes).

Despite this, we can show certain parts to approach the new animation process required for most of its assets and share some info regarding the size and scale of the combat so that you can have an overall idea of the challenges faced during its development.

Design phase

One of the main concepts of this design was to conceive a platform focused clash, where players had to reach its different hit-points while keeping an eye on other enemies and traps deployed by this character.

With this in mind, the first thing that we did was creating a path for Subject W to move from one hit point to another, considering on the overall scale of the stage. Different ideas were taking into consideration while defining the bones of the stage such as:

  • The distance that a player can reach between multiple surfaces, both in single and double jumps
  • The traps that will appear from point A to point B (hit-points) and their progression to increase the difficulty curve after each hit (PLFC boss routines consist on doing three hits, either by using skills or solving situations).
  • The height of the stage and the camera tracking to avoid motion sickness after repeated jumps.
  • Balance between safe areas and delusive/unstable surfaces through the map.
  • Incorporation of additional enemies (other Subjects) to increase the difficulty due to the accumulation of skills and enhancements acquired along the game.
  • Position of the different characters and elements that can appear through the combat.
  • The direction of the camera during cutscenes to show how the boss changes after each hit and the visual guides needed to represent the curse of action.
  • Planning and structuring animations by pieces to differentiate interactive parts, attacks, platforms, decorative elements + the use of speed variations to enhance specific effects on multiple sequences.

Taking all of this into consideration, we outlined the space in our vector grid where the rest of the designs have been made. Everything is scaled into this editor so we can change easily every representation of an object/platform/character and translate it later into pixel art.

.

After this, we created a raw environment of 3 x 3 stories inside our Unity’s level editor to do real-time tests with Subject W. That was the time to fine-tune the distance between platforms and position the placeholders for the different objects before stepping into the drawing board.

Frames upon frames of animation

We ended up with a boss composed of 100 ~ layers. Each layer has 30 frames of animation making a total of 3,000+ individual drawings, with almost the size of the entire scenario. It’s the biggest component of the entire game.

Additional sequences were added later in Aseprite to create easier animations, but at the beginning, we couldn't relay in our trustful pixel art program to develop the massive parts of this character. Performing this task with a highly detailed illustration per frame was undoable, so we started searching for other tools that were able to transform, rotate and distort the size of a layer without redrawing each frame separately.

The solution to this problem appeared to be the use of triangular meshes on .png files that allowed us to establish transformation points on specific frames inside the timeline and let the program distort each sprite on its own.

It was also essential to find a tool that allowed us to work with the lowest resolution possible since our graphics required pixel-perfect rotation and scaling.

Some of the programs that we tested where:

  • Spine: possibly the best tool to animate this kind of sprites and export them later to Unity. Supports pixel-perfect style animations disabling the linear filtering in Settings, and also has a bone system and a mesh tool. On the downside, it is not the cheapest program, and its Essential version doesn’t support the mesh option (our main need).
  • DragonBones: a free Chinese copycat of Spine. Almost the same tools and functionalities as the previous one, but we didn’t manage to use the mesh tool properly (it returned the graphics to non-pixel perfect sprites or didn’t export the sequences correctly).
  • After Effects: it ended up being our solution to import our layered document and animate everything at once with the use of its puppet pin tool. If you decide to use it for animation, you can use the 30-day trial or download it for a low monthly price for the period of time you’ll need it.

After Effects -or AE in short- isn’t the most friendly program out there, but it served its purpose in order to simplify the animation process. These are some of the pros and cons of pixel-art animation with After Effects:

Pros:

  • You can import a multilayered Photoshop document with each layer positioned in place in your composition.
  • Pixel perfect rendering.
  • Easy to use puppet tool with different mesh options.
  • Easy to use velocity curves and adjustment layers (color balance, etc.).
  • It can import groups composed of layers, keeping things organized.
  • Able to shorten or enlarge sequences while maintaining the equidistance between keyframes and create different starting points inside a loop via code snippets.

Cons:

  • If a .psd file is changed outside After Effects it doesn’t update the composition with the new elements.
  • Also, if you create a mesh over a sprite and the sprite has more or fewer pixels it would end up breaking the animation/mesh or not working at all.
  • The pixel transformation is not always as clean as you want it to, so it requires fine-tuning in Aseprite/ other pixel programs that support .png sequences.
  • It can’t export all the layers separated at batch in once, you have to export them one by one (there are external plugins to do so, but didn’t manage to make them work properly).

.

This is a sample of one the parts created with puppet pins. Instead of redrawing the lumps frame by frame (it would take hours to obtain a fluid animation like this drawing free-hand style), the program does all the heavy lifting by transforming the points assigned to each part of the sprite.

Creating a composition to animate and exporting the layered drawing  

As we stated in the pros and cons above, AE doesn’t update a .psd file once is imported, so we needed to figure out another way to import layers that allowed us to make changes if necessary without losing the already made animations. Our solution was to check the -File > Generate > Image Assets- option in Photoshop which exports all layers separately with .png extension in real time and later import them at once to After.

.

.

Ordering 100 layers in the timeline was a little tedious, but we didn’t find another solution at the time. Next step consisted on marking all layers with the dotted line icon inside the timeline’s quality and sampling checkbox.

What a mesh!

With the composition ready to animate we used the puppet tool, establishing a simple mesh and adding puppet points in the key areas that we wanted to move or deform on each layer.

.

Usually, three keyframes (initial, middle and final) are enough to create a good animation, but you can also add multiple keys to generate a great, detailed movement. The first and last keyframes are left untouched since they will become the standard position of the sprite. It’s the middle key the one that we need to move, so the loop goes to this position and returns to its original point later. To show the keyframes the layer/s need to stay selected while pressing the U key. The F9 key (also right-clicking the frame and going to > keyframe assistant) adds ease In and Out velocity parameters for a smooth transition between keyframes.

Animation length

The composition settings were designated to 25 frames per second with a non-specific timeline set up. At first, we exported the layers with 4 seconds of frame rendering, which resulted in 60 frame animations (reeaaally smooth but extremely heavy for Aseprite when we needed to import a ton of .png sequences into a single file. The other downside was that most of the frames required polishing, so we decided to shorten the anims with a 2 seconds frame rendering (using the stretch option accessed by right-clicking the columns on the timeline). This way the keyframes keep their equidistance, giving us a 30 frame animation, way more manageable considering the number of layers.

Comparison between a 60 and a 30 frame sequence. The 30 frame animation was smooth enough and required less rework + it’s more manageable.

Exporting the sequence to a pixel-art program

Now with the render bar/ work area cropped to the 2 seconds mark each layer is exported separately by clicking the dot of the timeline (solo option) to isolate its content and send it to render (ctrl+M).

.

.

The render queue shows the selected timeframe and a bunch of options.  For this process we created a specific profile with a set of parameters that fitted our needs: 

  • Render settings: at 15 fps (the speed used by us in most Unity anims)
  • Output module: png sequence, RGB + Alpha (to preserve transparency around the objects)

.

.

After the export, we end up with a folder full of png's named in sequential order. When the first .png is dragged into Aseprite the rest will follow the chain import and... voila! You have a 30 frame animation ready to go in .ase format.

Polishing

Now all the misplaced pixels and surface spikes are erased.

.

The jagged lines and shapes are cleaned to obtain a sharper animation. It takes some time to edit all the frames of a sequence, but it’s still less time consuming than animate from scratch. The other benefit comes from being a mechanical task, so other members of the studio can help with the process and speed things up.

In some cases, the layer order is altered to create a more natural movement, and some frames are shortened to avoid repeated frames originated by the ease In and Out interpolations of After Effects.

.

This is the final animation of the first sprite shown. Some effects were added later on Aseprite using the FX tool to blur green circles and create the glowing effect. The white reflection on top of each lump is drawn by hand.

Well, and that’s more or less the animation process using a mesh tool outside Aseprite. I will encourage game designers to use this option IF they work well with the Adobe suite, but probably the best option is to use the Spine program if they can afford it.

The Secret labs

Well, they are not “secret” per se, but we called them like that because of their dark aesthetic and the isolated feel of their design. Inside this subdivision of G.E.R. the bioengineering team tests the other Subjects (Were did they come from? Is every safety protocol secured?) so a lot of surprises can happen around this part of the facility.

.

We are always worried about the superposition of characters and interactives with their backgrounds, but this time we didn’t face the same kind of trouble. Other labs that have clearer walls needed subtle color gradients applied to them to create a contrast and help the interactives to stand out. The challenge with this kind of scenery was the opposite: trying to blend a little these elements with the overall tones of their surroundings.

.

The use of color grading adjustment layers helps merge the different tones and adds more richness and depth to this stages.

.

When we were designing the multiple assets for this labs, we’ve opted to change the white/clear surfaces with metallic ones, going for a more industrial, cold look. New machines have been designed for this part with orange signs to help them stand out and give you tips about where to go or what things can be used. We've also added a lot of glass elements with a vibrant blue-ish color enhanced by the use of highly contrasted color curves.

Background walls are composed by a set of desaturated green layers behind a dark gradient to showcase the absence of light (it is a bad idea to isolate dangerous light-absorbing forms inside a bright environment). The glasses on the back are tinted with darker colors, giving the notion of solitude and mystery. What things can appear on the other side?

The containment tanks can be seen alongside this rooms, and some designs represent that not everything is going to be as expected for the scientist that work with this Subjects.

This one is not a regular tube...

___

And that’s about it!

Even with the shortcuts showed in this post, the design process and the amount of animation conceived the last months was overwhelming, more so considering the pile of setbacks that we faced. In any case, we think that ending the game with a huge battle and putting all things at stake would be a cool gaming experience, so all the hours put into it will be worth it.

We hope that this info is helpful to devs and amateur artists alike. It’s hard to find detailed pixel-perfect bone and mesh tutorials out there, so at least we can contribute to the gaming community and shed some light in the use of techniques that don’t require free-hand pose by pose animation.

See you around, and don’t forget to comment! Now we can answer each backer individually with the improved message system of Kickstarter ;)

Stefan V, Thomas Adamantiou, and 80 more people like this update.

Comments

Only backers can post comments. Log In
    1. gadam07 on

      I've been going through my old Kickstarter backlog tonight to see where many of these games I've forgotten about have ended up. I have to say I'm extremely pleased to see development continuing and looking great on Paradise Lost. Many have outright died years ago. With the level of detail being built into this one, however, I think we could be looking at a modern classic which will sell many more copies upon release. Keep it up!

    2. Shai Abraham on

      @Beh Kok Seng: Not that I disagree with your comment about over-exhaustion, but regarding the 24FPS thing, that's just not true. Firstly, it's obvious to anyone who has played games that there is an extreme noticeable difference between 24FPS and 60FPS. But there's also this https://linustechtips.com/main/topic/327386-debunking-the-eyes-see-at-24-fps-myth/

    3. Radoslav Sharapanov on

      Thanks for the update, take care of yourself and good luck with the game. Don't worry about the delay. Cheers

    4. Asthree Works 2-time creator on

      @everyone: we can't thank you enough for the kind words. Seeing the amount of support received and how understanding is everyone with the current development situation is really encouraging. Couldn't ask for a better community to share this dream with.

      Love you all (৹˃﹏˂̵৹)

    5. Adam Cooperman
      Superbacker
      on

      I gotta say, I'm super happy to see so many people in these comments ok with waiting. I understand why some people get frustrated by Kickstarters that miss their estimated fulfillment dates but it happens so often for so many reasons, *especially* with video games.

      Thank you for the update and I'm really encouraged and impressed with the progress. I continue to be really fascinated with the in depth problems and problem solving you're showcasing. It's fascinating stuff to me and it really makes me feel involved with the process and not just a pre-order customer. Keep up the great work!

    6. Jaison Miller on

      I’ll add my own thanks for the update and agree with the general consensus of focussing on health! Looking forward to playing the game, it’s interesting to think back to 2013! Are you taking any more donations to help with all the further design?

    7. Missing avatar

      James Siddle on

      Thanks for the update, keep up the good work. Also I I'd echo what everyone else has been saying, make sure you take take of yourself. It's great to be stretched, but not stressed.

    8. Missing avatar

      John Lloyd Pinches IV on

      I had back problems caused by too much chair time (herniated disc) and was greatly helped by a back-focused yoga regimen. Thanks for the great update and hope you can find a healthy work/life balance.

    9. Nate Berry on

      I'm sure this game is going to be amazing when it finally comes out. Thank you for the update and your continued hard work. Be healthy and kick ass. We are all rooting for you.

    10. Nicholas Tasker on

      Take your time guys. We'll play the game when it's ready, so please don't compromise your health rushing to get things done faster!

    11. Mirvra on

      I'd rather wait longer for a game then see it's devs push themselves too hard ^^;; So yeah as everyone else has been saying: Take care of yourselves first and foremost... No one wants to see you all get sick or hurt yourselves or worse for a game...

    12. drmandarin
      Superbacker
      on

      Thank you for a great update. Please focus your priority on your health and wellbeing, I don't think any reasonable backer would want you to sacrifice those for any project. Unplanned and unexpected factors causing delays are inevitable - the best that can be done is to respond and update your project plan. Again, most reasonable backers will understand a delay in such a project, the most important (after your health) is that you please keep us up to date and informed as you have been doing. Thanks, take care and good luck.

    13. Beh Kok Seng
      Superbacker
      on

      Don’t let work ruin your health, but also don’t let rest turn into a holiday...

      For a pixel art game, 30 fps is already good as our eyes can process at an average of 24 fps.

    14. Missing avatar

      Juha M. on

      Thank you for the update! Take care.

      One of the most wanted games of 2019.

    15. Jai Bishop on

      Thanks for the very (very) detailed update. As everyone else has said, please keep your health as a top priority.
      Great to see the progress, your problem solving and the tantalizing final boss information.

    16. Zombra on

      Never would have guessed that a $12 pixel game about a talking houseplant could turn into a decade-long voyage of discovery, adventure, tragedy, and redemption.

      Best wishes for your continued good health. Nobody wants you hurting yourself over a game! Looking forward to FCPL when it's ready.

    17. Missing avatar

      Paul Rascher on

      It's good to hear back from you guys again. Sorry too hear about the health and back problems.

      It's great you guys are keeping with communications on the game development. The updated animation, sprites and objects are looking great. Also thanks in advance for no spoilers to the game, it wouldn't be any fun if there were.

      I want too applaud the work and effort your team are doing in the project. Please let them know they're all doing great work and I wish them all the very best and appreciate their struggles and efforts in what they are doing.

    18. Polge Clement on

      Honestly, at this point, i don't even care about the release date anymore. But in a good way ! Like, I know you guys are working hard, i understand the hardship you've been through, and honestly, no game is worth your health. At this point, a few months more or less isn't gonna change anything - just make a game you can be proud of, and don't sacrifice yourself on the way ;)

      Great update is great, I must admit, reading the first line, I thought the project had died, and i'm glad it didn't ;)

      I backed this project expecting a small game for ~10$, and i feel like i'm gonna get way more than my money worth, and is really worth the wait.

      Keep up the good work !

    19. Aesgaerius on

      Thank you for the update, transparency is the most important thing, and staying alive as well!

    20. Niki Coppola
      Superbacker
      on

      Coming to Nintendo Switch?

    21. Sharkey on

      Thank you for the fat update, and glad to hear you’re taking it easier on your health! No worries about the delay, the wait will surely be worth it!!!

    22. James on

      Thanks for the honest and interesting update. Glad to hear you’re keeping your health in mind and that the game is progressing. Very much looking forward to finished product!

    23. Asthree Works 2-time creator on

      @everyone: thanks for your kind words an understanding!
      .
      @Alex Valero "Danda": the project creator can respond directly to the backer's post, but it seems that it only works on the main comments section... the option doesn't appear here :(

    24. 6R3ND3L on

      Excellent update, thank you!

      Always of course, take care of yourself. Without you, you can't take care of others or build your dreams.

    25. Alex Valero "Danda" on

      Don't overwork yourself! Just take it easy.

      Just curious... What has changed in the Kickstarter message system?

    26. Jacob Kohl on

      Looking good! Glad to see things are moving forward even if not at the pace anyone would like.

    27. Imaria on

      As someone who has been fairly critical of how you guys have handled things in the past, I'll say that this is a great update. Clear communication, great information, and still maintaining a release timeline (even if it had to be moved). Keep your health up!