Like I said, I think it’s much easier to come up with a coding scenario that isn’t easily depicted by a photoshop doc than a psd that can’t make its way into HTML/CSS in one form or another.

So, if you are working in the space between liquid CSS, AJAX and Photoshop. There really isn’t yet a unifying tool (or set of tools) on which you can lean. Fireworks with Photoshop comes close, but even then some interactions will spill out into new docs.

You were very perceptive in calling out 37signals’ paper sketches, but I think you are making the same mistake by not allowing for the effort that standards designers bring to the table to make Photoshop a serviceable application.

The sad fact is that none of these tools allow for complete freedom for creativity. It is still largely the designer’s responsibility to keep the vision across the codes and the applications. That is the real starting point and often also the endpoint. Contrast that with print design, where a design can be trailed from concept to CMYK within a single suite.

Why does it seem so difficult to acknowledge that HTML/CSS skills are the underpinning of good web design? Just baffling.

Brad, either you’re just trolling, or you completely and utterly missed the point. I’ll give you benefit of the doubt, in case it’s the latter…

No one is saying we skip HTML/CSS. No one is denying that HTML/CSS skills and understanding are important in web design. And no one said we completely omit consideration of the medium in which we work.

*My* design process is more open and less limited when I don’t start with HTML/CSS. Get it?

Jason and his colleagues at 37signals don’t skip the design tools. They still use quick sketches on paper to start.

Good catch, there. Conversely, you might find that you don’t actually skip HTML/CSS, either. Even if your early Photoshop comps forced you into some CSS invention, they still benefitted from the CSS foresight that you had accrued to that point.

The real question is, are you still designing to those CSS edge cases, or have you decided to benefit from the very standards and practices that you helped create? If you never code the same way twice, then by all means continue to claim that you design straight in Photoshop. Otherwise, you must admit to keeping a mental-model of your HTML/CSS even as you work in Photoshop. The only difference between your mental-model and 37signals’ HTML prototype is that you can’t attach yours to Basecamp.

Even considering the CSS constraints that your early PSD’s exposed, I would venture that HTML/CSS exposes far more constraints in Photoshop. Ever try to build a liquid background with hover states and export to transparent PNG’s all in one go?

It has amazed me to see so many CSS luminaries deny the very pedestals on which they stand, pedestals that they helped raise. There is no shame in the material influence on art. Technology has always shaped the path of art. From lapis lazuli to acrylic to cement, each material invention was the benefactor of an artistic movement. Why does it seem so difficult to acknowledge that HTML/CSS skills are the underpinning of good web design? Just baffling.

I have a couple examples of how software tools have affected designers’ thinking, and the outcomes of their work with particular tools.

In the design program of North Carolina State University, one of the professors noticed that students who learned typography in adobe illustrator had a more sensitive eye towards typography than the students who learned in quark or indesign. The professor attributed this distinction to the amount of control each software package allowed. The idea was that quark and indesign had an underlying grid that required more effort to deviate from, while illustrator was in the reverse situation, that is, the student would need to take steps to have an underlying grid applied to their work.

With this distinction, the students who used illustrator had to put far more effort into aligning, spacing, and creating overall structure and order, while the students using indesign didn’t have to pay as much attention because indesign did some of this work for them. Indesign did many of these things to a “good enough” degree, where the students only had to hand adjust the typographic items that were clearly offensive rather than having to pay as close attention to a greater number typographic factors. In a sense, illustrator was training the students to be more sensitive to important aspects of design.

Another related item that is I think is interesting is an argument Lev Manovich makes. His argument is that in a software package, the tools it provides, the processes it uses to accomplish tasks, and its embedded work flows results in a certain ideology underlying the software (the software authors may have been entirely unaware of the underlying idedology). This manifests in the idea that one tool is better than another tool for a certain outcome, (but every tool also has unintended consequences that are difficult to understand until a clear alternative has become popular).

So the example Manovich uses is, if you look at some of the architecture that was made over the last 20 years. Some of the more prominent practitioners adopted similar elements which had little historical precedence. Two examples Manovich uses are Zara Hadid and Frank Gehry, both use few right angles and lots of sweeping, rounded forms.

Manovich goes on to say that if you asked these architects why they created theses structures, the will frequently quote Derrida and other Post-modern, Deconstructionist theories. At the same time, software packages that were created for animation were adapted for architecture, and when combined with civil engineering structural simulations, architects were all of a sudden able to create structures and forms that previously would have been near impossible. Manovich doesn’t say that Deconstructionist theory had nothing to do with this, but rather it was the tools the architects used that were producing a certain kind of thought were some shapes, forms and spaces were privileged over others. It was difficult to reveal that software packages had a biased preference towards certain spaces that most considered appropriate and good, until something so different came along that questioned the ideology built into the software tools. In this case, it was that spaces that didn’t conform to a more rectilinear can be appropriate under certain conditions.

There are a few other examples, mostly pedagogical in how the tools we use affect our thinking (in what is considered good and bad design) and our processes for creating design. I hate to take up so much space here so I’ll stop now. I just think it is so important to understand how our tools affect our thinking, and the outcomes that they privilege so our design decisions aren’t based upon something arbitrary but rather on what we as designers believe is best for a particular audience and context relationship.

We have to be aware that we don’t become over-reliant on these tools and they end-up becoming barriers to that goal.

One can say that the tools you use influence and limit your design. But I say that the tools you use are part of the design. For example, if I were to create an oil painting, I would use a pallet, brushes, and oils — and the influence of those tools would be expected in the final product. The visible brush strokes, the relief and texture of the painting, and translucent nature of the oils are part of the medium AND those features are expected. So, why look at digital creations any different?

I find the closer you get to the medium, the more honest the result. Keep in mind that we have an ever changing and functional medium that has no counterpart in the real world, so don’t hold it back by applying real-world tools. Look to coding as your brush, monitors as your canvas and functionality as your purpose.

Happy coding,

tedd

“I’m not sold on the idea that designers should do their own HTML/CSS (even though I do it myself), but having some knowledge of what’s possible with it is vital.”

I don’t think as a rule they always have to but they should be able to in a pinch. In the same vein of “know the rules before you break the rules”… I’ve got no issue with designers pushing the limits but they have to know what limits they are pushing. I’ve had enough designs dumped in my lap that suddenly become my nightmare to convert to HTML that I just don’t tolerate it anymore.

These days, IMHO, If you don’t know Intermediate-level HTML/CSS you’re a print designer, not a web designer.

I whole-heartedly agree with the sentiment that web designers should know how HTML/CSS works. Not that they can actually code complex designs – but at least have an understanding of how code (and the CMSes) they are designing for works. Or else their beautiful designs will not be well translated by the limitations that can be present with these tools.

Personally I think it’s easier to have a graphical mockup to code from, instead of coding first and designing secondary (unless it’s really flexible wireframing code). When I first learned to code I did all the CSS and HTML first and I look back and realize how hard it made things (and my crappy coding didn’t help!). Now I start with sketches, flesh it out in Photoshop and then break it all down to code.

“And I’m glad Jason and David wrote something that got me interested enough to write again myself.”

This sentence caught me in tears. Well, almost. Can I just simply thank 37s for getting Doug roll?

This response wasn’t intended as criticism of 37signals or any certain design style. Jason’s post was well-written and simply very thought-provoking for me. If anything, David’s post title was a little beyond what I would have written. But David and I are different people with different views. That’s cool. I still basically agree with most of what David wrote too. Other than that, I find the different perspectives and approaches interesting to see documented. And I’m glad Jason and David wrote something that got me interested enough to write again myself.

I’m not sold on the idea that designers should do their own HTML/CSS (even though I do it myself), but having some knowledge of what’s possible with it is vital.