Дизайн, який розробник реалізує без здогадок.
Прототипи, дизайн сторінок і UI-кіт у Figma — з усіма станами, адаптивом і відступами. Ніяких «а як це має виглядати на мобільному?» посеред розробки.
UI/UX дизайн сайту — це прототип, візуальний дизайн сторінок і UI-кіт у Figma, які розробник реалізує без здогадок. Підходить власникам сайтів і магазинів, яким потрібен власний стиль, адаптив і чіткі стани інтерфейсу. Прототип коштує від 8 000 грн, дизайн сайту — від 30 000 грн, погодинно — від $20, а перші результати з'являються від 1 тижня.
Коли потрібен дизайнер
Від структури до UI-кіту
Спочатку — прототип і структура, де зміни дешеві. Потім — візуал, коли логіка вже погоджена.
Прототип, дизайн або система
- Прототип + 2 концепти
- Всі сторінки desktop + mobile
- UI-кіт
- Супровід розробки
Так виглядає специфікація компонента
Кожен компонент описаний так, що розробнику не треба питати. Економія — десятки годин на уточненнях.
Від брифу до передачі
- тиж. 1ДослідженняБриф, конкуренти, сценарії.
- тиж. 1–2ПрототипСтруктура і логіка сторінок.
- тиж. 2–3ДизайнКонцепти, погодження, всі екрани.
- тиж. 4ПередачаUI-кіт, специфікації, супровід.
Що входить у дизайн
Робота йде від структури до візуалу, бо зміни в логіці дешевші на ранніх етапах:
- UX. Карта сайту, користувацькі сценарії, wireframes ключових сторінок, клікабельний прототип.
- UI. Дизайн-концепт у 1–2 варіантах, усі сторінки для desktop і mobile, іконки, ілюстрації та фото-стиль.
- Дизайн-система. Кольори, типографіка, сітка, компоненти з усіма станами, токени для розробки.
- Передача. Специфікація відступів і поведінки, експорт графіки, супровід розробки.
Файл Figma передаємо у ваш акаунт, і макетами володієте ви. Логотипи та брендинг ми не робимо, лише інтерфейси.
Скільки коштує веб-дизайн і від чого залежить ціна
Веб-дизайн ціна якого залежить насамперед від кількості унікальних екранів і глибини опрацювання. У пакетах діапазони такі: прототип від 8 000 грн, дизайн сайту від 30 000 грн, погодинна робота від $20. Усі проєктні орієнтири зібрані на сторінці цін.
| Фактор | Як впливає на ціну |
|---|---|
| Кількість сторінок і шаблонів | Кожен унікальний шаблон потребує окремого макета для desktop і mobile |
| Концепти | Два варіанти концепту вимагають більше часу, ніж один |
| Складність інтерфейсів | Кошик, фільтри, особистий кабінет мають багато станів |
| Дизайн-система | UI-кіт із компонентами та токенами додає обсяг, але економить час розробки |
| Наявні матеріали | Готовий бриф, референси та контент прискорюють роботу |
| Правки | Два раунди на кожному етапі входять у ціну, додаткові рахуються погодинно |
Дизайн інтернет-магазину: на чому ми робимо акцент
Для магазину важливі сторінки, де приймається рішення про покупку: каталог із фільтрами, картка товару, кошик і оформлення замовлення. Тут легко втратити замовлення через дрібниці. Про типові причини, чому покупці кидають кошик, є стаття чому губляться замовлення на checkout. Окремо опрацьовуємо мобільну версію, бо значна частина відвідувачів приходить із телефона.
Для магазину також варто заздалегідь погодити, як виглядатимуть порожній кошик, помилка оплати, відсутність товару та довгі назви в картках. Такі екрани рідко малюють «з першого разу», але саме вони найчастіше ламають враження від сайту після запуску.
Як проходить робота
- Тиждень 1. Дослідження: бриф, конкуренти, сценарії.
- Тижні 1–2. Прототип: структура й логіка сторінок.
- Тижні 2–3. Дизайн: концепти, погодження, усі екрани.
- Тиждень 4. Передача: UI-кіт, специфікації, супровід.
Прототип дає змогу побачити логіку сайту ще до того, як намальовано перший екран. На ньому легко виявити зайві кроки, неочевидну навігацію та забуті сценарії, а виправлення на цьому етапі займає години, а не дні.
Терміни орієнтовні й залежать від кількості сторінок. Після погодження ви отримуєте не лише картинки, а й структурований файл, у якому легко орієнтуватися: сторінки, компоненти та стилі названі зрозуміло, тож будь-який розробник швидко знайде потрібне. Спочатку ви погоджуєте прототип, і лише потім ми переходимо до візуалу.
Коли дизайнер не потрібен і чим відрізняється наш підхід
Якщо вам потрібна лише реалізація вже готових макетів, то замовляйте розробку сайту або full-stack на Nuxt. Для сайту, який уже працює і потребує лише перевірки якості інтерфейсу, почніть із QA-аудиту інтернет-магазину. А якщо вас цікавить логотип чи фірмовий стиль, це не наш профіль, і ми порадимо брендингову студію.
Практичний результат такий: розробник отримує макети з усіма станами, зокрема помилкою, порожнім списком і завантаженням, і не вгадує, як має виглядати екран. Менше уточнень посеред розробки означає менше переробок.
Кожен компонент описаний так, що розробнику не потрібно перепитувати: розміри, стани, кольори та поведінка. Ми перевіряємо контраст за WCAG і використовуємо токени замість значень «на око». Дизайном займається команда, що сама ж пише код, тож макети враховують можливості реалізації. Оцінити, як це виглядає в практиці, допоможе стаття як обрати підрядника на розробку сайту. Для UI/UX дизайну сайту корисно прийти з прикладами, які вам подобаються, і з тим, що не подобається в нинішньому варіанті. Це скорочує етап дослідження та допомагає швидше потрапити в очікуваний стиль. Коли будете готові, опишіть задачу в брифі.
Скільки раундів правок?
Два на кожному етапі входять у ціну. Зазвичай цього достатньо.
Можна дизайн без розробки?
Так. Макети будуть готові для будь-якого розробника.
Робите логотипи і брендинг?
Ні, тільки інтерфейси. Порадимо брендингову студію.
Хто володіє макетами?
Ви. Файл Figma передаємо у ваш акаунт.
Скільки коштує дизайн сайту?
Прототип коштує від 8 000 грн, повний дизайн сайту — від 30 000 грн, а погодинна робота — від $20. Остаточна сума залежить від кількості сторінок, складності інтерфейсів і кількості концептів. Точну вартість називаємо після опису проєкту.
Скільки часу займає UI/UX дизайн сайту?
Орієнтовно від 1 тижня для простого прототипу і близько 4 тижнів для повного циклу: дослідження, прототип, дизайн і передача розробнику. Терміни залежать від кількості сторінок і швидкості погоджень з вашого боку. Точніший графік складаємо після брифу.
Чим UX відрізняється від UI дизайну?
UX відповідає за структуру: сценарії, навігацію та логіку сторінок, а UI — за візуальну частину: кольори, типографіку й компоненти. Ми починаємо з прототипу, де зміни дешеві, і лише після погодження логіки переходимо до візуалу, щоб правки коштували менше.
Що потрібно від мене для початку роботи над дизайном?
Заповніть бриф і додайте посилання на поточний сайт, якщо він є, та приклади, які вам подобаються. Корисні також опис аудиторії, список потрібних сторінок і тексти. Якщо чогось немає, ми допоможемо скласти це на етапі дослідження.
Розкажіть про проєкт.
Відповімо за 2 робочі години. Оцінка з вилкою ціни і термінів — за 1 день.