-1

Disclaimer

I am a ruby on rails developer that never actually dealt with graphical design.

Situation

We are currently about to release a product. And the application looks alright but not commercially viable. Thus the director decides to bring on board a freelance graphic designer. Graphic designer redesigns mockups and puts amazing, no, seriously I really liked it, amazing graphical Photoshopped design, basically where everything is drawn but not touchable. Please have a look: high-fidelity-proto

ISSUE

And the he tells that the work of the graphic designer is finished. So DIY further: CUT the prototype and paste it in your web-site.... Eh-hem.... First of all, we have to purchase Adobe Photoshop for that purpose, secondly, we are having responsive web-site and the cut-and-pasted image would definitely look awkward when the height or width of the web-site changes, lastly cut images tend to grab background color which makes them unusable for in similar cases non-reusable (sorry for my English)

Question

How is it generally done with the graphic designers? Do they really pass only HUGE images to the devs and ask them to CUT pngs in Photoshop, or do they have to provide the final solution for a developer so I can put my image tags with the image and transparent background... where required :)

PS. In no reason I want to blame Graphic Designers as such and just want to understand where his deliverables finish and my responsibilities start.

PSS. Please don't judge me heavily I am very new to the full web-development lifeCycle and learn from day to day basis


*stuff

4
  • This isn't really an appropriate question for this site, in that it doesn't really relate to the UX of your product. You'll probably have more luck on the Graphic Design Stack Exchange. That having been said, the "gap" you're experiencing is normally filled by a frontend web developer (as a Rails guy, you're a backend web dev—frontend guys worry about HTML, CSS and Javascript, and generally are proficient in Photoshop).
    – Kit Grose
    Mar 27, 2013 at 5:26
  • It's a bit ranty, but I think the question of 'how to build a UI' could fit into this site (though it could certainly fit on GD or even SO as well). Since UX teams should be responsible for the UI (IMHO) I'd like the question to stay.
    – DA01
    Mar 27, 2013 at 5:44
  • Just ask the designer for the PSD file and send it to some folks that do PSD to HTML (google.com/search?q=psd+to+html).
    – icc97
    Mar 27, 2013 at 9:29
  • You will have to update the content of this question so that it is less angry rant and more of a specific answerable question. We'll be happy to re-open it once it's been brought in line with the guidelines outlined in the FAQ. (In particular the information in the What kind of questions should I not ask here? section.
    – JonW
    Mar 27, 2013 at 12:00

2 Answers 2

2

There are two extremes.

On the 'frustrating' end of the spectrum:

This is what I like to call "toss it over the fence and run" method.

This method typically involves a 30mb Photoshop with 200+ layers. It looks great. Visually stunning. It blinds the powers-that-be with it's gorgeous glossy veneer. It's then tossed over the fence to the dev team and the dev team is left to figure things out. Usually via much frustration, stubbed toes, swearing, and overtime.

On the 'smooth sailing' end of the spectrum:

This is what I like to call "the right way" method.

This method typically involves some form of iterative development process (such as agile) and a UX person and/or Team that is capable of actually creating the presentation layer. In this model, the UX and UI team is working with the team to meet all objectives (Including visual 'bling' as well as quality interactions, fast performance, and lean markup.) No PSDs are shared, but rather nicely formatted HTML, CSS and JS.

And then there's every method that falls in between--the reality is most of the time it's something in between those two ends of the spectrum.

As such, there is no 'general' method. What is happening in your situation is, unfortunately, frustrating and inefficient, but not uncommon.

What I would suggest at this point is to communicate with your bosses or whoever the powers-that-be are that you now have a really great visual design to work off of, but it's not built. Your team now needs to interpret this particular visual design into actual presentation layer code...ideally a responsive layout. That takes time and effort.

For an analogy, if you were building a house, you were just handed the sketches and foam-core model from the Architect. They look great, communicate the overal aesthetic but aren't even the blue prints yet--let alone the 2x4s and nails.

1
  • Personally I can say everything makes sense in your answer! Great overview and solid point. Mar 27, 2013 at 5:18
1

You need a front end developer who will slice the design. In your situation, look for one with creative background. This may help adjusting the design wherever possible, while avoiding bouncing there-and-back-again between the designer and front end dev. In the same time, tell your boss that the final result will not look precisely as in the design, but similar, as it needs, no, it requires adjustments and adding responsiveness.

I tell you, bro, the situation is not that bad :) You just need some graphics, a lot of this design is made in such a way that these elements can be based on CSS only, so the site may be quite lightweight. And this is crucial on mobile. Conclusion - again - you need a good, creative, HTML5/CSS3/responsiveness/mobile-friendly oriented front-end dev.

PS. Thanks for imbuing this site with some informal language, it sometimes brings some life :)

1
  • Yeah, man! Just got frustrated recently with this crap Mar 27, 2013 at 9:40

Not the answer you're looking for? Browse other questions tagged or ask your own question.