A quick Looney Tunes imitation with Fireworks

Doing graphic design in Adobe Fireworks is easy. And not only easy, but fun.

The following imitation of the oh-so-well-known-around-the-world logo of Looney Tunes was created by me just for fun, a couple of days ago:

A Looney Tunes imitation with Adobe Fireworks
(click on the image for original size!)

I don’t have the Looney Tunes font, so it doesn’t look as close to the original… I could have imitated it better, of course, but maybe some other time — it looks not bad even as it is now… :)

The smell of HTML and CSS in the morning…

A few days ago, Jeffrey Zeldman said: I love the smell of HTML in the morning.

To which I replied: @zeldman I bet it smells like a good cup of coffee! ;-)

And Jeffrey replied: @optimiced How right you are.

This inspired me to quickly create the following illustration in Fireworks:

The smell of HTML (and CSS) in the morning

(NOTE: Coffee cup is re-created from scratch in Fireworks, although it looks like this illustration. The final appearance of my little drawing was also inspired by @molif, for which I’d like to thank her!:-)

Adobe Fireworks Wallpaper Constest!

An amazing contest to participate in!

Just create an original wallpaper in Adobe Fireworks, send it (along with your contact info) to FireworksZone, and you are in!

Fireworks wallpaper contest

First prize is a retail version of Adobe CS4 Web Premium, USD 200.00 in cash, plus a chance to write a tutorial for Adobe Devnet | Fireworks!

Full details can be found here: http://www.fireworkszone.com/g-2-535

…but for your convenience, I will re-post all of them below:

Theme Fireworks Zone is holding a design contest. Use your imagination and design/illustration skills to create wallpapers using Adobe Fireworks. Size: 1280×960 pixels. The theme is open, with one wallpaper per contestant.
Who can compete? Everybody can participate as long as the artwork is a source PNG file (editable Fireworks PNG), which means you require the use of Adobe Fireworks.
Your submission must contain contact information and a short, one or two line biography, along with the artwork.
The contact information must include at least one of the following: home address, phone, or email address (preferably all of them). If you like, include your website URL so we can include it with your biography, if you are selected as a winner or runner-up.
Period From mid October 2009 — till December 1, 2009.
Artwork The artwork must be original and created specifically for this contest.
Formats accepted: Adobe Fireworks source file PNG, in vector format.
Submissions should be emailed to webmaster(at)fireworkszone.com with the following subject: “Wallpaper Contest — 2009
Converting Text to Paths Because every computer has a different set of fonts installed on it, you should never assume that the client has the particular font you used available. It is often illegal to deliver font files with your logo, so it is important that you convert all your text to paths, curves or outlines. This step will convert all fonts into a vector shape, and will not allow you to edit the text any further. In Adobe Fireworks, simply select the text you want to outline and go to Text > Convert to Paths.
Judging Criteria Creativity & Originality; Graphics skill
The judges A panel of judges will be selected. Each member will be part of the webdesign industry, fireworksgurus, Fireworks users and/or evangelists.
1st Prize $200,00 (payable through Paypal) + 1 copy of Adobe CS4 Web Premium + T-shirt. Additionally, Adobe we will invite the winner of the contest to work with the Adobe Developer Connection (Fireworks Developer Center) to write an article highlighting his/her inspiration and steps for creating the winning art.
If the winner declines this opportunity, the invitation would be extended to the runners up.
2nd Prize $100,00 (payable through Paypal) + Fireworks book + T-shirt
3rd Prize $50,00 (payable through Paypal) + Fireworks book + T-shirt
Prizes Prizes will be awarded to winners at the end of the competition’s period. The top 3 wallpapers will be published on Fireworks Zone.
Sponsors Adobe and Fireworks Zone sponsor this contest.
Downloads To participate, you will need to have installed Adobe Fireworks CS4 (earlier versions are acceptable, too).
If you do not own a retail version of Adobe Fireworks CS4, you can download a full-functional 30-days trial version from www.adobe.com/products/fireworks/
(Windows and Mac versions are available).
We also strongly recommend to you to upgrade your Fireworks CS4 version with the latest update (10.0.3.011), which can be downloaded from http://www.adobe.com/support/fireworks/downloads_updaters.html

If you have comments or questions, don’t hesitate to contact FWZ, which is organizing the contest!

In just two weeks, you could be the proud owner of Adobe CS4 Web Premium Suite — by simply creating a nice wallpaper in Fireworks!

So hurry up, as deadline for participants is December 1st, 2009!

Please, re-tweet and re-blog, as we are trying to bring together as many designers and Fireworks gurus as possible! Thanks! :)

Short URL for this post: http://bit.ly/fw-w-contest

Fireworks Grunge Styles 1.0

Today I am happy to announce for download the following Fireworks styles, by Fireworks guru Mikko Vartio:

(You can find Mikko in Twitter and Flickr, where he often posts about Adobe Fireworks.)

The styles are called Fireworks Grunge Styles, version 1.0.

They are absolutely free — but if you mention their author, Mikko, in a project where you plan to use them, this will be greatly appreciated! ;-)

Fireworks Grunge Styles (screenshot)
[downloaded over 300 times between Nov 14, 2009 and Dec 30, 2010!]

Description from the Author

  • The styles are based on Advanced Stroke settings and Alpha channel.
  • The grunge comes from custom white stroke and with Filters/Convert To Alpha, the stroke is “removed”.
  • Each style is coloured with Filters/Hue/Saturation settings, so color can be adjusted with adjusting the Hue value (see “Filters” section in the Property Inspector).

