Premium Styles – Letterpress and Emboss Effect

Posted in Resources > Text Effects by Firetuts

In the next installment of premium products from Firetuts I would like to introduce our new letterpress and emboss style. Depending on the background colour of your design or background pattern these types of effects can be difficult to use. With this in mind I have created three different styles to match the type background you might find working on a design.

To use the style simply select the style you need from the style panel.The effects can be used with text or vector elements, if you need any help with styles you can view a guide from Adobe.

Click image to view a real pixel example of the styles.

Letterpress-Emboss-mid-thumb

Click image to view a real pixel example of the styles.

Letterpress-Emboss-dark-thumb

Click image to view a real pixel example of the styles.

Letterpress-Emboss-light-thumb

 

How to import styles

  • Select Import Style Library from the Styles panel options menu.
  • Select the Letterpress and Emboss Effect (*.stl) file to import. This will make the style library available across multiple documents and multiple sessions of Fireworks.

Create complex vector shapes in Adobe Fireworks

Posted in Resources > Vector by Firetuts

Create complex vector shapes in Adobe Fireworks

A few vistiors have asked how to create complex vector shapes in Adobe Fireworks, specifically the shapes I did for the mega pack of ribbons and badges I released last week. So the screencast is a of me taking you through the process I use to create complex shapes.

Let me know if you do it different or have any questions in the comments below. And dont forget you can all 200 shapes in the mega pack of ribbons and badges.

Enjoy :)

Mega Pack – 200+ Web Ribbons and Badges

Posted in Resources > Vector by Firetuts

ribbon-badges-thumb

I’ve put together a huge pack of over 200 web ribbons and badges. Each element is in vector format and easily scaled and configured to the style of your own design. All ribbon elements come as grouped objects for simplicity of use and all elements are numbered in layer panels.


Comes in .AI, .PSD and FW.PNG file types!

FIREWORKS PNG DETAILS:
- Full compatible with Adobe Fireworks.
- Layers intact.
- Vectors intact.
- Fully editable to match own design.
- No Watermarks

ILLUSTRATOR AI DETAILS:
- Full compatible with Adobe Illustrator.
- Layers intact.
- Vectors intact.
- Fully editable to match own design.
- No Watermarks

PHOTOSHOP PSD DETAILS:
- Full compatible with Adobe Photoshop.
- Layers intact.
- Limited vector support.
- Fully editable to match own design.
- No Watermarks


Sample file

Ribbon vector set 1

ribbon-and-badges-one-promo-thumb

Ribbon vector set 2

ribbon-and-badges-two-promo-thumb

Badge vector set 1

ribbon-and-badges-three-promo-thumb

Badge vector set 2

ribbon-and-badges-four-promo-thumb

Campaign to open source Adobe Fireworks

Posted in Resources > Culture by Firetuts

On May 6, 2013 Adobe announced that Fireworks the graphics platform will no longer be developed by the team at Adobe. This petition is to give a voice to those who want this decision to be overturned or to have the code release to open source.

Please make sure you sign it.

http://www.change.org/petitions/adobe-com-release-adobe-fireworks-to-open-source

Change color of an element in a photo or bitmap

Posted in Resources > Bitmaps by Firetuts

With this technique you can change the colour of a particular part of a bitmap image or photo. The tutorial uses a photo as an example but remember that this technique can be used with elements of graphic design, icons or even web graphics.

Convert color photographs to black and white and sepia tone

Posted in Resources > Bitmaps by Firetuts

In this tutorial, you will learn this simple and extremely helpful technique of converting color photographs to black / white and sepia tone using Adobe Fireworks.

Why we need a new file format for Fireworks

Posted in Resources > Culture by Firetuts

With this post I’m going to open up a can of worms that’s been going from way back in Fireworks conception. If you’re familiar with Fireworks you know it has a native file format of .PNG for a source Fireworks document. Over the years many have discussed the merits of changing this to something specific to Fireworks.

The current options for saving a source file comes in two flavors, the native .PNG file format or using a prefix method of .fw.png. This prefix method is a bit of a compromise and more a workaround than a real solution. So in this post I’m going to try and put a case together to why I think the file format should be changed.

A little background to the current file format

To understand the discussion lets go back to the beginning of Fireworks, when the spec was created the file extension needed to be as interoperable as possible, that is to say it should be compatible with as many other graphics programs as possible. To achieve this Fireworks adopted the PNG format or more specifically the APNG format that is allowed by the PNG spec to carry ancillary data. This allowed Fireworks source files to be opened up in other graphics programs without relying on extra functionality.

What’s wrong with the PNG format

The oldest problem is the complicated process of having a source file format that can also be a destination (exported PNG) file. As users of Fireworks we will always have to make sure we never overwrite a source file with a flat exported PNG file. Lets be honest we have all done it at some point, granted using the .fw.png prefix makes the process of separating the source and export possible but its still not ideal.

As the prefix method is not a standardized method, working with unfamiliar files we still need to test to see if the file is a PNG source or not. So without a standard unique file format its impossible to be 100% accurate about the contents of a potential Fireworks source file.

CS4 introduced Pages

Ever since the introduction of ‘pages’ in version Fireworks CS4, the effectiveness of the interoperability of the PNG format became compromised. The goal of using the PNG format with Fireworks was to enable other programs to be able open a PNG file and manipulate the contents, even in the simplest fashion. With pages this idea became impossible as any Fireworks document that has more than one page makes those pages inaccessible to an external graphics editor.

Can you send me the PSD

How often after working on something have you heard the phrase ‘Can you send me the PSD’ from a college. This phrase is painful if you’re a Fireworks devotee like me but it’s a good example of how we associate functionality and brand to file formats.

Fireworks has been suffering from this lack of association. If you took a survey of what designers and developers associated with the PNG format, you might find people that associate it with supporting alpha transparency or IE6 didn’t support this transparency, you may find a few people that know its the source file format for Fireworks. The problem is that the brand and functional association to a source PNG file is messy at best and non existent at worst.

Future

I don’t know what Adobe has planned for Fireworks in the future but I hope they can see the merit of changing the file format to something unique. Lets see how Fireworks popularity performs if we give it that unique identity that it deserves now that the old reason for keeping the PNG format are no longer true.

My personal preference is change the file format to .fwd because is an acronym of Fireworks Document and it is short form for ‘Forward’, but this is my own opinion so let me know in the poll below what your favorite file format would be.

What file format would you like for the future of Fireworks

View Results

Loading ... Loading ...

Transparent text effect in Fireworks

Posted in Resources > Text Effects by Firetuts

Transparent text effect

This transparent text effect was based on the article on maagraphics. The effect is a simple and effective way of adding text to an image in an unobtrusive way, also with a few tweaks you can use this effect in conjunction with the letterpress effect, to create a nice click action.

transparent-text-effect-button

Sprite animation using Adobe Fireworks and Axure

Posted in Resources > Interaction Design by Firetuts

Joseph Reni goes through the steps to create an sprite animation in Fireworks using states. (more…)

Brand New Site and Brand New Possibilities – Firetuts V2.0

Posted in Resources > Culture by Firetuts

Over the years, I’ve always been surprised with the tens of thousands of visits we get each month, and looking through the stats these users are not searching for general content but content on Adobe Fireworks so who said there isn’t an audience out there who want to learn Fireworks. (more…)

Page 1 of 41234