Development Process
My project started as an exploration of creative machine learning using ml5.js and p5.js. Inspired by the DoodleNet sample code, I built on a system based on the sample code where users can draw any patterns, and the program classifies it to predict a “mood.” Once the doodle is classified, the system generates dynamic visuals corresponding to the detected mood. I separated layers for the background, particle effects, and user drawings to keep the interface responsive and visually appealing. Buttons like “Clear” and “Start Reading” allow the user to control the experience interactively.
What I Learned
Through this project, I gained hands-on experience combining machine learning with creative coding. I learned how to integrate ml5 models in real-time applications and how to use classification outputs to dynamically drive visual effects. Experimenting with Perlin noise, particle systems, and color interpolation taught me how to create organic and visually engaging animations. Additionally, managing multiple layers of graphics helped me understand state management and how to prevent unwanted flickering in complex interactive systems.
Challenges Encountered
One of the main challenges was ensuring that the visuals accurately reflected the predicted mood. Initially, the fluid sphere tended to stay in blue/purple colors, which made the feedback feel static. Performance issues arose when too many particles were generated, causing the frame rate to drop. Another challenge was synchronizing user drawing, classification, and visual updates, as these processes had to work smoothly together without interfering with each other. Finally, the limitations of DoodleNet meant some doodles were misclassified, which occasionally led to unexpected mood outputs.
Potential Improvements
In the future, this project could be enhanced by making particles and sphere behavior fully reactive to each mood, for example, adjusting particle speed, size, and transparency based on mood intensity. I could also animate the user’s drawn lines to reflect the mood for a more unified visual experience. Optimizing particle management would improve performance, and using a custom-trained classification model could increase recognition accuracy. Adding additional interactive features, like particles that respond to mouse movement or audio input, could make the experience even more immersive.