Installation & Use

Simply copy the file “Grunge Styles.stl” (found in the ZIP archive) to the Adobe Fireworks “Styles” folder and restart Fireworks.

1) Example location of the folder on Windows XP, for Fireworks CS4:
C:\Documents and Settings\USERNAME\Application Data\Adobe\Fireworks CS4\Styles\

2) Example location of the folder on Windows Vista, for Fireworks CS4:
C:\Users\USERNAME\AppData\Adobe\Fireworks CS4\Styles\

(For Windows 7 and MacOS X, please, refer to Adobe Fireworks Help, for the exact location of the “Styles” folder!)

That’s it! :-)

After you have copied the styles to the Fireworks “Styles” folder, and restarted Fireworks, you can can select “Grunge Styles” from the dropdown list in the “Styles” panel [screenshot], then select an object on the canvas, and apply any of the styles to it. They can be also edited easily (color, for example), so feel free to experiment!

Of course, you can also load the styles without first copying them: Open the “Styles” panel in Fireworks, then select “Load Style” from the panel menu [screenshot], and load them! (But personally, I prefer the other method.)

Download

[ Download Fireworks Grunge Styles 1.0 ]

Enjoy! :)

[ short URL: http://optimiced.com/en/?p=644 ]

Why Fireworks?*

Sometimes I hear “Adobe Fireworks? What it is for?” or “Why should I use Fireworks, if I use Photoshop/Illustrator?”.

Instead of answering that question, I’d like to show you the following illustration:

Mercedes SLA, drawn in Adobe Fireworks
— this vector illustration was created with Fireworks in 2005, by Fred Michel (unfortunately, I couldn’t find more information about its author) [download PNG editable file].

Or:

A compass, by David Hogue
— this illustration is by David Hogue, it was created a couple of days ago as a try to use similar technique as in an Illustrator tutorial [download PNG editable file].

Not bad results, eh? Especially for a program that is looked upon (by some) as an inferior alternative to Ai/Ps;-)

With Fireworks you can create some magical things or simple color effects. This is the ideal program for graphics for Web/screen — it combines the best of the bitmap and vector world. Fireworks is easier to use than Illustrator, it is even more easier than Photoshop. No, it is not free, but it is not expensive, either (it’s approximately 3 times less expensive than Photoshop, if I must be exact).

Some prefer GIMP. Others — Inkscape. Some creative professionals use only Illustrator and Photoshop. I remain a true fan of Fireworks and I would be happy, if Adobe will continue with its successful development…

My personal opinion is that for Web graphics and all graphic design tasks intended for use on screen (RGB/RGBa), Fireworks is the perfect tool! :-)

UPDATE (2009/Sep/23):

Illustration by Ryan Hicks, drawn in Fireworks
— I also forgot to show this excellent illustration by Ryan Hicks [download PNG editable file] (thanks, Jim!:-).
________________________
*Why Fireworks?
— a popular article by designer Stéphane Bergeron, published in Adobe Devnet.

Wild strawberry, in color and b&w (Fireworks)

Is it easy to color only some parts of an image/photograph?

Yes.

Is it easy in Adobe Fireworks?

It’s even easier than you may think! :-)

wild strawberry
(original photo by Ani, CC)

The image above was edited by me in less than 5 minutes, and yet, the final effect is quite impressive!

How it is done?

There are probably more than five ways to achieve a similar effect, but here’s how I proceeded:

1) Open a digital photograph in Fireworks;
2) ctrl+shift+D (cmd+shift+D on a Mac) to clone the layer with the photo;
3) In the Layers panel you now have 2 identical layers, both of them in color;
4) Select the lower layer, “lock” it in the Layers panel;
5) Select the upper layer, use menu Commands > Creative > Convert to Grayscale to convert it to black & white;
6) Now you have a b&w layer above a color layer;
7) From now on, it is easy: simply delete (use Marquee Tool, Eraser Tool, or a combination of both) parts of the upper, b&w layer, and the color parts will start to show through! Done! :-)

This technique can be quite effective, if applied to the right kind of image. In this case the original is very good for this purpose, as color is almost missing from it.

You can try to play with colors in GIMP, Fireworks, Photoshop — I don’t think there will be much difference in any contemporary graphics pogram:)

Finally, thanks to Geri, who inspired me to try this effect in Fireworks! ;-)

My first article (tutorial) at Adobe Devnet

While me and Ani take some short rest on the sea — just a couple of days around the Spirit of Burgas music festival, Faith No More, and our travel to Bourgas and Byala — my first ever tutorial went live at Adobe Developer Connection.

The ones who know, know, what is Adobe Devnet, and for those who don’t I’ll quickly mention that it’s a big honour for me that my modest work about Adobe Fireworks CS4 and its CSS Export options are now in the section Adobe > Devnet > Fireworks! :-)

Of course, the whole extended tutorial is far from being perfect — a lot of things I could have said in a better and shorter way; a lot of other things I forget to mention at all, and probably, I have some mistakes here and there, but I would be glad if the fruits of my 100+ h work could be useful to more than one Web/graphic designer…

That’s it, for now — my style is a bit telegraphic, but I have a whole day of swimming and lying on the beach tomorrow, so I better get some sleep now! :-)

PS And that’s the direct link to my Fireworks tutorial:)