Journal — Field Notes

Preparing Your PSD for Conversion: A Practical Checklist

We convert other people's design files for a living, which means we have seen every possible state a PSD can arrive in — from museum-grade organization to a single flattened layer named 'Layer 1 copy 47'. Both get converted. But the organized file gets converted faster, cheaper, and with fewer clarifying emails interrupting your week. Here is the checklist we wish every file followed, with the reasoning behind each item.

A well-organized design file with neatly grouped layers ready for conversion

1. Name and Group Your Layers Like Someone Else Will Read Them

Because someone will. Group by page section — header, hero, features, footer — and name layers for what they are, not what they were ('nav-link-hover', not 'Rectangle 14 copy'). When we extract a value or an asset, the layer tree is our map; a clean one means we extract exactly what you intended. Adobe's own layer documentation covers the mechanics, but the principle is simpler: organize the file the way you would want to receive it.

2. Include the Fonts — and Their Licenses

The single most common project delay is a missing font. Tell us every typeface in the design and, crucially, how it is licensed for the web. A desktop license that lets you mock up a design does not automatically cover serving the font on a website. If the font lives on a free service like Google Fonts, just say so — that answers both questions at once. If it is commercially licensed, confirm the webfont license exists before the project starts, because retrofitting a substitute typeface after build is genuinely painful for everyone.

3. Keep Imagery in Smart Objects at Full Resolution

We export imagery at multiple resolutions for responsive use, which only works if the source material has resolution to give. Smart objects preserve the original pixels; destructively scaled-down layers do not. The same goes for icons and logos: if vector versions exist anywhere, include them — an SVG icon set keeps every size crisp and shaves real weight off the final build.

4. Show or State the Interactive States

Hover, focus, active, error, empty, open, closed. A design that shows only the resting state of a navigation menu or form leaves the other states to our judgment — and while our judgment is decent, it is not your design intent. You do not need to draw every state; a note layer that says 'links underline on hover, buttons darken 10%' is entirely sufficient and takes two minutes.

5. Declare Your Breakpoint Intent

If you provide a desktop and a mobile design, the in-between is interpolation, and we are good at it. But if you have opinions — where the navigation collapses, whether the sidebar drops below or disappears, how the type scale shifts — write them down. One annotation layer saves three rounds of staging-link review. If you have no opinions, say that too; explicit delegation is just as useful as explicit instruction.

6. Use Real Content Where You Can

Lorem ipsum hides layout problems that real content exposes: the headline that wraps to three lines, the product name twice as long as the placeholder, the legal footer nobody designed for. Even partially real content makes the converted build dramatically more honest. Where real text truly does not exist yet, give us the realistic extremes — shortest and longest plausible — and we will build for the range.

7. Flatten Nothing, Delete the Junk

Hidden layers from abandoned directions, duplicated groups, stray color experiments — delete them before sending. Not because they break anything, but because every hidden layer is a question: is this intentional? The leanest possible file containing only the intended design is the fastest one to convert correctly.

The Payoff

A file that follows this checklist typically quotes lower and converts a day or two faster than the same design sent messy — fewer queries, fewer assumptions, no font emergencies. It is the cheapest optimization in the entire project. When yours is ready, the process page shows what happens next, and the contact form is where it goes. We will notice the clean layer tree, and we will appreciate it.

File Ready for Conversion?

A clean file quotes lower and converts faster. Send it over and get a fixed quote within one business day.

Send Your File