Journal

Design isn’t about tools

  • Posted on: June 05, 2008
  • In: Design
  • Comments closed

The other day, 37Signals wrote about Why they skip Photoshop. Fine. I think that suits them and their workflow, considering they don’t do client work and have an established UI style on which to draw. Jeff does a much better job of summarising my thoughts on the subject that I could. As does Jon

So, yesterday, we see this post on SVN, presumably as a follow up. Is it an inflammatory post? Or, do they have a point?

Horses for courses

As Jeff pointed out, and many of the commenters on the first post, choosing to use Photoshop is really a workflow thing. If you find it doesn’t suit your workflow, and you have an established UI then feel free to ditch it. When I worked at the BBC, I did that for a while as well. It works very well for a lot of the modular, micro-design tasks needed within a design that is already agreed. However, when a new design was required, I often needed Photoshop to give me the holistic design view. As Jon points out in his post, it’s much quicker to do that in an image editor, than using HTML/CSS.

Now matter how hard I tried, HTML and CSS could not give me that overview that Photoshop could. The subtle interplay of typography, colour, texture and whitespace is difficult to evaluate with HTML when you throw browser quirks in the mix.

Do print designers need to know how to build a press?

I think David’s post on SVN holds true to some degree. Yes, if you’re designing for the web you need to know the tools of your craft. But that’s the thing, Design is not about tools. Photoshop is a tool, as are HTML and CSS. Design is about solving problems, not about software. Some people choose to do that with Photoshop, and some with HTML and CSS. Neither route is the correct way of doing it and it’s a mistake to presume it is.

You can also argue that knowing how to build things in HTML/CSS limits your creativity. You work within your own boundries. If you’ve always had a sticking point with flexible layouts, then chances are, if you have to build the thing, you’re preference would be to avoid them. This is one of the disadvantages of knowing your way around HTML/CSS as a designer - it’s hard to break free of those constraints.

Tools, tools, tools

I’ve always liked to abstract my design process from the tools I use. Photoshop, Fireworks, HTML/CSS, Pen and paper, HTML Wireframes using Blueprint, Omnigraffle—It doesn’t really matter. You use what’s best for your workflow at the time. These are all tools in the same way that a pencil is a tool.

They are implements to realise a solution to a problem.

You say tomato and I say toe-may-toe.

Comments

So well said, Mark.

I take real exception to one thing in particular that David says: “Designers who work directly with the materials rather than through simulated environments like Photoshop are at a distinct advantage for making that happen.” Ok, I do actually agree with what he’s saying - and I am one of those designers whose knowledge of Photoshop is equally matched by my knowledge of XHTML / CSS - but “simulated environments” has something of a derogatory nature about it. Sure, Photoshop is not as ‘real’ as XHTML / CSS, but likewise XHTML / CSS is often creatively restricting, as you, Jeff, and Jon all rightly put.

I also strongly disagree with David that “the graphical prowess of a completely blank canvas” is a “niche”. Maybe for 37signals; not for the rest of the world.

Elliot Jay Stocks's Gravatar

Elliot Jay Stocks
Fri 6th Jun 2008
at 4:01 am

That’s the best comment yet on the subject, Mark! It is all about choosing the right tool or method for you to do the particular job in hand, and, as several people have pointed out ‘web design’ is too broad a church to prescribe one method or tool for every project. Much as I admire SVN’s products, I think theirs is a narrow stream in the broad river of web design. Variety is the spice of life (and web design).

Peter

Peter Holloway's Gravatar

Peter Holloway
Fri 6th Jun 2008
at 4:08 am

Definitely horses for courses.

I used to work from paper-based designs and then start with the html/css but it was a sod to change anything because the markup had to be spot-on otherwise it looked crap.

Designing in photoshop/fireworks is far better for me. I feel more creative and less constrained.

Tom's Gravatar

Tom
Fri 6th Jun 2008
at 5:07 am

About the headline “Do print designers need to know how to build a press?”: I think it would be better to say: Do print designers need to do their own prints. This like saying: Should a web designer build his own browser (or even computer).

I don’t believe you can design successfully for the web if you don’t know HTML and CSS. However, web design is composed of so many disciplines some of the design parts can be done by someone without an intimate knowledge.

Wolf's Gravatar

Wolf
Fri 6th Jun 2008
at 5:15 am

You say what I was subconsciously thinking, yet couldn’t elaborate on. Very well put.

David Airey's Gravatar

David Airey
Fri 6th Jun 2008
at 5:29 am

Here’s the base of their argument on designers and HTML/CSS:

I’ve worked with many web designers in the past who only did abstractions and then handed over pictures to be chopped and implemented by “HTML monkeys”. It never really gelled well. The things that got strong attention were all the things that Photoshop did well. Imagery, curvy lines, and the frame. All the around stuff, never the it stuff.

