Какие материалы должен отправить веб-дизайнер с помощью Photoshop разработчику?

Я реализовывал в основном веб-приложения и приложения для настольных компьютеров, и впервые я начал работать с графическим дизайнером на веб-сайте, предназначенном для общего пользования. В этом случае графический дизайнер работает не с HTML + CSS, а с Photoshop.

Какой тип материала обычно предоставляется в качестве конечного результата для фактической реализации проекта?

Например, я должен получить что-то большее, чем просто PSD-файлы? Как насчет различных состояний (таких как наведение ссылки, активное состояние и т. Д.) Или адаптивного дизайна? Я ожидаю слишком технические детали?

Любая помощь приветствуется.

Макет обычно передан для разработчика , чтобы знать , что идти. Это может варьироваться от файла PSD до просто плоского изображения, в зависимости от рабочего процесса. По моему опыту, я передал плоский макет со всеми размерами, размерами шрифта и используемыми цветами, а также полным набором фрагментов и использованных изображений. В основном все, что требуется для завершения проекта. Но это действительно зависит от рабочего процесса. Если сайт сделан в основном на CSS, требуется другая информация (значения градиента, значения тени, предустановки обрезки изображения).

Состояния кнопок всегда должны быть покрыты. В зависимости от того, как они будут сделаны (чисто CSS или срезы), вы должны указать либо все цвета, радиусы и размеры, либо сами срезы.

Адаптивный дизайн немного отличается. Проектирование вида - это только начало. Разработчик также должен знать, как должны вести себя элементы, когда сайт постепенно «сжимается». Как будет вести себя меню, если отображается меньшее количество параметров? То, что является только элементом списка в полном веб-представлении, может существенно изменить экран в мобильном представлении. Что происходит со всеми элементами наведения (нельзя использовать их в мобильном представлении)?

@ Ответ KMSTR - это решение на 80%, но если ваш дизайнер - настоящий профессионал, он / она определенно расскажет о мелких деталях, например, когда должна происходить анимация перехода или в каком порядке должны загружаться элементы DOM.

Если ваш дизайнер в этих 20%, попросите несколько пользовательских потоков UX и каркасов, или, если они особенно талантливы, прототип, сделанный в After Effects или Flash. В идеале они не оставляют никаких аспектов.

Все зависит от того, что вы договорились с графическим дизайнером.

Некоторые графические дизайнеры не знают ничего, кроме PhotoShop, и будут потеряны, если вы попросите что-нибудь, кроме большого PSD-файла.

Некоторые графические дизайнеры хорошо разбираются в HTML, CSS и JS и могут создать все для вас.

И тогда есть все между ними.

Я бы порекомендовал вам склоняться к последнему, поскольку веб-дизайнер, который понимает, что среда собирается создавать проекты, которые гораздо более дальновидны, отзывчивы, независимы от браузера и гибки, чем первый, но первый может работать до тех пор, пока UI Developer тесно сотрудничает с UI дизайнером.

Вы должны заявить, что ожидается впереди.

Я полностью способен доставлять файлы psd, страницы html / css или даже полностью динамические страницы jquery / php / mysql. Что доставляется, зависит от того, что запрашивается.

Если разработчик хочет только PSD, то это все, что я поставляю, и это их работа по созданию страниц. Я бы никогда не стал создавать страницы, если они не нужны.

У меня есть клиенты, которые полагаются на меня для полнофункциональных страниц, которые могут быть добавлены на существующие веб-сайты.

У меня есть клиенты, у которых есть разработчик, который отказывается использовать любой отправленный им код и настаивает на том, чтобы кодировать все сам, поэтому я доставляю psd-файлы.

На ваш вопрос нет четкого ответа. Это вопрос того, что согласовано до начала работы.

Вы действительно хотите дизайнера, который хорошо разбирается в HTML, CSS и Javascript. Место, где я работаю, мы никогда не видим ни одного файла фотошопа. Дизайнер дает нам URL-адрес страницы, мы копируем весь его пользовательский интерфейс, а затем заполняем пробелы, чтобы сделать страницу динамичной.

Есть несколько причин, почему это предпочтительнее:

1) Нет сомнений в том, что хочет дизайнер - нет никаких интерпретирующих чисел или примечаний, вы точно видите, как должен выглядеть готовый продукт, прежде чем даже прикоснуться к нему. Здесь есть все значения CSS, каждая функция JavaScript или анимация.

2) Это сокращает время, которое нужно тратить на работу над этой страницей. Да, вам все еще нужно перемонтировать его и, возможно, выполнить много работы на бэкэнде, но это сэкономит вам значительное количество времени на передней панели.

Конечно, вы не всегда контролируете дизайнера, с которым работаете. Но если вы работаете с фотошопом, убедитесь, что вы действительно получили все состояния кнопок, и знаете, какую анимацию хочет дизайнер. Надеюсь, если вы работаете в такой среде, вы можете просто подойти и поговорить со своим дизайнером и попросить разъяснений по мере необходимости.