Joystick drift
Update and re-render. If you want to tweak a pseudo-3D graphic created with Zdog, be it in angle, position, or again scale, you cannot forget the two steps.
It is not enough to change one of the aspects of the illustration.
illustration.rotate.y = 0.2; You always need one more instruction: updateRenderGraph().
illustration.updateRenderGraph(); Pick a hard-coded value and call the method to see the result. But if you want more control on the change, nothing beats the interaction baked in battle-tested HTML elements, like an input of type range. Once you set up the element you just need to extract the value — refer to the input event to continuously track the measure — and repeat the two step process.
Of course nothing stops me from doing the same after the fact. Hopefully, this makes for a less than frustrating twist.
"Zdog Monday", a series of gorgeous pseudo-3D graphics built with Zdog in one day of the week.
There is a collection on CodePen, but if you want some context, and a few twists, I took care to write about each single piece.
- Beauty sleep
- Counting shapes
- Step through frames
- Spinning change
- One out of six
- Child's play
- Memory pop
- ZZ Anne
- Just keep spinning
- Advent of shapes
- Joystick drift
- Canard sans souci
- Brilliant idea
- Lighten up
- Guiding star
- Small whimsy
- Double axis
- Neigh we go round
- Having a ball
- Powerful mix
- Assembly code
- When lightning strikes
- Loopty loops
- Season's rewards
- Cherry-pick
- Trail blazer
- Hatch-a-doodle-doo
- Bubble up
- Think you can