Batch processing with Fireworks has saved my butt on countless occasions. To be quite honest, I have no idea why their isn’t an equivalent feature packaged with Photoshop. With Fireworks it’s intuative, full-featured, and fast. Lets get started!
Blog & Design Tutorials
Batch Processing with Adobe Fireworks
July 3rd, 2009Easy Glossy Buttons with Fireworks
June 14th, 2009Just a few short years ago the gloss, or shiny look took the world of web interface design by storm. From a visual design perspective it became synonymous with web 2.0 – the modern crème de la crème of internet buzzwords! But is the glossy button falling from grace? Perhaps, but that won’t stop us from exploring some fun Fireworks techniques as we create some glossy buttons in Adobe Fireworks.
Reader Mail!
August 26th, 2008
Time for reader mail! I’m quite a bit backlogged, so I apologize on how long it took to post this. Most all questions I try to respond too via email right away though. Keep them coming! As to why there was such a long dry spell with the blog: To make a long story short I took a new job at a company 1,000 miles away in Charleston, South Carolina. At the time we moved my wife was about nine months pregnant. Our first child, a beautiful baby girl was born July 7th. Check out the Flickr album here if you’re curious. Thanks for everyone’s patience and kind words of encouragement during this lull in activity. Now on to the mail!
Bellabean Coffee: Part 6, Using Layers in Fireworks
August 17th, 2008
This is the sixth part of a series of web design tutorials on Adobe Fireworks. Using a fictional company I’m documenting my design workflow from start to finish. You can follow along by starting at the beginning of the series or by downloading the most recent Fireworks PNG file here (right-click, save-as). If you’re just starting out, you can download the 30-day full feature Adobe Fireworks demo here (note: A relatively painless account setup is required to download the free demo).
Bellabean Coffee: Part 5, Giant photo background
April 8th, 2008
This is the Fifth part of a series of web design tutorials on Adobe Fireworks. Using a fictional company I’m documenting my design workflow from start to finish. You can follow along by starting at the beginning of the series or by downloading the most recent Fireworks PNG file here (right-click, save-as). If you’re just starting out, you can download the 30-day full feature Adobe Fireworks demo here (note: A relatively painless account setup is required to download the free demo).
Quick Navigation Bar
March 22nd, 2008
I’m taking a break from the Bellabean Coffee design series this week to show a quick example of my workflow with Adobe Fireworks from start to finish. In this quick tutorial I’ll demonstrate how to design a typical bar style navigation and then export the images for inclusion in an HTML document. The Fireworks PNG source file for this will be included at the bottom of this post. If you’re just starting out, you can download the 30-day full feature Adobe Fireworks demo here (note: A relatively painless account setup is required to download the free demo).
Bellabean Coffee: Part 4, Masthead Details
March 11th, 2008
This is the fourth part of a series of web design tutorials on Adobe Fireworks. Using a fictional company I’m documenting my design workflow from start to finish. You can follow along by starting at the beginning of the series or by downloading the most recent Fireworks PNG file here (right-click, save-as). If you’re just starting out, you can download the 30-day full feature Adobe Fireworks demo here (note: A relatively painless account setup is required to download the free demo).
Bellabean Coffee: Part 3, Using Raster (photo) images in Adobe Fireworks
March 2nd, 2008
This is the third part of a series of web design tutorials on Adobe Fireworks. Using a fictional company I’m documenting my design workflow from start to finish. You can follow along by starting at the beginning of the series or by downloading the most recent Fireworks PNG file here (right-click, save-as). If you’re just starting out, you can download the 30-day full feature Adobe Fireworks demo here (note: A relatively painless account setup is required to download the free demo).
Bellabean Coffee: Part 2, Creating a Masthead with Fireworks
February 9th, 2008
This is the second part of a series of web design tutorials on Adobe Fireworks. Using a fictional company I’m documenting my design workflow from start to finish. You can follow along by starting at the beginning of the series or by downloading the most recent Fireworks PNG file here. If you’re just starting out, you can download the 30-day full feature Adobe Fireworks demo here (note: A relatively painless account setup is required to download the free demo).
Bellabean Coffee: A Fictional Client Project Using Adobe Fireworks
January 24th, 2008
Welcome to part one of my fictional client project: Bellabean Coffee. This will be a brand new, upstart, fictional coffee shop that’s requesting a brand identity complete with a website. To get things started we’re going to explore some of the vector capabilities of Adobe Fireworks by creating a simple logo for Bellabean, and nailing down a color scheme.
Setting the Stage: A New Fireworks Document
January 17th, 2008
I’m going to show you my particular workflow for creating a web layout with Adobe Fireworks, and I’m also going to cover the selection tools. When I get started on a new project, I like to have as much open canvas space as possible. Yet it’s also important to keep what’s going to become your finished product at the correct size for the eventual export.
To get started, click File > New to open the New Document Window. Here is where you set the document size and background color. I’m going to leave the discussion on ideal width for a website for a different post, but for our purposes here we’ll be using a relatively wide fixed-width design. So set the width to 940 px, the height to 3000 px or so (think big canvas) and choose a white background color. Make sure your DPI is set to 72, and click ok.
Why make websites with Adobe Fireworks?
January 10th, 2008
First things first, understanding the difference between vector and raster graphics. Raster graphics are flat images, like photos, jpegs, gifs, etc. Vector images on the other hand, are barely related. A vector image is geometric, much like CAD drawings. Fireworks, just like Flash and Illustrator create a file made up of points, lines, curves, and shapes.
Welcome to my Adobe Fireworks Blog
December 30th, 2007Hello, and let me be the first to welcome you to my brand new blog. As of the date of this writing, I’m sure I’m not welcoming very many people – but I sincerely hope that’ll change. Why you might ask? Because I’m a huge proponent of the program Adobe Fireworks and I’d like to help people get to know it (and love it) just as I have.
Hello from
