Розробник зробив «приблизно як у макеті», але все поїхало
Звіряємо верстку з Figma по відступах, шрифтах і сітці. Перед здачею показуємо порівняння екран до екрана на трьох ширинах.
Макет з Figma стає робочим сайтом, який виглядає саме так, як ви затвердили
Беремо ваш макет у Figma і верстаємо його в React, Webflow або WordPress. Сайт адаптований під телефон, швидко вантажиться, а форми та аналітика вже підключені.
Кошторис і строки після брифу
Кому підходить
- Власники, у яких уже є макет від дизайнера, а розробника немає
- Дизайнери й студії, яким потрібен надійний виконавець верстки
- Бізнеси, що хочуть редагувати сайт самі, без програміста (Webflow, WordPress)
- Команди, яким потрібен React-фронтенд за готовою дизайн-системою
Які задачі вирішуємо
На телефоні сайт виглядає гірше, ніж на комп'ютері
Верстаємо спочатку під мобільний, потім під планшет і десктоп. Якщо у вашому макеті немає мобільної версії, чесно скажемо про це до старту й запропонуємо варіант.
Не можу сам змінити текст чи додати сторінку
У Webflow і WordPress налаштовуємо редактор і колекції (повторювані блоки: послуги, статті, відгуки). Ви міняєте контент без коду.
Сайт є, а заявки губляться і незрозуміло, звідки вони
Підключаємо форми до пошти, CRM або месенджера. Ставимо Google Analytics 4 і події на кнопки та форми, щоб бачити, що працює.
Що входить у роботу
- Аудит макета: перевірка станів кнопок, мобільних екранів, шрифтів і зображень
- Верстка за макетом у React, Webflow або WordPress
- Адаптив під телефон, планшет і десктоп
- Анімації та ефекти при наведенні, якщо вони є в макеті
- Підключення форм до пошти, CRM або месенджера
- Базове SEO: заголовки, мета-теги, альтернативні тексти, карта сайту
- Оптимізація зображень і швидкості завантаження
- Налаштування Google Analytics 4 і подій на ключові дії
- Перевірка у браузерах Chrome, Safari, Firefox та на iOS і Android
- Передача доступів і короткий відеоурок, як редагувати сайт
Оберіть обсяг роботи
Пакет допомагає описати задачу. Кошторис і строки погоджуємо після брифу та уточнення вимог.
01
Лендинг з макета
Одна сторінка для реклами, запуску продукту чи події
- Верстка однієї сторінки до 10 блоків
- Адаптив і перевірка в основних браузерах
- Форма заявки з підключенням до пошти чи месенджера
- Базове SEO та аналітика
02
Сайт з макета
Корпоративний сайт, каталог або блог на 5–10 сторінок
- Верстка шаблонів сторінок у Webflow чи WordPress
- Колекції та редактор для самостійного керування контентом
- Форми, інтеграція з CRM, події аналітики
- Базове SEO, карта сайту, редиректи
03
React за дизайн-системою
Вебзастосунок або великий сайт з повторюваними компонентами
- Бібліотека компонентів (кнопки, форми, картки) за Figma
- Next.js або Vite, TypeScript за потреби
- Підключення до вашого API або CMS
- Документація та передача репозиторію
Як працюємо
Аудит макета
Дивимося файл у Figma: чи є мобільні екрани, стани елементів, зрозуміла сітка. Складаємо список питань і фіксуємо обсяг та ціну.
Вибір платформи
Радимо React, Webflow чи WordPress залежно від того, хто буде вести сайт і що він має вміти. Пояснюємо плюси й обмеження кожної.
Верстка
Збираємо компоненти, потім сторінки. На проміжному етапі даємо посилання на тестову версію, щоб ви могли коментувати.
Інтеграції й перевірка
Підключаємо форми, CRM, аналітику. Тестуємо на реальних пристроях і порівнюємо з макетом.
Запуск і передача
Публікуємо на вашому домені та хостингу. Усі акаунти й файли записані на вас. Показуємо, як редагувати контент.
Межі роботи
- Не змінюємо дизайн за вас: якщо в макеті є помилки в логіці чи немає мобільної версії, це окрема робота з дизайну
- Не обіцяємо першу позицію в Google: ми закладаємо технічну основу SEO, а позиції залежать від контенту й конкуренції
- Не робимо ідеальну копію складних 3D чи відеоефектів у WordPress, якщо вони потребують окремої розробки
Часті питання
Що потрібно від мене, щоб почати?
Доступ до файлу Figma, шрифти (або їхні назви), експортовані логотипи та зображення, тексти. Якщо чогось бракує, ми складемо список після аудиту.
Що обрати: React, Webflow чи WordPress?
Webflow підходить для швидких сайтів з візуальним редактором. WordPress — якщо потрібні плагіни й великий каталог. React — для складних інтерфейсів і застосунків. Ми підкажемо на етапі аудиту.
Чи зроблять мій макет з Figma точно один в один?
Ми прагнемо повної відповідності по відступах, шрифтах і кольорах. Невеликі відхилення можливі через відмінності рендерингу в браузерах, але ми їх покажемо й узгодимо.
Скільки коштує верстка?
Кошторис готуємо після брифу й уточнення вимог. Для першого етапу можемо взяти такий обсяг: верстка однієї сторінки до 10 блоків; Адаптив і перевірка в основних браузерах. Склад робіт, оплату й строки погоджуємо до старту.
Як відбувається оплата?
Порядок оплати погоджуємо разом із кошторисом до старту. Якщо проєкт має кілька етапів, описуємо результат і умови приймання для кожного. Підтримку та зовнішні сервіси враховуємо окремо.
Кому належить код і доступи?
Передачу коду, матеріалів і доступів погоджуємо до старту та фіксуємо в умовах роботи. Окремо описуємо сторонні ліцензії й сервіси, якщо вони потрібні.
Почнемо з вашої задачі
Опишіть бізнес, бажаний результат і поточний процес. Після брифу уточнимо вимоги та підготуємо кошторис.