The Hickensian
125 comments
Survey: What app do you use for comps?
When making comps for website designs, I usually use Fireworks. There are many advantages to this, such as setting up each page of site on a separate frame, and having constant elements (like navigation) on a shared layer. Underlining text is a cinch too. The only downside I’ve found is that it can run quite slow, especially when editing text. Sometimes, it’s slow to the point of wanting to throw myself on a fork.
So what do you use? I know that Illustrator and Photoshop are the popular choices. Is there an ideal, but unheard of, app out there that I’m missing out on? Or an everyday “who would’ve thought it could be used for that’ type app? Only one condition – must work on OS X.
Recent Posts
29.06.09 Icons for Interaction
16.06.09 Unite
10.06.09 Discovery
5.06.09 Daniel's Daily Monster
6.05.09 The Art of Penguin Science Fiction
Or Full Archives
playlist | RSS
Elsewhere
Download our vCard
RSS Feed
Comments | RSS
Richard said 1689 days ago:
I use Illustrator, sometimes PSHayo said 1689 days ago:
Just Photoshop. I sometimes used Flash for scribblings, but no more. Just plain good old Photoshop CS now.Patrick said 1689 days ago:
Still good-ol’ ImageReady here… Nothing fancy. Still want to get used to FireWorks, but the step to make is a big one when you’re always up against a deadline :-)Mike P. said 1689 days ago:
I use Fireworks and have had no trouble with speed. Word is that the new 2004 version is quicker. How big are your files? I find things run quite smoothly with files smaller than 8 megs. I run a PC with 512 of ram…I only recently discovered that I can use a library in FW the same as in Flash. One of those “D’oh!” moments that now saves me a tonne of time…
Jon Hicks said 1689 days ago:
Patrick – but do you find ImageReady does what you need it to do? I’ve not considered using it before, but I’ll give it a try.Jason Santa Maria said 1689 days ago:
For comps I usually start in Illustrator, then move to Photoshop to refine. I don’t consider ImageReady to be nearly featured enough to design in, BUT I often use it when I start programming almost exclusively for its slicing feature (which is also native to Fireworks) to keep track of image names and export settings.Dan Mall said 1689 days ago:
I usually use Illustrator. It’s a lot easier to block out areas of content and manipulate their sizes, positions, etc. Nice resource via Jason.However, Layer Comps in Photoshop CS are becoming a big favorite of mine. The ability to have different screens within one document is a life-saver. Not to mention the über-convenient “Layer Comps to PDF” feature . . .
Matt Carey said 1689 days ago:
Illustrator if only from habit! I am still on version 10 and I do hate that I cannot underline text, but I am used to it so it enables me to sketch quickly.Dan Mall said 1689 days ago:
Sorry, here’s the article from Jason: http://www.jasonsantamaria.com/archive/2004/05/24/grey_box_method.phpHumberto Oliveira said 1689 days ago:
I use Fireworks very often and haven’t had any speed issues until now. As I only design for the web it is very conveniently to draw in vectors and see in pixels (like John said while ago). Not to mention the slicing capabilities of Fireworks.I have one question for you, Adobe guys. Is Ilustrattor far more superior than Fireworks? What’s the limits of Fireworks, I mean, how do I know if its time to look for another tool?
Pete Ankelein said 1689 days ago:
I try to start with pencil and sketchpad (or napkin) to play with layout ideas. Next, I prototype a wireframe of the layout in in Photoshop (or Illustrator). Finally, I design the comp in Photoshop. I use Photoshop 99% of the time for layout and Illustrator or Flash mostly when I need to trace bitmaps or do other vector work to bring it into the PS layout. Illustrator comes in handy for the wire prototypes, though, for the same reasons Dan mentioned.I think it’s mostly a matter of what you’re comfortable with….I’ve worked with other creatives that preferred to do everything with Freehand, Illustrator, or Fireworks.
Julian S. said 1689 days ago:
As Pete (#11) does, I start with a pencil and a sheet of paper to create a layout. I realize my ideas with both, Illustrator and Photoshop CS.I hope my whole creative suite will arrive soon, if only trials so far… ;-(
Stuart Maynard-Keene said 1689 days ago:
I use Illustrator with the Pixel Preview turned on. Jon, I once used Fireworks but also found the processor hog on text rendering too slowww, but never had the sorted urg to jump on cutlery ;-)Jared Christensen said 1689 days ago:
In the past, at work we have used Macromedia Freehand. It worked pretty good. It had features to spit out text styles. We would then hand them off to the developers who would create the CSS.Adobe gave us a presentation on how InDesign can create xml files. It looked promising because we are publishing company and our current CMS is based on xml. We have not tried it yet, but Adobe says it would work.
Right now we are sort of in limbo and do our own thing. Some use fireworks, and others use Illustrator or Photoshop.
Dave Foy said 1689 days ago:
I skip about between apps for comps like you skip between browsers!I’ve always used PS exclusively till recently, then did the next few jobs in Illustrator for a while. While both have distinct advantages I feel you really need to have both open to compenstate for each of their strengths and weaknesses. Also, although I run a G5 Mac I still only have the default 512MB RAM (saving up for Christmas!), so I find Illustrator usually grinds my system to a halt.
I started using Fireworks (2004) only recently for comps to try to have only one app open, rather than two. I find it runs pretty quickly actually, but I now find I need 3 apps open! Grrr… I’ve got stuff still in vectors in Illustrator that I just can’t seem to export into FW (just get a white bitmap box. Odd.) and still find I need PS for the odd thing too.
Erm.. what was the question? : )
Allan Rojas said 1689 days ago:
layer comps and save for web are the features I love the most in photoshop cs… that’s all i useRyan said 1689 days ago:
First a piece of paper, then Photoshop.Rob Mientjes said 1689 days ago:
I start to draw it all with pen/pencil, but when I go digital, I tend to use Photoshop. I’m crap at vectors, so I need to work on that :P Illustrator is my primary choice for print of anything else than copy, cause well, vector-based rocks.Arikawa said 1689 days ago:
I start on paper, then quickly go right to SubEthaEdit to start coding.CSS in the head, Web Preview on automatic refresh.
Saves me a step, and prevents me from getting bogged down with things that won’t translate well to the web anyway.
John Oxton said 1689 days ago:
MS Paint mostly… it’s a fast, lightweight app that gets the job done without all the nonsenseRyan Brill said 1689 days ago:
I also use Fireworks MX 2004 for most of my design comps. (All of my recent ones.)The only downside I’ve found is that it can run quite slow, especially when editing text.
I’ve found the same thing. It only happens to me after I’ve been working in it for a while; and it seems that saving, closing the app, and restarting it seems to work (until it gets bogged down again… ;)
Derek Lakin said 1689 days ago:
Fireworks MX for me too. I haven’t had any speed problems (on my PC), but then I don’t think I’ve handled quite as intensive as what you’ve described.Scott Boms said 1689 days ago:
I like to start with a trusty no. 2 HB pencil, some scrap paper (napkins are terrible to try to write on) and go from there. Once I have a basic idea then I’ll move on to Photoshop, though I’ve used Illustrator more in the past.A lot of it depends on the problem at hand since it’s easier to do certain things in one app over another. In the end, the easiest thing to send to clients are either PDF files or JPEGs since basically everyone can open them without too many problems.
I’ve only used Fireworks a bit but I do find it gets really sluggish. Maybe this new type enginge MM is working on for the next version of Flash will be included in the next version of Fireworks as well and generally make the whole experience better. We’ll see…
I’ve done mock-ups in Flash before too, but that generally just makes me want to go over to the photocopier, lay my head down on teh glass and smash the lid on my head :)
Oh, and BBEdit is pretty handy for making quick structural layout mockups for CSS work. Love that live preview feature!
Matthew Pennell said 1689 days ago:
After the pen and paper I use Photoshop, but only because I’ve never learned how to use Illustrator or Fireworks properly. :(Frank Boës said 1689 days ago:
An interesting tool is Xara X. You have the freedom of vector graphics and the precision of pixel measurement… and it exports nicely to GIFs, PNGs and JPEGs.Thomas said 1689 days ago:
I choose Fireworks. The ease of vector and the power of bitmap all in one handy app. Ahh sweet success.Jeff Croft said 1689 days ago:
I usually use a combination of ImageReady and Photoshop CS, but when I downloaded the demo, I did find Fireworks to be very nice and tempting. I don’t own a copy of a recent version, though, so I’m not really able to use it on a regular basis. Maybe I need to get work to buy it for me. :)Ant said 1689 days ago:
Fireworks MX 2004. Oh I love fireworks! Love. It. It’s so easy to manipulate blocks of text, objects, and having vector tools is wonderful. Note, 99% of what I do is for online delivery.Philipe Fatio said 1689 days ago:
I ‘m using Fireworks MX 2004. I think it’s quite faster than the previous version. Sometimes I use Freehand for Vector. I prefer Fireworks than Photoshop, because I think it’s not so “heavy” and it’s faster.Jon Hicks said 1689 days ago:
Just to confirm – I’m using Fireworks MX 2004.Xara X – Windows only.
InDesign – Its my favourite print design app, but doesn’t really seem suited for screen graphics.
Mark said 1689 days ago:
Photoshop all the way for me. In the past I used fireworks for image compression (as it used to be so much better than imageready). Since imageready has improved a lot, in terms of image compression, I use that. I guess it’s like the old Illustrator/Freehand debate – it depends on what your happy and used to using.Rob said 1689 days ago:
100% Photoshop CS. I just love the new Layer comp tools – it makes variations a doddle. Plus the System layout for text gives really good results for CC’s. And of course all of my images are ready to optomise straight out of my comp.Cody Lindley said 1689 days ago:
For me its pencil and paper to Fireworks 2004. (photoshop for image manipulation)I’ve never been impressed with Imageready, but its been sometime since I have taken it for a serious test drive. Has it improved from its original conception?
Besides Fireworks and Imageready what other programs are targeted specificity at creating graphics for the web?
Wilson said 1689 days ago:
It’s really frustrating that each of these apps are so lacking for a very common task (web comps), each in their own unique and horrifying way.I’ve long given up using Macromedia apps because of the mind-crushing slowdown I ineveitably get (even on my G5 at work) and repeated crashes and odd behavior.
Photoshop is just too restrictive for me to design in (layers and bitmap elements don’t lend to quick experiments and free design), so I still usually start in Illustrator. But once I’m ready to make the final graphics and elements for the page, Illustrator falls short (no way to control the anti-aliasing on elements, slicing and save for web are clunky and intrusive). So I switch to Photoshop. But still, there’s no reliable way to get all my elements directly into Photoshop and manipulate them the way I want, so I end up recreating most of my design from scratch in Photoshop. It’s good for discipline, but hard on my mouse wrist.
10 or so versions into an app and almost as many years into the web as a graphical medium, and we still don’t have one app that does it right.
phnk said 1689 days ago:
Photoshop (oh, and I love surveys, so thanks ;)Ben Haldenby said 1689 days ago:
I use Fireworks MX 2004 on OS X and it is brilliant for designing for the web because it’s pixel-orientated. You can actually manipulate graphics and text in terms of pixels which you can’t easily do with Illustrator (even though Pixel Preview is a good stab at the problem). It has the best layer implementation for web work (in my opinion) as Jon pointed out. Keeping global elements (like navigation) on one layer and then hiding and showing other ‘page’ or element layers is brilliant. The slices implementation is the best as well.It is slow though, I think MX had a memory leak (after an hour of use the memory usage for it in Activity Monitor was just soaring). I think it’s improved in MX 2004, but the type engine is still a bit ropey; working with a really text heavy document is like wearing concrete boots.
Rakesh Pai said 1689 days ago:
Photoshop CS. Imageready only for slicing. Win Only.DeWaun said 1689 days ago:
Like many others, I start with a sketch pad and mock-up the structure/layout/columns, etc. Then I use Illustrator 10 or Photoshop 7 to build the base graphics and slice the graphics. Then I just save for web or save to PDF format for my comps.I started my design training on Aldus Freehand but have preferred the combo of Illustrator & Photoshop.
Andy Mac said 1689 days ago:
I’ve sort of got into the habit of doing the layout with CSS first and then building the graphics around it. Once I get an idea of how the words will look on the page then I can start messing with Photoshop, so essentially Topstyle Pro and Photoshop CS are the tools of choice.Scott Jungling said 1689 days ago:
The whole CS suite is great. You can practically switch seemlessly between Illustrator, PS, and Image Ready. All have the integrated “Save as Web” feature which used the Image Ready engine. None is really above and beyond the others for me. Ill is better with text, PS is better with filters/graphics, and I find Image Ready to be the easiest to slice up layouts with. Even though each application has some form of Slice, Image Ready, once you get used to it, wins. I made the transistion from Fireworks MX (old school) to ImageReady. The learning curve took about a day to tackle. After that it’s been smooth sailing.Josh said 1689 days ago:
One thing that surpised me while reading the comments so far is that very few people start with css. If you design with css and xhtml, then you have to be thinking from the start, “How can I pull this effect off using css?” So it seems natural to start with CSS and add images in once you have the structure. Speaking of structure, with so many sites these days having similar layout structure (2 column, 3 column, header, footer, etc) it would make since that more and more people would start with a basic layout type and work around that.Colin Barnes said 1689 days ago:
I always do most of my work on paper first, everything from initial ideas, to mind-maps, sitemaps and layout sketches.Once i’m happy with the layouts i’ll go into photoshop cs and start creating the graphics, I do the slicing directly in photoshop and not imageready, although most of my graphics are created indidiually on layers so I don’t have a lot of slicing to do. The export is PNG which is delivered to the clients.
I then use save for web, and start building the css in dreamweaver code view.
I want to start doing my comps in illustrator just finding it hard to get the time.
Fireworks just never felt intuitive for me, and being on a mac now, i’ve given up on it completely.
Josh Williams said 1689 days ago:
I start with paper, then usually move straight to CSS and Photoshop. I used to use Fireworks a couple years ago, but in an effort to standardize and limit the number of different filetypes, I’ve moved most everything entirely to Photoshop, as it’s handling of web images had gotten much better over the last two versions (7 and CS).Fireworks did get noticeably slow for me as well, which is one more reason I switched.
Additionally, my style has evolved lately to the point that I use a single pixel brush and eraser at various opacities a lot not, and Photoshop is much more conducive to this.
Jeff Smith said 1689 days ago:
I also start off with a pencil and a pad of engineering paper (I like to have the grid on the paper to keep things nice and symmetrical. Then I move on to Illustrator, and usually finish up in Photoshop to add a few final details to the comp, then ImageReady to slice everything up. Finally end up in SubEthaEdit to code everything.I’d like to give Fireworks a try as I’ve heard a number of people including those here that like it’s feature set.
Stephane Curzi said 1689 days ago:
1- Pen and Paper2- Photoshop
3- Slice and dice in ImageReady.
I use to do it in Specular Collage before OS X, It was a great little app, a mix between Photoshop and Quark, a REAL layout tool for images.
Lanny Chambers said 1689 days ago:
I’ve been using Fireworks since an alpha of v1, and stopped upgrading Photoshop at v3. The workflow advantages are compelling, and the live effects concept lets me amaze indecisive clients by emailing them updates while they’re still describing the changes on the phone. I find nothing useful (and plenty of bugs) in the MX releases, so I still run FW4 under OS9. It’s fast and rock solid on my old B/W G3, and does everything I need for web graphics production.Kevin Conboy said 1689 days ago:
John Oxton: Do you have stairs in your house?Anthony said 1689 days ago:
Well, I used to use Fireworks almost entirely. Love it’s vector and traditional pixel capabilities. On my PC I was getting a huge slowdown on writing text, but don’t have that problem using Fireworks 2004 on the Mac.I do, however, get slowdowns when selecting fonts through the Properties toolbar—because it renders the fonts (and I’ve got a ton) it sometimes hangs. Using the font menu from the top menubar alleviates this, as it doesn’t render them.
Am interested in the Illustrator to Photoshop path, however. Have tried this of late based on reading that others prefer this. Like the overall UI of Illustrator better than Fireworks, but I find that what I see in Illustrator doesn’t always transition perfectly when importing into Photoshop. I don’t, unfortunately, feel 100% confident with the designs there.
When comping in Fireworks, however, I know that what I’m doing here is what I’ll get, which is nice.
Hate ImageReady. Fireworks’ cutting capabilities seem-
to be at least-to be superior, and I like the control.Priidu said 1689 days ago:
Load your OSX based computer with maximum RAM and you don’t have any problems with Fireworks MX 2004. Especially when we are talking about one of them new Apple G5’s.Comparing Fireworks to Photoshop – sorry, but the first one is absolutely superb for creating web/screen layouts. I am not talking about photo editing, but fast workflow for layouting, making comps and playing around with graphic elements.
chuck said 1689 days ago:
Strictly Fireworks MX 2004 here … simply a tool that I cannot live without … I rarely use PSI thought I was one of the rare people that use FW … glad to see its so popular out there …
Malarkey said 1689 days ago:
Crayons (Caren D’Ache are best) on paper, sometimes scraps and often fag packets. Then Fireworks MX. What do I win?ayk said 1689 days ago:
Gimp2, InkScape, sometimes ImageMagickTravis Chillemi said 1689 days ago:
Paper. Then fireworks. I like the ability to use library items, the extensive textures, and most of all the extensions. My favorite extension: Form Elements. It offers users the ability to insert the most common type of form elements from Windows, WindowsXP, and OSX, into their documents for mock-up purposes. Woo hoo!Josh Renaud said 1689 days ago:
I begin with sketches and then move to experimentation and realization in Fireworks MX on the Mac. It can get bogged down if there’s a lot of type or special effects applied to elements. But I find its vector tools make it much easier to mock up a site quickly than in Illustrator or PS.Once I begin working on photos for the site, though, Ps is the only way to go.
Tom said 1689 days ago:
Potatoshop, but also lots of pen, paper and stickynotes.Dale Cruse said 1689 days ago:
What, nobody uses The Gimp?!Seriously, Photoshop first, last, and always. I do very little vector work, but if I did I would go for Illustrator, since it works and behaves more like Photoshop than Freehand does.
I suppose that if I had “grown up” on Fireworks I would use it more. For that reason I think of it a bit like using the metric system in the U.S.: The only reason it’s “difficult” is that we’re not used to it. Same thing with me and Fireworks. Photoshop is home for me and, unlike the metric system, I have not found a compelling reason to switch.
Jon Hicks said 1689 days ago:
Now I really wish I’d stipulated “Don’t mention the paper stage”! ;o)Now then I have very strong feelings on going into CSS first. I did it once, and the site looked awful. I personally find it too restricting, and the code decides the design. The route of “design first, then figure out how the hell to do it in CSS” allows for much more creativity.
Mark said 1689 days ago:
I used to use Illustrator, but got frustated in moving everything to photoshop and maintaining the clean lines. So now I just stick with Photoshop from start to finish.Nathan said 1689 days ago:
paper first _(ha I said it)_i work everything out on paper, make some notes about div’s if needed beside the layouts, maybe some “remeber this CSS rule” or something like that…
then I go into pshop and illy and make it look exactly how I want (not matter how complicated) then I figure out how to make it look good in Firefox by save for web (sometimes slices, sometimes just pasting in a new blank document) then make it line up in the CSS and XHTML bits in bbedit, subetha, smultron, whichever i feel like that day (bbedit is really the one i like right now)...
I find PShop’s layers freeing actually (to contrast the post above). I find that without them, I loose the ability to tweek things in minute ways…
I could easily use Firefox, Freehand, or even InDesign to do a site, but it just is easier for me in pshop…
I love that program.
Chris McDougall said 1689 days ago:
Since I design for web and print, I use Adobe Indesign constantly. However, for web comps I use Photoshop. I’d like to give Fireworks a whirl sometime since I hear so much praise for it and I do enjoy Maromedia’s products. I really wish there was a tool that worked a lot like Adobe Indesign or Quark, yet is made exclusively for the web and features a many of the things that make Photoshop/Fireworks/Illustrator so useful for the web. Doing layout comps would be an absolute breeze. Even having the simplest Indesign/Quark feature like the ability to contain multiple pages on a file would make things much easier.Nathan said 1689 days ago:
I meantioned Firefox at the bottom of my post, I meant Fireworks...Yeesh…
Marc Jones said 1689 days ago:
Photoshop. Have been doing so for the last 5-6 years.Yannick L. said 1689 days ago:
I use photohop and have been using it for about a year and half.Jason Beaird said 1689 days ago:
I usually start off with Photoshop CS and my trusty wacom to get an idea. Then I start drawing out vector shapes on top of my sketches and work it up from there with brushes, comp text, and detail. I usually even slice and export my comp out of Photoshop for the HTML Mock-Ups as well.I don’t know why anybody would say PS doesn’t lend to quick experiments. Although it’s not as friendly with the vector graphics, they’re there in full force. And now that Adobe added layer comps, and the ability to have sets of layer sets, I’m in PS heaven.
Jack said 1689 days ago:
Yeah my FIreworks MX 2004 is mind-bogglingly slow when it comes to editing text boxes that have anti-aliasing enabled. It also bugs me how the Home and End keys take you to the start and end of the whole text and not of the current line.But I’ve tried Photoshop and Illustrator and I find Fireworks the easiest to use. I need that pixel perfection and I was never much of an Illustrator user.
Brandon Walsh said 1689 days ago:
I just recently started doing comps (I used to just start coding). I use the GIMP, which I haven’t had any problems with. Unlike most, I don’t have any trouble with its interface.Web said 1689 days ago:
Have you ever tried GIMP? Since OS X is based on linux, it probably should work on it. I really like that app. You can pretty much do all the same things as you could in photoshop. Try it.The Other Jared Christensen said 1689 days ago:
(Commentator # 14 appears to have nicked my name!)I never realized so many people used Illustrator for comps. I’ve always used Photoshop, but I may have to try the ol’ AI format just once to see how it works out.
aplus said 1689 days ago:
I am fully committed to FW MX 2004. It is so much more flexible and web oriented than anything else I have tried. I love the batch functionality and dynamic effects/textures. But… I find when I am using bezier curves, borders and edges can lose their crispness. Slightly off topic: What are some of you fireworks users’ favorite little known features/extensions/resources?Christian said 1689 days ago:
I am a hard core Fireworks fan,It just seems logical to have all the vector, bitmap, and slice/optimization tools in one easy to use program.
As far as speed, I only have issues if I have been working in the document for about 4 hours, that is usually remedied by a restart of the program. Hopefully MM will improve performance on the next round.
As far as building comps – I have always used FW frames panel to create different iterations of my designs.
IMO – The layer controls are so much easier and faster than Photoshop and even Illustrator, though Illustrator has some functionality that is probably better.
The property inspector allows the program to intelligently give you access to the tools and commands that match your workflow.
And probably the topper is the ability to do live effects. Rather than baking the filter into the image or vector (the way PS does or at least did) FW gives you the ability to change your mind or adjust your filters when ever you want. This kind of control is invaluable when creating designs.
Interesting topic.
Hans said 1689 days ago:
I also use Fireworks, and I do agree that it can become painfully slow when editing text (or creating an absurdly large complex vector-shape, like a star), no matter what kind of computer you’re using. Still, it’s much better than Photoshop CS for most work. Photoshop’s interface (and organization) is big, grey, and clunky. Fireworks’ is little, colorful, and pixelly.Sian said 1689 days ago:
Like Andy Mac (39) I start with a basic layout in Dreamweaver and then work CSS around it.Jon Hicks said 1689 days ago:
One big difference between Fireworks and Photoshop that I should’ve mentioned, is that you can select anything. You don’t have to have that layer selected first, as in Illustrator. In fact it works better than that, as you can select the object with a single click in the layers palette.There’s no doubt that Fireworks is best for me – I just wish the performance was better.
Natalie Buxton said 1689 days ago:
I start in Firefox and have a pretty standard flow.Create three layers: – Colour Palette – Basic wireframe – Core Elements
Then I do the rest with frames, as you do.
The problem with Fireworks (all versions) is that when you start to have a lot of fonts installed it slows down to a chug as you add text.
I’ve used Photoshop, Illustrator and InDesign and they all suck for website design. Well, I think they do. It’s the ability to preview the layout in a browser window before I start hand coding the xhtml/css that wins hands down.
I still use Photoshop to do image editing, but not for website layout.
Dave S. said 1689 days ago:
Fireworks has the most logical layer management/selection ability I’ve seen. Grouping works exactly the way it should. I find its actual image creation tools a little dull, but it does handle anti-aliasing primitives much nicer than the vector tools built in to Photoshop. And of course, it’s slow as molasses unfortunately.I’m fine with building incidental graphics in Fireworks, and have been doing so more and more lately, but for comps Photoshop is still IT.
Alexander Tague said 1688 days ago:
Sketchpad first, then a few roughs before I jump right into coding CSS/XHTML in BBEdit.Never have tried FW. I’ve always been an Adobe fan for all my print and web work.
Jesse J. Anderson said 1688 days ago:
good ol Photoshop does the trick for me…it’s the first program I ever used to design (got a version WAAAY back, i think it was version 4 or something) and it’s still prolly my favorite.Mark said 1688 days ago:
I use fireworks mostly as well, it does however have some performance issues. I have Studio MX 2004 and have shyed away from Dreamweaver and replaced that with skEdit. But fireworks is my pick for icons, comps, and even illustration. I really dislike Freehand and it doesn’t even play that well with Fireworks. A bit off topic but thats my thouhts.Mark said 1688 days ago:
Not trying to spam, but have you guys tried sodipodi? I haven’t messed with it much but it is 1) free 2) a vector app 3) outputs to web formats. It will run on a mac via X11 (Which is also free). http://www.sodipodi.com It is in its infancy but useable and quite nice from what I have seen. Just another free alternative.Stephanie Sullivan said 1688 days ago:
I started out about five years ago with PS… and thought it was great. Then, when I got the whole Studio instead of just DW, I started playing around with FW… After the initial learning curve (didn’t really take THAT long), I never looked back. I still do image optimization in PS (though a good friend swears I don’t need to… maybe I’ll learn that soon), but for anthing “web comp” related, I adore FW.Sometimes when I outsource design work, I’m given a PS comp and I can barely stand to use it. I want the ability to click an object and change its background or border… I want to click a button to turn on or off a live effect. I don’t want everything rasterized. I’m spoiled rotten. :)
As to the speed—make sure you download the updater. It did help me a good bit (I’m also on a Mac). I think MM will work to fix this. It seems they’re aware of the issues.
And I’m with you on the designing issue. Though I build most of my sites in CSS-P now, I would never try to design with CSS and add images. I like creating just what I want to see in a browser within Fireworks. Of course I keep in mind what might be difficult to code as I design. Then, I slice and dice and in the html, I apply a lot of repeating backgrounds as well as background colors and borders, and create portions with CSS though it appears to be images… And in the end I usually have a quick loading CSS/image hybrid.
But I digress… To answer your actual question, it’s Fireworks all the way baby. ;)
Anthonyu Baker said 1688 days ago:
Ah, I think I’ve fallen in love with Fireworks again out of reading this thread. One thing I had started doing, in trying Illustrator out, was saving the comps as PDFs and sending those to my client. Works great!Again, the issue was the import into Photoshop. And then the slice/dice hell of ImageReady. Fireworks does it all.
Have also been working on ways to import other vector images into Fireworks. Recently toyed around with creating some more complex vectors in Flash MX 2004, saving as AI/EPS files, and imported into Fireworks. Worked like a charm.
I also have 1GB RAM, which helps with performance issues that I previously experienced on the PC with text rendering.
Great thread, though.
Jon—start another one on editors. Would love to hear from those who use SKEdit, Dreamweaver MX, Homesite, BBEdit and others…
Coudal said 1688 days ago:
Am I the last Freehand user?Marcus Ramberg said 1688 days ago:
Powerpoint ;-DPhilippe said 1688 days ago:
Paper, pencil(s); OmniOutliner (site structure, flow) and SubEthaEdit (creating a rough xhtml comp with colour schemes). My clients seem to understand better how things work out that way. Then the graphics editors come in (Photoshop and Illustrator, Fireworks MX sometimes, as it is slow, even with 1,5 gig of Ram. (this coming from someone whose used to work with 500Mb image files). And I dislike the MX interface; if I could use the OS X fonts with Fireworks 4, I’d be very happy. Complex typography in Illustrator, Photos always in Photoshop.Josh Jarmin said 1688 days ago:
Based on the comments here, I went back and tried ImageReady and found that it does a pretty good job of working with design comps. It feels more natural for this process that Photoshop. But I still use Fireworks or jump straight to CSS if needed (read: don’t have time for a full comp).Joshua Heyer said 1688 days ago:
Fireworks MX 2004 for layout/design. Been using it for years now and can’t go back to PS for this type of work.Photoshop CS for photo editing. Nothing better than PS for this.
dj blurb said 1688 days ago:
Get the updater. Get as much RAM as you can. I have 2 gigs on the work machine (a dual G5 2.0) and rarely run into slowdowns. Sure, I still use the CS triumvirate for print work and image editing (not so big on GoLive).I can’t believe no one has mentioned Art Director’s Toolkit. This app is bundled with new Macs (at least it was as of last year) and is a godsend for doing PMS to anything conversions, columns (in pixels!) and converting any measure to computer friendly measurements (we’re not so big on the metric system in the US) and it has a scale tool that shows percentages, measures and the like.
I second the designing straight into CSS/xhtml. There is a certain organic quality that gets lost.
Ryan Parr said 1688 days ago:
I use Fireworks. It’s made for web work. I find it to be Photoshop and Illistrator rolled up into one. I do run into slowing issues with Fireworks. I used to design in Photoshop, but once I was introduced to Fireworks, I’ll never go back. I blieve Fireworks produces cleaner graphics….as a personal preference.Stephen Fuqua said 1688 days ago:
Perhaps not as “professional” in my abilities as many of you, but I find Freehand quite usable for comps. Works intuitively and quickly. I prefer it to Fireworks simply because it gives me a better page concept (by design).For anyone reading here who sighs and says “gee, I wish I could afford those tools!”, here’s a suggestion: try OpenOffice.org. OpenOffice’s “drawing” app is not as good as Freehand or Illustrator of course, but you can actually do quite a bit with it. My biggest complaint was the difficulty in changing from the default color palette (for backgrounds, lines, etc.). Otherwise, you can quickly and easily create useful comps and export them to numerous formats (including SVG and PDF).
qrayg said 1688 days ago:
Yeah… FW MX 2004 is the way for me too. One of our designers uses AI and I can not stand it. I always end up having to edit his source files after he converts them to PSD because AI makes most boxes antialiased by 1 pixel.Maybe he is doing something way wrong.
Anyway… everyone should use FW if they want to get things done faster and be able to edit your effects without restrictions.
Gustaf Lindqvist said 1688 days ago:
Why not try The Gimp? It’s working under the GNU license. Anyway, its very good app, and works with many different OS, there for Mac OS X.http://www.gimp.org
Rayne said 1688 days ago:
I use Photoshop to create the layout and design then jump over to Image Ready to slice it up. I just switched from PC to Mac and can’t switch my Adobe software (don’t want to get rid of my PC copy since we have PCs on our home network, but can’t afford to buy another copy of the Creative Suite for the Mac!). When I need to do the graphic design, I hop on my husband’s PC for a few hours, then transfer the sliced images to my Mac for coding.Jarrod said 1688 days ago:
I used to work with Fireworks way back with version 3 and 4, then I switched to Photoshop when I learned it better. Now I play around with Illustrator and Freehand, but have a preference for Illustrator, but in the end all the final stuff is done in Photoshop.And I never work on any XHTML, CSS until I havethe design in Photoshop ready, then i figure out how I’m going to do it like Jon mentioned above.
Goran Anicic said 1688 days ago:
Just Photoshop .Gidget said 1688 days ago:
Fireworks for me. I’ve tried everything, and Fireworks seems to allow me to work the absolutely fastest. So far from perfect thought! I want InDesign and Fireworks to have a baby.It BOGS down on my pc, the more I work, the slower it gets. I have a little utility that reclaims memory, and that seems to help significantly.
Aaron Boswell said 1688 days ago:
I start out on paper and then visualize if it will work on the web with current css standards. Then I go into PhotoShop (changing the proof setup) and work the layer comps angle. I like PS over FW for one reason. I am a layer junkie. I do nested folders and all that. After I am done, i flatten and export to Fireworks. Mainly I use FW for slicing/dicing and exporting. I have found the image crunching (especially on JPGs) to be much better. Basically:1. Illustrator imports vector and bitmaps better into PS.
2. I am more used to the way PS handles.
3. PS has more robust processor handling and doesn’t bog down my machine.
4. By flattening my files, I can give them to a production artist to crunch and he can’t mess with it.
There you go.
Pepper said 1688 days ago:
I see no one else uses Quark Express. How interesting. Having used this for print design since 92, it is automatic for me to layout all pages in this for any purpose. There is a separate web design function now as well.Of course, Photoshop is my choice for use of images, as it can be saved in layers and image changes are made so easily. But the typography limitations are impossible after using real page-layout software.
M.e. said 1688 days ago:
FW 4 EVRclint said 1687 days ago:
I tend to agree about having my hands tied starting with CSS, if I recall correctly from his book, thats what zeldman does. Ive tried it but I find it really restrictive. Photoshop is essential to my formative stages of design, as well as Illustrator to incorporate vectorz. Then I crack open BBEdit and have at it. One thing I’ve been contemplating is to move from img’s strictly to manipulating text using CSS for graphics, ie extreme font sizing, line-height, and letter-spacing. More of a “live” design if you will…..marc hemeon said 1687 days ago:
Design in PS for web, FW/Illus. for logos, InDesign for Brochure, bcards etc.So why Photoshop for web design, well because of its great shading, pen tool,vectors, and brushes of course. I use vectors for all shapes, including custom shapes like arrows, icons etc. vectors for rounded boxes, sqaure boxes – blending otpions allow for easy borders, and shadows at a click – and with PS CS nested Layer sets! come on – it just doesnt get better.
Lets face it—old school javascript rollovers are dead (or are slowly dieing) with css – I end up having to make seperate images for background image replacement techniques—with an image for the active, inactive and hover states—i dont know any program that will make those for ya and then write the css with the proper cordinates based on a slice of a design—(google “css sprites” or “sliding doors css” for examples of what im talking about) maybe im doing it bass-ackwards – but, works for me.
zara said 1687 days ago:
I’ve always used PS although every once in awhile I will mix it up with Illustrator. Now that PS has vector shapes it makes me use Illustrator a lot less for comps though.I may have to look into FW though. I’ve never tried it and it sounds like I’m missing out!
Mayhem Studios said 1687 days ago:
I start with thumbnails then move onto Photoshop to layout everything. Then I jump over to ImageReady for slicing/opitimizing. Save out the html through ImageReady and tweak in Dreamweaver.Daniel J. Wilson said 1687 days ago:
I don’t know how well suited it is to web design, but Zengobi’s Curio (http://www.zengobi.com/products/curio/) is my tool of choice for user interface concept visualizations.Matt said 1687 days ago:
I’ve been a fan of Fireworks for quite a while; in fact it’s the only piece of Macromedia software that I like. Apart from Imageready, it seems to be the only piece major app that’s solely geared towards designing graphics for the web, which I find unbelievable in this day and age.I use Illustrator and Photoshop as well, but I find it infuriating that while there’s an overlap in features that makes both apps suitable for producing website comps, those common features aren’t quite sufficient to get away with using just one of them. If you want complex vector-based artwork on your site, you need Illustrator; if you want complex raster images on your site, you need Photoshop. Adobe markets both apps as having features for producing web graphics, but of course, they really want you to buy both.
There are Free Software alternatives like The Gimp (raster) and Inkscape (SVG) which are really worth supporting (both run on OS X using X11). I think it would be really nice to see a Fireworks-like app spring from these two projects.
Oscar said 1686 days ago:
i use photoshop at the moment~bc said 1686 days ago:
OmniGraffle is my tool of choice when sketching out a page. I used to use AI, but find OG to be faster… the goal is of course not ready to have art quality stuff, but to layout ideas. Then I just jump right to CSS. Images edited in PS/ImageReady or GraphicConverter. I tried hard once to get into MM’s stuff… I wanted to like it, but found their interface clunky. I’ll check back again at the next revision. I’m really suprised there are this many FW fans!BTW – if you have an Mac from the last few years, a full copy of OG2 is on your machine. I found v3 to be much better, so I upgraded. Highly recommended.
Michael Efford said 1686 days ago:
I use Fireworks MX 2004 for web layouts. The pixel precision, the ease of putting borders on things, the layer control, the aliasing control. The vectors. Oh the vectors! – but they’re really pixels. It’s too good.Potatochop for editing photos only.
The slowdown issue is really bad, thou a restart fixes it, hopefully the 7.02 update solves it completely. Has anybody tried it yet?
Aw! said 1686 days ago:
I know I must be the only one, but I used to work in CorelDraw!, but know I only use Photoshop for the mockups. I always start with a draw, defining the navigation structure..I have read the comments so i would try workintg with MM Fireworks..
William Bowers said 1686 days ago:
I usually use fireworks, as I think it is more tailored toward layouts and such. Sometimes I just feel like fireworks doesn’t cut it though if I’m trying to create a flashy header image, or some exploding text. But for the most part, fireworks it is.Shawn Grimes said 1685 days ago:
I primarily use Photoshop for doing mockups. I have not actually tried MM Fireworks, but after reading the comments here, it may be worth downloading the demo and giving it a try.brandon said 1685 days ago:
The trick to firefox is to use a font management client like suitcase and not have all your fonts in memory, only the ones your using, atleast that works for me.Great things to come for fireworks.. nice redesign btw. I’m a fan.
Tomasz Staniak said 1685 days ago:
Jon,Have you ever seen/used Photogenics?
Well, this app surely can’t be compared to giants such as Photoshop or Fireworks, which I use on daily basis, but I dare to say that when it comes to not-so-advanced manipulations or when it comes to intuitive editing, without dozens of layers – this tool beats the hell out of PS or FW, and isn’t so “mainstream” – important issue if one likes to be geekish individualist ;)
It’s also crossplatform – Windows, Linux, PocketPC and… AmigaOS (that’s where I first used the program), and the size of full install (.exe) is… 2MB…
http://www.idruna.com/products.html
http://www.idruna.com/photogenicshdr.html
As a pixel-pusher, and retired Amiga user, I have sentiment for not-so-well-known apps, therefore I still often use programs that may be substituted by any of Photoshop, Fireworks, Painter but habits are still strong. My list of commonly used apps is closed by ProMotion (2D 8bit pixel-pushing; like unbeatable Deluxe Paint), Aura (NewTek’s Brilliance; 24bit pixel pushing)
jaffry said 1685 days ago:
Photogenics is actually not bad – used it once on a friend’s laptop but it seemed a little sparse feature-wise. But this was a couple of months back so maybe it has improved.But nothing can take me away from Photoshop 7 for my work. No upgrades for me unless I really have to. (I was on PS5.5 for a very long time). I never liked FW from the beginning and I’d probably never use it… it’s one of those love-hate things. I love my PS7 too much. If only it’d run reliably on Wine on my Linux box…
Jon Hicks said 1685 days ago:
Photogenics – cross platfform, but doesn’t work on OS X, which was kind that one criteria I had.Brandon – I’ve used Suitcase since v6 and I’m currently on x1. Doesn’t help though.
Charles Roper said 1685 days ago:
I’ve tended to switch between PS and FW for web comps, and I’ve tried out using AI for a project, although I found it to be not-quite-right. Having used PS since version 4 and FW since version 1 both have improved their handling of creating comps and graphics for the web immesurably, but I think because FW was designed from the ground up for web graphics it definitely feels the best to me for many of the reasons other have cited. It just seems to take a more natural approach.One department I think FW definitely does lack in is its typography engine; it feels clunky and MS Word-ish, and lacks the fine, fully opentype enabled, typographic capabilities of the Adobe suite. I find myself switching back to PS for high quality typographic work. Another infuriating problem of FW is that it refuses to take advantage of the full 256 colour palette of GIF and 8 bit PNG when it should do. See the following two images for an example:
PS nice
FW nasty
Does anyone else experience this, or is it just me?
Jon Hicks said 1685 days ago:
Charles – I agree, although Fireworks always seems to do a better job of optimising images.Bernardo Schepop said 1684 days ago:
CS Rules…Josh said 1684 days ago:
I use Xara X – a fantastic vector illustration program for Windows only. It’s made by a small UK company called Xara. A free (trial) download is available from www.xara.com.I know you said Mac OS X only, but I simply had to mention this program because I really believe it’s one of those “best of breed” applications that deserves some wider recognition.
Why do I like it so much? It’s fast – even on less powerful machines. It’s very interactive – you don’t have to plough through numerous dialog boxes to alter properties or attributes of shapes. It also has a clean, uncluttered user-interface – no need to navigate through numerous palettes.
If you have Virtual PC, you can get it to work, but it will be painfully slow. Still, if you’re really curious, it will give you a taste of a (refreshingly) different interface from Illustrator or Freehand.
One last point; because vector programs like Xara make it so convenient to drag, re-size, skew and scale objects interactively, I find it almost impossible to go back to using bitmapped programs like Photoshop for comps.
Josh said 1684 days ago:
I should have mentioned that if you’re curious about the user-interface for Xara, but don’t want to (or can’t install) the software, the Xara website has some flash demos of the features in action – try the drop shadow one as an example.Sophie said 1683 days ago:
Fireworks for all the reasons already mentioned when it comes to page comps. Sometimes switch to PS for specific graphics/photo editing where I feel it has the edge.If FW is struggling editing a big block of text I sometimes find turning off the auto-apply feature (so it only updates in the Editor box, not on the actual design) and/or size/font/colour preview helps. Doesn’t cure the more general memory leaking though. (Thought that was just me – nice (??) to hear other people get it too.)
Would also love to know what editors people use, but that’s another thread…
Rik said 1683 days ago:
First I stare into space for a while. Then sketch layouts in (beloved) large Moleskine notebook, usually with Pilot Hi-Tecpoint V5. Then Photoshop CS.Jake Badger said 1681 days ago:
I use paper and a HB pencil first. then I generally go into FW04 and play around, rarely does my final comp look much like what I started with on paper. I love the “think in vectors display in pixels” mentality of fireworks. I still use photoshop for photo correction or manipulation, but I find FW is so much easier for web comps (even if it can be rather slow at times).Karl said 1681 days ago:
I too LOVE FW MX 2004, but I continue to worry about the long-term future of this product. My sources at Macromedia tell me that almost all the development for FW (and some other products) have been outsourced to India. New, major updates are doubtful given the company’s focus/shift to Flash, Breeze and Flex and other Flash-related products. They seem to believe their revenue stream future is here and not on a “mature” market like print and web tools. Maybe it’s time to really learn Adobe’s product line since I can’t imagine a world without Photoshop, but I can see one without Fireworks. (sigh).Jerome Verzier said 1679 days ago:
Hello Jon,I use Fireworks MX 2004 since a long long time and it’s, for me, definitely the best. I tried PS6, PS7, PS CS and even Illustrator and the bridge to cross is too big.
The best app is always the app you like working with. For example, a guy can use Paint Shop Pro to create icons (like Quadrone) or Photoshop (like Foood).
But for the PDF, I like InDesign CS so much :)
Jerome
Post Scriptum : sorry for my poor english.
Mike Funk said 1674 days ago:
I use Photoshop CS as well. I find that I almost always have a use for gaussian blur, extract, and especially layer styles. I have gathered hundreds of useful layer styles over the years and I almost always make use of them or make a custom one. Even if it’s a simple effect, I can copy it and paste to linked layers. I can’t copy appearances and paste to linked objects in Illustrator. I find the Illustrator drop shadow to be annoying since it takes so long to redraw every time I change the size or position of an object. And I get really annoyed trying to work pixels into illustrator: placing an image and vector masking it, only to realize that to do what I want to do I have to jump back to PS. I’ve given Fireworks a shot, but I’m too entrenched in Adobe keyboard shortcuts to switch. I have learned to use Photoshop as a makeshift vector graphics tool since my last job wouldn’t buy me Illustrator. So now instead of copying and pasting Illustrator paths as rigid pixels in PS, I create a vector shape so I can mess with it later.