Illustrator vs Fireworks

7 Aug 2006 - 8:59pm
7 years ago
28 replies
1491 reads
jbellis
2005

I know that Fireworks has come up occasionally in the discussion of prototyping tools, so hopefully this isn't too off-topic, but can someone who's used both FW and Illustrator help me out on something...

Am I suffering from familiarity delusion, or is Illustrator just horribly antiquated? I recently started using Illustrator 9.0 for a traditional publishing project. Admittedly, the splash screen copyright says 1998-2000, so maybe I'm comparing oranges to rotten apples. I hope that's the whole explanation. I really don't think I'm skewed by having learned one product first, but I do recall my first touch on MS Word and wanting to strangle those Wysiwiggers.

Is it really that bad and Adobe realized they had to buy or die, thus their purchase of Macromedia?
-Jack

Comments

7 Aug 2006 - 9:34pm
Jonathan Rea
2006

It really depends on what your using it for. If you want to do vector...
then I got illustrator all the way. The only thing I ever would want to
use fireworks for is optimization. It has a tendency to make files
smaller but really it's all about illustrator and photoshop for me.

-----Original Message-----
From: discuss-bounces at lists.interactiondesigners.com
[mailto:discuss-bounces at lists.interactiondesigners.com] On Behalf Of
jackbellis.com
Sent: Monday, August 07, 2006 9:00 PM
To: discuss at ixda.org
Subject: [IxDA Discuss] Illustrator vs Fireworks

[Please voluntarily trim replies to include only relevant quoted
material.]

I know that Fireworks has come up occasionally in the discussion of
prototyping tools, so hopefully this isn't too off-topic, but can
someone who's used both FW and Illustrator help me out on something...

Am I suffering from familiarity delusion, or is Illustrator just
horribly antiquated? I recently started using Illustrator 9.0 for a
traditional publishing project. Admittedly, the splash screen copyright
says 1998-2000, so maybe I'm comparing oranges to rotten apples. I hope
that's the whole explanation. I really don't think I'm skewed by having
learned one product first, but I do recall my first touch on MS Word and
wanting to strangle those Wysiwiggers.

Is it really that bad and Adobe realized they had to buy or die, thus
their purchase of Macromedia?
-Jack
________________________________________________________________
Welcome to the Interaction Design Association (IxDA)!
To post to this list ....... discuss at ixda.org
List Guidelines ............ http://listguide.ixda.org/
List Help .................. http://listhelp.ixda.org/
(Un)Subscription Options ... http://subscription-options.ixda.org/
Announcements List ......... http://subscribe-announce.ixda.org/
Questions .................. lists at ixda.org
Home ....................... http://ixda.org/
Resource Library ........... http://resources.ixda.org

7 Aug 2006 - 11:05pm
Luke Ball
2006

I recently started using Illustrator CS(1) as an icon design tool.
The "pixel preview" mode is fantastic for it (makes anti-aliasing and
resizing a breeze, etc). It's pretty good for page-level visual
design, too.

For schematic designs, I've been liking OmniGraffle (since no Visio
on mac). I used Illustrator for wireframes for years, but after using
a more well-suited tool, I'd never go back.

Luke Ball

> Am I suffering from familiarity delusion, or is Illustrator just
> horribly antiquated? I recently started using Illustrator 9.0 for a
> traditional publishing project. Admittedly, the splash screen
> copyright
> says 1998-2000, so maybe I'm comparing oranges to rotten apples. I
> hope
> that's the whole explanation. I really don't think I'm skewed by
> having
> learned one product first, but I do recall my first touch on MS
> Word and
> wanting to strangle those Wysiwiggers.

8 Aug 2006 - 3:14am
Baldo
2005

Even if I'm a little OT, For icon creation I suggest Inkscape:
http://www.inkscape.org/

> I recently started using Illustrator CS(1) as an icon design tool.
> The "pixel preview" mode is fantastic for it (makes anti-aliasing and
> resizing a breeze, etc). It's pretty good for page-level visual
> design, too...

8 Aug 2006 - 6:46am
jbellis
2005

Scott (and others),
Not "disconnected" at all and you confirmed part of what I was after. I
should have emphasized that I was addressing exclusively Illustrator's
interaction design.

(The 2000 version of) Illustrator that I'm using sucks by both 2006
standards AND some standards from the 1500's: for example, repeated,
parallel wording (15 "Show..." items on the Window menu; repeated parallel
words on both an Effects and Filters menu). Too many inefficient techniques.
Low interactivity compared to other products. Very peculiar vector node
editing, though I don't doubt it's powerful once you learn the secret
handshake. (No, I don't expect its keystrokes to translate from other
tools.) And the pièce de résistance for many Adobe products... the wonderful
help file from PDF hell.

The Adobe toolset (all around) continues to strike me as WordPerfect
redux... a relic of a "print"-centric company that has been at the top of
the heap, but cannot possibly prevail were it not for buying out the better
software designers. That's what I'm trying to resolve.

Someone please tell me its new version erases all these problems? (I don't
need any recommendations on icon editors, but thanks for those.)
-Jack

