Archive for February, 2009

Copy Pase layer structure now!

Facing problems while copy pasting layers and the layer structure not being respected.

Now worries now! Just use the extension created by Mayur

Download Link

Share on Facebook

Adobe Fireworks resources on the web.

Apart from the regular Exchange, Dev net articles, forums and community help available at Adobe’s official website, following are some of the links which are dedicated to Fireworks. It includes forums, blogs, extension posts, design posts, workflow descriptions and many other cool stuff dedicated entirely to Fireworks.

Alan Musselman

Aaron Beall

Thierry Lorrey

Matt Stow

Fireworks Guru Forums

There is also a Linked In group. Catch up on some of the interesting discussions going in there. There is also a google group named Macromedia Fireworks.

In case you guys find some other resources about Fireworks anywhere on the web, let me know so that I can highlight it as well. Let us spread the Fire which Works!

Share on Facebook

Fireworks panel series begin soon!

Hi everybody,

I am planning to start a series of blog entries on Panels in Fireworks. The entries will dive deep into exploring the panel functionality. It will help users in understanding the complete functionality of panels which are present in Fireworks.

If you would like to get some panel explained early in the series, send in the comments.

Share on Facebook

Fireworks and Symbols

Symbols are an important part in the way designer works with Fireworks. The application at the same time tries to reduce the burden or test his memory of updating all instances of the same object when any change is done.

To update all the instances in one go and provide further flexibility in the operations, Fireworks has symbols with multiple variations of it. Symbols are actually stored in the fireworks png file . Once a file is opened they can be accessed from "Document Library" panel in CS4 version. In the prior version it can be accessed from "Library" panel. The panels can be accessed from "Window" menu on a Mac or a Windows machine.

  1. Graphic
  2. This is the most generic form and has a parent child relationship. Whenever the master instance of the symbol is edited, the changes are broadcasted to all child instances of the symbol within the entire document. This serves as the edit once and update all mechanism. Any of the child instances can be updated so that the master knows of edits and transmits the update to all other instances.

  3. Button
  4. For creating effects like roll over, hover and similar behavior, the button symbol are used. They can be 2 state or 4 state buttons depending on the number of States/Frames which are present inside the symbol object. These symbols exhibit the behavior when previewed in browser or the preview button.

  5. Animation
  6. This is the traditional form of creating animated gif files. The transitions, delay settings and other file details are customized from the States panel.

  7. Component Symbols (aka Rich Symbols)
  8. Introduced in CS3 this is probably the most advance and least understood symbol type. This type of symbol also has a parent child relationship with an overriding facility. All the attributes of parent are inherited by all the child instances but if the child instance changes any of the available attribute from "Symbol Properties" panel, the parent attributes get over ridden only for that instance of the symbol. Any other instance of the symbol in the document does not get affected. Only the attributes changes through this panel are overridden, all other attributes are inherited from the parent.Each rich symbol is associated with a script from where the Symbol Properties panel is populated with the attributes which can be edited..

Symbols can be edited by double clicking on them. Once done so, the user enters the symbol edit mode where all the graphic tools are present for editing the objects.

Share on Facebook

Vectors rendering in Fireworks

Fireworks is a hybrid application with a competent set of tools and operations for the vector objects. One thing that suits for Fireworks is the ability to design for the screen. It could be a website, web application, desktop application, mobile application, ATM machine or anything else.

Designing with vectors and still get the pixel precision defining for it gives the application an edge. To learn more about how the rendering happens for the vector which have been created in Fireworks check out the following Knowledge Base article at adobe .com by Trevor

Vector Rendering in Fireworks

Share on Facebook

Kuler service in Fireworks CS4

Kuler is another service which has been added in Fireworks CS4. Kuler is a color palette sharing mechanism amongst the community of designers. The kuler panel can be accessed from Windows->Extensions->Kuler menu item.

The Browse tab within the panel allows users to search for the right palette. When the search results are populated with color palettes, an triangle icon next to it brings up a menu as shown below. The theme can be edited within the Kuler panel which will bring you to the Create tab.

