Candace! Canvas HTML Final Project



Candace! 


Creating "Candace!" was a lot of fun for me but there were several challenging parts that I had to work through. I had to pay a lot of attention to how I was layering the different elements because if an arm was behind the shirt or hair, the image would look completely different. Even the eyebrows had to be carefully positioned. 

I came to love the Bezier Curve and used it countless times so I could get the most precise depiction of the image, especially when it came to the subtle curves in the shirt and arms. I saved the cellphone for last because I knew the buttons would be challenging. This was a smart move on my behalf because by the time I made them, I was extremely comfortable with coding curves. It might not look like the buttons are different from a distance, but if you zoom in, each one is unique. I knew I wouldn't be satisfied with the final product if I used circles and called it a day. Each one is a combination of bezier curves and arcs. 

I am happy with how this project turned out and think I did a good job of copying a cartoon to the finest of details. I am a fan of coloring in the lines and making things perfect so knowing that the image is practically a carbon copy makes me proud, especially because I have never coded before. I definitely could have made some more creative decisions besides the radial gradient and did consider them, but ultimately opted to not change too much because that's the same character I know and love. The only thing I might have done differently is made the eyes interactive. I thought of that idea as we were looking at other projects in class and think it could have been funny, maybe next time!


The Original Picture:




Here are a few screenshots of my code: 




This project contained just under 900 lines of code!

Comments

Popular Posts