Why not use Sketch?

I agree that Photoshop is outdated and doesn't fit the workflow of developing interactive products. What I disagree with is the jumping right into html/css. Quickly iterating on an idea or a feature in higher fidelity comps has always been amazingly important to me. Designers are stuck in details, we love interactions, typography, colors and shapes. In order to get the right combinations it takes time. We have to go down a thousand dead ends to end up at the right solution. Can that be done in code? Yes of course. Is it as fast as me dragging around an art board and trying 30 different iterations? No. Increasingly we're losing the basic design process and fundamentals of design because of the differing opinions of process. Its fine to design in code if that works for you and yes photoshop is antiquated and clunky. But I don't think one shoe fits all (and it doesn't seem like you do either). As designers we need to be thoughtful about our decisions and personally being in code doesn't help me do that.

Just a thought.

EDIT: (Posted 2008) was added to the title after my comment.

Photoshop is awkward. You can’t help but know your way around Photoshop after working in it for 10 years, but I still find it awkward to get simple things done. Working with a pen feels so much more natural to me than going back to the toolbar over and over. A pen can draw anything, but in Photoshop you need to use the text tool to type, the shape tool to draw a shape, the menu bar to adjust this or that, etc.

He's been using Ps for 10 years and doesn't know keyboard shortcuts?

I completely disagree and I think it's a terrible advice. If anything should be avoided for the sake of productivity is sketching in paper. Ps is a sheet of paper with steroids:

You can copy hundreds of items with a single action and modified different states of individual items. Good luck mocking that on paper in less than 10 minutes.

You can play with real proportions, alignment and distributions in matter of seconds.

You can test your mocks on device (via Silkscreen) and see how they look like.

You can test with real iconography, color composition, typography etc. Not sure what this has to be left to the end while from the very beginning can give a sense of what feels right.

You can even export certain assets and play with Origami to have a sense of how motion and transition will be applied.

This should probably have a (2008) tag added to the title.

Remember this getting slammed in 2008, the comments were more value than the article.

Wrote on 2008, what??

Designing directly on the browser is harder but forces designers to understand how the browser works, this is why sometimes we read "Why designers should code?"

It's plenty of designers that are masters on their designing tool but they don't know nothing about the browser...

I like that this article is "Why we skip Photoshop" and not "Why you need to skip Photoshop." I like Photoshop, and it works well for me, so I disagree with some of the points. For example, "when you use Photoshop you can't help but pay attention to details." For me, that's a benefit. I lke being able to focus on alignment and colors and details. I like making things that look good for the sake of looking good. (Especially since attractive things work better.) That's what breathes life into me as a designer. I would rather take my time on details than rush into HTML/CSS.

I hate that feeling of picturing a certain color/typography palette in my head, describing it the best I can without a Photoshop mockup, then it gets jumbled up by passing through many hands (collaboration) and when it gets back to me, it's nothing like what I imagined but it's time to ship so off it goes and I can't take any honest pride in it. It's a tad bit demoralizing especially if it happens regularly.

I also feel like HTML/CSS also has a certain grain that encourages you to do things in ways you've seen before. In Photoshop (or Sketch or whatever) you can experiment to your heart's content without worrying about how it's going to work logistically. Not to say that designers shouldn't know how HTML/CSS works, but through experimentation that's purely graphical, you can think of some wild way to display a dropdown that doesn't look native but works well for the brand of the website & the users of the website you're designing for. Then if you know HTML/CSS you can scale it back so it is actually workable through HTML/CSS.

HTML/CSS are still in development too, so it's not as if our HTML/CSS toolkit is final. If you think of a new convention that's not currently the most elegant in HTML/CSS language but works well from a user experience standpoint, maybe in the future that will get worked into the spec.

Photoshop and HTML/CSS are both tools that are still evolving. I find it's better for me (again, for me) to try to use them to do the job that I want to do without focusing on their current nature. I know text in Photoshop is awkward (point #7 in the article) but Adobe's working on it, supposedly. The tools will evolve the way we use them even if it's awkward at first. border-radius wasn't always a thing, remember? We had to ask for it.