That’s why all the designers at 37signals work directly with HTML and CSS…

He’s making a case for good web design instead of doing poor graphic design and trying to port it to the web.  For some reason, they seem to confuse that with designers needing to markup HTML/CSS.  It’s ok if they want to run their shop that way, but it isn’t a necessary implication.  You just need a talented web designer, and who cares who does the code from there?

For the record, I do markup my own HTML/CSS, so I’m not arguing against it in any way.  :-)

Nathan Rutman's Gravatar

Nathan Rutman
Fri 6th Jun 2008
at 5:45 am

I agree with you and with Jeff Croft, but at the same time I agree with Jason Fried and Jon Hicks. Photoshop, Fireworks, HTML/CSS: they are all tools. And a web-designer must (should) know how to use them. But maybe what makes a good web-designer is knowing how to use all of them. Mastering floats and divs does’t mean how to build a press, but how the press works.

Cristiano Rastelli's Gravatar

Cristiano Rastelli
Fri 6th Jun 2008
at 6:19 am

I totally agree with point on creativity.  Designers should know how HTML/CSS works, but I find that those that do, are often holding themselves back in terms of the designs they create.

“This will be too hard to code in HTML/CSS” is something that I say often but not something that a designer should be thinking when working on page. 

Yes, the designer should know what is possible and what isn’t, but we’re working in a digital world and what is and is not possible changes every day. 

If the designer cannot keep up with with is and what is not possible they shouldn’t be shackled by it either.

Mubashar Iqbal's Gravatar

Mubashar Iqbal
Fri 6th Jun 2008
at 7:12 am

This post and the article that is referenced really challenged my thinking on this issue.  I agree on a lot of the reasons stated for how working directly in HTML/CSS can save a lot of time and give a “real time” ability to see changes, updates, etc.  I myself consistently find designers talking about how it really is the way to go.  But I also take to the side that this post has stated that the best thing to do is to use the tools that enable you to be the best designer for you, whatever those may be.  I don’t think you should limit your creativity in any way as well.  I think there can be a combination use of both approaches.  Again, the important thing is to utilize a process that best reflects your design quality.

http://www.ethos3.com

Heather's Gravatar

Heather
Fri 6th Jun 2008
at 7:55 am

I agree with you on the aspect of Photoshop being a workflow issue.  You have to do what works for you best.  I’ve done both approaches in the past and the best path for me has been pencil sketch, photoshop, html/css.

I think there is a logical point in the mockup process where you need to jump into HTML/CSS.  I’ve noticed a lot of design centric organizations do not do this.  For instance once you start implementing mockups for interactions that require several steps - it becomes harder to portray and more time consuming to do in photoshop.  But yes skipping photoshop or some design package for creating 90% of the initial UI is not effective for most of my work.

Now, relating to your thought’s on David’s approach.  I am very aligned to David’s point of view as opposed to your own.  I think that CSS is the web designer’s ink, the html their canvas.  Without knowledge of these tools I don’t see how you can be an effective designer.  I learned this the hard way.  After my designs wouldn’t look the way I wanted them to - I had to learn how to do the implementation myself.  This is often a more rewarding experience than designing the site in a graphics program but the mindset is not quite the same once you reach this point in the process.

Jim Jeffers's Gravatar

Jim Jeffers
Fri 6th Jun 2008
at 10:32 am

Design just needs an open mind with a creative brain. This is the real competence someone gets credit for.
But without the knowledge of powerfull tools it is just like a great idea. In my opinion every tool is powerfull, when You know how to use it. Okay, Paint…

Robert's Gravatar

Robert
Fri 6th Jun 2008
at 5:07 pm

I’m new to the web design business and found this post and all the links in it very useful. I hadn’t considered that some people might be opposed to use photoshop in the design process.

I am actually still discovering my workflow and recently built my first site using photoshop/css/xhtml by myself. It was definitely a learning experience.

Sean's Gravatar

Sean
Fri 6th Jun 2008
at 8:08 pm

I used to work from paper-based designs and then start with the html/css but it was a sod to change anything because the markup had to be spot-on otherwise it looked crap.

Toronto Lofts's Gravatar

Toronto Lofts
Sun 8th Jun 2008
at 1:01 am

I’m a journalism lecturer ands this is a helpful debate. Isn’t it leading to the only valid model: go with what works until it doesn’t?
I encourage my students to use whatever tools they are familiar with (pencil and paper, Word, Quark, Photoshop anything) to mock up a design, and then try and make that design work for the web. This means they can start work on the design more or less as soon as they’ve decided on content, audience, etc.
The results are fascinating. Some will go through hell and high water to get exactly what they want; some accept the limitations of the tools, and of their knowledge and compromise on their original design. Either way, of course, is OK if the final result is OK.
(Jim Jeffers is quite right, incidentally, in saying that “there is a logical point in the mockup process where you need to jump into HTML/CSS”. What is interesting is seeing when different groups of students arrive at that point.)

