Live data from Hacker News

PSD to HTML is Dead

blog.teamtreehouse.com

101–110 of 171 posts

Re: PSD to HTML is Dead

#101
post #9

It drives me totally batty to work on projects in which the designer assumes that their only responsibility is to provide a PSD file, which the developers will then turn into HTML and CSS. I want to work not just with designers, but with Web designers, who intimately understand the workings of HTML, CSS, some JavaScript, and the implications for different browser sizes and versions. Web designers speak HTML/CSS nativ…

Yadi yada is dead.. I also think web designer should have a basic understanding of css & html, but too many time I saw average web dev saying no to a designer because, well they did not care or did not know how to do it. If you start limiting yourself you limit what the designer can create. Another thing is now there are tools to make PSD to HTML much faster like CSSHAT that provide you with the exact CSS for each el…

"...make design iterations much faster..." as if!

Say you want to swap over the search box with the account functions (sign in, cart, etc.) in a header on an ecommerce site. Chances are that you need only change a couple of lines of css to effect this layout change. Minutes later you can then run through the customer journey with the client and get a few people to test it. You learn quickly if this is better for usability and if it does not work you simply roll back the css to what you had before.

Compare with the PSD approach. You can spend a minor age fiddling with the umpteen layers, then you can hide/show layer groups for the homepage/category page/product page/basket page/checkout and so on, saving out some flat jpg thing along the way. Then present it to the client and ask them to imagine if it is better. If they go ahead then you hand it over to some developer that will then have to make what was signed off pixel perfect.

However, along the way you discover that the account functions are in a dynamic list, e.g. the basket shows how many items are in it, as does the wishlist, and, on some pages, e.g. checkout, there may not be all the links shown. So it changes around. Consequently the area/box that has been designed fills up or gets empty, impacting the design in ways not understood doing it with Photoshop mockups.

Note this is a simple example with no fancy responsiveness involved, just plain regular desktop view.

Put simply, Photoshop is a useless tool for any meaningful design. It results in very poor workflow. All clients have already had websites, they all know that PSD mockups don't look like that once they are implemented, and, if they do, there is a whole lot of stuff that is not accounted for. It is much better to be honest with a client and involve them in an iterative design process.

Re: PSD to HTML is Dead

#102
I actually stopped working in Photoshop about two years ago when I realized you can prototype faster just by building a design from scratch in the actual browser.

It's so much faster than having a designer painstakingly mock something up in PS, then have me build it and realize a myriad of things that weren't apparent because we weren't looking at it in an actual browser.

Re: PSD to HTML is Dead

#103
post #44

Rant to follow: So I have done a fair share of PSD to HTML, PSD to WordPress theme, PSD to application web GUI, etc. rewrites. I generally have no problem with the concept of this, and got quite good at this. However, there are some real pet peeves that keep coming up in this workflow, that are really driving me crazy. If you are a designer working with a developer, and you happen to read this, at least please consid…

As a designer, I love hearing what developers want. I always hope the process is going to be a two-way conversation. It helps me a great deal to hear what the developer wants. I also agree that if you're going to design for the web, in PS, you had better at least have a basic understanding of how HTML works and how a web page is put together.

The best PSD I ever recieved had a layer exclusively reserved for annotating margins and spacing. I didn't have to dig into the PSD and check the toolbar, all of the figures I needed were right there.

It even came with a PDF style guide outlining line spacing, font size, colors in hex and margins/padding.

I've never been so elated to get a PSD.

Re: PSD to HTML is Dead

#104
When I first read this article I didn't really agree with it, but after reading some of the comments on here I can understand where it's coming from.

I think the main issue is that the designer understand that it's more of a guideline on how the site should look. When they start getting nitty gritty about exact line breaks and page by page style changes is where it gets hairy and falls apart.

I don't think moving away from mockups is the answer if that's what the article is implying. Just a greater understanding of modern web abilities and standards is all that's needed from the designer.

Re: PSD to HTML is Dead

#105
post #9

It drives me totally batty to work on projects in which the designer assumes that their only responsibility is to provide a PSD file, which the developers will then turn into HTML and CSS. I want to work not just with designers, but with Web designers, who intimately understand the workings of HTML, CSS, some JavaScript, and the implications for different browser sizes and versions. Web designers speak HTML/CSS nativ…

As someone who's done a huge amount of front-end development, I disagree completely, at least when we're talking about graphic design (as opposed to interface design, and even then it depends). The job of a good designer is to come up with a "look" for a page that feels a certain way, that communicates certain ideas, with careful consideration of clarity and emphasis. Their skillset is emotion and communication. Know…

Agreed, but responsive sites benefit massively from having a choreographer-designer - one who is both able to set out a plan (in Photoshop/InDesign/xxx tool) and then describe how different page elements flow.

