Filter effects

From Effects Task Force

Jump to: navigation, search

This is a summary based on this thread.

Contents

Requested filter effects

Paul Irish held an informal poll on twitter, see results.

The most requested filters, by far, are: blur, saturation, compositing modes, noise, and color levels. A few folks also were interested in: sharpen, contrast, drop shadow (a la brad's proposal), and chroma key.

There were so many requests for blending/compositing modes and unique mentions of individual ones, that I could break out those, too. See the chart for detail (multiply has the most interest).

Additional effects mentioned by a single person are: feather, brightness, bump/displacement mapping, elliptical distortions, image fill, alpha masks, lighting effects, per color desaturate, wave distort, reflect, sparkles & rainbow effects, color matrix Interesting that brightness doesn't have a big demand. The rest of these probably out outside the bounds of these canned filters.

Worth mentioning that recently there have been a few javascript libraries people have been gravitating towards to apply these sort of effects:

http://mezzoblue.github.com/PaintbrushJS/demo/

http://peternitsch.net/bitmapdata.js/


Rik Cabanier: Looking at how Adobe's apps are set up and our customer files, a rough list in order of importance would be:

  1. colormatrix
  2. blur
  3. dropshadow
  4. glow
  5. bevel
  6. gradient glow
  7. gradient bevel

FXG 2.0 specification defining the above filters.

Proposed requirements

  • Ability to easily animate the filters (e.g via CSS Transitions)
  • Commonly used effects should have a simple shorthand syntax

Other related proposals

New Filter Primitives

  • Proposing some new svg filter primitives: http://electricbeach.org/?p=950
  • Color Range: select a color range to change that specific color, or exclude changing that specific color when changing others. (For example, changing the color of a car, or changing a color photo into grayscale while not changing the color of a red balloon in it.)


Automated Filter Region calculation

Optimization from looking at WebKit's and Firefox's implementation:

Legend: + union of two areas

Regions: feBlend result area = input-area + input2-area

feColorMatrix result area = input-area

feComponentTransfer result area = input-area

feComposite result area = ... IN = input2-area ATOP = input2-area ARITHMETIC = input-area + input2-area

feConvolveMatrix result area = input-area extended by kernel radius

feCustom result area = input-area extended by margin

feDiffuseLighting result area = unbound?

feDisplacementMap result area = unbound?

feDropShadow result area = input-size + input-size translated by offset extended by blur radius

feFlood result area = unbound?

feGaussianBlur result area = input-area extended by blur radius

feImage result area = referenced resource size

feMerge result area = (+ input-areas)

feMorphology result area = input-area extended by radius

feOffset result area = input area translated by dx/dy

feSpecularLighting result area = unbound?

feTile result area = unbound?

feTurbulence result area = unbound?

pseudo primitives result area = unbound?


All values with unbound? fall back to the filter region.

Personal tools