Bernie Russell's Gravatar

Bernie Russell
Mon 9th Jun 2008
at 11:07 am

As someone with a print background, now working within a corporate web team, I have found the mockup to be an indispensable asset. It is absolutely impossible to communicate creative ideas to large groups of stakeholders without following the wireframe, graphical mockup, html template workflow.

Much like creating an editorial layout for print, using InDesign to first build wireframes serves as a scalable back bone for the project. Building out graphical and photographic elements in Photoshop and Illustrator also serves the dual role of putting in place the final application’s image library. Multiple pages/interactions can be quickly created, once styles are setup in InDesign.

Having a chance to set up styles in advance of actual css has another advantage. It leads you to potential problems in your hierarchy before they are committed to code. I have also found that I tend to writecleaner html/css when I have had a chance to think about their markup in advance.

However, if I were charged with the task of knocking out a quick template in a couple hours, I would go the direct css/xhtml route.

Overall, I think the folks over at 37 Signals, and pragmatic developers in general, are more interested in an iterative approach to development. Creating mockups just goes against their DRY principles.

Tim's Gravatar

Tim
Mon 9th Jun 2008
at 2:53 pm

"Tools” aren’t (just) about tools

Alex's Gravatar

Alex
Tue 10th Jun 2008
at 1:50 am

Interesting post (yet again Mark).  However here is my take as a developer with a keen interest in usability and good design.

“Knowledge of ‘HTML/CSS limits your creativity” Yes there are constraints with the web but they are only the equivalent of the constraints you see with all design mediums.  For example the size of a printed page, A sheet of paper is only two dimensional, the affect gravity will have on a building, etc.  As with all art and design it is the constraints that define it.  It is the handling of these constraints that produces the quality.

I would say that an in-depth understanding of HTML/CSS and not least scripting allows you to be MORE creative.  To pick one of many examples; the knowledge of the use of remote scripting (or AJAX if you’re trendy) to create truly fluid and dynamic content is having a profound affect on web design and a Photoshop screenshot is not going to cut the mustard in trying to convey what is possible in this medium.

Chris Jensen's Gravatar

Chris Jensen
Tue 10th Jun 2008
at 6:22 am

Yes Chris, couldn’t agree more. The development team I work with uses the .EXT JS library. We have created many mockups of modal windows etc. However, it is just not possible to begin to convey the richness of most effects with a mockup.

This whole conversation reminds me of the old musician’s argument where they say “the greats never learned to read sheet music”. I have played with musicians that don’t read and written web apps with a designer that didn’t know the web. Each time I felt constrained.

Tim's Gravatar

Tim
Tue 10th Jun 2008
at 9:29 am

I have twice been rejected from web design jobs for being too much of a designer, when all they were looking for was a code monkey. For me, the term web designer implies a synergy between the technical and the artistic. I find a lot of print designers don’t “get me” as a result of this dichotomy. But the technical facet is inexorably linked to the design component and vice versa.

It’s silly, to me, to try to divide up the tasks by putting them on either side of some imaginary fence, and that’s why I won’t work in an environment where I’m not responsible for everything visual. I’m not saying I wouldn’t respect the work of someone who builds great web designs solely in Photoshop, or is a whiz at CSS coding, but can’t work their way around choosing the appropriate fonts, colors, etc. I am saying I have more respect for someone who isn’t a one-trick pony…

Tom's Gravatar

Tom
Wed 11th Jun 2008
at 12:00 pm

@Chris Jensen: Agreed. I think constraints within a medium are really important - how else do you be creative?

To pick one of many examples; the knowledge of the use of remote scripting (or AJAX if you’re trendy) to create truly fluid and dynamic content is having a profound affect on web design and a Photoshop screenshot is not going to cut the mustard in trying to convey what is possible in this medium.

Agreed. In this instance, I’d use another tool to communicate those interactions: HTML prototypes for example, or a PDF generated from Omnigraffle. However, it’s questionable if you can create a holistic design view using just one tool alone. At some point in the process, Photoshop, or a similar image editor, is going to make an appearance.

@Tim: Agreed. A designer working on the web has to know the medium. But that is not the same as knowing how to writeHTML or CSS at all. A designer can be very aware of the medium, and designing for it, without knowing how to handcode in either markup language.

Mark Boulton's Gravatar

Mark Boulton
Wed 11th Jun 2008
at 2:13 pm

