Posts in Category "General Fireworks"

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

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

Easter Egg? Other Fireworks engineers!

Easter egg is a hidden feature of Fireworks which is no way related to the functionality of the product. It is a flash demo which contains photos of a lot of people who are involved with the building on Fireworks over different versions. To access the feature go to menu item

  • MAC: Fireworks -> About Fireworks CS4…
  • WIN: Help -> About Fireworks…
About Us dialog

The about dialog will pop up. Now press Control on Mac or Win and a single mouse click on the FW icon. Be patient! This will pop up the faces of people who work quite hard to bring the various versions of Firework to you. I am also in one of the images. You just need to hunt me down!. This trick can be found in earlier versions of Fireworks also.

Share on Facebook

Keyboard Shortcut Tips

Keyboard shortcuts are an important ingredient for an efficient user of an application. But different applications have their own custom set of shortcuts even if they have the similar kind of functionality.

Graphic applications like Fireworks, Photoshop, Illustrator and Freehand have a degree of overlap in their basic functionality. It is only in their advanced features that the applications start to differ. With the overlapping functionality amongst the applications it would be really beneficial if

  1. People working in some other application might like to use the same keyboard shortcuts in Fireworks.
  2. Migrating from other graphical applications to Fireworks for its specialized features but using the other applications keyboard shortcuts for some of the same task.
  3. A user has customized the keyboard shortcuts for an old version of Fireworks and would like to migrate the those shortcuts in the newly released version of Fireworks.

All the above problems can be solved as:

  1. See the below image where you can switch between the keyboard shortcut of other applications. The keyboard shortcut dialog can be accessed from the following menu items. This will load the keyboard shortcuts of the selected application.
    • WIN: Edit-> Keyboard Shortcuts
    • MAC: Fireworks->Keyboard Shortcuts


    Keyboard Shortcut dialog
  2. The keyboard shortcut file is an xml file which is placed at the locations
    • WIN: <OS Drive>:\Program Files\Adobe\Adobe Fireworks CS4\English\Keyboard Shortcuts\
    • MAC: /Applications/Adobe Fireworks CS4/Adobe Fireworks CS4/Contents/Resources/<language project file e.g en.lproj>/Keyboard Shortcuts/

    The path to "Contents" can be reached by Right click on "Adobe Fireworks CS4" app and click on "Show Package Contents". Just add the xml file from some other version of Fireworks and place it at the above location and restart the application. This will add the newly dropped xml file in the menu item. Select that xml file for shortcuts to work in the new version of Fireworks. Just remember to account for the Fireworks version when looking up the file path.

Share on Facebook

Fireworks CS4 top features

Following are the 11 features which have been highlighted in CS4 release for Fireworks product. To know more about them follow the link

  1. Preview or create package as an AIR application
  2. Export all the pages in png file as pages of a PDF
  3. Export the document as HTML and CSS
  4. Link objects to Styles and skin them in a click
  5. Bigger and better repository of re-usable assets
  6. Workspace Improvements through Smart Guides
  7. Kuler pallete usage directly in Swatches panel
  8. New User Interface for better layout organization
  9. Performance improvements in all areas of application working
  10. New Type Engine for better integration with other products
  11. Connect Now aka Adobe Connect for screen and voice sharing from within Fireworks

Stay tuned as I will highlight other features which are new in Fireworks CS4.

Share on Facebook