[Written before realizing the article is from 2008]

I've now heard this sentiment from several CEOs and top level management and though I agree with the sentiment (shipping early and validating often) I can't disagree more.

1) A designer can, through a myriad of tools, validate a Photoshop (or Sketch) file. Invision. Pixate. Framer. All are faster and more flexible than code.

2) Laying down code is, at least for me and I think for many, a different mental task than designing. I have different concerns (scalability and durability v. empathy and creativity) which, when conflated, often lead to the suffering of both.

3) Jason Fried, and the other leaders that seem to espouse this sentiment, are rarely (ever?) UI designers. I appreciate the sentiment, but I find that prescriptive (and somewhat pejorative) claims like this of a design tool or process when they themselves don't do the work to be fundamentally naive – designers should have the freedom to use the tools they think are best for solving a particular design challenge.

(Also, Basecamp may have had a relevant design 5 years ago, it doesn't now – the UX and interaction patterns are awful in my opinion.)

Sounds like they threw the baby out with the bathwater instead of fixing the individual "issues" they have with Photoshop.

I understand it's 6 years old, but this still reads as pretty bad advice. Anyone worth their salt in a design program can work just as fast as HTML, and the sharing/collaborative aspect is moot with virtual meetings.

A personal opinion, but I feel like the 37signals guys proudly buck industry trends solely on the back of the success of a very simple product. A dangerous mouthpiece for new designers to follow.

I remember thinking this was interesting back in 2008, but it's much easier and faster to experiment with ideas in Photoshop/Sketch than it is in html/css.

I also feel that photoshop uses a different part of my brain. Writing html/css/jquery logic is a much more left brain, analytical activity. Pushing pixels around in Photoshop feels much more right brain.

So it was an interesting thought experiment, but I feel like you can play around and get to a good idea faster in Sketch and Photoshop.

Yeah, I remember that article. Started prototyping ui using only html about 4-5 years ago, never looked back after.

To say don't use Photoshop (or your favorite editing program) is going a bit overboard in my opinion. Let me tell you why.

HTML/CSS, while yes, has the ability to make something that's "real" and clickable, is also slower to work and experiment with, and doesn't easily let you be creative in terms of unconventional layouts and designs. A lot of creativity, at least for me, comes from rapid experimentation and this is what Photoshop allows me to do that no other program has really been able replicate (yes, even Sketch, because you're limited in your options when it comes to working with raster artwork).

So yes, HTML and CSS is great, but for design, it's not the holy grail in my opinion. There are definitely cases where HTML and CSS would be more useful to work with, but for most design work, Photoshop (and Sketch, or equivalent) is still the best option.

You shouldn't base your design around the tool you use, you should choose your tool, based on the design constrains you need.

Sometimes you should use Sketch. Another time you need Photoshop. And another time it’s better to make it in code.

"We" being the operative word. While I agree with the author, I can see why this wouldn't apply to every designer out there.

That moment when this isn't a Photoshop vs. Sketch article, but still it becomes one. xD

Depending on the site, perhaps. For a big-budget marketing site to launch a product with lots of stakeholders and assets... in a large company... not really practical to skip Photoshop.

And I agree with the other comments about 10 years of Photoshop experience and still not knowing how to use it powerfully (keyboard, shortcuts, actions, layer comps, smart objects, etc.).

In context of the app "Basecamp" I can understand that designing for an application doesn't really require deep design exploration in a tool like Photoshop.

As a user experience designer I tend to gravitate towards Photoshop because I'm designing new experiences for new clients for each and every new project. Without defined guidelines in place, (like Basecamp already has) I need to explore my options.

The design doesn't need to be high fidelity by any means but I think it all boils down to preference.

In closing...

Use whatever method or tool that works for you and quit writing about the pitfalls of any of them.

I find that this works for App UI design, and for similar work...

but the minute you are working with a large Marketing dept for a client, this often goes out the window.

it's one of those 'pretty to think so' statements.

then again, it's like they said ...it works for them... your mileage may vary...