Thursday, July 10, 2008

Heading into Fireworks

I used the tool, Adobe Fireworks, to create the header for my blog. Mostly, I just played with it to figure things out, but I did get one important tip from an online tutorial: After you open an image that you want to use in Fireworks, take a screen shot of it. Then, in Preview, choose edit>copy. Back in Fireworks, select the "page" you want the image to go on. Choose edit>paste. In Fireworks, the designer works with pages and layers. I took a photo of my dog, and put it on a "page". Next, I downloaded an image of a computer keyboard and copied it to another "page" in Fireworks. Using the select tool, I moved the image around so that only the part I wanted showed in the box. I used the scale tool to elongate the image to make the keys look stretched out. I went back to the page the dog picture was on and, using the eraser tool, I erased everything but the part of the picture I wanted. This made the keyboard on the next page show through. Next, I added a text box, chose a font, color, and typed bloggiedoggie. I used a live filter of "inset embossed" on the type. The live filters are found in the properties box. Under assets in the Pages box, I chose a thinking bubble, and dragged it to the image. I manipulated the curvature, the distance, and the direction of the bubbles from the dog's head. In the properties box, I gave the bubble a fill color, an outline color, and added text. The last element I added was the pawprints. I imported that image into a layer of one of the pages, and I'm not sure how I did it, but I was able to set that layer to dissolve through so the pawprints showed on top of the other pages. I was then able to grab the pawprints, and move them around to where I wanted them. I ended up feeling that there is a high learning curve in using Fireworks.

To find the number of pixels needed for my blog header, I noticed, quite by accident, that the pixel width 730 showed, when a new picture was uploading into blogspot. To figure out the height, I measured it in inches. In Fireworks, you can set the picture size in pixels, inches or centimeters.

Enjoy my customized header!

4 comments:

BarbsBlog said...

Lori,

I love your header! Very nicely done and thank you for sharing Chase's tutorial with everyone. Have you started calling your doggie, bloggie?

Cheers! Barb

BloggieDoggie said...

Thanks, Barb. I have started calling my little doggie, bloggie. Just as a dog can become a best friend, I find myself thinking about my blog, and how it is like a best friend as well(always there when you need it, waiting patiently for your return, a place to let down your guard).
I appreciate your comment on my header. A huge learning curve, but I see how important it is to understand this end of graphic design. Great tools to use in the year ahead!
LJ

atechtchr2c said...

What a wonderful header. Nicely done and I'm sure that "bloggie" is waiting for the opportunity to post his/her comment as well. Perhaps, you might consider a "guest blogger" in the future? :)

AG

Demetri said...

Excellent work on this, and excellent description! It's great to see your composite images that carry forward the title/meaning of your blog. Each of the images (dog, keyboard, footprints, text) contribute to the overall purpose of the header.