Working with CSS sprites
Basic familiarity working with Fireworks is required. Prior experience building websites with CSS is also recommended. In this article, you'll learn how to work with Adobe Fireworks CS6 to generate CSS Sprites. A sprite image consists of multiple graphics that are combined together to form a single image. Each one of the graphics in the sprite image can be rendered separately in an HTML web page using the data provided in the CSS style sheet.
Creating jQuery Mobile website themes
Basic familiarity working with Dreamweaver and Fireworks is required. Prior experience building websites with the jQuery Mobile Framework, HTML, and CSS is also recommended. In this article you'll learn how to work with Adobe Fireworks CS6 to create custom jQuery mobile skins and use them in mobile websites based on the jQuery Mobile Framework.
Creating a cool website header
We have been posting a series of articles with simply fantastic images from the most famous graphic designers and illustrator from all around the world. Most of them have been pushing the boundaries mixing lighting effects with color overlays, and that have intrigued us.
Creating a Realistic Peelable Sticker Effect
The tutorial will give you a step-by-step instructions on how to create a peelable sticker effect, great for placing in a corner of a website to reveal news or offers. Getting started with our peelable sticker effect...
Creating the iPhone Frame
Since some people asked for this tutorial, We're going to show you guys how to create the iPhone frame. It isn't as complicated as it appears to be, and I think this is the solution that most comes closer to the original.
Masking in Fireworks
Adobe Fireworks video tutorial: Tom Green covers the basics of using bitmap and vector masks in Fireworks. You should download the files to follow along with this tutorial...
Mobile workflows using Fireworks and Device Central
As mobile devices, platforms, and app stores proliferate, it's more important than ever to have the latest device information at your fingertips. Adobe Fireworks CS5 is integrated with Adobe Device Central CS5, enabling you to leverage handset data and work more productively from inception to final launch of your mobile project. In this tutorial I'll show you how to harness the power of Fireworks combined with Device Central in these common workflows:
Easy Camera Icon Creation
few weeks ago I decided to create a camera icon. Usually I would do that in Illustrator or Photoshop, however as I use Fireworks pretty much most of my time I chose to create the icon using it. The cool thing about Fireworks is that you have the vector features found in Illustrator with bitmaps features found in Photoshop, especially layer style filters.
Text Glow effect
This morning I saw an advertisement on a webpage somewhere and really liked the glow effect it had. I spent sometime on it and managed to get something close to it.
Creating a glass button
Using Adobe Fireworks, I show you how to create a glassy style button/icon you might find on a mobile device or as a social media button.
Creating a folder icon in Fireworks
Adobe Fireworks is a familiar tool to a significant subset of web developers. There are many reasons for this. In addition to the benefits of integrating with Dreamweaver, Fireworks has an easy-to-use interface and includes a wide array of web-focused features. The image creation, slicing, and optimization tools make Fireworks extremely useful for both beginning and advanced users alike.
Build a Promotional iPhone App Website Wireframe in Fireworks
Wireframing is a useful part of the website design process. It's great to separate out this planning stage and have your page positioning, spacing, layout, and other elements like text size and tone works out before you jump into Photoshop to add color, texture, images, and effects to polish off your design.
Stylish Black Button
What I am going to teach you to make in Adobe Fireworks is a stylish shiny (glossy) black button for a website or blog or whatever you may decide to use it for.
Create a 3D vector icon in Fireworks or Illustrator
This tutorial will show you how to create a 3D-looking icon, adding fine details and shadows, using textures and making the illustration very realistic with gradients and lights. At the end of the tutorial it will be hard to say which software you used to create the icon because of its depth and stunning look and feel.
iPhone Wireframe Templates and Library Objects
Adobe Fireworks CS6 iPhone Wireframe Templates and Library Objects – In this lesson, we’ll take a quick look at some of the tools that you can use in Adobe Fireworks CS6 to create a design prototype for a mobile iPhone version of our eLearning course. Fireworks CS6 will get you started with the design process and it also provides some great support for iQuery Mobile and CSS Sprites.
iPhone Design Techniques
iPhone Design Techniques with AdobeFireworks CS6 -In this lesson, we’ll build a basic iPhone application custom design using Adobe Fireworks. This lesson covers importing custom graphic, adding layers, image transparency, and creating pages for view states in Fireworks CS6.
Creating an Interactive PDF for the Review Process
Adobe Fireworks CS6 / Adobe Acrobat Professional XI – In this lesson we will create an interactive PDF with Adobe Fireworks CS6. Starting with the iPhone mockup, you will learn the basics of working with the Web Layer and Hotspot tool. Exporting design comps for Adobe Acrobat Professional is a great way to start the design review and approval process.
How to apply twist and fade
In this tutorial you are going to learn how to create some fun abstract effects using Adobe Fireworks CS4+. This tutorial explains how a single Image/Vector can be converted into various Images/Vectors using the properties such as Steps, Spacing, Rotation and Opacity. The image below shows how we have applied twist and fade effects to a honey bee.
Gel Cap / Plastic Button
Learn how to create a button with glossy finish with the help of this tutorial. May be a little redundant. There is a lot of these tutorials around but whatever. Here's mine.
Build a Promotional iPhone App Website Wireframe
Fireworks is a great tool for creating a wireframe and while it doesn’t work perfect with Photoshop, you can export over there and then build off your wireframe. We’ll cover the design process of creating a wireframe for an iPhone application website in Fireworks. For those of you not familiar with this program, it will be a good jumping off point for using it to wireframe your web design projects. This is a first part of a multi-part series and will be fun!