----- Original Message -----
From: "Scott Meier" <scott at scottmeier.com>
>
> Illustrator has always been one of those applications to me that I
> just never understood why everyone used. It always seamed so
> inefficient.

8 Aug 2006 - 6:52am
jbellis
2005

Scott (and others),
Not "disconnected" at all and you confirmed part of what I was after. I
should have emphasized that I was addressing exclusively Illustrator's
interaction design.

(The 2000 version of) Illustrator that I'm using sucks by both 2006
standards AND some standards from the 1500's: for example, repeated,
parallel wording (15 "Show..." items on the Window menu; repeated parallel
words on both an Effects and Filters menu). Too many inefficient techniques.
Low interactivity compared to other products. Very peculiar vector node
editing, though I don't doubt it's powerful once you learn the secret
handshake. (No, I don't expect its keystrokes to translate from other
tools.) And the pièce de résistance for
many Adobe products... the wonderful help file from PDF hell.

The Adobe toolset (all around) continues to strike me as WordPerfect
redux... a relic of a "print"-centric company that has been at the top of
the heap, but cannot possibly prevail were it not for buying out the better
software designers. That's what I'm trying to resolve.

Someone please tell me its new version erases all these problems? (I don't
need any recommendations on icon editors, but thanks for those.)
-Jack

----- Original Message -----
From: "Scott Meier" <scott at scottmeier.com>
>
> Illustrator has always been one of those applications to me that I
> just never understood why everyone used. It always seamed so
> inefficient.

8 Aug 2006 - 7:15am
Graham White
2005

Illustrator 10 was a big jump forward from 9, so you may find a more recent
version more useful.
You can download and use a copy of the software from Adobe, good for 30 days
I believe.

Graham White

----- Original Message -----
From: "jackbellis" <jackbellis at hotmail.com>
To: <discuss at ixda.org>
Sent: Tuesday, August 08, 2006 7:46 AM
Subject: Re: [IxDA Discuss] Illustrator vs Fireworks

> [Please voluntarily trim replies to include only relevant quoted
material.]
>
> Scott (and others),
> Not "disconnected" at all and you confirmed part of what I was after. I
> should have emphasized that I was addressing exclusively Illustrator's
> interaction design.
>
> (The 2000 version of) Illustrator that I'm using sucks by both 2006
> standards AND some standards from the 1500's: for example, repeated,
> parallel wording (15 "Show..." items on the Window menu; repeated parallel
> words on both an Effects and Filters menu). Too many inefficient
techniques.
> Low interactivity compared to other products. Very peculiar vector node
> editing, though I don't doubt it's powerful once you learn the secret
> handshake. (No, I don't expect its keystrokes to translate from other
> tools.) And the pièce de résistance for many Adobe products... the
wonderful
> help file from PDF hell.
>
> The Adobe toolset (all around) continues to strike me as WordPerfect
> redux... a relic of a "print"-centric company that has been at the top of
> the heap, but cannot possibly prevail were it not for buying out the
better
> software designers. That's what I'm trying to resolve.
>
> Someone please tell me its new version erases all these problems? (I don't
> need any recommendations on icon editors, but thanks for those.)
> -Jack
>
>
> ----- Original Message -----
> From: "Scott Meier" <scott at scottmeier.com>
> >
> > Illustrator has always been one of those applications to me that I
> > just never understood why everyone used. It always seamed so
> > inefficient.
>
> ________________________________________________________________
> Welcome to the Interaction Design Association (IxDA)!
> To post to this list ....... discuss at ixda.org
> List Guidelines ............ http://listguide.ixda.org/
> List Help .................. http://listhelp.ixda.org/
> (Un)Subscription Options ... http://subscription-options.ixda.org/
> Announcements List ......... http://subscribe-announce.ixda.org/
> Questions .................. lists at ixda.org
> Home ....................... http://ixda.org/
> Resource Library ........... http://resources.ixda.org
>

8 Aug 2006 - 7:34am
Dave Malouf
2005

I have never been able to make the switch from Fireworks to Illustrator.
I never was a "drawer" and the toolset in Illustrator always seem to
speak to those folks.
It is however GREAT for type manipulation on a poster type page (Quark,
InDesign is better for typesetting in a book page).

But for doing GUI design I have not found a tool I love more than Fireworks.
Of course if you grew up in Photoshop/Illustrator and feel comfy living
there, then why move? I don't see any reason to move from one to the other.

Now, Photoshop vs. Fireworks that is a completely different story. ;)

-- dave

8 Aug 2006 - 8:35am
Todd Warfel
2003

Illustrator is first and foremost a print tool. A real shame
actually, as I don't think Adobe realizes that people are using it to
do IA work, or they simply don't care.

We do all most of our artifacts using Illustrator and InDesign. Part
of it is a comfort thing. Part of it is that it's a real drawing
tool, something that's important to us when doing our artifacts. I'd
much rather have a pen (Illustrator) than a crayon (Visio) when doing
the work we do.

