Expert’s Rating
Pros
Cons
Our Verdict
Adobe Fireworks — a funny compounding ofPhotoshopandIllustratorthat is specifically consecrated to vane conception — is one of the more specialized apps in Adobe ’s Creative Suite . As a companion intersection toDreamweaver , Fireworks allows designers to create World Wide Web mockups , gash files for exportation , and pass along plus to developers . To that goal , Fireworks CS6 rolls in enhancements that help ease the interchange between designers and developers .
Master of mockups
Fireworks ’ set of electronic image tools countenance you to construct mockups pixel - by - picture element , while the plan ’s vector tool let you quickly lay down boxes , backgrounds , and other resizable form . you could produce multiple pages within a individual document for different versions of the same basic design ; for example , one Sir Frederick Handley Page might contain a mockup of the nursing home page and while another legion the standard content varlet . Completed mockups can be sliced for exportation , and you could assign cut behaviors ( a rollover , for object lesson ) to be compatible with Dreamweaver .
pyrotechnic CS6 let in some underage usability improvements , include opaqueness controls for fill and strokes , an enhanced color picker that expose hex value , and the power to specify the angle of a slope . Additionally , the symbolization library now include interface elements from impertinent phones to help house decorator quickly mock up mobile internet site . New items include gesture icon , keyboard , and hardware frames .
Additions to the symbolisation program library allow you to quickly bemock up mobile Web user interface and mobile apps .
Additions to the symbol library allow you to quickly mock up mobile Web interfaces and mobile apps.
Enhanced CSS functionality
A typical work flow might have a designer creating web mockups in Fireworks , and then pass them to a Web developer for cod . The developer then has to deconstruct the mockups , cause judgments about what visual constituent can be achieved via Cascading Style Sheets ( CSS3 ) , a bait oral communication that is progressively used to trace not just the look and layout of text , but the coming into court of graphic element such as buttons , backdrop , and shadows .
The CSS Properties panel — raw to Fireworks CS6 — gives developer an advantage by automatically generating codification for many elements of the design . Let ’s say you use the transmitter tool to produce a rectangle with rounded corners , apply a gradient fill , and add a subtle drop cloth shadow : All this can be described by CSS . Select the physical object and visit the CSS Properties panel , and you ’ll see the full list of dimension along with the necessary code ( which can be copied to the clipboard ) . to boot , pyrotechnic can engender code specific to Opera , Firefox , net Explorer , and Webkit web web browser like Safari and Chrome to ensure consistent ill-tempered - web browser rendering .
This feature is a dandy plus for developers and it benefit designers , too . Tailor your design ingredient to CSS , and you’re able to debar contentious edits by a developer assay to streamline the website . The caveat — and there ’s always a caution — is that there are only a few types of graphic elements that can be full coded by CSS . The CSS Properties panel describes aspects of these objects ( for instance , tune weight , line colour , and filling ) , but it needs a warning indicator to let designer bonk which objects can not be fully distinguish by CSS .
The CSS Properties panel lets developers copy and paste code for objects like rounded rectangles, which can be fully rendered by CSS.
The 2nd cardinal way Fireworks now sustain CSS is via CSS Sprites . Instead of slicing interface graphics into dozens of case-by-case data file , you could export a single image file ( or sprite sheet ) containing all graphic element . CSS code — fix by your slice — describes the location of each graphic constituent on this sprite canvass . The welfare is that the sprite sheet is download only once , which helps hasten up the web site by reducing demand on the waiter .
The CSS Properties panel lets developer copy and paste computer code for objects like rounded rectangle , which can be fully depict by CSS .
jQuery Mobile theme skinning
jQuery , for the naive , is a touch - optimise framework that can help oneself developers quickly deploy content tailored to sassy phones . It leans heavy on CSS graphics and CSS sprite sheets to ensure that mobile internet site stretch quickly .
In Fireworks CS6 , it ’s now potential for a designer ( rather than a developer ) to customize a jQuery Mobile paper without ever having to weed through code . It ’s a chip of a ham - fisted process , however . There is no dedicated theme editor program in Fireworks CS6 ; instead , you ’re asked to customize the attribute of object across a multi - page template and then export it as a theme .
opt Commands - > jQuery Mobile Theme - > Create New Theme opens a unexampled stem written document . The first pageboy get you define orbicular assets and styles , and you ’re represent two sets of mutual navigational icons that you may custom-make . you could also specify the style for push button recording label , icon screen background , boxful shadows , and rounded nook by clicking an aim and adjusting its property . The subsequent five pages offer default swatches that you’re able to tailor to your design by choosing fonts and tweaking the color of headers / footers , backgrounds , and push . Unfortunately , Fireworks does not incapacitate properties that are n’t entanglement - friendly , so you have to be thrifty to avoid fount and gradient types that are n’t abide by CSS .
Fireworks CS6 lets you tweak jQuery themes, but it’s an awkward process that lacks a customized preview option.
A work up - in stem preview lets you check out your root word at any time , though you must manually recharge the prevue after you make change . The bother is that you’re able to not preview the root word using your own sample capacity , which is disappointing given that the primary focus of this app is to make vane mockups . In consequence , this means you ’ll ask to rebuild the theme in a regular written document in orderliness to create a right mockup for your guest .
Moreover , jQuery Mobile offer a devoid entanglement - establish editor program called ThemeRoller , which handles theme customization with more finesse than Fireworks . paper stage setting are configured on the left-hand , colour can be dragged and dropped from the palette at the top , and all change to a theme are displayed live in the centerfield of the page . Once you ’re glad with what you see , you’re able to download the paper for free . Fireworks ’ multi - page template structure is ungainly in comparison , though unlike ThemeRoller , you’re able to make changes to the stem ’s default picture circle ( and add novel icon ) using Fireworks .
pyrotechnic CS6 lets you pluck jQuery themes , but it ’s an awkward process that lacks a customize trailer choice .
Old habits
Despite four major update , Fireworks keep on a respectable deal of port artefact from its twenty-four hours as a Macromedia Studio MX merchandise . As a upshot , many aspects of the interface are discrepant with other apps in the Adobe Creative Suite . firework ’ vector tools — originally derived from Macromedia Freehand — bear on to be markedly different than those in Illustrator .
That ’s not always a bad matter ; for lesson , gradient controls include a lot of handles that allow for you to quickly tweak the location and slant of the filling , and you may edit the corners of a rounded rectangle or the points of a wizard at any metre . However , these difference of opinion create an unnecessarily exorbitant learn curve for new user migrating from Photoshop or Illustrator .
It simply does n’t make sense that product within the same app suite would have different tools to reach the same death . It ’s been five class since Fireworks was officially incorporate into the Creative Suite , and unluckily , it still feel like a bit of an outsider .
Macworld’s buying advice
Fireworks CS6 is a conundrum . It divvy up a flock of functionality with Photoshop , and many designers are quite content to use Photoshop ( or even Illustrator ) to make Web mockups . However , Fireworks CS6 has a number of trenchant advantage as a Web design environment , include an broad symbolisation library , crochet with Dreamweaver , and enhanced support for CSS .
Existing Fireworks user will want to upgrade to CS6 , particularly if they often run into design subject with Web developer who want factor like buttons and backgrounds designed within the restriction of CSS . On the other handwriting , the Fireworks exploiter interface can be divergent enough from its Creative Suite mates to frustrate some users . From an creative person and designer stand , unless your Web developer ask that you provide CSS codification snippets or CSS fay sheets , you ’re probably better off perplex with Photoshop to mock up your websites .
[ Chris McVeighis an author , illustrator and toy dog lensman who exist in Halifax , Nova Scotia , and a frequent contributor to Macworld . ]
