Спи, Малыш
01
Описание
Клиент
Спи, Малыш — это команда сертифицированных консультантов по детскому сну и перинатальных психологов
Задача
Разработка нового сайта компании с продажей услуг: персональные консультации, вебинары, семинары по детскому сну, записи обучающих видео.
- Разработать уникальную платформу сайта под цели и задачи проекта: продажа услуг, продвижение статей и организация личного кабинета с взаимодействием с консультантами
- Учесть дальнейшее расширение возможностей сайта: интернет-магазин, прообраз CRM внутри системы управления сайтом
- Подключить системы оплаты
- Провести аудит дизайн-макетов на тему ошибок в пользовательском взаимодействии и внести коррективы до момента разработки
Введение
Клиент к нам обратился на этапе разработки нового сайта, когда были готовы уже почти все дизайн-макеты нового интерфейса. Старый сайт был сделан на коленках в Wordpress, был неудобен, и на нем была низкая конверсия в заказы.
В довесок дизайн не выглядел профессиональным, не вызывал большого доверия со стороны пользователей и не соответствовал уровню услуг. Немаловажным фактором является отсутствие завершенной адаптивной версии под мобильные устройства. А ведь половина посетителей заходили на сайт именно с таких устройств.
Первая и основная задача — запустить новый, полностью адаптивный и удобный сайт с целью увеличения количества заказов. Вторая задача — в дальнейшем создать систему управления заказами и клиентами, в которую необходимо включить возможность работы консультанта с клиентами, а также создать фундамент для добавления функционала интернет-магазина.
Аудит дизайн-макетов
Первым делом нужно проанализировать дизайн-макеты, предоставленные клиентом, на тему ошибок и неточностей, сформировать список предложений по улучшениям. Этот анализ важно проводить не позднее этапа дизайна (идеально — все сразу продумывать во время проектирования), чтобы можно было быстро внести правки, а не делать это на вёрстке.
По результатам анализа макетов был составлен список рекомендаций. Клиент доверил нам внести правки, и после финального утверждения и доработок мы приступили к процессу вёрстки дизайн-макетов.
Адаптивная вёрстка
Вёрстка — один из важных этапов, определяющий, как будет в итоге выглядеть сайт для потенциалного клиента. Качественная вёрстка позволяет избежать потери конверсии и в целом делает взаимодействие с сайтом лучше и приятнее.
На первом этапе нами были свёрстаны все макеты, которые представил клиент. А в разработку пошла лишь часть, необходимая для первой версии проекта. Остальные свёрстанные шаблоны остались для последующего внедрения. При таком целостном подходе мы получаем стабильную вёрстку всех страниц, и в дальнейшем это помогает избегать ошибок и дополнительного тестирования.
05
Главная страница
Главная страница является агрегатором точек входа на ключевые разделы сайта, это презентация услуг компании. Фактически она не является главной с точки зрения входящего трафика посетителей, поскольку основная часть поступает на страницы статей и на конкретные страницы услуг.
06
Консультации
Страница консультаций — это миникаталог с фильтрами по возрасту. Данный параметр является важным критерием, поскольку потенциальные клиенты ищут услуги под определённый возраст своего ребенка.
07
Видеозаписи
Если мама пропустила онлайн-вебинар по сну — нет ничего страшного, видео можно просмотреть в записи. Каждый купленный вебинар дополнительно сопровождается полезными материалами и ссылками, которые можно посмотреть в личном кабинете.
08
Всё о сне
Данная библиотека знаний по детскому сну содержит множество полезных материалов. Для клиента это источник посетителей, поскольку каждая статья подготовлена не только для мам, но и для поисковых систем. В категориях статей также есть фильтры по возрастам.
Страницы статей призваны обучать родителей полезным методом сна, а также продвигают услуги компании, контекстно предлагая их внутри статьи.
Отзывы
Реальные отзывы по каждому типу услуги подкрепляют доверие к компании. Поэтому для каждого клиента есть возможность оставить свой отзыв, который после модерации будет опубликован на сайте.
10
Оформление заказа
Оформление услуг происходит как в интернет-магазине с понятными шагами: добавление в корзину, переход к форме с информацией о клиенте, подтверждение и оплата онлайн.
Это сделано с учетом последующего добавления интернет-магазина в систему сайта, чтобы можно было добавлять в корзину не только услуги, но и товары. Оформлять и оплачивать сразу в простой и понятной форме.
11
Разработка
После тестирования и финальной приёмки вёрстки наступает этап составления задания на разработку системы управления сайтом. Как ранее отмечалось, нам важно было предусмотреть много моментов, связанных с последующим расширением сайта, а также создать уникальную систему управления товарами и услугами через общую корзину, оформление заказа и оплату.
С учётом дальнейшего развития и расширения сайта (управление клиентами, работа консультантов с клиентами, магазин товаров) было предложено разрабатывать новый сайт на базе фреймворка Yii2, создать уникальную систему, в первую версию которой включить следующие функциональные модули:
- Управление контентом на сайте
- Консультации
- Видеозаписи
- Статьи
- Отзывы
- Модуль корзины и оформления заказа
- Модуль заказов
- Модули оплаты
Остальные модули решено отложить на последующие версии сайта. Подобное дробление на итерации позволяет запускать быстрые версии сайта с минимально-необходимыми возможностями, чтобы уже получать отдачу от проекта.
Плюсы решения кастомного решения для системы управления сайтом на Yii2:
- Большая гибкость при расширении
- Высокая скорость работы системы
- Наличие заготовок по модулям
- Относительно быстрый процесс разработки
- Отсутствие лицензий на использование и продление
Процесс разработки включает следующие работы:
- Создание репозитория проекта в облаке, в нашем случае это Bitbucket
- Поднятие тестовой площадки на сервере клиента, чтобы при итоговых настройках сервера тестировать проект, перед боевой выкладкой
- Проектирование и разработка архитектуры проекта
- Написание модулей
- Подключение шаблонов верстки
- Формирование интерфейса системы управления сайтом
- Тестирование и отладка
После этапа разработки наступил процесс наполнения реальным контентом и комплексное тестирование всех сценариев на различных устройствах. Далее была проведена работа по оптимизации под поисковые системы, чтобы замена на новую версию сайта прошла без сильных потерь по посещаемости.
Результат
В результате мы получили сайт, который принимает заказы и имеет систему управления, заточенную под специфику проекта. Клиент может полностью самостоятельно поддерживать сайт по контенту, включать и отключать реализованные опции. А самое главное, всё это быстро загружается, и сама система может трансформироваться в любом направлении — добавление новых модулей, функций и возможностей будет проще, чем в рамках готовых CMS.
