Logo
programming4us
programming4us
programming4us
programming4us
Home
programming4us
XP
programming4us
Windows Vista
programming4us
Windows 7
programming4us
Windows Azure
programming4us
Windows Server
programming4us
Windows Phone
 
Windows Vista

Adobe Fireworks CS5 : Improving Your Workflow - Thinking ahead: future-proofing your projects (part 2) - Using Fireworks files with Photoshop

- Windows 10 Product Activation Keys Free 2019 (All Versions)
- How To Bypass Torrent Connection Blocking By Your ISP
- How To Install Actual Facebook App On Kindle Fire
4/2/2012 11:34:48 AM

Using Fireworks files with Photoshop

With each product cycle, Fireworks and Photoshop come closer to having a fully integrated working relationship. If you need to move your Fireworks designs to Photoshop, you’ll get the best results by understanding Photoshop Live Effects, best practices for saving your file for Photoshop, and Photoshop export options.

Many elements can be preserved for editing in Photoshop. Text, hierarchical layers, layer groups, vector shapes filled with Photoshop Live Effects, solid color, many gradients, and masked objects are maintained and supported when you save a file in PSD format from within Fireworks.

Photoshop Live Effects

You will add a border around the images in the wallpaper page using a Photoshop Live Effect.

1.
Switch to the Pointer tool, hold down Shift, and click each of the thumbnails.

2.
Click the Add Live Filter (+) button in the Filters section of the Properties panel, and choose Photoshop Live Effects.

3.
Choose the Stroke category.

4.
Set the size of the stroke to 1, the position to Inside, and leave the opacity at 100.

Enhanced integration in CS5

Fireworks and Photoshop CS5 have tighter integration in many ways:

Importing from Photoshop to Fireworks

You can force flattening of Photoshop adjustment layers when importing PSDs, which you can enable/disable in the Preferences.

Hue, saturation, and color blend modes and the Hue/Saturation filter in Fireworks now use the same algorithms as Photoshop to improve color fidelity and appearance

Importing editable gradients from Photoshop now match better:

  • Linear to Linear (close to perfect match)

  • Radial to Radial (close to perfect match)

  • Reflected to Bars (close to perfect match)

  • Diamond to Rectangular (approximate match)

  • Angle to Conical (approximate match)

Saving/Exporting Fireworks files as PSD files

Exporting editable gradients from Fireworks to Photoshop are likewise more accurate:

  • Linear to Linear (close to perfect match)

  • Radial to Radial (close to perfect match)

  • Bars to Reflected (close to perfect match)

  • Rectangular to Diamond (approximate match)

  • Conical to Angle (approximate match)

  • Ellipse to Radial (approximate match)

  • Ripples to Radial (approximate match)

  • StarBurst to ShapeBurst (loosely matched)

  • Contour, Satin, Waves to Linear (loosely matched)


5.
In the Fill area, change the stroke color to Black by clicking the black color swatch.

6.
Click OK.

All the thumbnails now have a black border. We’ve hidden the guides and slice guides in this figure so you can better see the borders. If you want to hide them yourself, choose View > Guides, and then deselect Show Guides. To hide the Slice Guides, choose View > Slice Guides. Don’t forget to set them to be shown again afterward if you do this.

What are Photoshop Live Effects?

Photoshop Live Effects are editable visual effects you can apply to objects within Fireworks. They are supported in Photoshop as layer styles. Fireworks maintains layer styles as Photoshop Live Effects when you open a PSD file in Fireworks.

The Live Effects dialog box in Fireworks is not as robust as its Photoshop counterpart, but using these Live Effects instead of native Fireworks Live Filters will guarantee Photoshop support of the effect, if you or someone else needs to edit the file in Photoshop.

If Photoshop is not part of your workflow, by all means stick to the Fireworks Live Filters or any third-party filters you may have.


Saving your file for Photoshop

If your designs and comps must go from Fireworks to Photoshop for further editing, and you want to retain as much editability as possible, make sure you save a copy of your file in the Photoshop PSD format.

1.
Choose File > Save As.

2.
Browse to the Lesson12 folder.

3.
Choose Photoshop PSD from the Save As Type (or Save As) menu. The menu name will change to Save Copy As when Photoshop PSD is chosen.

4.
Click the Options button.

5.
To maintain as much editability as possible, choose Maintain Editability Over Appearance.

6.
Click OK to accept the settings, and then click Save to save the new file.

If you open the file in Photoshop, you will see that the file is very similar to the original Fireworks design, with two exceptions: the brightness of the header and the texture in the background are missing.

