Processing.js/Presentation
Background
- Matthew
- What is Processing.js?
- a JS port of the visual media programming language P5
- PJS outputs the picture/animation/etc. to the new HTML5 canvas element
- cadre of Seneca students, joined by others through the Internet, have been working to complete the port since Fall 2009
- Where did it come from?
- Processing
- An open source Java-based visual media programming language
- Developed by Ben Fry and Casey Reas at MIT as an educational tool
- Don't need to know Java, or be a programmer, do create sketches
- Has since gone on to be used in industry and spread over the Internet
- http://www.openprocessing.org/
- Continues to spread: Fry employed by Google to bring P5 to the Android OS for mobile devices
- P5 comes with its own development environment which can export "sketches" as a Java applet
- Applets can be embedded in websites asd usual
- A short demonstration of the PDE
- Canvas
- A new element in HTML5
- Used to draw images/animations/etc. directly on a webpage
- Comes with its own functions, which are accessed by JavaScript
- Smiley face example
- Canvas supported, to one degree or another, in most browsers. Coming to IE9?
- People already using it
- GitHub network chart for a more substantial example
- Anna will talk more about GitHub
- Processing
- Why Processing.js?
- Makes Processing more accessible, both for developers/artists and their clients/audiences; no need for Java, no need to download and install the PDE; browsers are ubiquitous, when the online Pjs development environment is complete, it'll be possible to develop on the web for the web
- Anna will talk about work toward the online development environment
- enhances the usefulness, and encourages adoption, of open technologies like canvas
- just as P5 makes it easier to create graphics in Java, so too does Pjs make it easier to make graphics in canvas
- create new ways of creating content
- Michael will show how Pjs, by leveraging the webs ability to mesh different technologies together, is helping to enhance or create new and wonderful content
- Pjs can help provide feedback to assess and improve browser JavaScript and canvas implementations
- Reduce the need for plugins and the pitfalls they entail
- Makes Processing more accessible, both for developers/artists and their clients/audiences; no need for Java, no need to download and install the PDE; browsers are ubiquitous, when the online Pjs development environment is complete, it'll be possible to develop on the web for the web
- History
- John Resig, notable JS developer better known for the jQuery library
- discovered P5 and was impressed, realized a JS library could interpret P5 code and output to canvas
- created Pjs, ported just enougn to get a gaggle of P5 examples, but had no time to pursue it
- heading up development passed to Al MacDonald (aka f1lt3r); also took an interested in Processing while looking for ways to enhance web pages
- Michael will show you some of the cool things f1lt3r's done with Pjs
- Pjs became one of Mozilla's projects they use to get students involved
- Professor David Humphrey brought the project into the open source development course, DPS909, last semester
- Work on Pjs continued into this semester with the followup course, DPS911.
- Lost a few, gained a few people
- Notable gain this year: Corban Brook. Professional web developer who's become one of our core devsand project managers
- Fruits of our labour
- in eight months, we've brought the library to an almost-release-worthy state
- still have issues with performance, and puzzling over how to port features in Java not easily replicated in JavaScript
- in the next little while we'll be showing you some of the results of that work
- Daniel will give you a taste of what's been done in the 2D realm; we've enhanced implementation started by Resig
- Andor will show you Pjs gone 3D, something that was added right here at Seneca
- Anna will show you the the nascent online Pjs development environment built upon Mozilla's Bespin project
- As one of the project leaders, she'll also give an overview of how the project has been organized
- Finally, Michael will show how Pjs is spreading across the web by sampling some of the ways its being used today
PImage
- Daniel
- talk about experience with PImage, having multiple opinions and ways of doing stuff
- getting to talk to originators of the processing language and meet and talk to people from mozilla and community
- demos/examples, color picker, thumbnail viewer, Andor's crayon sketch ?
- difficulties. performance issues
- how seneca open source courses helped me realize the power of community
3D
- Andor
- Intro
- Problem
- Processing requires 3D support
- Approach
- Use WebGL, a working standard to draw 3D objects
- Problems
- Lack of a roadmap
- WebGL is still a working standard, many bugs still exist
- WebGL isn't implemented in all browsers yet
- Some discrepencies exist between browsers
- Performance issues
- Demos
Bespin
- Anna
- show off bespin examples
Managing Process
- Anna
- Git Hub
- work-flow decisions
- decision making process
- managing an Open-Source project
- difficulties
Working with the Community
- Mickael
- Demos
- Usage around the web and world, askken, iPhone/iPad, teaching
- how big the community is: who uses processing, how many people in channel
- irc/twitter talking to people from around the world watching the news spread
- working with professionals
- working with people from all around the world