Dynamic Filters - Restyle Your Image

[DTP Articles]
[Vector Articles]
[Bitmap Articles]
[Web Articles]
[3D Articles]

[Free Photos]
[Colour Management]
[Photo Sharing]
[Drupal Tutorial]
[Introducing CMS]
[Photo to Art Tutorial]
[3D Rendering Tutorial]
[Future of Web Design]
[Google Bourbon]
[Google Background]
[Adobe-Macromedia]
[Live Paint Live Trace]
[3D Materials]
[Extending Bitmaps]
[Image Modes]
[Elements 3]
[Flash Video]
[Flash Bitmaps]
[CD Authoring]
[Mac PC History]
[Best 3D App ]
[Photo Edit Roundup]
[Photoshop Patterns]
[Web Success]
[Texture Library]
[Web Stats ]
[Best Web App]
[Best Creative App]
[3D to 2D]
[Corel or Not?]
[Photo Bargains]
[2D to 3D]
[Creative Suite]
[CSS Positioning]
[Tablet PC]
[Pen Input]
[Acrobat Directions]
[HTML Tables]
[Illustrator_Plug-ins]
[RGB to CMYK]
[Filter Tips]
[Understand CSS]
[Photoshop Filters]
[Flash Usability]
[Web Fonts]
[2002 System]
[Font Formats]
[MX Explained]
[DTP Tagging]
[Image Resampling]
[Image Resolution]
[Data-Driven Design]
[Digital Video]
[Windows XP]
[Paper to PDF]
[Flash Animation]
[Page Imposition]
[Design Roundup]
[Graphic Roundup]
[eBook / ePaper]
[Image Management]
[Removable Storage]
[Understand Halftones]
[Web Buttons]
[XML Revolution]
[Bitmap Vectors]
[Image Enhancement]
[Windows 2000]
[PDF Workflows]
[Flash v LiveMotion]
[Advanced File Formats]
[Design Companies]
[Dynamic Filters]
[Site Structuring 2]
[BMP/TIFF/JPEG/GIF]
[Site Structuring 1]
[Image Hoses]
[Text Typography]
[Producing Panoramas]
[Spot Colour]
[SVG Format]
[Design Sites]
[Database Publishing]
[Vector Brushes]
[Layout Compositing]
[Brush Control]
[Web Repurposing]
[Digital Cameras]
[Automating Scripts]
[Stock Photography]
[Quark v Adobe]
[Bitmap Editability]
[1998 Applications]
[Photoshop 5 Colour]
[Asymmetric Grids]
[Bitmap Masking]
[Bug Hunting]
[Commercial Print]
[Vector Transparency]
[Scanning The Facts]
[Colour Print]
[Image Management]
[Preparing Print]
[Understanding EPS]
[DTP Grids]
[Layer Handling]
[NT or Not?]
[Hardware 1997]
[Microsoft Publishing]
[3rd Party Solutions?]
[Beyond CMYK]
[Acrobat v Immedia]
[Postscript 3]

[3D Rendering Tutorial]
[Acrobat Tutorial]
[Art Tutorial]
[Colour Management Tutorial]
[CorelDraw Tutorial]
[Drupal Tutorial]
[Flash 5 Tutorial]
[PageMaker Tutorial]
[Photo to Art Tutorial]
[Photoshop Elements 3 Tutorial]
[Photoshop Elements Tutorial]
[Photoshop Basics Tutorial]
[Photoshop Advanced Tutorial]
[Web Dreamweaver Tutorial]
[Web FrontPage Tutorial]
[Web Design / HTML Tutorial]
[Web Graphics Tutorial]