Customizing Photoshop Export options

While maintaining editability makes the file as flexible as possible when opened in Photoshop, you may also lose certain effects or features. In the current file, the vector shapes used as containers will remain as vectors, and because the fills are linear gradients, even those will export properly. Other gradients such as contour, satin, or waves will be loosely matched. The header, which uses a Levels Live Filter to help with its appearance, will lose the Live Filter, and as a result, the header will look different in Photoshop.

If the appearance is more important than the object’s editability, you can customize the Photoshop export options.

1.
Choose File > Save As.

2.
Browse to the Lesson12 folder, if necessary.

3.
Change the name of the file to nature_tours_custom.psd.

4.
Choose Photoshop PSD, if necessary, from the Save As field.

5.
Click the Options button.

6.
Choose Custom from the Settings menu.

7.
Change the Vector setting to Maintain Appearance. This will convert vectors to bitmaps, but leave any true text as editable text.

Note

The only way to maintain the Levels Live Filter is to completely flatten the objects in Fireworks. If this is an effect you desire and still wish for editability, let Fireworks discard the effect and then you can add an Adjustment Layer while in Photoshop.

8.
Click OK to accept the custom settings, and then click Save to save the file.

Common Live Filters

Some Fireworks Live Filters are supported by Photoshop and behave as standard Photoshop layer styles.

Photoshop Live Filters can be added while in Fireworks, or they can be supported (editable) or maintained (only editable in Photoshop) if they are added as a layer style in Photoshop.

The following list of Fireworks Live Filters are supported and maintained between Photoshop and Fireworks:

  • Drop Shadow, Inner Shadow

  • Glow, Inner Glow

  • Bevel and Emboss (all)


Common blending modes supported by Photoshop and Fireworks

Blending modes can be applied to objects or layers. When you apply a blending mode, the object’s color and opacity are blended with the object beneath it in the Layers panel. Fireworks has 46 different blending modes. Photoshop and Fireworks share many common blending modes (23 in total). If a blending mode in this list is applied to an object or layer, the mode will be supported and remain editable in either application.

Normal

Dissolve

Darken

Multiply

Color Burn

Linear Burn

Lighten

Screen

Color Dodge

Linear Dodge

Overlay

Soft Light

Hard Light

Vivid Light

Linear Light

Pin Light

Hard Mix

Difference

Exclusion

Hue

Saturation

Color

Luminosity

Other -----------------
- Adobe After Effects CS5 : The Timeline - Spatial Offsets
- Adobe After Effects CS5 : The Timeline - Timeline Panel Shortcuts
- Adobe Flash Professional CS5 : Exploring Companion Technologies & Recognizing Project Potential
- Adobe Flash Professional CS5 : Contextualizing Flash in the Internet Evolution
- Adobe InDesign CS5 : Managing Pages and Books - Inserting Pages
- Adobe InDesign CS5 : Managing Pages and Books - Using the Pages Panel
- Dreamweaver CS5 : Creating Adobe AIR Applications - Installing AIR into Dreamweaver & Designing for AIR
- Dreamweaver CS5 : Creating Adobe AIR Applications - About Adobe AIR
- Creating Basic Windows Images : Building a Reference Computer (part 2) - Preparing the reference computer for imaging
- Creating Basic Windows Images : Building a Reference Computer (part 1)
 
 
Top 10
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Finding containers and lists in Visio (part 2) - Wireframes,Legends
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Finding containers and lists in Visio (part 1) - Swimlanes
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Formatting and sizing lists
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Adding shapes to lists
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Sizing containers
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 3) - The Other Properties of a Control
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 2) - The Data Properties of a Control
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 1) - The Format Properties of a Control
- Microsoft Access 2010 : Form Properties and Why Should You Use Them - Working with the Properties Window
- Microsoft Visio 2013 : Using the Organization Chart Wizard with new data
Popular tags
Microsoft Access Microsoft Excel Microsoft OneNote Microsoft PowerPoint Microsoft Project Microsoft Visio Microsoft Word Active Directory Biztalk Exchange Server Microsoft LynC Server Microsoft Dynamic Sharepoint Sql Server Windows Server 2008 Windows Server 2012 Windows 7 Windows 8 windows Phone 7 windows Phone 8
programming4us programming4us
Celebrity Style, Fashion Trends, Beauty and Makeup Tips.
 
programming4us
Windows Vista
programming4us
Windows 7
programming4us
Windows Azure
programming4us
Windows Server