Exceptional plant progress

September 05, 2017

Latest video, plant timelapse:

SO MUCH PROGRESS since the last update!!

Implementation Notes

A few weeks ago, I had been struggling with exactly what data structure to use for the plant. It felt like the NxN grid was the wrong data structure – code was hard to write, the abstraction just didn’t feel quite right, etc. I wanted something that could more properly represent each “node” of plant, and I wanted something that contained pointers to the next node(s) of the plant, and a pointer to the parent node…

And then I realized…

Clearly the right data structure was a TREE!

Once I got the plant represented as a 7-ary tree (and once I finally got all the bugs out…), the rest of the code was pretty straightforward, though it’s not too pretty.

Things I could (but probably won’t) clean up later:

A fun intermediate stage

When I was playing around with plant growth algorithms, I made this happen:

Didn’t stick with this algorithm, but it’s fun to watch!

Console debugging

I was having trouble getting my 7-ary tree working perfectly, and honestly what I should have done was written a unit test for the PlantNode data structure itself. Had I gone that direction from the beginning, I am certain it would have saved me time. But that’s not what I did!

Instead, I mostly suffered through print-statement debugging, until I realized that the tree growth would be easier to “see” with a little bit of color.

So I wrote a debug mode that was kind of cool, where I color-coded each branch of the tree, and matched the console log statements to the color of the branch:

TODOs for next time

Bloom and grow

August 23, 2017

I completed my TODOs from yesterday: plants now grow in 4 directions (well, up to 4 directions) and blossom into flowers!

Latest video:

🎵 blossom of snow may you bloom and grow 🎵

I guess technically this is grow-and-blooming, but the blooms will turn into strawberries tomorrow, I think!

Implementation Notes

I chose a straightforward implementation that’s slightly broken in the following ways:

  1. Sometimes there are less than 4 growing stems:

  2. Sometimes a stem gets stuck and doesn’t end up blossoming:

I think I want to fix issue (1) and possibly also issue (2), but since it’s kind of a tricky problem, I decided I won’t fix them right away. I’m going to focus on finishing a simple version of the game first. After I get a mostly-good-enough version of that, I’ll work on polishing up the grow behavior!

Console debugging

I also added some debug functions that you can call via the DevTools console:

And I looked up how to add style to your console messages! The code is not super elegant:

const consoleStyle = 'color: #008751; font-size: 12px';
console.log('%c------------------------------------------------------', consoleStyle);
console.log('%c                Welcome to PLANTSIM', consoleStyle);
console.log('%c------------------------------------------------------', consoleStyle);
console.log('%c  You can use the following commands to debug:', consoleStyle);
const commandStyle = 'color: #FF004D; font-size: 12px';
console.log('%c  > %cworld.debugStep(n)%c: Draw n steps of the plant (must plant seed first)', consoleStyle, commandStyle, consoleStyle);
console.log('%c  > %cworld.bloom()%c: Try to draw flowers at the stems', consoleStyle, commandStyle, consoleStyle);

But it’s pretty fun!

TODOs for next time

Oh we’ve got two sprouts now

August 22, 2017

Now there are two randomly growing stems!

Latest video:

Implementation Notes

It’s really fun to figure out the algorithm for strawberry pixel plant growth! It’s being driven from my pixel art, actually. I start drawing a random pixel strawberry plant, then I try to figure out what decisions I’m making as I’m manually making a pretty pixel picture. Then I try to figure out how to code them up!

I rewrote the guts of the Plant class today to get both stems growing:

At some point I’ll also play around with adding little leaves and smaller offshoot stems for appearance.

Pixel Art Notes

Drew a little more concept art, to help me understand how plants should grow:

Also decided on colors for the “unripe” strawberries!

TODOs for next time

Basically what I wrote in the implementation notes!

A sprout of a game

August 18, 2017

Wooooo, I started coding!

And here’s a video of the action:

The actual game will not involve clicking a canvas to make the plant grow - you’ll need to give it water and love and attention etc. But I’m going with this for now, just to get the random generation part working.

Implementation Notes

Pixel Art Notes

The art of this game is important to me (and to the game!), but I’m very new to pixel art. I found MortMort’s YouTube channel super helpful for tips on creating pixel drawings, esp this video:

I’ve already incorporated the “Avoiding doubles” tip in my plant generation, for a smoother pixel line. I think on Monday I’ll try to incorporate his “Avoid jaggies” suggestion as well.


For Monday

Plant Sim Begins!

August 16, 2017

I’m creating a game I’m temporarily calling Plant Sim*, which lets you plant a strawberry plant from seed and follow its growth!

It’s like a Tamagotchi, but with a strawberry plant: if you water the plant daily, you’ll see it grow! You’ll get a score that reflects how healthy and happy your plant is.

The plant will grow in random directions, depending on watering + space available (and maybe the sun). No two plants will be the same!

*argh I really need a better name.

Mock plants

I drew these by hand in PICO-8’s sprite editor*:

(*I know that this is not really the purpose of PICO-8’s sprite editor but it was convenient for my needs!)

Vague game ideas

Software design

For tomorrow