Randomization is a key feature in any generative design system, as a adding random variations is a way to get new an interesting output as well as adding more organic or interesting qualities to designs. Being able to use controlled randomization is also one of the reasons to use a parametric generative system like Paragraphic, as it allows you to try and adjust randomization ranges just like any other generation parameter.
The tricky thing with this is that you want to have these values be random enough so that there are no visible patterns in repetitions, but you also want them to be exactly the same each time you generate a layer. So that you get the same result when you look at the same file, or if you change some random parameter range back and forth. Most random number generation systems let you do this by resetting them to a state using a specific random seed, and then produce the same sequence of pseudo-random numbers. However, this can still cause issues since you then need to always request your numbers in the same order to get the same stable results.
The solution I’ve gone with for now to this issue is to simply set up a large static array of random values that I keep and don’t regenerate. This is the same approach I’ve previously used for the Vectoraster randomization features and in Patternodes. So when “generating” a random number Paragraphic actually just gets one of these pre-generated numbers, where which one can be offset by local random “seed” parameters and things like what transform and element index it is for. This way I can ensure that for example the same random value for the same element in a specific layer will always be the same “random value”, regardless of what order the generation happens in. And as long as there are enough pre-generated values there will be no repeating patterns.
Random transform group node
So now I’ve started implementing this functionality in the aptly named Random Transform layer node. This node takes the elements in the layer the node is on and applies a random transformation (offset, rotation or scaling) to each one separately, using a value range your set for each transform type.
This is a new type of node I’ve at least for now called a group node. They’re what I’ve previously called change nodes in that they modifies the elements in the layer the node is on. But with the difference that group nodes are mostly useful when used on layers with more than one element. In other words either group layers, or layers where you’ve previously added a repeater node so they produce a group of elements.
After spending a lot of time working on the fundamental building blocks of the design system and UI it’s nice to now finally be getting to some of the more advanced features. The stuff that make a parametric generative design system like Paragraphic actually provide some functionality that’s difficultly to do in more traditional design software, instead of just being a more clunky bare-bones version of Designer or Illustrator. Hopefully there will be a lot more of that going forward!
Additional improvements
UI/UX
- Improved tool automatic selection based on layer selection and node editing. For example changing to the repeater tool when you add or modify a repeater node or back to select when deselecting or finishing adding a shape.
- Improved handle editing by applying restrictions like proportional resizing and strict x or y offsets by holding shift when dragging.
- You can now add layer nodes from the layer context menu as well, and not just using the Add node button in the inspector.
New nodes
- Added new Circle repeater node, repeating elements in a circle, with multiple radial layers supported.
- Added new Line repeater node, repeating elements along a line with either a fixed count or fixed spacing between them.
- Added new Area repeater node, repeating elements in an area with either a fixed rows/columns count or fixed spacing between them.