I sat down after a while to do a few sketches on P5.js , I had done some a few months ago but using the basic functions like ellipse(), rect(), etc. While thinking about what I wanted to make, I noticed I was holding on to my NYU ID and the torch was the first thing I noticed on it. Ergo, I decided to try that completely aware of the fact that curves are difficult!
Making this on photoshop or illustrator is 4000 gazillion times easier is my conclusion after hours of trying and getting nowhere!
I decided to take inspiration from my fellow classmates and went through their blogs, one of whom had used illustrator to depict the exact co-ordinates of points and then wrote the code! So I decided maybe that would help!
I then decided to evoke the mathematician in me and started looking at computer graphics and curves. Bezier seems to be AWESOME! (Does not change the fact that I still don't know how to use his equations to my advantage but nonetheless AWESOME!)
Starting with any curve from left to right or from right to left on the NYU logo, according to my understanding - we would require a 4th order curve.
The question now is how do I determine the 4 variables and how do I then calculate according to the p5 syntax bezier() !!!!!
I needed 4 points -
- One end of the curve - check
- The other end of the curve - check
- First controlling point - no clue
- Second controlling point - no clue
(I am hoping that someday in the future I can come back to this post and rejoice!)