
Why we skip Photoshop when mocking up websites - mcantor
http://37signals.com/svn/posts/1061-why-we-skip-photoshop
======
teej
Jeff Croft's comment hits the nail right on the head:

"Do you think the aesthetic you guys have developed for your products makes
this no-Photoshop workflow easier for you than it might for others? ... Is it
possible that your no-Photoshop workflow has actually influenced your design
style?"

It's fine that 37signals chooses to skip Photoshop as a design restraint to
increase flexibility and agility, but they're choosing to sacrifice a degree
of aesthetic freedom along the way.

------
tvon
Yes, using a graphic design app is inappropriate if you're not doing any
graphic design.

~~~
blasdel
Photoshop is:

    
    
      An extremely good interface for editing and retouching photographs
      Okay for doing painting and bitmap art creation
      Mediocre for doing graphic design -- alignment and layout are frustrating
      Abysmal for doing web design that isn't brochure-like
    

Omnigraffle is a terrific example of a general graphic design app that is
suitable for web design.

~~~
tvon
I agree (as much as I can without actually being a designer), and I think a
lot of people have lamented the loss of Fireworks when Adobe gobbled up
Macromedia. It's also worth mentioning that Inkscape is a good tool if you're
on Linux or Windows.

That said, regardless of how mediocre or abysmal Photoshop might be for
graphic/web design, it's what most people seem to be using for it these days.

~~~
psyklic
What do you mean by "loss" of Fireworks? It is still sold by Adobe as part of
CS 4.

~~~
tvon
Holy crap, I had no idea. My mistake.

------
neovive
I find Fireworks to be a much better tool for web mockups. In the latest
version, Adobe added the ability to create interactive (clickable) wireframes
and mockups that can be exported to multi-page PDF's. Fireworks offers a great
toolset for those who are willing give up some of the advanced image editing
functionality of Photoshop for more flexibility and speed.

~~~
jamesbritt
I like DENIM for clickable mockups

<http://dub.washington.edu:2007/projects/denim/>

------
antidaily
I've noticed quite a bit more graphic details in their recent product pages
and sign up forms. Turns out their new designers do indeed design in
Photoshop: [http://37signals.com/svn/posts/1821-work-in-photoshop-
dont-s...](http://37signals.com/svn/posts/1821-work-in-photoshop-dont-save-in-
photoshop)

~~~
puns
Their new designers are adding a lot more visual touches to the interface,
too. The original 37signals style consists mainly of HTML elements styled with
CSS, and with all the controls unstyled, e.g. form controls. When you're not
creating new images for buttons, backgrounds and boxes, then there really is
little point to use Photoshop -- you just need to mock up the layout, and that
can be done on paper.

When you're adding a lot of visuals, you'll end up using them in the final
product, which is where designing that stuff and laying it out in Photoshop
becomes more practical. It really depends on the style of the UI and how
heavily it relies on custom images.

------
hkuo
The controversy here is so unecessary. They begin with "Why we skip..." Note,
the word "we". They're making a case that works for them and may work for
others that haven't considered it. They're not trying to tell you how you
should do things and they're not asking people to tell them how they're wrong.
People have just forgotten that there is no one way to do things.

------
ironkeith
That's odd - I'm fairly certain I've seen a number of 37signals articles where
they post pics from Photoshop while they're designing interfaces...

~~~
smiler
I believe that they since hired a couple of graphic / UI designers, who it
seems use Photoshop a lot more

------
bkbleikamp
This post caused an absurd amount of controversy when it was originally
posted. Is it really necessary to rehash all of it?

~~~
mcantor
I found the controversy fascinating. Yes, there is a danger of a circular
debate ("Well, yes, but X"; "Well, yes, but Y"; "Well, yes, but X", etc...),
but the article forced me to reconsider my assumptions, and that's great. Even
if I still use Photoshop, it's good to examine why.

------
jubos
Making your mockup interactive aside, I do like using photoshop to play around
with color schemes. Changing css and refreshing the page is slower than just
tweaking colors in photoshop.

~~~
tjpick
firebug saves doing a refresh, and makes dynamically editing css a pleasure.
The webdeveloper toolbar "edit css" functionality is ok too, if you want to
copy/paste css.

------
hellotoby
I think this article is a bit misleading. It's easy to skip photoshop when you
already have a house style for your application and a base css template
already set up.

Things are a bit different if you are starting to build a brand from scratch.

------
henriklied
Didn't they later come out with a post explaining how they _use_ Photoshop for
mockups?

~~~
unalone
I don't think so. There was a popular article from somebody else at the time
that was a counterpoint, but it was entirely external.

------
cb33
Is it really that big of a hassle to make a quick PSD mockup that will
ultimately help you visualize a site? Are those 25 minutes that tedious? I
think they're doing themselves a disservice.

~~~
unalone
Don't knock it if it works.

I don't see what makes Photoshop better than scribbling on a page.

------
omouse
So wait, are they writing HTML/CSS by hand? That's a bit stupid.

~~~
gojomo
You don't mock things up in hand-crafted HTML/CSS? What do you start with?
(Dreamweaver?)

(Sometimes my first mockup of a UI is monospaced plaintext in a draft email!)