Illustrator does have a high learning curve, however, and w/o multi-
page support and master pages, we have to piece together a solution
using InDesign and Illustrator. So, that part stinks.

CS is a major improvement over 9. Hey, they finally even have native
support for underlining text!

On Aug 8, 2006, at 7:46 AM, jackbellis wrote:

> The Adobe toolset (all around) continues to strike me as WordPerfect
> redux... a relic of a "print"-centric company that has been at the
> top of
> the heap, but cannot possibly prevail were it not for buying out
> the better
> software designers. That's what I'm trying to resolve.
>
> Someone please tell me its new version erases all these problems?
> (I don't
> need any recommendations on icon editors, but thanks for those.)

Cheers!

Todd R. Warfel
Partner, Design & Usability Specialist
Messagefirst | designing and usability consulting
--------------------------------------
Contact Info
Voice: (607) 339-9640
Email: todd at messagefirst.com
AIM: twarfel at mac.com
Blog: http://toddwarfel.com
--------------------------------------
In theory, theory and practice are the same.
In practice, they are not.

8 Aug 2006 - 8:38am
Anthony Armendariz
2006

If you compare apples to oranges we all know there are many pros and
cons to the macromedia vs. adobe tools. Photoshop will be better for
some jobs where Fireworks will be better for others. Web design and
production is the one job that Fireworks will always surpass Photoshop.

If you are working on a large web site re design in a team
environment, you can save exponential time and energy on production
while easily maintaining creative direction and quality across
multiple layouts. These savings help your maximize quality and
efficiency and your company’s bottom line. Here is how to optimize
web production with Fireworks.

1. You can design on a component level: Design your interface
components as separate PNGS and import them into one master Fireworks
layout. Design them independently and update your master documents.
Think of how much time this saves if you have multiple layouts that
use a shared navigation bar for example.
I created a example of this and will send it to interested members.

2. Find and Replace: If you have ever had the daunting experience of
making a font or color palette change across multiple unorganized
heavy Photoshop files, then you will love this. Lets say using
Photoshop it takes you 20 min to edit 5 files in any given project.
That’s over an hour and a half! With Fireworks you can do find and
replace on both hex colors and fonts. Yeah that’s right, changing the
same files would only take 5-10 min.

Our company Behavior is considering using Fireworks to maximize
production and design between Information Architects and Designers.

Photoshop is slow and archaic. Yes it has great layer effects, but
guess what so does Fireworks. Fireworks was build solely for web
production teams, and it does a very very good job.

Anthony Armendariz
Creative Director
______________________________
Behavior
http://www.behaviordesign.com
212.532.4002 x211
212.532.4090 fax

On Aug 8, 2006, at 8:34 AM, Dave (Heller) Malouf wrote:

> [Please voluntarily trim replies to include only relevant quoted
> material.]
>
> I have never been able to make the switch from Fireworks to
> Illustrator.
> I never was a "drawer" and the toolset in Illustrator always seem to
> speak to those folks.
> It is however GREAT for type manipulation on a poster type page
> (Quark,
> InDesign is better for typesetting in a book page).
>
> But for doing GUI design I have not found a tool I love more than
> Fireworks.
> Of course if you grew up in Photoshop/Illustrator and feel comfy
> living
> there, then why move? I don't see any reason to move from one to
> the other.
>
> Now, Photoshop vs. Fireworks that is a completely different story. ;)
>
> -- dave
> ________________________________________________________________
> Welcome to the Interaction Design Association (IxDA)!
> To post to this list ....... discuss at ixda.org
> List Guidelines ............ http://listguide.ixda.org/
> List Help .................. http://listhelp.ixda.org/
> (Un)Subscription Options ... http://subscription-options.ixda.org/
> Announcements List ......... http://subscribe-announce.ixda.org/
> Questions .................. lists at ixda.org
> Home ....................... http://ixda.org/
> Resource Library ........... http://resources.ixda.org
>
>

8 Aug 2006 - 8:50am
Dave Malouf
2005

Anthony Armendariz wrote:
> Our company Behavior is considering using Fireworks to maximize
> production and design between Information Architects and Designers.
>
> Photoshop is slow and archaic. Yes it has great layer effects, but
> guess what so does Fireworks. Fireworks was build solely for web
> production teams, and it does a very very good job.
You are definitely preaching to the converted here. I've been using Fireworks since 4.0 and haven't really looked back at Photoshop or Illustrator since.

We didn't even mention its interoperability with Dreamweaver and Flash as other killer reasons to use the tool.

I find its mix of raster and vector, its text abilities, etc. to be the best of photoshop and AI in one tool.

one trick I LOVE in Fireworks ...

Use frames ...
1. create a bottom layer or set of layers(that you know repeat across all screens) and set it to share across frames.
2. For each distinct screen either create a new frame, or duplicate an existing frame if there is enough carry over.

Print to PDF and it creates a single page for each frame.

This is REALLY great when doing small flow sequences when all you are doing are showing dialogs, and other alternative and exception behaviors.

One problem with this is that it soaks up a ton of memory as the system creates duplicates of images in each frame, but the pain point is worth it over time.

-- dave

--

David (Heller) Malouf
Vice President
dave(at)ixda(dot)org
http://ixda.org/
http://synapticburn.com/

AIM: bolinhanyc // Y!: dave_ux //
MSN: hippiefunk(at)hotmail.com // Gtalk: dave.ixd(at)gmail.com

8 Aug 2006 - 11:59am
Dave Cronin
2005

Another plus worth mentioning about Fireworks for UI rendering:

FRAMES.

Frames can be used to store different screen states. You can set it up
so that a Layer is the same on every Frame (and changing it one place
changes it everywhere), or so that it is different for every Frame.

This means that when you export 200 screen states, you don't have to go
through and manually turn each layer on and off.

Also:

SYMBOLS.

You can define a group of objects as a symbol and then changing it once
changes it everywhere. Even across files.

It is true that Fireworks does not provide nearly the level of
typographic control that Illustrator does, nor the level of pixel
control that Photoshop does, but in cases where you need that level of
control, it's possible to import that stuff as symbols.

8 Aug 2006 - 12:32pm
jay hilwig
2006

Is it an apt comparison?
I group tools:
* Web Production *
Fireworks
Imageready
Photoshop-'crossover'
* Vector *
Illustrator
Freehand
Flash-'crossover'

I do not think Fireworks would stand up to Illustrator in a strict
comparison of vector/illustration functions the same way I don't think
Illustrator is meant for web/frame based design.

The Adobe CS/CS2 suite is vastly improved from 2000 and is likely worth a
download of the trial version.

_jay

-----Original Message-----
From: discuss-bounces at lists.interactiondesigners.com
[mailto:discuss-bounces at lists.interactiondesigners.com] On Behalf Of Graham
White
Sent: Tuesday, August 08, 2006 5:16 AM
To: jackbellis; discuss at ixda.org
Subject: Re: [IxDA Discuss] Illustrator vs Fireworks

[Please voluntarily trim replies to include only relevant quoted material.]

Illustrator 10 was a big jump forward from 9, so you may find a more recent
version more useful.
You can download and use a copy of the software from Adobe, good for 30 days
I believe.

Graham White

----- Original Message -----
From: "jackbellis" <jackbellis at hotmail.com>
To: <discuss at ixda.org>
Sent: Tuesday, August 08, 2006 7:46 AM
Subject: Re: [IxDA Discuss] Illustrator vs Fireworks

> [Please voluntarily trim replies to include only relevant quoted
material.]
>
> Scott (and others),
> Not "disconnected" at all and you confirmed part of what I was after. I
> should have emphasized that I was addressing exclusively Illustrator's
> interaction design.
>
> (The 2000 version of) Illustrator that I'm using sucks by both 2006
> standards AND some standards from the 1500's: for example, repeated,
> parallel wording (15 "Show..." items on the Window menu; repeated parallel
> words on both an Effects and Filters menu). Too many inefficient
techniques.
> Low interactivity compared to other products. Very peculiar vector node
> editing, though I don't doubt it's powerful once you learn the secret
> handshake. (No, I don't expect its keystrokes to translate from other
> tools.) And the pièce de résistance for many Adobe products... the
wonderful
> help file from PDF hell.
>
> The Adobe toolset (all around) continues to strike me as WordPerfect
> redux... a relic of a "print"-centric company that has been at the top of
> the heap, but cannot possibly prevail were it not for buying out the
better
> software designers. That's what I'm trying to resolve.
>
> Someone please tell me its new version erases all these problems? (I don't
> need any recommendations on icon editors, but thanks for those.)
> -Jack
>
>
> ----- Original Message -----
> From: "Scott Meier" <scott at scottmeier.com>
> >
> > Illustrator has always been one of those applications to me that I
> > just never understood why everyone used. It always seamed so
> > inefficient.
>
> ________________________________________________________________
> Welcome to the Interaction Design Association (IxDA)!
> To post to this list ....... discuss at ixda.org
> List Guidelines ............ http://listguide.ixda.org/
> List Help .................. http://listhelp.ixda.org/
> (Un)Subscription Options ... http://subscription-options.ixda.org/
> Announcements List ......... http://subscribe-announce.ixda.org/
> Questions .................. lists at ixda.org
> Home ....................... http://ixda.org/
> Resource Library ........... http://resources.ixda.org
>

________________________________________________________________
Welcome to the Interaction Design Association (IxDA)!
To post to this list ....... discuss at ixda.org
List Guidelines ............ http://listguide.ixda.org/
List Help .................. http://listhelp.ixda.org/
(Un)Subscription Options ... http://subscription-options.ixda.org/
Announcements List ......... http://subscribe-announce.ixda.org/
Questions .................. lists at ixda.org
Home ....................... http://ixda.org/
Resource Library ........... http://resources.ixda.org

8 Aug 2006 - 1:15pm
Peter Bagnall
2003

