Разработка прототипа для сайта услуг по ЖД перевозкам
Прототип сайта услуг по ЖД перевозкам. Сегодня рассмотрим прототип сайта услуг по ЖД перевозкам, что должно в него входить, и как он должен выглядеть.
Прототип сайта услуг по ЖД перевозкам
1 Этап анализ конкурентов
Для того, чтобы понять какие страницы должны быть на сайте и с какими коммерческими факторами необходимо сделать анализ конкурентов, что у нас было сделано.
Проанализировано 15 конкурентов и выбраны растущие, на основании этих данных выписаны страницы каждого конкурента.
Пример, как делать анализ конкурентов рассказано в статье "SEO анализ конкурентов для будущего проекта".
2 Этап анализ коммерческих факторов сайтов конкурентов
На данном этапе как раз происходит анализ коммерческих факторов. По итогу у нас получается список пересечений по коммерческим факторам, которые присутствуют у всех конкурентов, и которые дополнительно можно добавить.
Пример коммерческих факторов главной страницы:
1) Логотип
2) Телефон
3) Кнопка “Заказать звонок”
4) Гео
5) Слайдер
6) Категории
7) Оплата
8) Работы
9) Отзывы
10) Вопрос-ответ
11) Прайс
12) И т.д.
3 Этап построения структуры типовых страниц и их вложенность
На данном этапе мы выстраиваем структуру типовых страниц и их вложенность. Результатом будет карта зависимостей и какие прототипы необходимо будет реализовать.
4 Разработка прототипа с учетом п.2
Сейчас мы разберем пример построения прототипа страницы услуги
Прототип страницы услуги
Прототип отдельной услуги по ЖД перевозкам
Прототип 1 - Отдельная услуга - Баннер
Из прототипа 1:
- Хлебные крошки
- Н1
- Калькулятор, как на главной
Прототип 2 - Отдельная услуга - Об услуге
Из прототипа 2:
- Н2
- Текст 1500 символов. Предусмотреть различные типы списков - нумерованный и ненумерованный
- Баннер к услуге
Прототип 3 - Отдельная услуга - Таблица цен услуги
Из прототипа 3:
- Н2
- Тип перевозки
- Активный таб
- Неактивный таб
- Выбор страны отправки
- Ссылка на скачивание прайса
- Таблица - строка. При наведении активная
- Таблицы - столбы. Редактируемые
- Текст 2 строки
- Кнопка “Калькулятор” при нажатии открывается боковая форма
- Ссылка на все тарифы
Прототип 4 - Отдельная услуга - Теги
Из прототипа 4:
- Н2
- Тег - кнопка услуги, при наведение активность, при нажатии переход
- “Показать ещё”, при нажатии показываются все теги и заменяется на “Скрыть”
Прототип 5 - Отдельная услуга - Как работаем
Прототип 6 - Отдельная услуга - Часто задаваемые вопросы
Прототип 7 - Отдельная услуга - Форма
Из прототипа 7:
- Н2
- Кликабельный телефон
- Кнопка “Оставить заявку”, при нажатии открытие боковой формы
- Кнопка “Начать чат - менеджер в сети”, перекидывает на чат с менеджером
- Кнопка “Обратный звонок”, при нажатии открывается боковая форма
Прототип 8 - Отдельная услуга - ГЕО
Итог
Мы с вами рассмотрели построение прототипа на основании действующего проекта. Я вам подробно расписал, как строился прототип страницы услуги по ЖД перевозкам, и какие элементы использовались для построения.
Прототип - это экономия времени на реализацию дизайна сайта, а также творческий рубеж для маркетолога и seo оптимизатора.
В следующем кейсе по прототипам рассмотрим построение другой страницы.
P.S. Прототип - это не дизайн, и в дизайне может отличаться расположение кнопок и ссылок, но вся суть сохраняется в том виде, в котором мы ее закладываем.