Presentation slides from the second session. Have a look! For any doubts, feel free to message your queries at fb.com/koderunners . Happy Coding!

1. The KODERUNNERS Community
Creative Coding 101 - Abhik Biswas

2. The KODERUNNERS Community
• Creative Coding 102
Processing : Basics and Fractals
By : Abhik Biswas & Soumik Rakshit (ft. Arijit Roy) , CSE

3. The KODERUNNERS Community
Recap : Cartesian Map in Processing
On a computer screen, the origin (0, 0)
is always at the top left location of the
screen
Creative Coding 101 - Abhik Biswas ; Soumik Rakshit

4. The KODERUNNERS Community
translate(width , height);
Changes the width of the
centre (X axis)
Changes the height of
the centre (Y axis)

5. The KODERUNNERS Community
frameRate(Image rate);
Determines the speed with
which the image changes

6. The KODERUNNERS Community
Creative Coding 101 - Abhik Biswas
Hands on : Clock

7. The KODERUNNERS Community
Algorithmic Tree
Let us consider the different parts of a tree (Trunk , Branches ,
Leaves)
Branches are evolved from the trunks. Branches are again
evolved from branches. (Self similar and repeat style)
Self similar and Repeat style = Fractal Progression

8. The KODERUNNERS Community

9. The KODERUNNERS Community
Branching Algorithms
Draw
Draw two or more opposing
diagonal branches from the
top of the trunk.
Continue
At the ends of these branches,
continue adding two or more
opposing diagonal,slightly
thinner branches.
Go back
Go back to step two until a
specific limit is reached.

10. The KODERUNNERS Community
Creative Coding 101 - Abhik Biswas
Hands on : Fractal Tree