Re: PSD to HTML is Dead

#106

Earlier quoted context omitted.

Great writing. But as someone who also came from a different design field, I'm not sure it's obvious to new designers where and what they should start learning. It would have been great if the author had identified tools for a replacement workflow (though I'm sure Treehouse must get more into that elsewhere on their site). I came into the world of UX and UI design by way of architecture, and it was quite a while unti…

The tools don't really matter; it's the process which is important. The prototype should be just that - a prototype to be thrown away after starting the product - it should not be used to translate to another medium, or as a final spec sheet which is frozen and cannot be modified during implementation. What you use to prototype doesn't matter - it could be on paper, grid paper, photoshop, HTML, whatever gets it done…

Yes! I have a beef with the notion of "design" as a role. It's a thinker/doer split, which is inherently problematic. Software creation is almost entirely design activity; it's just enough different sorts of design that we need a team to be able to do them all well.

For me, design artifacts are a way to communicate and a way to prime the pump so that you can start iterating in the real medium and getting real-world feedback. For both uses I'm alway seeking the minimum amount of investment in design artifacts, because as soon as the real product is live and in use, the artifacts are all candidates for recycling.

Re: PSD to HTML is Dead

#107
post #26

And thank goodness. If anybody knows where the grave is, I'd like to go piss on it. As somebody who long ago did print design, I totally get why designers would want pixel-perfect control. It is awesome, but you get that in print because you are physically manufacturing an object and sending it to people. The web was device independent from the get-go. It wasn't your paper anymore; it was their screens. There were a…

Hear, hear. I'm ashamed to admit I built one or two websites this way - but then I got a job wrangling XML into EPUB, and oh my word am I sorry for my sins now. And this: >It wasn't your paper anymore; it was their screens. ...is something the publishing industry needs to, but seems to be pathologically unable to, appreciate.

Don't feel bad; we all did. The flip side of my rant is that the early web was as ugly as sin. The desire to use it to make something beautiful was a good one, and we had to try a lot of approaches toward that. My problem wasn't that fixed-width, device-hostile designs were tried, it's that they became the dominant approach without anybody understanding what had been lost.

Re: PSD to HTML is Dead

#108
post #86

Earlier quoted context omitted.

I'm not sold here on this one. Since we know the specific small set of resolutions on iOS devices, I'd rather have a designer/UX lay down exactly how it should look, then have devs execute on that. If dev provides a valid reason why a design component would be a royal pain, then design can go back and adjust. Just had this argument 20 minutes ago on using a native control versus designing our own and adding a few lis…

Why waste time doing it on a photoshop canvas when a developer could easily and quickly get an overview with Cocoa and auto layout through storyboard? Background: none.

Because stock iOS (iOS 7 changes this a little bit, but not much) only gets you so far. Things like pixate get you a little further, but ultimately some sort of visual design process comes into play, typically with a tool that's been used in that process since time itself began.

Background: 20 years as a creative technologist currently doing iOS based experiential retailing for huge brands where the interactivity and visual appeal simply doesn't exist in stock iOS. And I also wrote an app publishing tool that works similarly to Adobe DPS (build informational apps in Photoshop, see http://www.youtube.com/watch?v=YXlHFhbqzHU).

Re: PSD to HTML is Dead

#109
post #9

It drives me totally batty to work on projects in which the designer assumes that their only responsibility is to provide a PSD file, which the developers will then turn into HTML and CSS. I want to work not just with designers, but with Web designers, who intimately understand the workings of HTML, CSS, some JavaScript, and the implications for different browser sizes and versions. Web designers speak HTML/CSS nativ…

A good analogy is an architect (of buildings) who doesn't know structural engineering. Yes, they don't have the degree, but basic knowledge of behavior of materials, how buildings don't fall down, and so on, are the difference between pretty drawings and actual buildable designs.

Re: PSD to HTML is Dead

#110
post #9

It drives me totally batty to work on projects in which the designer assumes that their only responsibility is to provide a PSD file, which the developers will then turn into HTML and CSS. I want to work not just with designers, but with Web designers, who intimately understand the workings of HTML, CSS, some JavaScript, and the implications for different browser sizes and versions. Web designers speak HTML/CSS nativ…

As someone who's done a huge amount of front-end development, I disagree completely, at least when we're talking about graphic design (as opposed to interface design, and even then it depends). The job of a good designer is to come up with a "look" for a page that feels a certain way, that communicates certain ideas, with careful consideration of clarity and emphasis. Their skillset is emotion and communication. Know…

There's lots of middle ground. Designers knowing what are web-safe fonts, or how big most users' screens are, are fundamentals that I've still seen lacking.
Post reply on HN