Как выполнять адаптивную верстку статичного макета PSD?

Добрый день,на собеседовании получил задание сверстать одну страницу (типовой лендинг) "согласно идеологии адаптивного дизайна". Проблема в том, что в PSD находится только дизайн сайта для 1920х1080, а если мне не изменяет память, для адекватного RWD нужен дизайн для каждого из брейкпоинтов дизайна.
Как поступать в такой ситуации? Должен ли я сам придумать дизайн, оставить все как есть или я просто не понимаю этой самой "согласно идеологии адаптивного дизайна"?

Заранее спасибо.
  • Вопрос задан
  • 1794 просмотра
Пригласить эксперта
Ответы на вопрос 5
vicodin
@vicodin
Имею некоторый опыт
именно поэтому дизайнер должен быть еще и верстальщиком, а верстальщик - дизайнером.
Там по сути и дизайна даже нет, скорее нужно базовое представление о UX.

Как обычно делаю я? Верстаю full-width макет, и начинаю уменьшать ширину браузера попиксельно, появляется косяк - рефакторю этот момент или пишу для него media query. И так до 320(сейчас чаще до 400) пикселей.
Ответ написан
Комментировать
xPomaHx
@xPomaHx
1vs9
Дизайн мобильной версии обычно простой. Так что да сами додумайте, это не сложно, тем более не вы отвечаете за его качество, если скажут чуть подправить то подделаете не страшно.
Иногда нужно просто текущий сайт вертикализировать, тоесть просто сделать так чтобы то что в строчку правильно сбрасывалось на новую строку
Ответ написан
Комментировать
FreedomRun
@FreedomRun
веб-программист
Как вариант просто начать верстать "mobile first". Сначала одним столбцом делаешь стили для основных блоков. Потом начинаешь постепенно (по мере увеличения ширины экрана) позиционировать эти элементы. В зависимости от проекта можно либо сетки всякие использовать, либо обычными 'float' и 'position: absolute' делать layout (позиционирование). Брейкпоинты можно из того же Bootstrap взять. Мне кажется, тем людям, которые дали тебе задание, даже понравится, что ты всё сделал без лишних вопросов. А если им что-то не понравится в мобильной версии, то всегда можно сослаться на отсутствие PSD-макета или ТЗ по мобильной версии.
Ответ написан
Комментировать
@kvalood
В таких случаях я делаю 20-30% наценки на проект. Так-как появляется дополнительная возня + тестирование адаптивности.
Ну и разумеется делаешь все на свой вкус, придерживаясь дизайна мобильных приложений.

Так-же можно сделать заготовки, и исспользовать их во всех проектах (всплывающие уведомления, боковые меню итд).
Ответ написан
Комментировать
disablesilence
@disablesilence
Штатный искусствовед
Обсудите с заказчиком. Предупредите, что можете сделать адаптивку сами, но переделка может стоить времени и денег, поэтому стоит уточнить всё «на берегу»
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы