Live data from Hacker News

PSD to HTML is Dead

blog.teamtreehouse.com

141–150 of 171 posts

Re: PSD to HTML is Dead

#141

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…

I do a lot of front end development for agencies, but also a good amount for my own projects. I only present mockups to clients, so we are all on the same page.

What I do with the PSDs for my own projects is use Layer Properties to name the color (and if applicable, the font, weight, and pt size). That way, when I go to do the build, I can glance at the layer and get that information quickly.

Many PSD designers group layers, but don't put extra effort into naming layers. Little things like that make a huge difference in time.

Re: PSD to HTML is Dead

#142

Earlier quoted context omitted.

Would you normally expect a psd to contain exactly specified type sizes? I don't use psd comps myself, but I'd treat them as more sketches and guidelines as to actual style and placement, rather than some sort of specification document, because it's a different medium and text handling in ps is pretty basic - it's really not suited to extensive text layout.

Yes, since there is an implicit agreement beforehand that the PSD should be converted to HTML/CSS. For example, if I missed a border on an element or margin spacing between text areas this would be something I would be expected to fix. The designer would most likely point this out. Many designers I've worked with get very upset if you change anything in this regard without some sort of discussion. The point you bring…

So developers actually have to know quite a bit of Photoshop in order to translate designs into authentic representations of a mockup.

Re: PSD to HTML is Dead

#144
post #122

Earlier quoted context omitted.

This is one of the nice things about the occasional comp delivered in AI. Its so much easier to translate assets to the web that it confounds me why AI wasn't the standard from the beginning.

I haven't used it recently, but a few years ago? AI was terrible compared to PS. I mean, I like vector graphics and was willing to struggle with a lot of pain for the advantage of using vectors instead of rasters for a project... holy crap AI was awful. Crashy, cumbersome, cringeworthy. I'm an amateur, so I'm not going to be an expert on the professional features, but a few days with AI led me to go right back to Ink…

Its even worse for not sharing any of its hotkeys with Photoshop.

Re: PSD to HTML is Dead

#145

I swear I feel like I've read a version this article once a year since the advent of CSS. This is a naively utopian vision of the future. The designer/developer is a very rare breed outside of the HN community. Most designers can't / won't write markup or CSS, and most developers are piss poor designers. The design->planning->building segmented workflow will always exist, as it has in all engineering disciplines sinc…

there are usually two approaches to a problem: top down and bottom up. PSD -> HTML is a top down workflow.

Re: PSD to HTML is Dead

#146
post #21

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…

Is there a known method for documenting an interaction in a design mockup?

've heard of but haven't used: http://keynotopia.com/

Re: PSD to HTML is Dead

#147
post #127

I disagree. In the hands of a competent web designer, photoshop is still the most expressive tool available. I've been bouncing PSDs with a designer for the past couple of weeks and I want him being creative and making something beautiful, not constantly worrying about how the images are going to get sliced up or sprited or what's svg and what's not. That's my job. So long as there is in iterative process in place wh…

Finally someone who gets it. I first started out with Photoshop, then learned a bit of Rails and front-end code. Now I use both. Photoshop makes it super easy to design things quickly and iterate different concepts. It's also great for storyboarding effects before trying to finesse them. And then when it comes to coding it up, that's when I get more particular about element positioning.

I'm with you. Photoshop is just a rapid visualization tool to make sure the concepts in my head are sane. Often they don't quite work out as I picture them, so Photoshop makes it easy to quickly iterate on alternative forms. Once I'm confident in the direction I'm going, I'll switch to actual implementation, often not even finishing what I was working on in Photoshop.

Using Photoshop to slice images up into pieces and reassemble them again in HTML is dead, but I think that process has been dead for more than a decade now. Photoshop itself is still quite useful though and many of its features map quite well to CSS.

Re: PSD to HTML is Dead

#148
This whole post, and comments, sound extremely unrealistic. In an ideal world, things work as you would say - but in the real world, things don't work like this.

I'm not sure if any of you guys have seen the inside of a psd2html place - it is highly optimized with a hive mind around browser compatibility. I would say that best of the breed slicers leverage bootstrap, sass/less, etc and incorporate their experience inside it.

I would argue that the missing piece is not some new, magical way of doing things - but rather the interchange formats. For example designers don't use PSD grids that account for fluid layouts (FYI - I'm not even opening the can of worms that is responsive design). This makes it hard for slicers to deliver fluid layouts.

The search for the mythical designer + SASS engineer is very hard and very likely futile. In fact, my opinion is that you are starting the process incorrectly. I suggest to find a best of breed slicer, START the design process with them as opposed to a designer (get their recommended grids, etc) - then give the designer a set of constraints to work with. This should ensure your downstream workflows are smooth.

Re: PSD to HTML is Dead

#149
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…

I agree. I think it's obviously ideal to find someone who can design in photoshop translate that with html css javascript and create the entire front end experience. But is it practical?

I'm not sure. I think the designer programmer relationship needs to change. The designer must understand the programmer is going to have to do some "interpretation" of the original design. It's not going to look exactly the same.

Re: PSD to HTML is Dead

#150
I would like some constructive advice. I currently use sliced PSDs as part of page content workflow to get a one page flyer from InDesign onto the web.

I start with a one page PDF which was generated in InDesign for print. This one page flyer needs to be linked to products on an ecommerce site. The flyer changes weekly.

Currently I open the PDF in Photoshop, slice it, add the links and upload it into an iframe. It takes about 15-30 minutes to get if from PDF to live.

What would be a more efficient way for me to convert this PDF to clickable web content? I don't want to spend more time than I currently do on it.

Post reply on HN