Inspiration
I originally conceived the idea thinking it could be a good idea to raise money for a nonprofit I worked for in the Summer of 2015. Now I believe that it could have many more applications, including gifts for family members and friends.
What it does
The application takes an inputted picture then slices that picture into equal-sized squares or rectangles (depending on the size of the original picture). These tiny pictures are then saved onto a database. Then a user would go to the web application and the first picture that hasn't been drawn yet and isn't currently being worked on is displayed with an HTML5 canvas next to it so that the user can try to recreate the original square as best as they can using the app's drawing capabilities. Once they are done, they click the save button and that picture is then saved into it's row in the database. Once all of the pictures have been drawn, the application returns an original work of art, crowdsourced by the public.
How I built it
I built the front end using HTML, CSS, Javascript and JQuery. The original picture was sliced using PHP and then saved to the database using mySQL.
Challenges I ran into
I was able to implement drawing functionality complete with a color picker. After drawing one line or dot of a certain color, when the user switches to a new color and beings to draw on the Canvas, all previous lines/points that were drawn change to the new color.
Accomplishments that I'm proud of
I'm proud of the fact that I came to my first Hackathon and met like-minded "hackers" like myself, learning a lot in the process.
What I learned
I learned a lot more about mobile app development.
What's next for Crowdsourced Drawing Web Application
I need to troubleshoot the problems outlined above in challenges. Also, I need to add a save button to the HTML that sends the ID and picture as a JSON object to the mySQL database.
Log in or sign up for Devpost to join the conversation.