Jojo Johnson's profile

Don't Leaf Me Alone!

Title card for "Don't Leaf Me Alone!"
This weekend I had the pleasure of working with two of the most talented developers I know to create a game for a mini game jam on itch (though we didn't end up submitting the game). Links to the repo, art, and my developer friends' GitHub pages can be found at the bottom!
Tile sets and something unique about game art
One thing I learned from this process was that game art development is extremely satisfying. Often times, I am on the development side, so it was nice to put my hard work into something artistic and see it be brought to life by people who knew how to make it work. As a web designer, I am often very used to making things with responsivity in mind, though it was very freeing to just let that go for a bit while making these designs. For the tile set, every square is 128px by 128px, and there is a scale for basically every sprite/asset I made for this game. This was very new to me, but I felt like I picked it up quickly as it is easier to work in a space with a set height and width, the space in which we were working in being 1920px by 1080px.
Tile set for "Don't Leaf Me Alone!"
The tile set changed quite a bit throughout the development process, so there are a few open tiles to account for some of that possible change in the future without making major changes to the file size.

The art style that was chosen for this project was fun, boutiquey, cutesy, and a little whimsy! Nearly all of the elements are hand drawn on my laptop's track pad to keep that unique and whimsy feel, and I felt very excited to begin learning Affinity Designer for this project as well. I've found that Affinity's anchor point editing system is quite seamless, and I really enjoyed all the little features that came along with it--it really changed the designing process for me by miles.

The nice and unique thing about game art is that you only need one picture split into even squares to create a whole palette for your developers to paint a canvas with however they'd like. This was definitely a new concept to me, though a very exciting one!
Flower sprites
The flower sprites were the center of this game jam. The theme was "grow," and the object that we needed to have in the game was a flower.
Flower defenders and their projectiles for "Don't Leaf Me Alone!"
So I guess there is no better time than now to mention what the game is about! The idea was to make a sort of tower defense game, but there is only one flower you need to protect, and the flowers above are for defending that flower--but there's a catch! It's also a hybrid farming simulator game! You must make money to buy more defense flowers by selling the flowers you've grown and cultivated throughout the game!
Daisy phases for "Don't Leaf Me Alone!"
Throughout the game your daisy grows, and if you can successfully protect it all the way to it's final stage, you win!
The enemy
Now you might be wondering, "what am I protecting this flower against? Well we have the perfect enemy just for that! The fly was a unique design for this project because it is the only sprite with a continuous animation. It's wings flap up and down, all thanks to these next couple of tiles:
Fly sprites for "Don't Leaf Me Alone!"
In the first couple panels, we can see the individual design for both the up and down positioned wings on the fly, and on the bottom panel we can see the sprite actually used to animate the fly by switching between the opposing sides of the panel to switch the wing position. This was another hurdle I felt I had with game art--the curse of creating without knowing. I jumped head first into this, creating two separate sprites at first, thinking that would be the best way to do it, not being nearly as educated as my cohorts who understood what went into sprite animation much better than I did, so I was glad to have them on my team.
The right tools for the job
we came up with a set of tools that we ended up modifying later, but the basic set was a watering can to grow your plants, a glove to move your plants, and a shovel to sell your plants. We ended up scratching the glove because of potential exploits with being able to move your plants, but I wanted to include it as tribute to the entire design process.
Tools for "Don't Leaf Me Alone!"
Growing stronger
To add a little more to the game, fertilizers for increasing attack speed and flower health were added, and the design was entirely one of the developer's idea, which was fun for me to take another person's ideas and employ them through my own design.
Making a picture perfect UI
One thing I found I loved about game art development is that every button that is created is only a black box until you give it art to put on the button, and then the UI is customized to every one of your personal wants and needs! The nice thing about having an artist around is that you can create any asset at any time in the same consistent style.

There were two main UI elements that I was instructed to make. The first was the tool bar. The design I wanted to go with was a kind of wood grain and patch work feel.
Tool bar UI elements for "Don't Leaf Me Alone!"
The first is the entire tool bar background (again with that wood inspired texture that you will see pop up a few more times), the second is the shop button that appears above the tool bar to take you to the shop, the third is an empty tool bar slot, and the fourth is a selection indicator for indicating which tool/bud you have selected.

The second was the shop and the items inside the shop.
Shop UI elements for "Don't Leaf Me Alone!"
The first is a long span of the wood grain texture to cover the entire shop area, and the next two are patchwork tabs to hold the place of tab buttons in the shop.

Part two of designing for the shop was making info cards about the flower buds you can buy, and the fertilizers you can buy.
Shop cards for "Don't Leaf Me Alone!"
Title screens, end screens oh my!
One important part of making a game is communicating to the player how they did, what to do next, and how to play, replay, or quit... so I made buttons and title screens for all of those things!
Title and end screens for "Don't Leaf Me Alone!"
This set features the title tag for the game, and two screens declaring either a loss or a victory!
Menu buttons for "Don't Leaf Me Alone!"
This set also features three buttons to guide users on what to do next, as well as the next image showing the same wood grain, but sized for menu screens.
Menu-sized screen for "Don't Leaf Me Alone!"
Wrapping up
I want to thank my developer friends Levi and Josh who made my first time designing for a game very pleasant, and for clearly communicating their ideas and thoughts with me as I pressed out these designs for 24 hours--it was truly magical to see my work be brought to life in a way I had never seen before!

Here are some helpful links if you'd like to download the game and play it for yourself on Godot, find the art and download it for a project of your own, or if you'd like to find the GitHub profiles of me or the two awesome developers on this project.

The game repository:
https://github.com/levi-wj/DontLeafMeAlone

The Designs:
https://github.com/levi-wj/DontLeafMeAlone/tree/main/images

Jojo Johnson:
https://github.com/emmaohn

Levi Jones:
https://github.com/levi-wj

Josh Sooaemalelagi:
https://github.com/Nortories
Don't Leaf Me Alone!
Published:

Don't Leaf Me Alone!

Published: