9 Replies Latest reply on May 21, 2008 7:23 PM by pixlor

    Banner using Fireworks??

    Miss_Angela
      I know that Photoshop is the best program to create a banner, but I don't have that program and I want to make a banner. Can I use Fireworks? What does Photoshop have that Fireworks does not.

      This is something like I wanna do :
      http://members.optusnet.com.au/willowb71/banner.jpg

      I want to make what it looks like in the background of this banner, all the images together and like a fade over color so they all match. I have NO idea how to do this. If anyone knows of a tutorial for this type of banner please help.

      I basically want to see if something like this can be done in fireworks.. Any help would be be appreciated. I've done a search and can only find tutorials for basic banners, this one is a bit more advanced.

      Thank you
        • 1. Re: Banner using Fireworks??
          Level 7
          I'm sorry, I don't have time to go into details, but just to reassure you
          Fireworks is probably the best if not very best program to do this.

          I'm quite sure someone will be along soon to help.

          Peter
          _____________________
          "Miss_Angela" <webforumsuser@macromedia.com> wrote in message
          news:g07v6p$n0p$1@forums.macromedia.com...
          |I know that Photoshop is the best program to create a banner, but I don't
          have
          | that program and I want to make a banner. Can I use Fireworks? What does
          | Photoshop have that Fireworks does not.
          |
          | This is something like I wanna do :
          | http://members.optusnet.com.au/willowb71/banner.jpg
          |
          | I want to make what it looks like in the background of this banner, all
          the
          | images together and like a fade over color so they all match. I have NO
          idea
          | how to do this. If anyone knows of a tutorial for this type of banner
          please
          | help.
          |
          | I basically want to see if something like this can be done in fireworks..
          Any
          | help would be be appreciated. I've done a search and can only find
          tutorials
          | for basic banners, this one is a bit more advanced.
          |
          | Thank you
          |


          • 2. Re: Banner using Fireworks??
            pixlor Level 4
            Yeah, you can do that with Fireworks.

            Broadly, here are some general suggestions. If they're too vague, ask a specific question, okay?

            First, get stuff ready to work on. Open up a Fireworks document that's a pretty good size. Get some images you like. and plop them in. They'll each be a bitmap object whose visibility you can turn on and off by clicking on the eye symbol. It's handy to turn them all off except the one you're working on. You can double-click on "Bitmap" to rename an object and that can help you keep track of them.

            It's nice to cut away what you don't need. You can use the magic wand, the rectangular or oval selection tool, or the lasso selection tool to select bits you don't want, then press your Delete key. Keep on getting rid of what you don't want till you're fairly happy.

            You can resize the images to the same size: select each one, then go to Modify > Transform > Numeric Transform, then Resize, and enter your dimensions.

            Click on an image with the selection tool to move it around. To change which ones are in front, drag the object up or down in the Layers palette on the lower right.

            For the background, it looks like the images are grayscale. Go to Filters > Adjust Color > Hue/Saturation... and set Saturation to 0. Or at least way down.

            Now...to get that overlapping effect, you can experiment with a couple of things. On the on the Layers palette, you can change the opacity (look for the checkerboard symbol and "100" and set that to a smaller number) or the blending mode (look for "Normal" and try some of the other options in the drop-down, like "Multiply").

            For that all-over color, add a rectangle object that's the size you want for your banner and set the opacity very low.

            There are quite a few ways to get interesting edge effects. One way is to add a rectangle with no fill and a stroke. To do this, add another rectangle and select it. In the Color mixer, click on the color block next to the paint bucket and click the red circle with the line through it. Click on the color block next to the pencil and choose a color. In the Properties inspector, there's a section for strokes. It probably has "1-Pixel Hard" in a drop down box. Experiment with the width (probably 1 in the text box to the left of that) as well as the strokes available to you in the drop down box.

            The example has some colored text over the background images, but behind the foreground images. Add that next and set its opacity low. Add your foreground images. Add your foreground text. In Fireworks, the drop shadow is under the Property Inspector palette's "Filters;" selection.

            If you want to add another object, later, you can move it backwards (or forwardwards) by dragging its object in the Layers palette. If you're not sure if you like something, just click the eye symbol next to it to set it invisible.

            Save your work often. I like to make a new version at least once a day and put the date on the end so if I mess up, I've only lost a few hour's work. For example, banner-5-12.png, banner-5-13.png, etc.

            If you have questions about anything specific, then just ask. Specific questions are sometimes easier to answer.

            Good luck!
            • 3. Re: Banner using Fireworks??
              Miss_Angela Level 1
              Please help!! I am stuck... Here is where I am having issues....

              Ok, the size my banner needs to be is w960 h196 Do I make the canvas this exact size at the beginning to work with or shrink it later?

              I don't understand if I am supposed to edit an image before I import it in the banner. I have tried importing a 4x6 image, shrink it, use the magic wand, use feather, but it doesn't look good at all. When I use the layover color, it just looks like a cover and the picture does not look sharp.

              Is it better to outline the photo and get rid of everything around it?

              Another problem. My website is a blue color (#4682B4) not really dark, but I want to have maybe the background of the banner white, but the overlap a lighter blue.. For some reason, the color I use for my canvas is the same color used for the overlap. I can't figure out how to get around this.

              In this banner, an example I found online. It looks like someone just outlined the photos, deleting any background and put them up against a white background. I don't see how the magic wand works for this. http://members.optusnet.com.au/willowb71/banner.jpg

              I must be doing something wrong. haha
              • 4. Re: Banner using Fireworks??
                grrafty371
                quote:

                Originally posted by: Miss_Angela
                I know that Photoshop is the best program to create a banner, but I don't have that program and I want to make a banner. Can I use Fireworks? What does Photoshop have that Fireworks does not.

                This is something like I wanna do :
                http://members.optusnet.com.au/willowb71/banner.jpg

                I want to make what it looks like in the background of this banner, all the images together and like a fade over color so they all match. I have NO idea how to do this. If anyone knows of a tutorial for this type of banner please help.

                I basically want to see if something like this can be done in fireworks.. Any help would be be appreciated. I've done a search and can only find tutorials for basic banners, this one is a bit more advanced.

                Thank you


                Fireworks will be the perfect program for banners similar to that. Fireworks can even make better then that.
                • 5. Re: Banner using Fireworks??
                  Miss_Angela Level 1
                  anyone? Please read my last reply. I still need help. Thanks
                  • 6. Re: Banner using Fireworks??
                    Level 7
                    Miss_Angela wrote:
                    > anyone? Please read my last reply. I still need help. Thanks

                    Hi Angela,

                    See if this tutorial helps

                    http://www.projectseven.com/tutorials/images/p_montage/index.htm


                    --
                    Linda Rathgeber [PVII] *Adobe Community Expert-Fireworks*
                    --------------------------------------------------------------
                    http://www.projectseven.com
                    Fireworks Newsgroup: news://forums.projectseven.com/fireworks/
                    CSS Newsgroup: news://forums.projectseven.com/css/
                    http://www.adobe.com/communities/experts/
                    --------------------------------------------------------------
                    • 7. Re: Banner using Fireworks??
                      pixlor Level 4
                      quote:

                      Originally posted by: Miss_Angela
                      Please help!! I am stuck... Here is where I am having issues....

                      Hi again. Linda's tutorial is really quite nice, you might want to read it through.

                      quote:

                      Ok, the size my banner needs to be is w960 h196 Do I make the canvas this exact size at the beginning to work with or shrink it later?

                      Hmm. I'd make your image larger, so you have some room to work. But, put a 960x196 rectangle at the bottom of your layer stack, so you know where you want to place things. Then, when you''re done, save a copy , turn off visibility of all elements except this rectangle, and click on
                      Modify > Canvas > Trim Canvas
                      (There are other ways to crop a document, but this is one possible easy way.)

                      quote:

                      I don't understand if I am supposed to edit an image before I import it in the banner. I have tried importing a 4x6 image, shrink it, use the magic wand, use feather, but it doesn't look good at all.

                      If you have another image editing program that you're comfortable with, by all means go ahead and use it. After you shrink an image, try applying some unsharp mask to make it crisper. It's under
                      Filters > Sharpen > Unsharp Mask...

                      quote:

                      When I use the layover color, it just looks like a cover and the picture does not look sharp.

                      I'm not sure what you mean by this.

                      quote:

                      Is it better to outline the photo and get rid of everything around it?

                      If you mean with the lasso tool or something, then probably yes. That way, you won't have any distracting bits.

                      quote:

                      Another problem. My website is a blue color (#4682B4) not really dark, but I want to have maybe the background of the banner white, but the overlap a lighter blue.. For some reason, the color I use for my canvas is the same color used for the overlap. I can't figure out how to get around this.

                      You can always set a rectangle at the bottom of your layers, but you can change the canvas color by clicking on
                      Modify > Canvas > Canvas Color...
                      and select what you want to have.

                      quote:

                      In this banner, an example I found online. It looks like someone just outlined the photos, deleting any background and put them up against a white background. I don't see how the magic wand works for this. http://members.optusnet.com.au/willowb71/banner.jpg

                      Ah. I getcha now. Try the Lasso selection tool. The magic wand will get similar colors, so it's only helpful if the background is one color.

                      quote:

                      I must be doing something wrong. haha

                      No, just learning how to do stuff.

                      • 8. Re: Banner using Fireworks??
                        yes ,definitely
                        you can simply left the heavy photoshop
                        photoshop is better for digitalpaiting and make up in pictures
                        you can to something incredible with fireworks

                        i made this donation button by fireworks
                        http://prisonerblogger.com/2008/05/my-3rd-step-for-liberty/
                        • 9. Re: Banner using Fireworks??
                          pixlor Level 4
                          quote:

                          Originally posted by: PrisonerBlogger
                          yes ,definitely
                          you can simply left the heavy photoshop
                          photoshop is better for digitalpaiting and make up in pictures
                          you can to something incredible with fireworks

                          i made this donation button by fireworks
                          http://prisonerblogger.com/2008/05/my-3rd-step-for-liberty/



                          Psst! She says in her first post that she doesn't have Photoshop.

                          Nice button, though!