[Home / What's New]
[DTP / Publishing]
[Vector Drawing]
[Bitmap / Photo Editing]
[Web Design]
[3D Software]
[All Reviews]
[All Articles / Tutorials]
[Book Search / Shop]
[Site Map / Search]
[Contact]
 

you can help support the site with a direct donation or by shopping via the following links:

[Amazon.com]
[Amazon.co.uk]
[Amazon.ca]

Thank you!

 

 

Tom Arah takes complete creative control of his bitmap and vector images through dynamic filters

One of huge advantages of bitmap editing compared to vector editing is the absolute creativity it offers. In a bitmap the image is built up as a grid of pixel values each and every one of which can be instantly transformed at any time. By applying a colour correction, for example, the saturation or contrast of the image can be enhanced to bring out the richness of the colours and completely change its final impact. Even more impressive is the ability to apply a stylizing filter, such as a watercolour or charcoal effect, to change the whole look and feel of your photo, effectively turning it into a work of art. In comparison images produced with vector-based drawing programs tend to come in just one style: over-computerised.

The bitmap programs might offer absolute creativity, but they suffer in comparison to the vector applications’ absolute control and editability. In Photoshop, for example, the majority of filters are derived from the former Aldus Gallery Effects collection which was incorporated back in version 4. There’s no doubt that these filters can produce impressive results, but you have to work hard at it. The filter’s name gives little idea of its end effect and the preview in the dialog is so small that it’s virtually useless. The filter’s parameters are even less transparent, so that customising the effect is often pure guesswork. In short I doubt that there are more than a few users who feel completely in control of Photoshop’s stylizing filters.

That wouldn’t matter so much if the effects were editable so that you felt free to experiment, but this is the real problem with the Photoshop filters - they are destructive. In other words, once the effect has been applied the pixel values have changed forever. You can’t restore the values with an "unwatercolour" filter, for instance. In practice there are various workarounds which can make this less of a problem including the Fade command, with which you can immediately merge the result pixels with the original values, and the History palette, with which you can interactively paint between before and after states. Most important of all is the use of copied layers which means that, where necessary, you can always revert to your original pixels. Generally though the main point still holds true: applying a bitmap filter is a one-way process. Worse, because there is no going back, most users choose not to go forward in the first place.

Clearly what’s needed is a way of making filters non-destructive. Again Photoshop 4 seemed to lead the way on this with its introduction of adjustment layers. These allow Photoshop’s range of colour correction filters to be applied as a lens on the layers below them without actually permanently changing these layers’ pixel values. The real beauty of the system is that it makes colour correction completely editable. To fade the effect, for example, you can quickly change the adjustment layer’s opacity. To customise the effect, you can simply double-click on the layer to call up the relevant dialog for fine-tuning. And, as a last resort, you can always delete the adjustment layer and you’re back with your original pixel values ready to start again.

Adjustment layers provide colour correction filters non-destructively so they can always be re-edited.

Colour corrections and stylizing filters both work by taking original pixel values and calculating new result values - so why can’t filters be made to work in the same way? If it was as simple as this Adobe would happily have obliged so clearly there’s a fundamental problem. As far as I can see what distinguishes the colour adjustment filters is that they are built on simple serial algorithms in which the same transformation can be applied to each pixel’s values in turn. Stylizing filters are another matter entirely. A watercolour effect, for example, involves multiple passes in which areas of similar colour are first identified and then its edges are highlighted. In other words each pixel’s result value depends not just on its original values and the algorithm but on a complex combination of variables. Without a one-to-one correlation the processing involved escalates exponentially.

PhotoDraw 2000

So far the idea of non-destructive filters has proved infeasible in Photoshop and other traditional bitmap environments, but that certainly hasn’t ruled it out entirely. With PhotoDraw 2000, Microsoft chose to throw out the old ideas and to design a modern graphic application from the ground up. The result is a program in which the distinction between vector and bitmap is deliberately ignored and in which image styling is recognised as fundamental. This means that you can select any bitmap or vector object, whether internally created or imported, and apply multiple non-destructive adjustments to them, for example, to boost saturation while darkening the overall tone. Unlike adjustment layers this correction is done on an object rather than global-basis so that you maintain complete and easy control over every aspect of your image.

When it comes to the range of effects filters PhotoDraw is even more impressive. In particular, the program provides over 200 Designer Effects arranged into various categories such as crayon, pointillist and watercolour. Loading up a dialog to see each of these effects in turn would be laborious to say the least, so PhotoDraw provides a gallery of preview image thumbnails to give some idea of the likely results. Click on a thumbnail and the default effect is relatively quickly applied to your image. If you don’t like it you can quickly remove it by clicking on "None" or another effect. If it’s nearly there you can go to the settings panel to fine-tune the effect with a range of consistent and meaningful parameters many of which, such as the transparency level and range of brushes, are shared between effects. The implementation is a huge improvement on the old-fashioned Photoshop Gallery filters, but more importantly so are the end results - each Designer Effect almost guarantees attractive results.

In a head to head in terms of creativity the Designer Effects would easily beat Photoshop’s filters, but what really makes the difference is the editability they offer. Like the colour corrections, each Designer Effect remains live so that at any point in the future you can select the object and go in and remove or fine-tune its style. More importantly you can edit the underlying object and the effect will update automatically whether the objects are bitmap or vector. If you add some text with one of PhotoDraw’s new Theme texture fills, for example, you can apply colour effects to boost saturation and change hue and then add an attractive "angled sponge" style designer effect to give your title an artistic edge. To do this in Photoshop you would have to render the text so there would be no going back and little going forward. In PhotoDraw you can always choose new colour corrections, a new designer effect, a new texture or even edit your text and the image will automatically update accordingly. Just in case you were worried you might still be missing something, PhotoDraw even lets you access Photoshop’s Gallery Effect filters as plug-ins!

PhotoDraw 2000’s Designer Effects are creative and non-destructive enabling re-editing.

The creative flexibility opened up is stunning, but it’s not all good news. To begin with any third-party filter involves rendering the image objects so you immediately lose editability. Another problem is the way that effects can only be applied on an object basis. In some ways this is an advantage, but when you want to apply the same effect either across the board or to just a section of an object you suddenly hit limitations. Sadly this ceiling is generally true of PhotoDraw and rules the program out as a professional design tool. The biggest limitation of all though is fundamental. PhotoDraw’s creative flexibility is its huge strength, but it is also its fatal weakness. The behind-the-scenes processing involved in keeping a stylizing filter "live" is clearly phenomenal and takes a huge toll on performance. When pushing the creative envelope that’s a price worth paying, but unfortunately PhotoDraw’s all-or-nothing integrated approach means that you have to pay the same price for even the simplest tasks.

TextureWorks

Having tasted PhotoDraw’s restyling power, however, it’s difficult to go back to the old ways so is there an alternative solution? Judging by PhotoDraw’s strengths and weaknesses what we are looking for is a way of applying filters, preferably including Photoshop filters, non-destructively, when and only when we want them, on either a global or object basis, to vectors or bitmaps and all within a professional, high-end environment. It’s a tall order but amazingly it’s exactly what a small plug-in called TextureWorks from Virtual Mirror (www.virtualmirror.com) promises. Most amazing of all is that it promises all this bitmap power from within the most resolutely vector-oriented environment around - Adobe Illustrator.

Once installed TextureWorks appears as a new floating palette within Illustrator. All you have to do is select an object and choose one of the texture preview icons at the bottom of the palette and suddenly your previously clinical vector object is transformed into a textured bitmap full of artistic character. Options on offer include various painterly, sketch and distortion effects such as pointillize, crystalize and craquelure. If they sound familiar that’s because they are based on the same Gallery Effects that Adobe bundles with both Illustrator and Photoshop. The difference is that within Illustrator, thanks to TextureWorks, the filters become non-destructive. This means that if you don’t like the effect you can always just remove it or click on another either now or, crucially, at any time in future.

As well as providing non-destructive access to Photoshop filters, TextureWorks also solves the other main problems that limited PhotoDraw. By default filters are applied as a "wash" to individual objects, but you can also apply them as a "lens". In this mode, rather than the object itself being affected, all underlying objects or sections of underlying objects are updated which is ideal for both global and local effects. TextureWorks also foregrounds the underlying rasterization process that PhotoDraw attempts to hide, giving complete control over the two features essential for professional control: colour mode (RGB or CMYK) and resolution (1 to 2400dpi). For most print work 300dpi is more than adequate but with TextureWorks’ live update this can quickly reduce work to a crawl far slower than PhotoDraw. With TextureWorks, however, you can simply lower the current dpi or, by switching off auto-update, restore the full speed of Illustrator while you work.

TextureWorks offers lens-based non-destructive image styling from within Illustrator.

In many ways TextureWorks seems too good to be true. Sadly it is. When you dig a little deeper you find that the magic is built on an incredibly simple trick. Each stylizing effect is actually built on a recorded action. Essentially each TextureWorks effect is a macro that combines an enhanced version of Illustrator’s Object>Rasterize command with its bundled bitmap filters and which runs whenever an associated object is updated. The trick works brilliantly and takes Illustrator onto an entirely new creative level, but there’s one huge problem: editability. By its nature each texture effect is limited to the filter settings in its associated action. In other words the only way to fine-tune an effect is to record a new action and to load that into the TextureWorks palette – hardly an encouragement to creative experimentation.

Deneba Canvas

TextureWorks is undoubtedly a huge step forward, but essentially it’s a clever workaround. What’s really needed is the same sort of power fully integrated and completely editable within one of the existing big players. This is exactly what the latest version 7 of Deneba Canvas promises. It’s not surprising that Canvas should lead the pack in this area as the program has always been in the vanguard when it comes to combining vector and bitmap processing. In the past though, although the program offered both vector and pixel editing tools, it was actually quite traditional in the way that it kept the two realms well separated. Generally you would work on producing your design as vector objects and you could then render them within the program as bitmaps for further pixel-based painting and processing. The problem was that as soon as you rasterized your objects you lost the all-important non-destructive creative flexibility.

With Canvas 6, however, Deneba began to truly merge and integrate its vector and bitmap processing to produce a completely new technology: SpriteLayers. Essentially SpriteLayers bring all the compositing capabilities of Photoshop-style layers into Canvas’s primarily vector environment. What this means in practice is that you can take a vector object like text and change its transparency or blend mode so that it interacts and combines with any underlying objects. Ultimately the only way this can be achieved is as bitmaps but Canvas manages to juggle these with the original vector objects to maintain complete editability. This means that you can always change the level of opacity or blend mode, for example, or edit the underlying text.

With version 7 Deneba has taken this same non-destructive technology to an entirely new level with its SpriteEffects. Using the new SpriteEffects palette you can select from a range of effects, such as a full collection of colour correction filters, and these are automatically applied to the current object rather like an object-based adjustment layer. Far more impressive, however, is the ability to apply more advanced special effects filters. To overcome the typical uniform colours and clinical lines of vector artwork, for example, you can add a low level of noise or a gaussian or even motion blur. Thanks to the SpriteEffects non-destructive nature if you later regret your decision you can always remove it or, crucially, simply double-click on the effect name to recall its dialog for fine-tuning.

Canvas 7’s new SpriteEffects enable vector artwork to be quickly given a creative restyling.

As with TextureWorks the Canvas implementation is surprisingly advanced with full control over colour mode and resolution and again with the crucial ability to apply effects either on an object basis or as a lens. Canvas even takes the lens concept to its natural conclusion by enabling the lens to magnify underlying objects or for its point of view to be frozen – ideal for pulling out and highlighting areas of an illustration. Other refinements include the ability to temporarily hide effects, to add and reorder multiple effects and to save particular effects as named styles for future use. Perhaps most impressive of all is the ability to add any Photoshop-compatible plug-in filter as a SpriteEffect. At last we can experiment with those Photoshop stylizing filters without committing ourselves.

It’s been a long journey but finally we’ve got what we set out looking for - the ability to apply Photoshop bitmap filters in a non-destructive way. The surprise is that we had to move to a vector environment to do so, but in fact that only adds to the creative potential on offer. And the potential is awesome. Imagine you’ve just been handed a vector illustration of a car to produce an advert. First you can duplicate the car and apply a combined grayscale and threshold SpriteEffect to one copy so that only the illustration outlines are visible like a designer’s blueprint. Next you can add a gradient or painted-on transparency SpriteLayer so that the final full-colour car seems to be organically emerging from the blueprint. Now you can add multiple SpriteEffect magnification lenses with frozen viewpoints to pull out features of the car that you want to highlight. Finally you can add a global lens to shift the colour of the car or to apply a motion blur or to apply a watercolour effect - or all three! When you’ve finished few would believe that the final illustration had taken minutes rather than days to set up and no one would believe that it remains live so that any element of the image or its stylizing can be edited with the final image instantly updating accordingly.

SpriteEffects and SpriteLayers together take Canvas onto a new creative plane.

The potential is amazing but there’s still one fly in the ointment. Canvas 7’s SpriteEffects can do everything I’ve described and more, but the technology isn’t yet reliable enough to use in a production environment. In particular on both machines I tested it on, trying to call up any third-party plug-in for re-editing as a SpriteEffect lead to crashes. The good news is that by the time you read this the promised 7.1 update should have appeared to fix the problems. I really hope so.

Tom Arah

May 2000


Hopefully you've found the information you were looking for. For further information please click here.

For free trials and special offers please click the following recommended links:

For further information on the following design applications and subjects please click on the links below:

[3D], [3ds max], [Adobe], [Acrobat], [Cinema 4D], [Corel], [CorelDRAW], [Creative Suite], [Digital Image], [Dreamweaver], [Director], [Fireworks], [Flash], [FreeHand], [FrameMaker], [FrontPage], [GoLive], [Graphic Design], [HTML/CSS], [Illustrator], [InDesign], [Macromedia], [Macromedia Studio], [Microsoft], [NetObjects Fusion], [PageMaker], [Paint Shop Pro], [Painter], [Photo Editing], [PhotoImpact], [Photoshop], [Photoshop Elements], [Publisher], [QuarkXPress], [Web Design]

To continue your search on the designer-info.com site and beyond please use the Google and Amazon search boxes below:

Google
Web designer-info.com

       
designer-info.com: independent, informed, intelligent, incisive, in-depth...
 


All the work on the site (over 250 reviews, over 100 articles and tutorials) has been written by me, Tom Arah It's also me who maintains the site, answers your emails etc. The site is very popular and from your feedback I know it's a useful resource - but it takes a lot to keep it up.

You can help keep the site running, independent and free by Bookmarking the site (if you don't you might never find it again), telling others about it and by coming back (new content is added every month). Even better you can make a donation eg $5 the typical cost of just one issue of a print magazine or buy anything via Amazon.com or Amazon.co.uk (now or next time you feel like shopping) using these links or the designer-info.com shop - it's a great way of quickly finding the best buys, it costs you nothing and I gain a small but much-appreciated commission.

Thanks very much, Tom Arah


 
[DTP/Publishing] [Vector Drawing] [Bitmap/Photo] [Web] [3D]
[Articles/Tutorials]
[Reviews/Archive] [Shop]  [Home/What's New]

Copyright 1995-2005, Tom Arah, Designer-Info.com. Please get in contact to let me know what you think about a particular piece or the site in general.