Kuler panel Browse tab


You can also select a palette and add them to the Swatches panel in Fireworks through "Add to Swatches Panel" menu. This will add the palette of 5 colors at the end of all color entries in Swatches panel in Fireworks.

The Create tab as already mentioned allows for the editing of searched themes. The below image has 2 icons highlighted which communicate directly to Fireworks. The yellow highlighted icon numbered 1 sets the current stroke color of Fireworks as the Base color. The blue highlighted icon does the same operation but for fill color. If stroke or fill has transparent set to them as the color, a dialog will warn the the user to choose only solid colors. Same warning dialog appears when the user tries to work with gradients and other non solid color values.

Kuler panel Create tab


Other workflows are if the fill or stroke field is selected in Tool palette, double clicking on any color in the 5 squares will set that color to the selection in Tools palette.

Share on Facebook

Fireworks – Past, Present and Vision

Different logos of past Fireworks versions

In the days of Macromedia, Fireworks was a tiny niche, but popular application preferred by people for its flexibility while dealing with bitmap and vector objects. That is still a very big advantage for the application but the journey for it is being defined freshly to find a more strategic spot in the creative suite of products.

CS3 was the first version under the flagship of Adobe brand for Fireworks. The tag of “Rapidly prototype and Design for the web” was well received by the designers and other consumers of the application. The application started gaining importance for Interaction Designers, Information Architects for various activities from Wireframes to Website prototypes.

The journey does not end here and gives Fireworks unique opportunities at different stages. CS4 release projected a stronger Suite Integration story for the application apart from making website prototypes easier to create and maintain. Fireworks seems to be the tool for any design which has to be put on the web.

Exciting times lay ahead with Adobe focusing on this application. It fits well in the portfolio for Web Designers where Adobe is gaining strength. Making itself as the first choice tool for Web Designers, free lance designers, Interaction designers, Experience engineers will not be an easy task but Adobe is fully committed to this vision.Being a design application, the focus stays on refining the existing design-centric workflows, creating new ones to keep the application abreast with the technology advances around it.

An interesting opportunity lies in the area of Interaction design where a click through mockup of an application or website or even a workflow is needed. Fireworks has the feature set which makes it a natural choice for designers of that portfolio. Adobe will continue to invest in that area by promoting Fireworks as the right tool for these designers.

Fireworks has been a tool preferred by freelancers and designers but there are some bottlenecks when using the application in their design process. The commitment is there to streamline that process and go the extra mile of reaching the stage where the design can be handed over to developers in case of website or web applications. For freelancers, they can just spit out standards-compliant CSS from Fireworks itself and tweak it.

Vastly improved support for CSS was a major effort in CS4 release and the feedback has been very positive on that front as well. Let us all get excited and anticipate for the exciting times that lay ahead for Fireworks with Adobe brand fully committed to it.

Share on Facebook

“Share My Screen” service in Fireworks CS4

Creative Suite 4 has a number of services included for different products. Fireworks CS4 introduced three of them namely

  1. Share My Screen aka Acrobat Connect
  2. Kuler
  3. Search For Help

The Share My Screen service is good for any application where the design right on the canvas of the application can be shared online. The sharing happens securely over https protocol and can be viewed by only those whom you wish to invite. The service requires you to have an Adobe ID which can be created free from

The dialog can be accessed from "File->Share My Screen". Once logged in the browser window opens which for some of you might install a flash plug-in needed to run this service. Once all the installations are done, a dialog box opens with URL address which has to be sent to people to view your canvas.

Share My Screen dialog

Then click on the "Share My Computer Screen…" button which has opened in browser. Some plug-in might be needed again which will finally lead to a screen with options of "Share" and "Cancel" After that you can return to any application like Fireworks whose canvas you would like to share with viewing participants.

When the participant joins a message will pop up requesting your confirmation to allow the user to view. Explore all the other options for chat, file share and have a good time collaborating using this feature. Free users can share it with 2 people and beyond that the subscription has to be purchased.

Mac or Win, it should work!

Share on Facebook