I once saw little children and their parents have a blast creating art together on a huge wall covered with paper
What it does
Allows remote teams to co-create art together.
How we built it
Meteor, SVG and lots of caffeine.
autopublish 1.0.4 (For prototyping only) Publish the e... blaze-html-templates 1.0.1 Compile HTML templates into reactive... ecmascript 0.1.5 Compiler plugin that supports ES2015... es5-shim 4.1.13 Shims and polyfills to improve ECMA... insecure 1.0.4 (For prototyping only) Allow all dat... jquery 1.11.4 Manipulate the DOM using CSS selectors meteor-base 1.0.1 Packages that every Meteor app needs mobile-experience 1.0.1 Packages for a great mobile user exp... mongo 1.1.2 Adaptor for using MongoDB and Minimo... reactive-var 1.0.6 Reactive variable risul:bootstrap-colorpicker 2.2.0 Bootstrap Colorpicker: http://mjolni... session 1.1.1 Session variable standard-minifiers 1.0.1 Standard minifiers used with Meteor ... tracker 1.0.9 Dependency tracker to allow reactive... twbs:bootstrap 3.3.5 The most popular front-end framework...
Challenges we ran into
Our original plan was to allow user to drag an arbitrary multicolor SVG "brush", cloning it on every mousedrag. That produced beautiful pictures, but did not scale, as it created a huge DOM. In retrospect, we could have chosen a combined svg/canvass approach (SVG shapes drawn on canvass) to allow for both scalability and stunning visuals; but we also wanted the editor to be "infinite" on both large and small scale, i.e.
1) to zoom out and pan without limitations (the only limitation: not straying too far away from what's already drawn, expanding gradually), and
2) to zoom in, allowing for an infinite (or near infinite) level of detail. E.g. someone might draw the school, someone else might zoom in and draw a classroom, then a desk, then a book, then pictures in a book, etc.)
That did not materialize during this hackathon, but I intend to continue. Anyone wants to help?
Accomplishments that I'm proud of
Portability! The thing just worked on mobile without any effort at all, and worked very fast.
What we learned
SVG (both of us learned it just today!)
How far you can push a DOM
how not to bite more than you can swallow :-)
Simplicity. I started developing multiple drawing tools (pencil, polygon, ellipse, with an intent to create a flexible design allowing for 3rd party drawing tools); had to delete all but pencil halfway.
What's next for Infinite Image
Infinity! Infinite zoom in and out. Think Google Maps for artists.
There is no reason not to drag and drop (i.e. fully CRUD) individual components of vector graphics.
Custom 3rd party drawing tools - maybe.
Would anyone like parts of it on atmospherejs.com? Let us know.
Founder of Apex Software in Seattle. We develop Meteor apps for our clients. Yes, we are hiring Meteor devs, and we are looking for new clients! Contact me at email@example.com for more info.