Вёрстка из Sketch/XDВерстка по макету

Вёрстка макета из Sketch или XD на HTML и CSS: страница по экспортированным артбордам, с версией для телефона

Обычно готово за 15 минутДоработки включеныКонтроль качества
Защита оплатыПодробнее
  • Доработки в рамках пакета бесплатны.
  • Если вы не ответите в течение 3 дней после сдачи, работа будет принята автоматически.
Заказать · 39 $

При оплате деньги резервируются и переходят сервису, только когда вы примете работу.

Вёрстка макета из Sketch или XD на HTML и CSS: страница по экспортированным артбордам, с версией для телефона

Пример результата

Пример по пакету «Стандарт»

Главная страница стоматологии по её макету

До: макет, который прислал клиент

Макет главной страницы

После: работающая страница

Страница на компьютере Страница на телефоне

Файлы: ZIP-архив с index.html, стилями и 2 картинками для страницы, готово к загрузке на хостинг клиента. Здесь показаны скриншоты страницы.

Клиент: стоматология Bright Smile Dental. Задача: превратить макет главной страницы в работающую HTML-страницу с той же сеткой, цветами и текстами и кнопками записи, которые звонят в клинику.

Клиент и все данные вымышлены.

Об услуге

Некоторые макеты до сих пор лежат в файлах Sketch или Adobe XD, которые без самой программы не открыть, и страница так и не была сверстана. Экспортируйте артборды в PNG и загрузите их, и мы сверстаем их на HTML и CSS: те же блоки, сетка, цвета и кнопки, с настоящим текстом, а если мобильного артборда нет, сделаем версию для телефона по десктопному. Файлы .sketch и .xd, облачные ссылки и прототипы мы открыть не можем, поэтому всё, чего не видно на экспорте, опишите в брифе. Фото и иконки рисуются заново в том же духе, если вы не экспортируете их и не загрузите отдельно. Анимаций, серверной части, CMS и хостинга нет.

Что входит

  • Что вы получитеАрхив ZIP со страницами, стилями и картинками, готовый к загрузке на хостинг, и предпросмотр каждой страницы на странице заказа.
  • По вашим артбордамБлоки, отступы, цвета и размеры шрифта как на экспорте
  • Версия для телефонаДелаем по десктопному макету, если мобильного нет
  • Настоящий текстЗаголовки и абзацы в HTML, которые читают поисковики
  • Ваши изображенияФото, иконки и логотип, экспортированные отдельно, ставятся как есть
  • Чистый кодОбычные HTML и CSS, без фреймворков, ничего не грузится с чужих сайтов

Порядок работы

  1. 1
    ЭкспортВы экспортируете артборды в PNG и загружаете их с пояснениями
  2. 2
    ВёрсткаМы верстаем страницы и рисуем недостающие картинки
  3. 3
    Предпросмотр и архивВы сравниваете страницы с макетом на компьютере и телефоне, скачиваете архив и просите правки в рамках пакета

Что нужно от вас

До 5 картинок в PNG, JPEG или WebP: артборды, экспортированные из Sketch (раздел Export в инспекторе) или из XD (File > Export > Selected), по одной странице на файл, в масштабе 1x или 2x, и по желанию фото, иконки или логотип, экспортированные отдельно. Напишите, какой артборд какая страница, какие шрифты, какие состояния не видны на экспорте, например открытое меню, и куда ведёт каждая кнопка. Не файлы .sketch и .xd.

В брифе мы спросим:

  • Какой артборд какая страница?
  • Шрифты в макете
  • Что поменять по сравнению со старым макетом
  • Куда ведёт каждая кнопка?
  • Макет ваш?

Сравнение пакетов

Эконом1 артборд, до 5 блоков21 $Стандарт1 артборд, до 10 блоков39 $БизнесДо 3 артбордов67 $
Срок1 день2 дня3 дня
Доработки123
Страниц113
Блоковдо 5до 10до 8 на странице
Картинок для страницы24—
Версия для телефонаДаДаДа
Что загрузитьЭкспорт артбордов в PNGЭкспорт артбордов в PNGЭкспорт артбордов в PNG
Картинок для страниц——6
ЗаказатьЗаказатьЗаказать

Защита оплаты

Вы оплачиваете заказ сразу, но деньги переходят сервису только за принятую работу.

  • Фиксированная ценаЦена пакета не меняется после оплаты.
  • Деньги резервируютсяПри оплате сумма только резервируется. Сервису она переходит, когда вы примете работу.
  • Проверка перед сдачейКаждый результат проходит проверку качества, прежде чем попасть к вам, и вы видите его на странице заказа до приёмки.
  • Бесплатные доработкиПросите изменения в рамках брифа столько раз, сколько предусмотрено пакетом.
  • Приёмка через 3 дняЕсли в течение 3 дней после сдачи вы не примете работу и не попросите изменений, она будет принята автоматически. Если после сдачи вы напишете в чат заказа, заказ подождёт; ответив, мы можем начать отсчёт 3 дней заново и сообщим об этом в чате.
  • Переделка или полный возвратЕсли результат не соответствует брифу и доработки не помогли или срок превышен больше чем вдвое, напишите в чат заказа: мы переделаем работу или полностью вернём деньги.
Как это работает →

Вопросы и ответы

У меня больше нет Sketch или XD.

Тогда попросите того, у кого остался файл, экспортировать артборды, или пришлите чёткие скриншоты макета, если текст на них читается. Мы верстаем только по картинкам.

Можно дать облачную ссылку на макет?

Нет, мы верстаем только по загруженным картинкам, а не по ссылкам и файлам макетов, и не входим в ваши аккаунты.

Совпадёт ли вёрстка с макетом до пикселя?

Вёрстка будет близка к макету по сетке, цветам, размерам и порядку блоков, но не до пикселя: шрифты системные и похожие, а фото рисуются заново, если вы не загрузите свои. Правки исправят то, что для вас важно.

Можно заодно освежить старый макет?

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

Не нашли ответ?

Все услуги раздела «Разработка и IT»

Ещё в разделе «Разработка и IT»

Заказать · 39 $· ~15 мин