Sarthak Singhal

Welcome back in 2009

2009-01-04T06:49:45Z

Hope you all had a good relaxing time with family at respective homes. I welcome you all back as we will gear ahead towards understanding the details of Fireworks CS4 release. In the past posts I have tried to sum up some of the details but will try explaining things on a feature viz feature basis.

I want to thank all the visitors of my blog for their support and the excellent comments which have kept me on my toes. I have been posting for some time and would like to know now if you all are expecting something different. With the information bank I have related to Fireworks I tend to assume that knowledge restricting me from posting them.

I am still on an extended vacation and will try to moderate this blog to the best of my capacities till I reach back office. With the economic slowdown and turmoil at multiple places in the world, let us all pray for a prosperous and safe year 2009. Good luck for the year ahead.

Merry Christmas and Happy New Year 2009

2008-12-24T10:53:50Z

On the eve of Christmas, on behalf of the entire engineering team of Fireworks I wish all of you a merry Christmas. Have a very happy and joyous upcoming New Year 2009. When we come back in the new year we will discuss more ways of digging deeper into Fireworks and its capacities. Till then have a great time relaxing.

Below I have posted some of the designs created by one of the users of Fireworks CS4. Hope you enjoy them.

Visit www.i2fly.com for more information about the designer

With your Fireworks engineer signing off this year, we will meet again in the new year 2009.

CS4 Text woes workaround

2008-12-23T09:13:12Z

Users facing the text bounding box issue can breathe a sign of relief as there is a workaround for that problem. As a temporary solution is through an extension which will correct all text objects whose blue colored bounding box has been shifted in the document.

Important Note:

Running this script will correct the bounding boxes for all text objects in the document affected by this bug. This correction is limited for that png file edit session only. The bug may be encountered again during future file edits where the extension script will need to be executed again.
Any CS3 text element if present inside a Group ONLY will get re-rendered on running this script. After installing this extension, you can access this script from Commands menu-->Re-sync Text

This extension will not touch any text elements containing missing fonts. The missing fonts dialog pops up when opening a png file which contains fonts not found on the system.

Thus there is no need to worry about CS3 text and missing text getting re-rendered unnecessarily on using this Extension.

http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&loc=en_us&extid=1706527

Re-sync Text Bounding Box is a simple Extension which will go through each and every text element present in a png document (be it inside a page or a layer or a state) and re-align its bounding box.

EXAMPLE:

The following is the screen shot of a file which got affected by this problem.

After running the extension script mentioned in the above link, the following is the state of text objects.

Extending Fireworks CS4 document live

2008-12-23T05:19:31Z

Adobe Fireworks CS4 extending document is live with the new document containing all the changes in the API for the product. The same document is also available as a pdf file which can be saved on you local disk for referring to it while you are disconnected.

Web Help Link

http://help.adobe.com/en_US/Fireworks/10.0_Extending/index.html

Downloading PDF Link

http://help.adobe.com/en_US/Fireworks/10.0_Extending/fireworks_cs4_extending.pdf

Utilize the power of JavaScript interpreter built into Fireworks to enhance your productivity. To give you some examples, many panels have been built entirely using this technique. Some of them are Path, Align, Export to AIR panels.

Explore the power within the application.

Auto Save in Fireworks CS3, CS4

2008-12-19T13:17:04Z

I have seen that users of Fireworks are running into issues where the design job is lost while saving the file. I admit to this begin a huge frustration for the users and we will work on to better it. Till that time a useful utility is present at the following web address which can save the png file automatically for you.

http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&loc=en_us&extid=1698332

This is an AIR application which will save your work automatically. It will not update the original png file but will create a folder FWAIRBackup where the auto saved png file will be placed. The extension will successfully work in versions CS3 and CS4 of Fireworks. The only requirement is that AIR run time needs to be installed which can be downloaded from http://www.adobe.com/products/air/

Further details of the extension can be obtained from the first link. Any other doubts or queries post them right away.

Get to know the all new Adobe CS4 Help

2008-12-17T11:40:15Z

You might have noticed it already—when you launch Help from any of your CS4 products, you now have a much wider pool of knowledge to get information from. Earlier, all the information that you could get when you launched Help was from the content created by Adobe. Now, we know it is impossible to have all features, all scenarios, and all conditions documented at the time of release.

Welcome to Community Help.

Starting with CS4, Help launches the Community Help landing page—where you get a one-page view of what’s new, what’s hot, and some selected pickings from the wide variety of content sourced from the user community—that includes you. Take a look at the select video tutorials, blog entries, or see if any of the issues that you faced have a technical resolution posted on Adobe Support site. Needless to say, you can search for any of the content too.

One of the best features that I liked about is that you can effectively enhance the existing Help content on the web page with the commenting feature. You might have noticed that I added a few links to some very useful extensions on Adobe Exchange. So, I added a link to the Fireworks Exchange page for the Inherit Guides extension (http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&loc=en_us&extid=1333018) on the Help page for adding, editing, and deleting pages: http://help.adobe.com/en_US/Fireworks/10.0_Using/WS4c25cfbb1410b0021e63e3d1152b00db4b-7f82.html

Now, everyone is a Help author!

So, if you have a great web site that contains some valuable tips for Fireworks users, go ahead, and post them as comments at the relevant Help pages. Or, if you have a tip to share, add them as comments. You even get some community points for suggestions and inputs that benefit the community.

And now, there is a cool short web page that lists all the options of Community Help: http://help.adobe.com/en_US/CommunityHelp/

And don’t forget that Fireworks Community Help home page is here: http://www.adobe.com/support/fireworks/

2 new Fireworks articles at Adobe Dev Center

2008-12-09T12:02:10Z

Two new articles have been posted at Fireworks Developer Center on www.adobe.com. The actual links for the articles are mentioned below. For people new to this location, it houses articles, extensions which range from traditional usage of Fireworks to extending the functionality to its limits. Explore the following new articles apart from the old ones which are a good read.

Lorem Ipsum placeholder text generator for Fireworks
http://www.adobe.com/devnet/fireworks/articles/loremipsum_panel.html

Workspace Manager panel in Fireworks CS4
http://www.adobe.com/devnet/fireworks/articles/workspace_manager_panel.html

Easter Egg? Other Fireworks engineers!

2008-12-09T11:14:40Z

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...

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.

Keyboard Shortcut Tips

2008-12-08T09:10:42Z

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

People working in some other application might like to use the same keyboard shortcuts in Fireworks.
Migrating from other graphical applications to Fireworks for its specialized features but using the other applications keyboard shortcuts for some of the same task.
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:

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

The keyboard shortcut file is an xml file which is placed at the locations

WIN: :\Program Files\Adobe\Adobe Fireworks CS4\English\Keyboard Shortcuts\
MAC: /Applications/Adobe Fireworks CS4/Adobe Fireworks CS4/Contents/Resources//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.

Fireworks CS4 workflow changes - Part 4 (Last)

2008-12-05T12:14:23Z

Continuing with the workflow changes that have been done in CS4 release version, below you can find 6 more. I will keep posting more workflow changes in this release over the next few weeks.

All the color spaces of .psd and .ai are now supported. Once the import/open of the files happen, they get converted to RGB 8 bit.This might result in color variations on certain occasions. Prior to CS4 some of the files refused to open.
Another hidden functionality added in CS4 is the history of object selections. Consider a case when you select objects at multiple places on the canvas and have to revert back to the last selected object. Fireworks CS4 allows a history for the selection of objects also. The user can run back or forward in the selection history using Cmd+Shift+Left Arrow/Right Arrow on Mac and Ctrl+Shift+Left Arrow/Right Arrow on Win.
Whenever a custom asset is created by the user, the path location is remembered unlike CS3 where the user had to navigate to Fireworks preferences location in users folder.
The usage of special characters in File, Page, State name has been restricted. Ex '/', '\'

Not really a workflow change but all the flash panels are not loaded at the launch of application. They are initialized and respond only when they are in focus. This improves memory footprint of the application and performance. If all the flash panels are in focus then the user will not see any change. Also when the flash panel has been switched off, it does not unload and consumes memory.
A much needed and special feature to have images inset the text, Text In Path has been added which will create something like as below. It can be accessed from Text->Text in Path.

Fireworks Users and Engineers handshake

2008-12-03T04:27:46Z

Lately I have seen a lot of comments getting posted at my blog and I am quite happy with it. My goal is to narrow the barrier an Engineer or a Designer faces while communicating with each other. A developer writes code without sometimes getting to know how that code is being used in real life designing. A designer on the other hand would like to applaud the engineers or criticize them for the work that has been done. These two personalities do not know the right people or the medium to convey this message.

Trust me there is no other satisfying feeling for a developer when a customer tells them directly what a beautiful job they has accomplished. And if there are bugs, issues, enhancements to be done and they come directly from people like you, it keeps the blood pumping in their veins of engineers. This is just what I am trying to achieve through this forum.

We keep hearing internally about how Fireworks is getting used by designers outside. I would like to hear directly from the customers how they actually use Fireworks. Please do not restrict about writing using the CS4 version only. The work flows involved around Fireworks could span across multiple versions. The integration amongst different CS4 applications where Fireworks play a role. What is the end result from the work flow? Is it a prototype generated, wire frame, mobile application mock up, interaction design. These topics we have heard but would like to know a little more in depth of how these are achieved using Fireworks.

Be assured that I will have the feedback circulated around so that the engineering team can have a direct look at how their features and functionality are being used in real world. It will drive them crazily happy when they read the feedback from all of you Fireworks users.

Probable Text woes and their resolution in Fireworks CS4

2008-12-01T08:50:08Z

Below are some of the scenarios with respect to text shifting on the canvas. The user lands in a situation similar to one shown below from all the 4 scenarios.

Scenario: Selecting/de-selecting the text object and trying to move it on the canvas using keyboard arrow keys.
Problem description: The text within a textbox in Fireworks CS4 on a Mac will move within the textbox and even move out of the textbox if you select and deselect the textbox multiple times while moving the textbox with the keyboard arrow keys each time.
Temporary workaround: When ever you see a text image going out of sync with its bounding box, just re-adjust the text or double click inside the bounding box. This will make the text object to correct itself.

View Video

Scenario: Trying to align text elements using mouse either against other objects present on the canvas or a guide, using the cues from smart guides.

Problem description: When ever we have grids enabled and we try to align a text element against other objects on the canvas using the cue from smart guides, sometimes the text bounding box shifts away from the text image on releasing the mouse.

It seems this shift in the bounding box is happening when the bounding box tends to snap to the nearest grid pixel and we release the mouse at half pixel less.

Temporary workaround: Try to align text elements with the following settings turned off. (i)View->Grid->Snap to Grid and (ii)View->Smart Guides->Snap to Smart Guides

Scenario: Range Kerning/Kerning value in CS3 is not the same in CS4.

Problem description: Range Kerning value applied in CS3 does not give the same appearance when opened in CS4 and updated. The look of the text block totally changes and we need to manually enter the new value to get back the desired effect.

Temporary workaround: Range Kerning control present in the UI has now been changed to Tracking in FWCS4. Tracking control works the same way as that present in apps such as Adobe Illustrator or Photoshop. To apply tracking, a range of characters has to be selected first, unlike kerning control wherein, just keeping the cursor between 2 characters we could apply kerning.

For a value of Kerning applied in CS3, if we set approximately 10 times the value of Tracking in CS4, we can get similar looking text element. Ex: if the Kerning value which was set in CS3 for a text element was 10, then around 100 could be the Tracking value which we will have to set in CS4 so that we can get similar looking result.

Scenario: 2 pixel shift in text glyphs when we change area/frame text to point text and vice a versa.

Problem description: When we change the area text (drawn by click dragging on the canvas using the text tool such that we get an area bounding box) into a point text (drawn by just click once on the canvas using text tool) by double clicking the top right handle or vice-versa, we can see that there is a 2-px shift in glyphs on the canvas.

In ATE, bounding box of a point text is different than the area text. The area text has a small gap between the glyphs and the bounding box, thus currently when we do such a change; there is a slight shift of the glyphs either upwards or downwards depending upon the point or area text change done.

Temporary workaround: Create either an area text or point text depending upon your requirement and don’t shift or change from one type to the other. Note that when you convert area text to point text, the glyphs shift 2 px downwards and when we convert a point text into an area text, glyphs shift 2 px upwards.

Scenario: Trying to 9-slice scale a custom symbol or common library element, sometimes the text jumps away.

Problem description: When we try to apply 9slice scaling on common library element such as a button etc, sometimes the text jumps away from its location. 9-slice scaling when applied to a text bounding box changes it to an area text if it’s a point text which makes the glyphs to shift 2 px from their original location. Moreover in situations where in 9-slice scaling is used to scale the button element, after some point the text tends to break away from its original location.

Temporary workaround: If a symbol or custom component has text contained inside, then make sure that the text object is placed well inside the 9-slice guides and they are not overlapping. More importantly, make sure that the text element is an area text box (if it’s not then convert it by dragging the lower right corner of the bounding box) and not a point text box.

Fireworks CS4 workflow changes - Part 3

2008-11-26T13:00:17Z

Pixel radius definition for primitive rectangle. The radius can be changed even after the rectangle is 9 slice scaled. This is apart from defining it in percentage values.

Restricting the scaling down of objects which have 9 slice scaling applied to it. This prevents the objects from getting distorted for vector and bitmap objects.
States and Layers panel have a small radio button kind of functionality which allows for moving the objects from 1 state/layer to the other layer/state without any issues. When an object is selected contained in the State or Layer the radio button is enabled. Once the button is enabled designer can move just the radio button which inturn moves all the selected objects under it.

The vector objects like Line, Ellipse, and Polygon now show up with names unlike just "Path" as was present in earlier versions.

When guides are present on a document, pressing shift will show the distance between 2 guides on the canvas in pixels.

Fireworks CS4 workflow changes - Part 2

2008-11-25T08:02:36Z

Guides on the master page will be visible on child pages. Any new guides added will also get reflected on the child pages. Guide location changes made in the master will reflect on child pages. Child page can override the master page guide settings.
In the symbol properties panel, user needs to press Enter to reflect the changes in fields like labels.
Loading of flash panels are delayed. This will reduce the launch time and use memory stamp only for panels which are used by users. There are 8 flash panels by default in Fireworks CS4.
Anti-aliasing for vectors is much smoother now. It is due to new rendering mechanism added in CS4 version.
Mouse wheel scrolling in panels

Mac: Layers, Pages, states, Common Library
Win: All panels

Fireworks CS4 workflow changes - Part 1

2008-11-24T11:56:02Z

Master Page Optimize settings can be carried over on to the child pages. For optimize settings to be inherited by child pages, they need to be linked. Child page can override the master page optimize settings. Alternatively when the optimize settings for child page is modified, the linking goes off and the master page optimize settings are overridden.
Designers can now select multiple pages and change the optimize settings in one shot. It will be reflected in all pages.
Layers contextual menu has a new menu item called "Share Layer To All Pages". This option will share the selected layer across all the existing pages.
Another option added to the Layers contextual menu item is "Exclude Shared Layer". This option will remove the shared layer on current page without affecting it on the other pages.
The contextual menu can be accessed by right clicking in the layers panel. Similar right click functionality has been added to Pages and States panels.
Icons use for Extensible Flash Panels. Users can now place icons along with swf files, which will be considered as panel icons in workspace.The icons need to be png files. The name of the png file should be the same as panel name. Mouse over behavior can also be specified an icon and its name should be 'panelName_over.png'