My Masterpiece

Homepage
Gallery
Delete functionality
Drawing functionality

Inspiration:

We wanted to create a fun, engaging, and positive environment where users could document core memories they've experienced throughout their daily life, and be able to have an interactive experience where they can draw anything they'd like and can collect memories into a gallery they can make into their "masterpiece."

What it does:

Our program utilizes the camera of the computer to track the user's pointer finger movement as they draw an image on the screen, giving the user the option to save or clear the image. If the user selects the save button, their image will be saved in a gallery of images for the user to refer back to. These images in the gallery can be deleted at any time as well. Furthermore, our project combines parts of computer vision with image storage to create an engaging environment for the user.

How we built it:

We used artificial intelligence to help generate code through prompt engineering. The languages we used were HTML, CSS, and Python. We used HTML, and CSS primarily for the front end part of our application-all the visible components in our project-and we used mainly python for the backend-the parts of our project that manage the camera functionality and database.

Challenges we ran into:

Most of the challenges we ran into were regarding GitHub and the importation of pngs. Towards the beginning parts of this project we were having a rough time dealing with committing and pushing the code. In terms of importing pngs, such as our logo and picture frame, which were hand drawn, getting the scale to align with the camera and overall layout was very tedious and time consuming.

Accomplishments that we're proud of:

Something that we are all pretty proud of us is navigating parts of backend code that we were all unfamiliar with. To go more into detail, we heavily utilized the camera in order to draw images with our fingers, and we had to work with tracking our hand movement and palm gestures which was unfamiliar territory for the most of us. Additionally, we're all proud of the fact we got work on the parts of the project that best suited our skill set.

What we learned:

We learned numerous things throughout this experience, from better understanding both backend and frontend code to simply working with other people to create one bigger project. This experience heightened each of our ability use external resources to aid us into creating a larger scale project, and it also helped our communication skills so we could all work with each other within an organized structure. Lastly, our frontend knowledge was overall pretty limited at the beginning but with the help of resources like React.js, mentors, and workshops we were able to gain a better grasp of it all.

What's next for My Masterpiece:

To continually improve our masterpiece, we hope to expand the scope of the project, aiming to make it available for multiple users to use at the same time and grow an online community where numerous amounts of people around the globe can share snippets of their day-to-day memories and keep in contact with others. Also, we hope to implement further functionality, like adding more button features, a streak system, expanding the scope of the gallery, adding customizable frames for the images the user draws, thus enhancing the user experience. Furthermore, we hope to include the use of AI tools within our project, to make it overall more efficient, as adding tools such as auto generated captions and auto generated audio describing the images as the user hovers over them are of interest to us, as it would allow those who are visually or audibly impaired to be able to know what the images are describing.