It should be the opposite if you ask me. If you know how CSS/html works all the more reason why you can design in photoshop surely- knowing what is possible and not possible as you go. That is certainly how it works for me.

But to ‘design’ and visualize using the tools of production makes no sense to me, unless you don’t have to show a client the iterations and work, and it is just your own project, and the design is quite basic. Most typeface choices, patterns, textures, images etc., can only really be visualized quickly in the likes of photoshop, no matter how fast you are at coding. Either way you still have to use photoshop to create the images. And if a grid is important to you you can shift around underlying structural design choices easier in photoshop in my opinion.

Sounds to me like it’s just a case of developers (programmers) seeking to exclude designers from the web dev process for no other reason that some kind of nerdish showmanship.

dave's Gravatar

dave
Thu 12th Jun 2008
at 4:33 am

This post that is referenced really challenged my thinking on this issue.  I agree on a lot of the reasons stated for how working directly in HTML/CSS can save a lot of time and give a “real time” ability to see changes, updates, etc.

yarn's Gravatar

yarn
Thu 12th Jun 2008
at 6:28 am

Does anyone think that 37 Signals is just drumming up traffic to their blog? It seems like they’re the popular hot chick in high school that talks badly about the poor kids. Except, I doubt they have a nice rack.

James's Gravatar

James
Thu 12th Jun 2008
at 3:58 pm

It’s nice to see other designers stand up to SVN and point out what are the important issues when it comes to designing anything, be it for web or print. All designers should know the medium they create for, and be aware of the limitations that the medium presents.

inspirationbit's Gravatar

inspirationbit
Fri 13th Jun 2008
at 11:00 am

I love the guys at 37 Signals. No truly I do. But like the Lakers last night vs the Celtics after being so far ahead, they started to believe the hubris and are drinking their own Kool-Aid. There are coders that can design, and designers that can code. There are architects like Zaha Hadid and Frank Gehry that know how exactly their designs will be built. Does that mean they have to go out and build the darn thing?!?!?!!? I don’t think so!

The crew at 37 Signals are probably the best “masterbuilders” of our era but I do not believe it is always necessary for the designer to have to build/code. Photoshop, in their article, I believe is being a bit over-maligned as some sort of hocus-pocus concept builder that does nothing but present no ends of problems to the “engineers on site”. After graduating from the hallowed halls of architecture, this much I know. There have always been conflicts between the draughtsman and the builder, the architect and the engineer and now the designer and the coder, this has led to the merging of functions in web development. This is what 37 Signals has and it has served them incredibly well. But UI design, site architecture and all the rest is as important as the pixel perfect crafting of a design in Photoshop. This kind of argument leads to seeing the use of Photoshop or the other aspects of design as mere...decoration. The fluff after the heavy lifting has been done.

This ticks me off a bit.

Design, UI development and coding MUST go hand in hand from the get go. Beauty exists in code but it is not design!

For me coding is a high craft but my dear friends..it is not design. Design is more than aesthetics just as how code is more than integers and letters on a screen. Design is meaning. Meaning, believe it or not adds value. It heightens the experience (ever picked up an iPhone?) Also, design is more than meaning, it is the expression of the “one-ness” of a that which is created. There is no “fusion” of form and function. BULL!

They are the same.

Form is function and function is form.

When you listen to how Jonathan Ive describes in such succinct prose the creation of the iPhone or iPod from a manufacturing point of view then weaves in the user experience then how the whole is expressed with such eloquence in the resulting form you begin to understand just how design works.

There has always been a backlash from hard core coders that can design against all things WYSIWYG. In some regards it is deserved because there are many Photoshop jockeys that don’t understand how a site concocted in Photoshop will be built but on the other hand don’t whip the tool because the master abuses it. All tools have their place. TextEdit, CSS Editor BBEdit , Photoshop even the “lowly” iWeb - all have a place depending on the production workflow needed to get a specific site done. We as designers, developers and everyone in between just need to know how best and when to use them as needs be. THAT is what makes us professionals. Time to quit my rambling. Now...lets get back to work.

Yorkali Walters's Gravatar

Yorkali Walters
Fri 13th Jun 2008
at 1:18 pm

A very interesting point of view. Itis true that many designers get restricted by the tools they use, and as they are creatures of habit they are unable to go beyond such limitations. Luckily I’m rather flexible and often shift between Photoshop, HTML/CSS and other tools to achieve the best workflow and result. In some cases I even start a project with a simple sheet of paper and a pencil, as it isn’t very restrictive, and then I go for a tool that seems to suit me best in this particular job.

Ben Dawkins's Gravatar

Ben Dawkins
Sat 14th Jun 2008
at 7:09 am

I agree with 37 signals (although I should prefix that with ‘I have no real large-project experience, education in the subject etc. etc.’)