On 8 Aug 2006, at 14:50, Dave (Heller) Malouf wrote:
> Use frames ...
> 1. create a bottom layer or set of layers(that you know repeat
> across all screens) and set it to share across frames.
> 2. For each distinct screen either create a new frame, or duplicate
> an existing frame if there is enough carry over.
>
> Print to PDF and it creates a single page for each frame.
>
> This is REALLY great when doing small flow sequences when all you
> are doing are showing dialogs, and other alternative and exception
> behaviors.
>
> One problem with this is that it soaks up a ton of memory as the
> system creates duplicates of images in each frame, but the pain
> point is worth it over time.

I create masses of layers in FW, one for each part of the UI,
sometimes even to button level. I share all the layers, and then for
each frame it's just a matter of switching on the appropriate layers
for that frame. I've ended up with well over a hundred layers doing
this, which is a bit of a pain, but it does keep FW moving pretty
well, and it avoids the duplicate images, which also means if you
want to change something throughout the design it's very quick.

Frames are so useful though. I don't know where I'd be without them.

--Pete

----------------------------------------------------------
It does not require a majority to prevail, but rather an
irate, tireless minority keen to set brush fires in people's minds.
- Samuel Adams, 1722 - 1803

8 Aug 2006 - 1:20pm
Dave Malouf
2005

Peter Bagnall wrote:
> I create masses of layers in FW, one for each part of the UI,
> sometimes even to button level. I share all the layers, and then for
> each frame it's just a matter of switching on the appropriate layers
> for that frame. I've ended up with well over a hundred layers doing
> this, which is a bit of a pain, but it does keep FW moving pretty
> well, and it avoids the duplicate images, which also means if you want
> to change something throughout the design it's very quick.

Ok! this is beyond cool! Are you saying that when you share across
frames you don't have to have the same layers visible in each frame?????

dude!!!! Amazing!!!

::bowing to the FW gods!!!!!::

--

David (Heller) Malouf
Vice President
dave(at)ixda(dot)org
http://ixda.org/
http://synapticburn.com/

AIM: bolinhanyc // Y!: dave_ux //
MSN: hippiefunk(at)hotmail.com // Gtalk: dave.ixd(at)gmail.com

8 Aug 2006 - 2:15pm
Anthony Armendariz
2006

Is anyone willing to show examples of how they have increased
productivity of interface design using FW?
I am willing to share files because I believe we should all help each
other out.

Anthony

8 Aug 2006 - 2:20pm
Dave Malouf
2005

Anthony Armendariz wrote:
> Is anyone willing to show examples of how they have increased
> productivity of interface design using FW?
> I am willing to share files because I believe we should all help each
> other out.
>
Anthony and everyone else ...
A great place to share materials if you like is through our Resource
Library. This is exactly one thing we were hoping would happen when we
opened it up.

Just go to http://resources.ixda.org/ and register to post it up there
and voila!

I'm sure many will unfortunately be reluctant b/c of the sensitive and
protected nature of the work they do. It is an unfortunate part of what
we do. I do know that that volunteers have figured out how to create
clean examples of their work. The tools section on the IAI site has such
cleaned and useful tools.

-- dave

--

David (Heller) Malouf
Vice President
dave(at)ixda(dot)org
http://ixda.org/
http://synapticburn.com/

AIM: bolinhanyc // Y!: dave_ux //
MSN: hippiefunk(at)hotmail.com // Gtalk: dave.ixd(at)gmail.com

8 Aug 2006 - 2:25pm
russwilson
2005

How? I can't see how to do this... (but I'm
no FW expert either)

Thanks,
Russ

-----Original Message-----
From: discuss-bounces at lists.interactiondesigners.com
[mailto:discuss-bounces at lists.interactiondesigners.com] On Behalf Of
Dave (Heller) Malouf
Sent: Tuesday, August 08, 2006 1:21 PM
To: discuss at ixda.org
Subject: Re: [IxDA Discuss] Illustrator vs Fireworks

[Please voluntarily trim replies to include only relevant quoted
material.]

Peter Bagnall wrote:
> I create masses of layers in FW, one for each part of the UI,
> sometimes even to button level. I share all the layers, and then for
> each frame it's just a matter of switching on the appropriate layers
> for that frame. I've ended up with well over a hundred layers doing
> this, which is a bit of a pain, but it does keep FW moving pretty
> well, and it avoids the duplicate images, which also means if you want

> to change something throughout the design it's very quick.

Ok! this is beyond cool! Are you saying that when you share across
frames you don't have to have the same layers visible in each frame?????

dude!!!! Amazing!!!

::bowing to the FW gods!!!!!::

--

David (Heller) Malouf
Vice President
dave(at)ixda(dot)org
http://ixda.org/
http://synapticburn.com/

AIM: bolinhanyc // Y!: dave_ux //
MSN: hippiefunk(at)hotmail.com // Gtalk: dave.ixd(at)gmail.com

________________________________________________________________
Welcome to the Interaction Design Association (IxDA)!
To post to this list ....... discuss at ixda.org
List Guidelines ............ http://listguide.ixda.org/
List Help .................. http://listhelp.ixda.org/
(Un)Subscription Options ... http://subscription-options.ixda.org/
Announcements List ......... http://subscribe-announce.ixda.org/
Questions .................. lists at ixda.org
Home ....................... http://ixda.org/
Resource Library ........... http://resources.ixda.org

