Overview
For this first assignment, this was actually my very first time coding. Because of that, I wanted to keep things simple, but also try something that I thought was cool and interesting. I decided to make a portrait in a scene that could change from day to night. The feature I liked the most was being able to switch the background from morning to night with a single click, it felt like a big achievement for me and made the project more fun. Overall, I kept the shapes and details simple, but I made sure that I could still change and experiment with the code.
https://editor.p5js.org/hajarr.alkhaja/full/
https://editor.p5js.org/hajarr.alkhaja/sketches/YawBFYuSj
Process
We started with a warm-up in class where we learned how to make a simple circle. That gave an idea on how to code for different shapes. We also learned how to make shapes change with a mouse click, and this inspired me to add the day and night feature. I watched the tutorial videos from YouTube, which helped me understand how to use shapes like ellipses, arcs, and triangles. From there, I built my project step by step, first the background, then the grass and sky, and finally the girl. I kept it simple, using a different shape and color for each feature, and added a night variable so everything could change between day and night.
Code Highlights
At first, I really struggled with the code because I didn’t fully understand how the night variable and the if (night) statements worked. It was confusing to me how to make something happen only in the day or only in the night. Slowly, I started to get the hang of it, and once I understood the logic, it became much easier. In the end, most of my code was just repeating the same pattern in different ways, for example, changing colors, showing the sun or the moon, or opening and closing the eyes.
Another challenge I faced was figuring out where to place each shape. I had to keep adjusting the positions, running the code, and moving things again until I found the right spots. This took a lot of trial and error, but it also helped me learn how the coordinate system works.
At one point my code even stopped working completely and gave me errors I didn’t understand. I couldn’t figure out why, so I used AI to help me find the mistake. Once I fixed it, everything started working again, and I was able to continue building my portrait. Overall, I feel like I learned a lot about both the logic of coding and the patience it takes to position and test shapes.