Содержание
Прототип сайта могут создавать разные специалисты: UX-дизайнер (самый частый случай), продуктовый дизайнер, веб-дизайнер (особенно если он совмещает UI/UX), менеджер продукта (Product Manager) в небольших командах или даже владелец бизнеса (при условии, что он разбирается в проектировании интерфейсов). Также прототипирование часто выполняют фриланс-дизайнеры на заказ, а в крупных студиях — отдельный специалист, которого так и называют — «прототипировщик» (или «UX-архитектор»). Главное требование — понимание логики взаимодействия пользователя с сайтом, а не умение красиво рисовать.
Роли, создающие прототипы: подробный разбор
Кто именно делает прототип, зависит от размера команды и сложности проекта.
1. UX-дизайнер (User Experience Designer)
Это основная роль, закреплённая за прототипированием. UX-дизайнер не рисует иконки и не подбирает шрифты (это UI), он проектирует сценарии: как пользователь заходит на сайт, что делает, куда кликает, как оформляет заказ. Он создаёт каркасы (wireframes), кликабельные прототипы, проводит юзабилити-тесты. Инструменты: Figma, Axure, Balsamiq, Miro (для схем).
Когда нужен: в любом проекте от лендинга до портала. Без UX-дизайнера команда рискует сделать красивый, но неудобный сайт.
2. Веб-дизайнер (UI/UX универсал)
В небольших студиях и у фрилансеров один дизайнер может совмещать и UX (прототипы), и UI (графику). Он рисует прототип серыми блоками, утверждает его с заказчиком, затем создаёт цветной дизайн. Для владельца бизнеса это удобнее: один контакт.
3. Продуктовый дизайнер (Product Designer)
В IT-компаниях, где развивается один продукт (CRM, банковское приложение, маркетплейс), дизайнер делает всё: от исследований до финального UI. Прототипирование — часть его работы. Product Designer обычно глубже погружён в бизнес-показатели и технологические ограничения.
4. Менеджер продукта (Product Manager) или бизнес-аналитик
В некоторых командах прототипы на низком уровне детализации (бумажные наброски, схемы в Miro) создаёт PM, чтобы быстро проверить гипотезу. Затем он передаёт «скелет» дизайнеру для проработки. Это экономит время, так как PM лучше знает требования заказчика.
5. Frontend-разработчик или верстальщик
В совсем маленьких проектах (или когда нет бюджета на дизайнера) прототип может накидать сам верстальщик, чтобы показать заказчику расположение блоков. Однако это скорее исключение: разработчик мыслит структурно, а не пользовательскими сценариями, поэтому прототип может получиться неудобным.
| Специалист | Что делает с прототипом | Когда встречается | |
|---|---|---|---|
| UX-дизайнер | Создаёт кликабельные прототипы, проводит тестирование | Всегда в профессиональных командах | |
| Веб-дизайнер (универсал) | Рисует прототип, а потом на его основе делает дизайн | Фриланс, небольшие студии | |
| Менеджер продукта | Быстрые наброски для проверки идей (low-fidelity) | Стартапы, продуктовые команды |
Какой специалист нужен именно вам (для заказчика)
Если вы заказываете сайт и вам нужен прототип, ваши действия зависят от выбранного подхода.
- Вы работаете с веб-студией: в штате есть UX-дизайнер (или он совмещён с UI). Вы оплачиваете этап прототипирования отдельно (или он входит в пакет). Обязательно потребуйте утвердить прототип до начала дизайна.
- Вы нанимаете фриланс-дизайнера: ищите специалиста с портфолио, где есть примеры прототипов (серые схемы, а не только готовые сайты). Убедитесь, что он понимает разницу между UX и UI.
- Вы делаете сайт самостоятельно в конструкторе (SitePro.by, Tilda): никто за вас прототип не сделает, если вы не нанимаете специалиста. Но вы можете сами нарисовать прототип на бумаге или в Figma (бесплатно) — это лучше, чем сразу переходить к блокам в конструкторе и потом переставлять их 10 раз.
- Вы работаете с CMS (Joomla, WordPress): прототип помогает выбрать подходящий шаблон. Нарисуйте схему расположения блоков (где меню, где слайдер, где форма) и покажите разработчику — он подберёт тему, максимально близкую к каркасу.
Процесс прототипирования (кто и что делает по этапам)
- Аналитика (бизнес-аналитик или PM): собирает требования, определяет цели, аудиторию, конкурентов.
- UX-дизайнер: создаёт user flow (схему путей пользователя) и low-fidelity прототип (wireframe) — схематичные блоки без деталей.
- Согласование с заказчиком (UX или PM): правки, утверждение структуры.
- UX-дизайнер (или UI): дорабатывает mid-fidelity прототип (добавляет реальные тексты, условные иконки, но пока без цвета).
- Тестирование на пользователях (UX): можно провести на этом этапе, чтобы выявить проблемы.
- Передача UI-дизайнеру: тот уже на основе прототипа создаёт цветной макет.
В маленьких командах пункты 2-4 может делать один человек.
Почему заказчику не стоит делать прототип самостоятельно (без опыта)
Кажется, что нарисовать схему просто: вот меню, вот логотип, вот текст. Но хороший прототип учитывает:
- Приоритеты: какой блок должен привлекать внимание первым.
- Пути пользователя: сколько кликов нужно до цели.
- Мобильную адаптацию: как сетка перестраивается на телефоне.
- Сценарии ошибок: что видит пользователь, если форма не отправилась.
- Психологические триггеры (например, расположение кнопки «Купить» относительно цены).
Непрофессиональный прототип может упустить эти моменты, что приведёт к переделкам на этапе дизайна или разработки. Поэтому лучше доверить прототипирование специалисту, даже если он фрилансер на несколько часов.
Резюме от эксперта
Прототип сайта создаёт, в первую очередь, UX-дизайнер (или универсальный веб-дизайнер). В небольших проектах это может быть фрилансер или даже PM, но в идеале прототипирование — отдельная компетенция. Если вы заказчик, требуйте прототип на этапе «до дизайна»: это сэкономит вам 30-50% бюджета на правки. Если вы начинающий дизайнер, учитесь делать прототипы (Figma, бумага и ручка) — это навык, который отличает «рисовальщика» от «проектировщика интерфейсов». Помните: красивый, но неудобный сайт никто не будет использовать. А прототип — самый дешёвый способ сделать сайт удобным.
