itch.io is community of indie game creators and players

Devlogs

Plant Technique

Silvi
A browser plant game made in HTML5

Hi! I want to show a little bit of the tech for Silvi, as well as talk about my post-jam plans. You can see my primary dev-log here:

So I’ll be primarily going into more techy stuff here!

+inhib_decay = 3
+stiffness = .3

leaf: ((.1, .3, 1, .8, .2, 0), #69cc45, 0, 0.3, .3, .01, .1)
stem: ((1, 1), #376339, 5, .8, .2, .4, 0) 
tiny_stem: ((1, 1), #69cc45, 5, .4, .2, .2, .05)
flower: ((.1, .1, .9, 1.3, 0), #d14232, 0, 0.4, .4, .05, .12)

>s=stem, max_inhib=14, height = .3, dist_stem = 8:
(
  (
    [leaf, angle=30, a_size=.7, len=2.5 {.7}
    leaf, angle=-50, a_size=.7, len=2.5 {.7}] {.7}
    stem, angle=0, size=1, len=.2 {1}
  ) {.2}
  [
	stem, angle=12, size = 0.95, len=.5 {.6}
    stem, angle=-12, size = 0.95, len=.6 {1}
  ] {.3}
  (
    stem, angle=10, size=.9, len = .6 {.4}
    stem, angle=-10, size=.9, len = .6 {.5}
  ) {.2}
) {.1}

s=stem, min_dist = 3, height = 1:
(
    +[
        tiny_stem, angle=15, size = 0.8, len=.6 {.3}
        tiny_stem, angle=-10, size = 0.9, len=.5 {.3}
        stem, angle=5, size=0.3, len=.2 {1}
    ] {.5}
) {1}

s=tiny_stem:
(
    (
        flower, angle = 0, a_size = .3, len = 0.2 {1}
        flower, angle = 60, a_size = .3, len = 0.2 {1}
        flower, angle = 120, a_size = .3, len = 0.2 {1}
        flower, angle = 180, a_size = .3, len = 0.2 {1}
        flower, angle = 240, a_size = .3, len = 0.2 {1}
        flower, angle = 300, a_size = .3, len = 0.2 {1}
    ) {.1}
) {1}

{
    stem: -1, .4, 90, 0, not;
    stem: 0, .2, 0, .9, not;
    stem: 1, .1, 5, .7, not;
    tiny_stem: 1, .2, 25, .3, grow;
    stem: 1, .08, -10, .5, grow;
}

do not be alarmed! this is a plant!!!! i promise.

It is a plant, it’s the way I define my plants in text. We’ll go over each section, because this mostly describes how my plant system works. This is for the “long leaf” plant in Silvi.

+inhib_decay = 3
+stiffness = .3

These are just some general variables for the plant. I’ll talk about inhibitor once we get to the growing part, but the stiffness is how resistant the plant is to getting blown around in the wind.

leaf: ((.1, .3, 1, .8, .2, 0), #69cc45, 0, 0.3, 0.3, .01, .1)
stem: ((1, 1), #376339, 5, .8, .2, .4, 0) 
tiny_stem: ((1, 1), #69cc45, 5, .4, .2, .2, .05)
flower: ((.1, .1, .9, 1.3, 0), #d14232, 0, 0.4, .4, .05, .12)

These are all the types of pieces the plant has. Plants in silvi are represented as a collection of elements, defined by nodes. These are the element types.

To take one of them, leaf, we can break it down into what each number means. The first (.1, .3, 1, .8, .2, 0) defines how it’s drawn. We take each of those numbers and interpret it as a width, evenly spaced along the element. The next bit, #69cc45, is just a hexedecimal color code that defines what color the element is. The next number, 0 in the leaf’s case but different for others, is the inhibitor - we’ll still hold off on that one. The next two 0.3, 0.3 tell us the maximum width the element can grow to as a mid-element (with a child and parent), and an end element (with no child). The next one 0.01 is the stiffness, and then the final one is the z-coordinate. I really should’ve named these, but this is what I did in the jam. Regrets. These numbers pretty much define what each element is!

The next part, starting with >s=stem, max_inhib=14, height = .3, dist_stem = 8: defines the way it grows. That line is a condition, it says if the previous element was a stem, the inhibitor is less than 14, the height is greater than 0.3, and the distance from the base along the stem is less than 8, these things can grow. That’s not exactly what it says but… naming problems. So this inhibitor thing. In real plants, they push a growing tip out and leave branch buds behind. These don’t grow, because the tip outputs an inhibiting chemical. Once the tip gets far enough away, the concentration of this chemical drops, and it can grow! This is Silvi’s attempt at modelling it.

To get back on track, if this condition is met, the things below can grow, but what does that mean?

  (
    [leaf, angle=30, a_size=.7, len=2.5 {.7}
    leaf, angle=-50, a_size=.7, len=2.5 {.7}] {.7}
    stem, angle=0, size=1, len=.2 {1}
  ) {.2}
  [
	stem, angle=12, size = 0.95, len=.5 {.6}
    stem, angle=-12, size = 0.95, len=.6 {1}
  ] {.3}
  +[
    stem, angle=10, size=.9, len = .6 {.4}
    stem, angle=-10, size=.9, len = .6 {.5}
  ] {.2}

You’ll see three kinds of groups in there. (), [], and +[]. Respectively, these mean “pick any number”, “pick exactly one”, and “pick at least one” of the things inside. The things in curly braces are chances for each to be rolled. Each line starting with an element type describes an actual element that grows out, with some angle deviation from its parent, some size, and some length. These can be nested too, allowing some really interesting behaviour!

[(
        flower_white, angle = 0, a_size = .5, len = 0.4 {1}
        flower_white, angle = 90, a_size = .5, len = 0.4 {1}
        flower_white, angle = 180, a_size = .5, len = 0.4 {1}
        flower_white, angle = 270, a_size = .5, len = 0.4 {1}
    ) {.1}
    (
        flower_yellow, angle = 30, a_size = .5, len = 0.4 {1}
        flower_yellow, angle = 120, a_size = .5, len = 0.4 {1}
        flower_yellow, angle = 210, a_size = .5, len = 0.4 {1}
        flower_yellow, angle = 300, a_size = .5, len = 0.4 {1}
    ) {.1}]{.1}

This either grows the petals of a white flower, or of a yellow flower!

Finally, at the very end, we have this:

{
    stem: -1, .4, 90, 0, not;
    stem: 0, .2, 0, .9, not;
    stem: 1, .1, 5, .7, not;
    tiny_stem: 1, .2, 25, .3, grow;
    stem: 1, .08, -10, .5, grow;
}

This just describes the stuff the plant starts with. It goes element type, element it connects to, width, angle, length, and whether it starts as a growing point!

This is really all there is to the way Silvi represents plants! Internally there’s some more logic that deals with actually carrying this out, and the sun’s and wind’s influence and such, but this is really all there is to each plant! That’s how I made them all in the last few hours of the jam!

Files

  • silvi-v0.0.5-web.zip 17 MB
    Oct 12, 2022
Download Silvi
Leave a comment