Free tools for designers, web developers

BANGALORE, INDIA: The world has come to understand that presentation and packaging of otherwise mundane and plain content can do wonders to the experience and saleability of content. Proprietry software like Adobe Photoshop, Illustrator and Maya have been present for ages now and are undergoing constant revisioning to be able to provide the latest and the best to the people using them.

However, these proprietry software are bound by licences and come at a premium which may pinch your pocket if the requirement is in numbers. Open Source technologies and software have come up in a big way to ease this pressure onthe pocket. It is important to note that these free software do not turn out to be compromises. And many of the capabilities that these Open Source multimedia and 3D software have to offer, rival those of proprietary ones.

Gimp, Inkscape, Blender and Art of Illusion are justsome of the free software for generating and manipulating graphics, and images. Gimp has come to represent a free substitute for Adobe Photoshop. Using Gimp, we can editraster graphics and it can be deployed to be used as a simplePaint program or to double up to provide capabilities of anexpert photo retouching software.

These capabilities enable Gimp to be used as a fine replacement for Photoshop related activities. Inkscape is an open source vector graphics editor. These capabilities are similar to the ones provided by Adobe Illustrator. For creation and manipulation of vector graphics, the .svg file format enables designers to create logos,icons, images etc. 3D images and graphics creation and pres-entation has a come a long way. Full fledged movies likeAvatar made their mark as they were able to mesmerize audiences because of the cool 3D effects that they brought tothe table.

Blender and Art of Illusion are examples of 3D modelling and rendering studios which are available for allmajor operating systems. These software provide featuresranging from basic skeleton modelling to complex high-polymodelling that includes subsurfaces etc. 'Sintel' is an inde-pendently produced short film, initiated by the Blender Foundation as a means to validate the open source 3Dcreation suite Blender and prove that open source soft-ware can be a viable development platform for modelling and designing industry.

Let's have a roundup of what these software are, thefeatures provided by them and how to get started onthese software.

GIMP

GIMP (GNU Image Manipulation Program) is a rastergraphics editor. It is primarily employed as an image re-touching and editing tool. It can be used as a simple paintprogram, an expert quality photo retouching program,an online batch processing system, a mass productionimage renderer, an image format converter, etc. It isavailable as a free download for Windows, Mac and vari-ants of Linux as well. In order to construct its interface,GIMP uses the GIMP tool kit (GTK+). GTK+ has evolvedinto a standalone library since its earlier inception andis now available as part of the setup engine. GIMP canalso be used to create basic animated images in the GIFformat. It can be used for editing and creation of origi-nal images, icons, graphical elements of web pages andart for the user interface elements of free software.

Features

Tools used to manipulate images can be accessed via thetoolbox, through menus and dialogue windows. Let'shave a look at some of the features of GIMP:

1. Color: GIMP has several ways of selecting colorsincluding palettes, color choosers and using an eyedrop-per tool to select a color on the canvas. The built in colorchoosers include RGB/HSV selector or scales, water-color selector, CMYK selector and a color-wheel selector.Colors can be selected using hexadecimal color codes also. GIMP has native support for indexedcolor and RGB color spaces, other colorspaces are supported using decompositionwhere each channel of the new color spacebecomes a black and white image. Colorblending can be achieved using the blendtool. Gradients are also integrated intotools such as the brush tool, when the userpaints this way the output color slowlychanges. There are a number of defaultgradients included with GIMP, a user canalso create custom gradients with tools provided.