8 Aug 2006 - 3:33pm
Peter Bagnall
2003

On 8 Aug 2006, at 20:25, Wilson, Russell wrote:
> How? I can't see how to do this... (but I'm
> no FW expert either)

Ok, I'll walk you through a trivial example... (I'm using FW MX 2004
btw, so I think I'm a version or two behind, but this has been in FW
since at least version 3, probably from day one)

Create a new fireworks doc, and create two layers. Double click on
the layer names, and you'll get to rename them, but more importantly
there's a checkbox there "share across frames". Make sure it's
ticked. You'll see a filmstrip icon appear next to the layer name
telling you it is now shared. Be careful here, when you share a layer
it takes the content of that layer from the current frame, and
content in any other frame for that layer is destroyed, so it's best
to share immediately when you create the layer.

Now put some content into those layers...

Then create a few frames. Switch to frame one, and switch on layers
as needed. Switch to frame 2, switch on/off layers as needed. Go back
to frame 1, and it will have retained the layer visibility state for
frame 1 independently of frame 2. And that's how you can create a
very simple interface walkthrough pretty fast. Add frames as needed
to get the complete sequence.

But the real beauty of this, Dave alluded to too, is that you can
have common UI elements in layers, and just show them in the relevant
frames by making those layers visible only where needed.

Cheers
--Pete

--------------------------------------------------
A society grows great when old men plant trees whose shade
they know they shall never sit in.
- Greek proverb

Peter Bagnall - http://people.surfaceeffect.com/pete/

8 Aug 2006 - 3:38pm
russwilson
2005

Thanks Peter!
- Russ

-----Original Message-----
From: Peter Bagnall [mailto:pete at surfaceeffect.com]
Sent: Tuesday, August 08, 2006 3:34 PM
To: Wilson, Russell
Cc: Dave (Heller) Malouf; discuss at ixda.org
Subject: Re: [IxDA Discuss] Illustrator vs Fireworks

On 8 Aug 2006, at 20:25, Wilson, Russell wrote:
> How? I can't see how to do this... (but I'm no FW expert either)

Ok, I'll walk you through a trivial example... (I'm using FW MX 2004
btw, so I think I'm a version or two behind, but this has been in FW
since at least version 3, probably from day one)

Create a new fireworks doc, and create two layers. Double click on the
layer names, and you'll get to rename them, but more importantly there's
a checkbox there "share across frames". Make sure it's ticked. You'll
see a filmstrip icon appear next to the layer name telling you it is now
shared. Be careful here, when you share a layer it takes the content of
that layer from the current frame, and content in any other frame for
that layer is destroyed, so it's best to share immediately when you
create the layer.

Now put some content into those layers...

Then create a few frames. Switch to frame one, and switch on layers as
needed. Switch to frame 2, switch on/off layers as needed. Go back to
frame 1, and it will have retained the layer visibility state for frame
1 independently of frame 2. And that's how you can create a very simple
interface walkthrough pretty fast. Add frames as needed to get the
complete sequence.

But the real beauty of this, Dave alluded to too, is that you can have
common UI elements in layers, and just show them in the relevant frames
by making those layers visible only where needed.

Cheers
--Pete

--------------------------------------------------
A society grows great when old men plant trees whose shade they know
they shall never sit in.
- Greek proverb

Peter Bagnall - http://people.surfaceeffect.com/pete/

8 Aug 2006 - 4:25pm
Becubed
2004

>> Ok! this is beyond cool! Are you saying that when you share across
>> frames you don't have to have the same layers visible in each
>> frame?????

> How? I can't see how to do this... (but I'm
> no FW expert either)

In FW, each frame can have different layers visible (i.e., some
turned on, others turned off). It doesn't matter whether a particular
layer is shared across frames: you can still choose to have it
visible or not.

I've found that frames is one of the more difficult things for people
new to FW to wrap their heads around. Here's how I describe it: use
layers to organize your UI *structurally*; use frames to organize
your UI in *time*. In other words, each frame contains a snapshot of
a specific screen state. Here's the tough part to understand: the
same layer can contain entirely different objects from frame to
frame. An example:

You have two layers, named "background" and "content". You have two
frames, named "1- home page" and "2- landing page". Your background
layer is shared across frames: that means the contents of this layer
are identical as you move between frames 1 and 2. Your content layer
is NOT shared, so it contains entirely different objects on frame 1
than on frame 2.

I love Anthony's idea of having people share files to illustrate how
they've increased productivity. I need to sanitize my files before
sharing them, but here's a peek at how I organize things. Note: I'm
quite sure there's a better way, so I'm eager to hear how others are
approaching this.

My layers, from top to bottom:

- Web layer (hard-coded into Fireworks)
- Temp (a basic dumping ground or scratch pad)
- Documentation (for my annotations)
- Hover content
- Hover objects
- Base content
- Base objects
- Background (shared across frames)

