Difference between revisions of "Candy-js"
Kpangilinan (talk | contribs) (→Project Details) |
Kpangilinan (talk | contribs) |
||
| Line 20: | Line 20: | ||
Various projects using video on the web need to create innovative and non-standard effects to transform the video, for example, applying filters, altering the video, using 2D and 3D effects, etc. This project will create a library that provides some commonly needed effects (e.g., colour filters, tilt shifting, etc.). This project will overlap and support the HTML5/Video Comic Book project. The follow is a list of Candy effects: | Various projects using video on the web need to create innovative and non-standard effects to transform the video, for example, applying filters, altering the video, using 2D and 3D effects, etc. This project will create a library that provides some commonly needed effects (e.g., colour filters, tilt shifting, etc.). This project will overlap and support the HTML5/Video Comic Book project. The follow is a list of Candy effects: | ||
* Normal - Displays the original video used in the <video> tag | * Normal - Displays the original video used in the <video> tag | ||
| − | * Comic - | + | * Comic -Darkens the dark, lightens the light, makes it look cartoony |
| − | * Grayscale - | + | * Grayscale -Black and white effect |
| − | * Sepia - | + | * Sepia -Dark brown grey color filter |
| − | * Green Screen | + | * Green Screen – Replaces green screen background for an image |
| − | * Rotate | + | * Rotate – Flips the video horizontally |
| − | * Negative - | + | * Negative -Turns positive RGB video colors into negative RGB |
| − | * | + | * Bright – Control brightness and darkness of video |
| − | + | * Emboss – Video is molded or carved in relief | |
| − | * Emboss | + | * Tilt-Shift – refers to the use of camera movements on small- and medium-format cameras, and sometimes specifically refers to the use of tilt for selective focus, often for simulating a miniature scene. |
| − | + | * Blur – Defocus on video | |
| − | * Tilt-Shift - | + | * RGB Filter – Manually add/subtract to RGB values |
| − | + | * Modulate – varies the brightness of an image’s pixels in a periodic way. It can be used add “Venitian blind”, “scanline” or “mesh” type effects. | |
| − | * | + | * Pixelate – transforms an image into a grid of uniformly colored rectangles. So named because it simulates increasing the size of pixels in the image. |
| − | * | + | * Disperse -Spreads/Scatters pixels from original video |
| − | * | ||
| − | * | ||
| − | * | ||
===Project Plan=== | ===Project Plan=== | ||
Revision as of 17:51, 13 December 2010
Contents
Project Name
Candy.js Library
Project Description
The Candy.js project is an effects extension to Popcorn.js.
Project Leader(s)
Project Leader: Kenneth Pangilinan
Contacts: Brett Gaylor, Scott Downe, Anna Sobiepanek, Dave Humphrey
Project Contributor(s)
Pointallize Effect: Contribution made by Brian Law who is working on ComicBook.js, his demo allowed me to analyze his source code and come up with the pointillism effect.
Project Details
Various projects using video on the web need to create innovative and non-standard effects to transform the video, for example, applying filters, altering the video, using 2D and 3D effects, etc. This project will create a library that provides some commonly needed effects (e.g., colour filters, tilt shifting, etc.). This project will overlap and support the HTML5/Video Comic Book project. The follow is a list of Candy effects:
- Normal - Displays the original video used in the <video> tag
- Comic -Darkens the dark, lightens the light, makes it look cartoony
- Grayscale -Black and white effect
- Sepia -Dark brown grey color filter
- Green Screen – Replaces green screen background for an image
- Rotate – Flips the video horizontally
- Negative -Turns positive RGB video colors into negative RGB
- Bright – Control brightness and darkness of video
- Emboss – Video is molded or carved in relief
- Tilt-Shift – refers to the use of camera movements on small- and medium-format cameras, and sometimes specifically refers to the use of tilt for selective focus, often for simulating a miniature scene.
- Blur – Defocus on video
- RGB Filter – Manually add/subtract to RGB values
- Modulate – varies the brightness of an image’s pixels in a periodic way. It can be used add “Venitian blind”, “scanline” or “mesh” type effects.
- Pixelate – transforms an image into a grid of uniformly colored rectangles. So named because it simulates increasing the size of pixels in the image.
- Disperse -Spreads/Scatters pixels from original video
Project Plan
| Release | Download Release | Features/Points Addressed |
| 0.1 | http://github.com/kpangilinan/Candy | Demos the Candy library effects |
| 0.2 | https://github.com/kpangilinan/Candy/tree/popit | 0.1 Release + dynamically changing the effects + dynamically changing green screen effect + brightness controller |
| 0.3 | https://github.com/kpangilinan/Candy/tree/0_3 | 0.1 Release + 0.2 Release + RGB filter + Emboss + Blur + Tilt-Shift + Disperse + Modulate + Pixelate + Pointillize |
Project News
September:
- Implemented original video onto canvas
- Implemented cartoon effect
- Implemented grayscale effect
- Implemented sepia effect
- Implemented green screen effect
- Implemented flip effect
October:
- Setup GIT Hub repository
- Implemented negative effect
- Implemented interlaced effect
- Released Candy version 0.1!
November:
- Added 'data-apply-effect' attribute to the <video>
- Modularize source code in Candy.js library
- Dynamically change brightness level
- Dynamically change green screen background
- Dynamically change videos effects
- Released Candy version 0.2!
December:
- Implemented Color Filter
- Implemented Emboss Effect
- Implemented Blur Effect
- Implemented Tilt-Shift Effect
- Implemented Disperse Effect
- Implemented Modulate Effect
- Implemented Pixelate Effect
- Implemented Pointillize Effect
- Released Candy version 0.3!