{#PageBreak#} 

2. Image editing: The more commontools include a paint brush, pencil, air-brush, eraser and ink tools used to createnew or blended pixels. Tools such as thebucket fill and blend tools are used to changelarge regions of space in an image and canbe used to help blend images. GIMP also has a selectionof smart tools which include the clone tool that copiespixels using a brush, the healing brush which copies pix-els from an area and corrects the tone and color whereit is being used. The blur and sharpentool is a brush thatblurs and sharpens. Finally the dodge and burn tool is abrush that makes target pixels lighter (dodges) or darker(burns). A list of GIMP transform tools include the aligntool, move, crop, rotate, scale, shear, perspective and flittools. GIMP has approximately 150 standard effects and fil-ters, including Drop Shadow, Blur, Motion blur and Noise.

3. Selections and paths: There are several tools thatcan be used to create custom shape selections including arectangular and circular selection tool, free select tool, andfuzzy select tool. More advanced selection tools include theselect by color tool for selecting contiguous regions of colorand the scissors select tool which creates selections semi-automatically between areas of highly contrasting colors.GIMP also supports a quick mask mode where a user canuse a brush to paint the area of a selection. The foregroundselect tool helps extraction of foreground elements, suchas a person or a tree in focus. The Paths Tool allows a userto create vectors. Paths can be used to create complex se-lections around natural curves, paths can also be named,saved, and painted with brushes, patterns, or various linestyles.

Layers: An image consists of many layers sitting in astack. Each layer in an image is made up of several chan-nels. Text layers can be created using the texttool, allowing a user to write on an image.

File formats support: GIMP's nativeformat XCF is designed to store an image in-cluding all features specific to GIMP such aslayers, channels and vectors. Read only for-mats include Adobe PDF documents. GIMPcan also export to MNG layered image files,HTML and ASCII Art. GIMP has im-port/export support for popular image for-mats such as JPEG, PNG, GIF and TIFF, alongwith the file formats of several other applica-tions like Corel Paint Shop and Adobe Photo-Shop. Other formats with read/write supportinclude PostScript documents, X bitmap im-age and Zsoft PCX. GIMP can also read andwrite path information from SVG files andread/write ICO Windows icon files.

How to get started

Initially conceptualized and primarily popular in theLinux environment, GIMP has evolved to be easy enoughfor Windows usage as well. Installing GIMP on Windowsfollows a set pattern of regular steps which we have cometo associate with any other software on the Windows OS.The appropriate installer for GIMP can be downloadedfrom http://www.gimp.org and saved in the desired des-tination. The default install on GIMP can be selected forregular users. Custom install lets one control the morespecific aspects of the install but the full install is theideal way to proceed. GTK+ is installed automaticallythrough the GIMP installer. Upon its install, GIMP canbe launched like a normal Windows program.

We installed Gimp in the above fashion on our ma-chine. Any image can be imported on the software usingthe open image option from the files menu or eventhrough drag and drop. Gimp lets you play around withdifferent layers and channels in an image. We importeda .jpeg image on the software. On the right of the soft-ware, there is the layers toolbar. Different channels ofthe image were separated using this toolbar.

Simplyclicking on view of a particular channel provides us withthis functionality. Once the channels are separated, theuser has the option of controlling these channels asstand alone entities. As can be seen from the image, weviewed the red and the green channels of the image keep-ing the blue channel hidden. The drag and control tool present on the left toolbox enables us to resize and playaround with this image.

A "Perspective" toolbox appearswhen the channels are separated. This toolbox can beused to view and edit the relative effects on channels.Thus it is quite clear from these options, their placementand usage that using Gimp is similar in nature to Photo-shop. However, every software has some differences in itslayout which the user can get used to with some basictime spent on it.

{#PageBreak#}

Inkscape

Inkscape is an Open Source vector graphics editor appli-cation, with capabilities similar to Illustrator, Freehand,CorelDraw, or Xara X using the W3C standard ScalableVector Graphics (SVG) file format. Inkscape is cross-plat-form and runs on Mac OS X , Windows OS and varientsof Linux as well. Supported SVG features include shapes,paths, text, markers, clones, alpha blending, transforms,gradients, patterns, and grouping. Inkscape also sup-ports Creative Commons meta-data, node editing, layers,complex path operations, bitmap tracing, text-on-path,flowed text, direct XML editing, and more. It imports for-mats such as JPEG, PNG, TIFF, and others and exportsPNG as well as multiple vector-based formats.

Features

Many of the icon sets being used for Linux have beenknown to be created using Inkscape. Using Inkscape youcan brand your projects, create icons for your desktop,design webpages, create marketing materials, and create maps for gaming. These features render Inkscapeideal to be used in place of a proprietary SVG graphics ed-iting utility. Let us have a roundup of some of the fea-tures that Inkscape brings to the table.

Object creation and manipulation ?Inkscape facilitates object creation and manipulation. Logos, maps,web pages, icons etc can be created using Inkscape sim-ilar to Illustrator. Some basic creation tools are availableat hand to be able to do this. Easy to use GUI based toolselect and apply mechanism goes hand in hand with thecreative thinking of the designer to create his heart's de-sire onto the canvas present. Some of these tools are thepencil tool, pen tool, calligraphy tool rectangles, ellipses,stars/polygons, spirals, text tool, embedded bitmaps,clones etc. Apart from object creation, Inkscape is muchof use for object manipulation as well. All objects createdby Inkscape and other open svg, css files are easy to ma-nipulate and edit using Inkscape. Some of the manipu-lations available to the designer are Affinetransformations, Z-order operations, Grouping objects,Layers, Copying and pasting objects, Alignment and dis-tribution commands.

Fill and stroke- Images need to be aligned andplaced along with other elements like text and graphicsfor a vivacious display. The designers need to play arounda lot with colour, gradients and layers in an image. Thishelps bring out the best in any image and helps the de-signer manipulate those images according to need andrequirements of the medium of presentation of theseimages. Color selector, Color picker tool, Copy/pastestyle, a gradient editor capable of multi-stop gradients,Pattern fills, Dashed strokes, Path markers are some ofthe facilities provided in Inkspace for the desired job.

Operations on paths- Some times the images thatthe designer has created may not be imported to the pro-gram of use directly. This is the time that these imagesand their paths need to be worked out. Meta data, as it iscalled, of these images requires editing to some extent.Inkspace facilitates this and provides Node editing, Con-verting to path, Boolean operations, Path simplification,Path insetting and outsetting, Bitmap tracing featuresfor achieving the same.

Text Manipulations? A designer works not only onimage creation and manipulation but can also includeworking and playing around with text. Similar in natureto designing and aligning magazines, designers need toadjust, align and layout the text provided. Inkscape has tools available that let the designers adjust the text ele-ments according to their need. Some tools of interest re-garding text manipulation can be used to play aroundwith multi-line text, installed outline fonts, right-to-leftscripts, Kerning, letter spacing, line spacing adjust-ments, Text on path, Text in shape, etc.

Rendering? We are aware that images are not theonly area of work-rework that the designers these daysneed to tackle. Presentation of these images in pre-pre-scribed formats can become a source of headache for thedesigner as well. Rendering of the images is one sucharea that needs to be tackled. Inkspace provides tools likefully anti-aliased display, alpha transparency support fordisplay and PNG export, complete ?as you drag? renderingto provide the user with ample support to bring out the bestin rendering.

Miscellaneous- Apart from some of the said features,Inkscape can be used for a variety of other miscellaneousactivities like 'live watching and editing' the document treein the XML editor, command line options for export andconversion, compliant SVG format file generation and ed-iting. These may come in handy as and when required.

Getting started Installing Inkscape on a Windows platform is a fairlyroutine process. We can download the appropriate in-staller for our system from www.inkscape.org to be savedin the desired location. A normal step by step instructionbased process is to be followed. The installer takes sometime to install certain files and hence patience has to bemaintained. The database of tools and effects generallytake time to install and we must avoid trying to cancelthe installer because of this. Much like GIMP, the GTK+toolkit is automatically loaded onto your machinethrough the installer and we do not need to look forgraphics capabilities elsewhere.

To be able to gauge the experience of using Inkscape,we imported .svg file into the software. Different layersof this file were moved, separated and one was subse-quently removed. Then, just as in paint, we used a paint-brush fill option, selected a particular color and changedthe color of our object in the image. Easy enough to ex-ecute, Inkscape does not require a lot of experience to beable to use it. However, creativity is something that hasto be inculcated by the designer himself. The usage pat-tern and ease of Inkscape makes you realize that there isnot much difference between the capabilities and user experience of Inkscape and Illustrator, apaid software from Adobe.

{#PageBreak#}

Blender

If you have been contemplating to have 3Dcontent creation suites for your designers,but exorbitant licensing costs have been adeterrent, then Blender is an ideal free opensource 3D studio for you. It is a complete 3Ddesigning studio that can be used for mod-eling, UV unwrapping, texturing, rigging,simulating water, smoke or particlesscenes, skinning, rendering, animation of3D environments, editing, and compost-ing. These features make it ideal for creat-ing interactive 3D applications, animationfilms, video games or special visual effects.

One of the positive aspects of Blender isits size, with just about 10MB installer, you can have arich 3D content creation studio that can run on severalpopular computing platforms like Mac OS X, MicrosoftWindows and Linux.

Features

Blender has features that are characteristic of high-endmodeling software. Among such features include ad-vanced simulation tools such as rigid, realistic body,fluid, cloth and softbody dynamics, powerful characteranimation tools, and also has support for Python for em-bedded scripting. Blender's animation tools include in-verse kinematics, skeletal, hook, curve and lattice-baseddeformations, shape keys (morphing), non-linear ani-mation, vertex weighting, soft body dynamics includingmesh collision detection, LBM fluid dynamics, particle-based hair, and a particle system with collision detec-tion. The rendering capabilities are boosted withintegration of YafaRay, which is a ray tracer and is alsoa free software.

The Blender 3D studio provides non-linear au-dio/video editing and composting capabilities for cre-ation of animation or special graphics films. Theembedded scripting feature using Python can help youin task automation and creating custom tools. It can alsobe used for defining game logic, importing and exportingfor other formats like OBJ, DFX etc. The integrated gameengine helps in creating interactive animations. This in-tegrated game engine offers interactivity features such as collision detection, dynamics engine, and program-mable logic.

Getting started

Blender 2.49b is the latest version of the software, andis available for free download. Suppose you want to in-stall Blender on Windows then download the blender'swindows executable file. Once you have the file, the in-stallation can begin. The installation is an easy process,but you have to be watchful at a dialog box where itprompts for asking for location to keep the executablefiles. This would be the location where the user files willbe placed. These folders save user data, namely tempo-rary data like test renders and physics data, as well a de-fault settings. Each user of that PC can have their own,or they can all share one. Select a place to install the files,and click Next to install Blender.

The system requirements for Blender are also nothigh. Good specs hardware with 2GHz processor, 2GBRAM and graphics card with 256MB dedicated RAMwould give seamless performance, but for productionpurposes where the rendering of design files would be oflarger sizes; a higher specs hardware would be recom-mended. That could ideally be a quad-core with 8GBRAM and graphics card like Nvidia Quadro or ATI FireGLhaving 768 MB RAM.

{#PageBreak#}

Hands-on

Blender's interface is specifically designed for a graphics modeling application and the vast array of featuresare different from and organized differently than other3D software packages. In particular, Windows users mayneed to get accustomed to the alternate manner thatBlender uses to handle such things as button choicesand mouse movements. Some features are familiar likeTop Menu bar having options like File, Add, Help etc., butBlender heavily relies on keyboard shortcuts for speed-ing up work and that is also the case with other multi-media studios as well.

To get familiar with the interface and exploreBlender's features let's try making some figures andadding textures to them. On the main Blender screen,there is a square in the center, delete that box by press-ing X key from keyboard. Now our scene window isempty. Let's add a sphere there. Select Add > Mesh > UV-Sphere to add a sphere in the scene (click on the OK but-ton for the number of segments and rings, in our case its32). Zoom in using the mouse scroll button and press theS key (size) to make the sphere 4 squares wide. Now adda second UVsphere in the scene.

Resize it (S) to 2 squareswide. Now press the G key (G=Grab) and move the sec-ond sphere on top of another. Select the two spheres bypressing the B key and drawing a square all aroundthem. Then press Ctrl+J and click on "join selectedmeshes". From the object mode (pressing Tab key) selectthe two spheres. Now go to the editing menu (F9 or the button that is circled) and click "Set Smooth". If youpress Z now, the snowman should look smoother. Bypressing F12 key or by selecting Render > Current Frameyou'll be able to view the rendered scene of two sphereshaving smooth texture.

This shows that Blender is a feature rich 3D studioand can be used for creating impressive graphics and an-imations.

{#PageBreak#}

Art of Illusion

Art of Illusion is a free, open source 3D modelling andrendering studio. It is written entirely in Java, and canbe used on any Java Virtual Machine which is compati-ble with J2SE 1.4 or later. It offers features that rivalthose found in highly expensive commercial 3D softwareprograms. The highlighting features of Art of Illusionare that it includes subdivision surface based modelingtools, skeleton based animation and a graphical lan-guage for designing procedural textures and materials.

Features

The striking out feature of art of Illusion is its interface.The interface is split into four screens that offer four dif-ferent views of the object, i.e. front, left, top and last onebeing a camera angle. The user is free to choose from anyscreen and design and change the object. The changesdone in one screen view will be correspondingly reflectedin all the views. This gives the designer the liberty to see how his object will be looking like withouteven having to render the frame.

It provides subdivision surface basedmodeling tools for creating smooth sur-faces from control meshes of arbitraryshape and structures. It has a feature richset of tools that allow you to sculpt objectsin natural and intuitive way. Another ex-ceptional feature of Art of Illusion is itssupport for procedural texture editor. Bywiring together blocks that represent dif-ferent patterns or mathematical func-tions, one can construct complexprocedures in just minutes.

Getting started

Art of Illusion being a open source project,it can be downloaded freely and is avail-able for all popular operating systems. Theprerequisite being Java 1.5 or later. If the Java VirtualMachine (JVM) is not present on your computer, thenduring the process of installation it prompts the user todownload the JVM. Once the installation is done, youcan start the Art of Illusion program. Before gettingstarted, you need to know about one more thing: coor-dinates. The position and dimensions of objects is deter-mined by a coordinate system with three axis, named X,Y and Z. The X axis points to right, while Y axis points up-wards and Z axis pops out of screen. Lets start by creat-ing a demo object to learn the interface and its features.

When you start your first sketch, you don't see thegridlines for reference. You can set up a grid in the mod-eler by selecting Scene > Grids from the menu, and thenset spacing to 0.5 and subdivision to 10. Before clickingOK check the snap to grid and show grid options. This al-lows us to easily draw objects with an exact position andsize and to align objects othogonally. You may changethe grid parameters at any time to accomadate yourneeds for finer or coarser grids. Lets add a cuboid toframe. Select the 'create box' tool from the left panel anddraw a box in the front view of the scene. You can noticethat in different views the box is shown as it will look likefrom those angles. You can also add animation by select-ing the Animation option from the menu bar. Once youhave finalized the scene, you can view the renderedframe by selecting Scene > Render scene option from themenu or by pressing Ctrl + R keys.