I place main-window objects on my base layers. Dialog boxes, hovers,
rollovers, etc. go on the hover layers.

My frames, from first to last:

- [Screen state 1]
- ...
- [Screen state n]

This leads to a huge benefit over Illustrator: you can simply print
the file and each frame becomes a page in a PDF file. So I tend to
create frames that correspond to pages in whatever deliverable I'm
creating. It's a huge time saver.

--
Robert Barlow-Busch
Practice Director, Interaction Design
Quarry Integrated Communications Inc.
rbarlowbusch at quarry.com
(519) 570-2020

This e-mail message (including any attachments) is intended only for
the use of the individual to whom it is addressed and may contain
information that is privileged, proprietary, confidential or subject
to copyright. If you are not the intended recipient, you are
notified that any use, dissemination, distribution or reproduction of
this communication is strictly prohibited. If you have received this
communication in error, please notify the sender and delete this e-
mail message immediately.

8 Aug 2006 - 4:41pm
Jeff Howard
2004

It helps to understand Illustrator not as a competitor to Fireworks,
but to Freehand. Both went head to head in the late nineties for the
print design market. I learned both when they were in the 6.x range,
and embraced Illustrator for its connection to Photoshop. In my
opinion, Illustrator peaked around v8 and has only become more
bloated since then. At the same time, InDesign has cut into the
market of what many print designers used Illustrator for. AI web
tools still seem cursory to me.

It really helps to have grown with the tool from the days when it was reasonable. But for UI wireframes I'd guess that most people are apologists, not advocates.

// jeff

8 Aug 2006 - 5:42pm
Baldo
2005

Discussion is very interesting since this is my apps combo:

.Illustrator: to edit vector elements (1% of all the every-day work)

.Photoshop: to create web site screenshots
....smart Objects to include vector elements (logos)
....layer comps to create different compositions (rarely used)
....to get a pixel image control (very important to me)

.winscite (notepad): to make HTML / CSS

To create XHTML w3c sites, I need to make code by myself (I cannot use
any "export to html" automatic functions).
When I need to create HTML sites full of images and antialias texts, I
use photoshop to HTML functions (It's only a bit tricky when I need to
change some elements when HTML is already done).

Does anyone share my methods? Or Am I the only photoshop addict?

--
www.sanbaldo.com

8 Aug 2006 - 5:59pm
Jough
2006

>
> Does anyone share my methods? Or Am I the only photoshop addict?
>

I use fireworks in similar ways in which you use Photoshop, and I assume
many others do as well. But, my concern is that you use notepad for xhtml
and css design. Why not try a text editor that does color coding? I use
Dreamweaver not for the WYSIWYG elements, but simply for the color coding of
xhtml, CSS, php, javascript, etc. It seems to help me since I tend to
misspell paddding and text-aling frequently!

Jough

9 Aug 2006 - 7:57am
Mark Schraad
2006

I moved back and for the between illustrator and freehand (the more accurate comparison) for years (since the 1.0 versions.) They were great for print. I did use illustrator for some wire framing when it was the only available ap under OSX. I also found InDesign ultimately more flexible though and moved towards that because many of the automated functions, multi page and layer functions. It also handles raster images much better than either freehand or illustrator.

In the last year I have played with both All Clear and Visio - neither of which I really like as they are only available on Windows. Though All Clear is clearly more productive for flow charts and diagrams, Visio seems to have a plethora of third party add-ons.

SInce I prefer to work on mac... I really like the Omni products... graffle, outline, etc.

Now that I have a MacBookPro I plan to install windows so that I have Visio and the subsequent compatibility with product engineers.

Maybe that helps...

Mark

On Tuesday, August 08, 2006, at 02:42PM, Jeff Howard <id at howardesign.com> wrote:

>[Please voluntarily trim replies to include only relevant quoted material.]
>
>It helps to understand Illustrator not as a competitor to Fireworks,
>but to Freehand. Both went head to head in the late nineties for the
>print design market. I learned both when they were in the 6.x range,
>and embraced Illustrator for its connection to Photoshop. In my
>opinion, Illustrator peaked around v8 and has only become more
>bloated since then. At the same time, InDesign has cut into the
>market of what many print designers used Illustrator for. AI web
>tools still seem cursory to me.
>
>It really helps to have grown with the tool from the days when it was
>reasonable. But for UI wireframes I'd guess that most people are
>apologists, not advocates.
>
>// jeff
>________________________________________________________________
>Welcome to the Interaction Design Association (IxDA)!
>To post to this list ....... discuss at ixda.org
>List Guidelines ............ http://listguide.ixda.org/
>List Help .................. http://listhelp.ixda.org/
>(Un)Subscription Options ... http://subscription-options.ixda.org/
>Announcements List ......... http://subscribe-announce.ixda.org/
>Questions .................. lists at ixda.org
>Home ....................... http://ixda.org/
>Resource Library ........... http://resources.ixda.org
>
>

9 Aug 2006 - 8:25am
Anthony Armendariz
2006