I don’t understand why web designers would know how to use photoshop before knowing how to HTML and CSS: it’s not as if they’re difficult technologies, and web pages are HTML documents rather than images.  Is it because designers are coming from a print background and then trying to apply these skills to the web, rather than accepting it’s a different media which requires different skills and a stricter set of rules to follow?

Leon P's Gravatar

Leon P
Sat 14th Jun 2008
at 11:20 pm

In response to Leon’s comment: Layout is layout, the principles that governs the layout of a site’s design can be executed with pencil and paper, HTML/CSS, Photoshop, etc, ect, etc. Some print designers as they transition to web design of course are more comfortable with a tool that many have been using for quite a long time so you can see why these PSD slice and dice sites online are so popular. Let’s remember the theme of the blog post we are commenting on...tools.

Tools are like art media. Charcoal, guach, water paint, oils. There are certain works of art that can only be expressed in one media or the other. There are others where the media does not matter. Web development is somewhat like that. No matter the site Photoshop can be used for it’s layout BUT it can’t code the site. HTML/CSS can code almost any site but it’s not probably the best tool to design/lay out a site.

Design isn’t about tools, neither is development. I stand by that.

Yorkali Walters's Gravatar

Yorkali Walters
Sun 15th Jun 2008
at 6:10 am

One more thing. Jacob Cass put it suucintly on a recent post on his site:

--"Want to know how to design? Then you should learn the basics of design. The basic elements of design include colour, line, shape, scale, space, texture and value and these are the fundamental pieces that make up any piece of work. If you ever start a design course this will be the very first thing that you are taught, guaranteed."---

Photoshop cannot teach that, HTML or CSS cannot teach these base principles. The tool only executes the design within the boundaries of the aforementioned elements. There are many sites as we all know whose “designers” have no idea how these elements work much less how they work together. This is what we should be berating. NOT the usefulness or lack thereof of the tool used to create it.

Yorkali Walters's Gravatar

Yorkali Walters
Sun 15th Jun 2008
at 10:42 am

How on earth can html / css be *creatively restricting* per comment #1? Those are not restrictions. Those are the constraints and the reality of the medium. A web site only needs two files: index.php and style.css. Both are written in text. Did I mention photoshop anywhere?

Root's Gravatar

Root
Sun 15th Jun 2008
at 11:02 am

You see Root therein lies the rub. Of course a website only needs two files. But what are you expressing, selling, communicating. Not all sites can get by on just two files.

Yorkali Walters's Gravatar

Yorkali Walters
Sun 15th Jun 2008
at 1:39 pm

It doesn’t matter how many files there are. They are all text. Except the content which might in some instances be digital. You will be telling us next that you block out your photoshop loveliness with latin text. For heavens sake.

Root's Gravatar

Root
Sun 15th Jun 2008
at 9:16 pm

Root,
What about the image files?

Yorkali Walters's Gravatar

Yorkali Walters
Sun 15th Jun 2008
at 9:54 pm

Interestingly enough there has just been an article at alistapart proposing moving straight to what they call prototypes ie working coded models. I have been doing it for years. Like Malarkey if I need an image I do a screenshot. LOL. Using a style switcher I can present half a dozen variations at a client presentation in moments. Still graphics simply do not capture the power of CSS and nor can they be used to illustrate interactivity.

Root's Gravatar

Root
Tue 17th Jun 2008
at 11:00 am

Maybe we should clarify the function of graphics at the different stages of the developmental cycle. Usually that first sketch or the first stack of lines of code to flesh out an idea are crucial. But Different people think and develop their ideas in distinctly different ways. For me sometimes I sketch, other times I go straight to screen. For most people more adept at coding and not so much sketching they will of course jump in to that to flesh out a spark of an idea. We are all as different as the tools we use. The bottom line is as always getting it done...right for that specific project, for that specific client. And getting it done on time.

Yorkali's Gravatar

Yorkali
Tue 17th Jun 2008
at 11:51 am

Well hopefully the days of a young buck straight out of college handing his photoshop mess to highly experienced coders with the words *thats my design that is the way I want it * are drawing to a close but I doubt it.

Root's Gravatar

Root
Tue 17th Jun 2008
at 12:34 pm

You got that right!

Yorkali's Gravatar

Yorkali
Tue 17th Jun 2008
at 12:36 pm

You can also argue that knowing how to build things in HTML/CSS limits your creativity. If you’ve always had a sticking point with flexible layouts, then chances are, if you have to build the thing, you’re preference would be to avoid them.

And going to Photoshop first avoids this problem how?

The straw man in this argument is obvious.  A designer that can’t build flexible layouts is not a designer that knows how to build in HTML/CSS.

Brad's Gravatar

