NOC#W01 – Flower 🌸

• Project – Flower

 

• Process

1. Start from playing with the exercise example code

Example code link: https://editor.p5js.org/MOQN/sketches/FDL6XpJFv

2. Change the shape, color and angle to make it more like flower

3. Add Mouse Interaction to make various and unpredictable effects

4. Make an automatic animation separated from the mouse interaction

5. A rectangle try – it looked good but it didn’t meet my expectation.

6. Add Scale() 

7. Add more animations to make it look fancy  (the version I think which is the most like a flower animation)

 (A final draft)

• Reflection/ lesson-learned

It was out of my expectation that I have learnt how to make such delicate images by code in the first class. rotate(), lerp(), translate(), push() and pop(), which are essential in my assignment, are all what I first learnt and help me develop more possibilities of coding. Also, I found the reference on p5.js website was very useful. However, I still need to learn more about vertex() and some math function code. I didn’t know how to use them well so I gave up adding them to my code. I hope I can figure them out through more practice.

• Sketch Link

https://editor.p5js.org/Tinggg/sketches/vlBrk1j7S

Leave a Reply

Your email address will not be published. Required fields are marked *