Graphical Design with OSS
Many designers don’t use graphical Open Source Software. This is not a coincidence: usually they don’t understand it, don’t like or even despise it. Since using the free software requires more time and technical knowledge — it seems easier to pay for a working package from a well-known vendor.
This approach is common, but it could be useful to take a peek at another one. Today’s OSS provides so many possibilities, that it becomes relatively easy to create almost anything that’s possible to make with the proprietary software, especially in the web design areas. In my opinion, it happens to be so good, that it may be worth taking a leap of faith.
Usually, when it comes to graphical design, few people agree that open source software is capable of producing the same level of quality work that the proprietary software does. My intention in this article is to question this stereotype and to present a strong case for using OSS for graphical web design, without going into a discussion over which one is better to use. The bottom line should sound like this: it’s possible, and isn’t necessarily more difficult to create any type of web graphic or design using only OSS.
In spite of all the mentioned appeal, most graphical designers prefer to keep using the proprietary software, and for a good reason — it provides in many cases easier, more stable and more intuitive interfaces that save professional designers’ time. In the professional web design environments where a client waits for the results, this is very critical. Also, it takes time to learn something new, so many question why spend it… But for the majority of website creators, and for those who just starting to take their first steps in the web industry and aren’t sure whether they really need to spend money on graphical software, open source software can offer all the necessary tools, educational opportunities needed to enrich and shape your creative thinking and technical skills.
A quick warning: using and learning gOSS usually requires more time than learning proprietary software. How much more? It depends. But if you have some spare time, and are ready to have fun with exploring another mysterious world of software, then you will only benefit from it. However, trying to go for broke right off the bat, expecting to be exactly at the same level you are in other more familiar software and setting somewhat unreasonable or out of reach goals, might not be the best attitude to start with. After all, most things in life become more rewarding after we have taken the time to learn more about them, and our grip on them improves. Same with OSS.
Where gOSS is extremely useful? — In web design agencies it’s common that the web designs and layouts are composed by a graphics expert. Then these designs are passed to the developers, which can decide what and how to slice in order to optimize the graphics better for the general consistency of the web site. For simple operations like these a natural choice would be using an OSS program such as GIMP and not wasting the money on proprietary software.
If you’re new to web design, you’ll quickly learn that the proprietary graphical software is very expensive. So if you’re unsure which one to choose, my advice to you is to first try the open source software. One big plus of using OSS, is that you can get it all for no cost. Another advantage becomes clearer with some of the more popular gOSS programs: they are developed quickly and newer updates include more and more interesting features. The beauty of this quick development is that anyone from anywhere in the world can extend or improve any program. So if someone wants a new feature in their program, every other user can have it as well.
To inspire you, and to let you taste what is possible to create with these free software tools — please have a look at this Sintel open movie, which was entirely created using graphical OSS. I worked in a relatively large animation studio, which couldn’t produce during one year a fraction of what this tiny and talented group produced with gOSS in less than a year. This important lesson in life taught me the following: it’s not the type of software which is important, but the kind of professionalism, passion and will that are keys to succeeding.
To start, let’s separate four common graphical types. Under each type, you’ll see a name of the program that handles it, and it’s brief features list.
Inkscape screenshot by Val Kotlarov
- Vector graphics — great for creating icons, illustrations, charts, web decorations, and other usually quick and impressive vector art.Inkscape — Spiro curves, Converting rasters to vectors, Gradients, Basic vector shapes and Boolean operations.
- Photos — probably the most popular graphics type. Software helps you to batch-process photos, for example, when you need to cut down the image size and in the same time to enhance the quality.GIMP — Layers, Brushes, Selection tools, Masks, Image and Canvas transformations, Filters etc. A lot of free plugins are available too, such as G’MIC. A lot of file types are supported, so converting to a transparent PNG or creating sprites can be real fun.
- Rendered 3D graphics — probably the most time-consuming to create, but also very impressive when well done.Blender 3D — Basic shapes: cubes, cylinders etc., Lights, Textures, Shaders. Different rendering engines.
- Drawings — for any artist, the natural way to express himself or herself.MyPaint — Provides the ability for a free hand drawing when used with a digital tablet. It has a very impressive set of prebuilt and customizable brushes, Layers, different color pickers and very intuitive keyboard and mouse shortcuts.
© copyright Blender Foundation | www.sintel.org
Sure, there are many other gOSS programs and tools that can be used for the various types of graphics. However, the programs suggested offer a specialized and a narrower set of tools to handle the graphic type they were associated with on the list. So for example, if one wants to edit a photo, best practices suggest using GIMP instead of something else, because it’s built exactly for that. Similarly, if you want to create a vector icon, although GIMP allows doing it with paths, converting them to selection areas and filling with gradients, it’s much easier and more fun to use Inkscape, and the rasterized result will have better quality in addition to allowing easier changes to it later.
Other related programs which can be interesting are:
- Krita — allows sketching and painting.
- Xara Xtreme — handles vector graphics manipulation.
- Luminance HDR — for High Dynamic Range images processing and tone mapping.
- exiv2 — a handy utility if you want to modify images’ metadata.
Before you start, you need to define your need then use a suitable program. Often you’ll need more than one program. For example, after creating and saving a vector graphics image, you might want to correct the colors or try to optimize it for web. GIMP always comes in handy here.
Generally speaking, using gOSS might initially be a bit confusing. Usually, these programs are initiated by creative developers, for whom the programming languages feel just like a mother tongue. Since they develop it usually for themselves, there might be some lack of good documentation with some programs. Though a quick trip to Google usually satisfies the any beginner’s need: be it the need for good tutorials or documentation, there is plenty online from those who came before you and were willing to contribute.
Exploring the program’s interface also produces greater understanding of available functionality. Many plugins can be found online, if some functionality is missing. For example, GIMP plugin registry has a lot of great plugins. Save for web for example, helps to optimize and preview the image before saving. Liquid rescale is another interesting example – it allows resizing an image without shrinking/stretching of the objects.
Several tips for using gOSS.
- Like with any graphic work you are doing no matter the software, get in the habit saving your work more often. Unfortunately, some gOSS is not always that stable.
- You may want to check frequently for the new software updates, and download them. Security updates are of course of the main concern, and they should be updated. Ubuntu linux and other distributions, automatically check for these updates, and suggest you install them.
- Keep the stable release for your work. You can additionally download and install the development release, with newer features and bug fixes, but they will tend to lack the stability. So they should be used for your main work only if some added feature is indeed indispensable.
- Participate in online forums to get extra help, or help others. Explaining to someone how to make something can often result in discovering new features or techniques, and lead to a better understanding of the work. Writing a tutorial has a similar effect.
- The real power of gOSS is, of course, in the open source code. If you feel like coding, you can take the program, and change it the way you like. You can make it really shine, to look and behave exactly as you wish.
What to use, how and when?
GIMP is comparable to Photoshop. You can achieve virtually the same results with it. Usually any tutorial for Photoshop from the web can be done with the GIMP. The missing functionality can be substituted with a few simple steps. For example, in Photoshop, you can apply a shadow effect to a layer. In GIMP, you will need to apply a shadow filter, which will create a separate layer with the shadow below the desired one.
Here is a very handy batch processing plugin for GIMP, David’s Batch Processor. It allows selecting a bunch of images, resizing them, enhancing, changing their format and more with a few clicks.
GIMP can be easily transformed to Gimp Paint Studio (GPS) — additional features that bring in rich sets of brushes and makes GIMP easier to use.
Use Inkscape when you want to create logos, web icons, cartoon-like illustrations which are so commonly used in the web design. It’s possible to create those beautiful, colorful and shiny posters, this blog has many tutorials for Inkscape. Inkscape has the Spiro curves — simpler and more intuitive curves than Bezier. It has plenty of filters, modifiers, layers, paths and so much more. Sketch easily practically any shape. Save vector files as PNGs, in varying dimensions. The interface is very easy, and for the beginner as always it’s advised to explore the menu, as well as going through the documentation.
Since Blender belongs to other graphical programs category, the UI is less intuitive and requires more time to learn. This program is great if you want to bring some realism to your website. Things like adding a realistic shadow to a photo can be done quickly. It’s a really good choice if your drawing skills aren’t good enough and you want to draw realistic objects in space. Another advantage is that you can crate and render an amazing red car from any angle, change the environment, lights etc. Of course drawing these from scratch would require more time and skills. So what’s possible to create with Blender? You can find fine examples here, or here, or here.
Shark Ride by Kjartan Tysdal
Finally, I decided to interview some great artists who use OSS. I found their email addresses, contacted them, and they kindly agreed to answer a few questions about using OSS.
You have many beautiful and interesting works on your website. Which one is your favorite?
Thanks a lot. It’s hard for me to define a ‘favorite’. That’s probably because I still see something to fix in each illustration I did. When I update my portfolio, I always let my wife decide which artwork she would choose for inclusion. My real favorite illustration — is certainly the idea I have in mind just before trying to lay it down with my tools. I still try to get closer and closer to this original idea.
Can you describe some difficulty that you encountered while using Open Source software?
It was a real challenge, and only 2 years ago for me. The first set of difficulties was purely technical : installing and choosing a distribution, makes almost all the hardware working, configure the tablet ; all of this is difficult and I had to spend time and patience to understand how it worked. The second set of difficulties is more related to my artworks. . No other users at this moment did professionals digital painting with graphical OSS. I had almost to invent a way to do it , test many softwares and try to find a professional workflow. I had to find alternative to a lot of things, and change totally my way to think an artwork. Thanks to Mypaint, Alchemy and the fork Gimp-painter , I discovered great tools.
2 years after, I can see things grew so fast that 95% of the difficulties I encountered totally disappeared : Distribution, tablet and most of the OSS I use are really easy to install, and documentation and tutorials now exist.
How do you contribute to the Open Source community?
I contribute as a user can do : I report bugs, I communicate with developers to give them feedback on new features, I use them and I maintain a blog to share my resources/tips/tutorials. I’m mostly around Mypaint, Krita, Ubuntu/Mint and Blender.
As an active user in the community, can you share some of your thoughts about the future of the graphical OSS?
Graphical OSS will grow ‘slowly by surely’ and become stronger tools, this is sure. I already see many studio adopting FLOSS, or schools learning to student with them and I guess it will grow too in the future. So, I’m confident about a very bright future for graphical OSS.
For many, Andrew is better known as Blender Guru. He has created/creates many great works, you can find more info about him, and a lot of smashing Blender tutorials on his Blender 3D tutorials website.
Why did you choose Blender? Was it a hard decision to go the ‘Open Source’ way?
Nope! I started way back when I was 15, and had the choice between $3000+ commercial software or the open source Blender. It was a no brainer for me :)
How would you compare Blender to a proprietary 3D software in terms of ability to create great 3D scenes?
One of the great things about blender is that it’s a complete 3d suite. It allows you to create an entire animation or artwork from start to finish without ever leaving blender. Once you’ve used the built-in compositor you won’t ever want to leave ;)
However, Blender is not without it’s shortfalls. The internal render engine is severely lacking when compared with commercial render engines. In my opinion it’s the one thing that is stopping Blender from being production ready, so I hope it’s improved shortly.
Do you think it would be difficult for someone who’s not familiar with Blender to learn to use it?
Of course! But that comes with the territory. All 3d software has a very steep learning curve, it’s up to the artist to persevere through the roadblocks until they become good at it. The hardest part for most beginners is getting used to working in three dimensions. Once you’ve got that down pat, everything else usually falls into place.
Leaving the financial side, would you recommend Blender, or would you suggest buying a 3D editing program? Why?
In all honesty, if you want to get employed in the 3d industry then you need to be using 3ds Max. It’s just a simple fact. It’s the industry standard application and most employers will expect you to know how to use it. However having said that, Blender is the perfect application for beginners to get their feet wet. They can learn the fundamentals in a supportive community, do almost everything with it that commercial applications can and with no costs. It’s a seriously powerful program, but it may take a while before the industry realizes that.
I found Sebastian’s portfolio on DeviantArt. He uses GIMP / GPS among the other tools. Take a look at his amazing works.
Edgewalk by Sebastian Zakrzewski
Why do you prefer using the open source programs? Which benefits do they give you?
Open source is free and legit. It’s also solid alternative to commercial programs — it offers same basic functionality and performance.
It’s also about flexibility — commercial projects usually stick to one design and approach to work,
while community behind open source doesn’t hesitate to experiment and often comes up with great ideas on how things can be done in different way.
Do you encounter situations when you would prefer using similar proprietary software for your art works instead?
Yes and no: I miss few handy tools like freeform transformation from Photoshop but I can live without them. On the other hand there’s no good alternative in open source for ArtRage or Google Sketchup I sometimes use, but they’re addition to software I’m using on regular basis. If need arises and I won’t be able to find anything suitable in open source, I won’t hesitate using proprietary software.
Would you recommend others use open source software?
Yes, it’s definitely worth trying — it may suit your needs and thanks to popularity it’s constantly gaining I think more and more solid programs will show up.
Here’s a bunch of download links for free graphical software to try out. The first four programs were described in this article, and can be downloaded straight away, others can be easily added on Linux machines.
- Blender 2.5!
- VirtualBox and appliances
- Chrome / Firefox: the ultimate WYS part of WYSIWIG.
- Netbeans / Eclipse: the coding part (html,php etc).
- Fspot / Shotwell photo manager
- Luminance HDR
- Hugin – panorama photo stitcher
- OpenOffice Presentation in particular.
- mtPaint – pixel art
Val Kotlarov is yet another talented dude, who likes to combine fine and creative arts through software. He tries to express this better through the web development and design. OSS occupies the foreground on (t)his landscape divided by the rule of thirds, and remains in the central rectangle. The background is currently in bokeh.