Brad
Tue 17th Jun 2008
at 3:29 pm

And even if our photoshop genius can understand flexible layouts how can he draw / paint them ? It can’t be done.
A complete failure to understand width, height and scale at different screen resolutions/platforms is endemic in graphic designers on the web. The comments about trying *different fonts quickly* in PS is farcical.

Root's Gravatar

Root
Tue 17th Jun 2008
at 9:37 pm

I think it can be argued that work flow patterns can vary from project to project. Where one project may require using Photoshop for quickly fleshing out a spark of an idea there are other times when a significant part of production time involves lottsa face time with psd files. As I said before, yes there are Photoshop jockies that only know how to push pixels and have no idea how the site will be built. Regardless, don’t beat the tool for the shortcomings of the pixel-pusher.

Yorkali's Gravatar

Yorkali
Tue 17th Jun 2008
at 10:56 pm

one project may require using Photoshop for quickly fleshing out a spark of an idea

Is this how people think about designing web sites?  Surely decisions about information structure should be made first. ‘How do I organise the information I wish to convey to my readers?’ should come before ‘I want to use brown text on a black background and three columns, one of which has a background image of the Empire State Building’.

Let’s say the information structure has been decided on and the designer moves on to thinking about how this will be presented.  I still don’t understand why you’d use PS at this stage: why not HTML and CSS the design?

Leon P's Gravatar

Leon P
Wed 18th Jun 2008
at 1:09 am

Okay, it’s time to speak for myself...alone. In response to Leon’s comment. Site structure and page structure design are of course crucial steps in any project. But every site’s workflow is not the same. For some developers that focus on just certain types of sites the workflow becomes quite the same. Others just stick to what is comfortable for them regardless of the workflow. Let’s remember what the post is about.

Design is not about tools.

Site architecture, page structure, form, line, rhythm, harmony, balance, AJAX, conversions, etc. There is more to this than tools, there is efficient workflow. Whatever it takes to get the job done...right.

Yorkali's Gravatar

Yorkali
Wed 18th Jun 2008
at 6:08 am

But that is the issue. Photoshop and other software of similar ilk does not *get the job done*. Or even contribute to it. If you need to writetext, and apply markup and CSS what use is a graphics application apart from the inline graphics for the CSS?  Please do not answer. It is no use at all. In our agency the amount of money that is wasted in man hours on this type of nonsense is dreadful. And the *print* off our dodgy printer is the favourite ploy of these guys before *meetings*. Jeez.

Root's Gravatar

Root
Wed 18th Jun 2008
at 7:57 am

@root: As much as I’m enjoying this lively debate with @Yorkali, I feel you are missing the point of the original post. It also sounds like your having a dreadful time with some bad designers. Can I suggest you hire some good ones?

It is my opinion that, in my own practice, nothing else but Photoshop *gets the job done*. It is painfully obvious that this is not the case for you, which is fine. This post was to make a point that design is not about tools. Yet your argument seems to be all about tools.

If you need to writetext, and apply markup and CSS what use is a graphics application apart from the inline graphics for the CSS?

Again, can I refer you to the original post.

Now matter how hard I tried, HTML and CSS could not give me that overview that Photoshop could. The subtle interplay of typography, colour, texture and whitespace is difficult to evaluate with HTML when you throw browser quirks in the mix.

Designing for the web is not just about lines of code, or the software you use to realise your solutions. It may be for some, but not for all of us.

If only my view of the web was as black and white.

Mark Boulton's Gravatar

Mark Boulton
Wed 18th Jun 2008
at 8:11 am

Hey Root, loving this debate too. Part of the reason I was on the tools bit is to somewhat get it out of the way so we could focus on the design. Lotta good that did :) Anyway, my secret is. I love Photoshop, it is the core of my design work flow no matter what media I am in. But here I go again on the tools focus :)

Yorkali's Gravatar

Yorkali
Wed 18th Jun 2008
at 8:23 am

OK Mark fair comment. But for my 2c there is no point in approving any type of design without *throwing in the browser quirks*. It is the browser quirks and the variations in the user agents which distinguish us as web designers. Any way I dont need to tell you this. I love your work. I am now back on my best behavior.
I am just in the process of embedding a 400k flash graphic header into a site. Oh. There are 5 of them.
On one page. And I am a standards developer. Never mind new designers. I need a new job. LOL.

Root's Gravatar

Root
Wed 18th Jun 2008
at 8:38 am

people who skip photoshop either are real hitech or dont know anything about design. i cant think of doing any design or graphics editing without photoshop

website design's Gravatar

website design
Wed 18th Jun 2008
at 10:47 am

People who skip PS are not *hi tech*. They are web developers.

Root's Gravatar

Root
Wed 18th Jun 2008
at 12:48 pm

