As part of a company assignment, I developed a captivating 2D Bubbles website using HTML5 canvas, JavaScript, and CSS. The website features an interactive canvas with four bubbles displayed on the left side and corresponding arrows on the right. Upon clicking a bubble, the adjacent arrow smoothly moves towards it until contact, triggering a color transition of the bubble to grey. Implementing this functionality required a deep understanding of event handling, animation, and DOM manipulation. Additionally, I incorporated a reset button to restore the initial state of the bubbles and arrows. This project not only honed my skills in front-end development but also showcased my ability to create engaging user experiences through interactivity and visual effects.