In this example you will find 4 files. Instead of creating internal
symbols of the elements in the 01_master layout. Each component was
created and saved as an external .png and then linked into the
library of the master layout. To change the components you must edit
the external files. This is just a very quick example but you can see
how it works.

-------------- next part --------------

9 Aug 2006 - 11:54am
Tague, Kevin C
2006

"I've found that frames is one of the more difficult things for people
new to FW to wrap their heads around. Here's how I describe it: use
layers to organize your UI *structurally*; use frames to organize
your UI in *time*."

If you're interested in achieving this concept in Photoshop (CS2), you can
use the animation palette to create collections of visible layers, and then
step through the frames for presentation. (if I'm understanding the concept
correctly)

-kevin

10 Aug 2006 - 2:47am
Loz Gray
2006

The points you make below Anthony are what I have been using
illustrator for for years, particularly doing component design using
EPS files and importing into a master document.

I've also used illustrator for wireframes (using the same EPS
component 'trick'), but in the current project I am working on I
finally got round to doing XHTML/CSS wireframes, which instantly
provides you with a set of 'clickable' wireframes, and I have found
to be the best solution for them, even after only one try. The added
benefit of them is that they can, if done correctly, be built upon
and tidied up to be come the final product.

I am interested to know how easy it is to produce wireframes in
Firefox and to get them interactive as this may be easier for some
designers who are without any XHTML/CSS knowledge, and a more
familiar environment than something like dreamweaver.

Loz

e: loz at lozworld.com | w: http://www.lozworld.com

On 9 Aug 2006, at 05:02, discuss-
request at lists.interactiondesigners.com wrote:

>
>
> Message: 12
> Date: Tue, 8 Aug 2006 09:38:37 -0400
> From: Anthony Armendariz <anthony at dialoguedesign.com>
> Subject: Re: [IxDA Discuss] Illustrator vs Fireworks
> To: Dave (Heller) Malouf <dave at ixda.org>
> Cc: discuss at ixda.org
> Message-ID: <702049D4-879A-4B1B-B7C1-2EBA9EC01FEB at dialoguedesign.com>
> Content-Type: text/plain; charset=WINDOWS-1252; delsp=yes;
> format=flowed
>
> If you compare apples to oranges we all know there are many pros and
> cons to the macromedia vs. adobe tools. Photoshop will be better for
> some jobs where Fireworks will be better for others. Web design and
> production is the one job that Fireworks will always surpass
> Photoshop.
>
> If you are working on a large web site re design in a team
> environment, you can save exponential time and energy on production
> while easily maintaining creative direction and quality across
> multiple layouts. These savings help your maximize quality and
> efficiency and your company?s bottom line. Here is how to optimize
> web production with Fireworks.
>
> 1. You can design on a component level: Design your interface
> components as separate PNGS and import them into one master Fireworks
> layout. Design them independently and update your master documents.
> Think of how much time this saves if you have multiple layouts that
> use a shared navigation bar for example.
> I created a example of this and will send it to interested members.
>
> 2. Find and Replace: If you have ever had the daunting experience of
> making a font or color palette change across multiple unorganized
> heavy Photoshop files, then you will love this. Lets say using
> Photoshop it takes you 20 min to edit 5 files in any given project.
> That?s over an hour and a half! With Fireworks you can do find and
> replace on both hex colors and fonts. Yeah that?s right, changing the
> same files would only take 5-10 min.
>
> Our company Behavior is considering using Fireworks to maximize
> production and design between Information Architects and Designers.
>
> Photoshop is slow and archaic. Yes it has great layer effects, but
> guess what so does Fireworks. Fireworks was build solely for web
> production teams, and it does a very very good job.
>
> Anthony Armendariz
> Creative Director
> ______________________________
> Behavior
> http://www.behaviordesign.com
> 212.532.4002 x211
> 212.532.4090 fax
>
>

13 Aug 2006 - 9:02am
mtumi
2004

FW is excellent. Illustrator is, IMO, overkill for UI design, as
much of its functionality is print-centric.

On frames - what I'll do is have one doc that contains all my dialogs
(in individual frames), another for a specific aspect of
functionality, and then easily be able to create a new dialog or
screen since I have all the related pieces in the current doc.

In addition to being able to export to pdf, you can also export all
the frames to individual files, which is handy if you are making
graphics for specs that use external images (ours are in a wiki).

Another bonus is that there are a number of UI design -related
extensions, such as "insert browser cursor", "form elements" and so
on. Happy to provide a full list of the ones I use if anyone is
interested.

Also FW is alive and well, according to this:
http://groups.google.com/group/macromedia.fireworks/browse_frm/thread/
22afaa2fdb7eb668/5b22381b4a62c81d?lnk=st&q=%22danielle%20beaumont%
22&rnum=1#5b22381b4a62c81d

On a not-necessarily-related note, Adobe has been looking to survey
application designers recently, in case anyone is interested (the
survey is very short):
http://weblogs.macromedia.com/mchotin/archives/2006/07/
designers_neede.cfm

Michael

Syndicate content Get the feed