Hey guys, it’s not about the toooools :)

Yorkali's Gravatar

Yorkali
Wed 18th Jun 2008
at 12:54 pm

Two thirds of the guys in this thread do not seem to understand Gravatars. LOL.

Root's Gravatar

Root
Wed 18th Jun 2008
at 12:58 pm

It’s very important for a web designer to know how ‘it works’ (CSS, XHTML) in order to be able to design for the web, regardless of the method they use. Those who don’t know are called graphic designers.

Evan Skuthorpe's Gravatar

Evan Skuthorpe
Thu 19th Jun 2008
at 8:47 am

Hear hear!

Although it’s important for designers to understand websites, they don’t have to make working prototypes in favour of actually getting creative.

The only reason I can think of for using the tools is in situations where you can’t mock-up things as effectively as you’d like - say, if you’re planning an snazzy AJAX or javascriptpopup / tool.

James's Gravatar

James
Fri 20th Jun 2008
at 7:04 am

Well said James!

Yorkali's Gravatar

Yorkali
Fri 20th Jun 2008
at 7:33 am

I am slowly getting to grips with Photoshop for our site. I don’t see how anyone could get results without it or a similar package. To design, I think you need a lot of time and constant visuals. Switching between your editor and a browser does not give this.

Celina Buy's Gravatar

Celina Buy
Fri 20th Jun 2008
at 6:08 pm

That is the point Celina. There is no such thing as *design* for a web site. It is all content, markup, CSS and scripts. ie text. Not to mention php and RoR or AJAX. Consequently to produce such a thing you need a text editor. And a proper CSS stylist who understands browsers, standards, accessibility, usability and a lot of other stuff. But he is going to be writing CSS. Not futzing about producing one dimensional pretty pictures which are functionally useless. What no one in this thread has mentioned is semantic markup. And where designers reign, semantic markup is the first casualty invariably. And when the semantic markup is compromised everything else starts to fall apart. The whole planet is saturated with print *designers* masquerading as web developers. And that is why most of the web sucks and it is also why the largest and richest corporation in software consistently produces the crappiest browsers.
And please do not get me started on *sliced* images.

Root's Gravatar

Root
Sat 21st Jun 2008
at 12:23 am

Root,
I could not disagree with you more. It is apparent that you and I are locked into a certain modality of thinking that I think will not break anytime soon. After ALL the points for and against that were made above this is quite apparent.

When anyone who develops sites say “there is no such thing as *design* for a website I am convinced there is no convincing you.

Yorkali's Gravatar

Yorkali
Sat 21st Jun 2008
at 6:14 am

What I meant - and I may not have expressed it well - is that the only way design can be implemented in a web site is in the CSS. So it seems a good place to start. I prefer to use the proper term which is style. Site styles or themes/skins are interchangeable. And they need to be applied to one or more pages of content. That content may be in one or more templates or layouts. And those layouts may also change or develop over time to reflect growing/evolving or additional content.

And that content is driven by the need to engage/inform the user community in a way that is appropriate to the site and is structured by the info and seo architects and written by the hypertext copywriters. Er did I mention photoshop yet?

You are quite right. You will never convince me to go ass backwards again. I did it once on a corporate build at the client’s demand nearly 10 years ago. Never again.

You have only got to look at a blog platform like WordPress to see what I mean. Or visit the Zen Garden.

Root's Gravatar

Root
Sat 21st Jun 2008
at 9:52 am

Really well said James!

Michael Web's Gravatar

Michael Web
Sat 21st Jun 2008
at 8:37 pm

I am also slowly getting to grips with Photoshop for my site. I don’t see how anyone could get results without it or a similar package. I agree to you.

Alejandra Seo's Gravatar

Alejandra Seo
Sat 21st Jun 2008
at 8:40 pm

I’m still learning photoshop, and I’m not sure whether I’ll ever be able to say that I know it well.

Magda's Gravatar

Magda
Sun 22nd Jun 2008
at 7:36 am

Root - you say the only way to impliment the design is to use CSS.  That’s fine, but it doesn’t mean you have to start there.

There’s a whole design process that should take place before you even think about jumping into the CSS.

How do you think sites like Web Designer Wall or the shiny ‘Web 2.0’ stuff came about?  That’s all Photoshop’s influence.

James's Gravatar

James
Mon 23rd Jun 2008
at 2:38 am

very well said James, very well said.

To add to that. I think alot of developers/coders/designers including me at times, make the mistake of using the production tool (Photoshop,CSS,XHTML,etc) as the main, if not, the only place where the concept is visualized.

This leads to a lot of wasted cycles in the design process. I think we should focus more on sketching with simple paper and pencil BEFORE we sat in front of the computer, or before we run to the myriad of web inspiration sites.

Seriously thinking through what we want to communicate/sell for ourselves or our clients using trusty “analog” paper would greatly reduce the time we spent futzing with our mice. I don’t know, just a thought.

Yorkali's Gravatar

Yorkali
Mon 23rd Jun 2008
at 7:31 am

I read the original post/article with some disinterest…
If you aren’t using Photoshop or a vector design program you are a UI designer rather than a graphic or web layout designer.
It’s comparing apples techniques to oranges techniques I think.
Just hack it out with a typewriter maybe, that’s as primitive as a lead #2. :)

Ty's Gravatar

Ty
Mon 23rd Jun 2008
at 1:08 pm

Root’s comment that CSS is the only way to implement design is, of course, true… just as the only way to implement the construction of a building is via bricks, mortar, and other such materials. But I think that it misses the point that before the builders arrive on-site they expect to know what they are supposed to be building. They need to have the architect’s drawings to refer to. Similarly, before I start typing out css I like to know what it is I’m aiming for. I want to have a design in mind, and that means that I have already done a good deal of design work before the CSS is applied. CSS is not a design tool.

(Ah, the ‘T’ word again)

Information architecture, for me, normally begins as a series of lists in a sketchbook, before moving to something like Omni Outliner; wireframes start the same way (sketchbook), generally progressing to something like Omni Graffle. All this is design work; it’s not graphic design, certainly, but it’s vital preparatory design. By the time I get to the xhtml that prep work means that I have the site’s IA skeleton firmly in mind and the code will better for it. It also means that when I step into photoshop I’ll be fully aware of what jobs those graphics should be doing.

My point (and I’m starting to ramble a bit, so I’ll shut up in a sec) is that design for the web comes in many forms, even within a single project. IA is one form of design. Graphics is another. These are skills that come from different directions but meet and need to complement each other.*

I see IA/wireframing as the prep work for (x)html, and graphics work as the prep work for CSS. Each provides an invaluable blueprint for the next stage. Yes, you can probably save yourself some time by skipping some of the design work before you jump into implementation, but I think that it will come at the expense of something... probably either information clarity or visual elegance.

*I’d certainly argue that the former is more important than the later—but the latter, if done well, can sometimes help overcome the failings of the former).

Rick's Gravatar

Rick
Tue 24th Jun 2008
at 4:38 am

Rick,
that was p r i c e l e s s....thank you. It could not have been better said.

Yorkali's Gravatar

Yorkali
Tue 24th Jun 2008
at 5:20 am

One more thing....a former commenter was distilling web design, as I understand it,

Content with Style applied.

“I prefer to use the proper term which is style. Site styles or themes/skins are interchangeable. And they need to be applied to one or more pages of content. That content may be in one or more templates or layouts. And those layouts may also change or develop over time to reflect growing/evolving or additional content.”
Then today I saw this job posting from 37signals soliciting job applications for a new role created on their team. Please read below:

We’re looking for a special designer who wants to come in and change our game. We’re looking to be reinvented visually.

The job would include completely redesigning our public facing marketing sites and being in charge of constantly evolving that public image. Help us better communicate the benefits of
our products. Think simple, but also think visual beauty. More imagery, more graphical, less plain text.

In many ways this is a creative/art director role, but also a “you’ll do the work too” role. So whatever you dream up you’ll also be designing and executing. It’s a high profile position for us with lots of influence across our company and the industry.

More imagery, more graphical, less plain text.

love that :)

Yorkali's Gravatar

Yorkali
Tue 24th Jun 2008
at 7:53 am

LOL. You can bet the farm that the new 37 signals designer is going to have to work within the framework of semantic markup. Eg he is going to be styling content. And photoshop jockeys obviously need not apply.

Root's Gravatar

Root
Tue 24th Jun 2008
at 8:58 am

Hm. Agree that there is no Messiah-tool, but aren’t we really talking about design, not graphic design as in limiting creativity?

A web page has a purpose - the aesthetics & looks of this is only a tiny part of the big picture.

Design without purpose is art.

(I loathe Adobe products. Corel does it just as nice, and way faster for me.)

BK's Gravatar

BK
Wed 25th Jun 2008
at 11:34 am

Commenting is not available in this section entry.

A picture of Mark BoultonI'm a graphic designer from near Cardiff in the UK. I've been a designer for over ten years now and primarily work on the web. I'm still partial to a bit of print every now and then though. I used to work for Agency.com in London as an Art Director before working as a Senior Designer for the BBC in sunny Cardiff. This was all before I took leave of my senses and formed my own design consultancy, Mark Boulton Design Ltd.

I've got a thing about grids and typography and occasionally ramble on about them to anyone who will listen.

If you're after simple, clean and effective web design; let me know.