Разработали веб-приложение для сервиса консультаций с психологами. Кейс «Поговорим.онлайн»

В начале 2022 года к нам обратилась компания Talk to me — крупный психологический центр с командой опытных специалистов, собственной школой по подготовке терапевтов и офисом на Патриарших прудах. Они называют себя корпорацией добра и стремятся изменить мир к лучшему, оказывая людям психологическую поддержку.

Задачи были такие:

- Создать максимально простой интерфейс для сервиса, в котором одинаково легко разберется клиент и терапевт

- Разработать многофункциональный личный кабинет для клиентов и терапевтов, где в одном месте собрано расписание, история посещений и платежей, подключение к онлайн консультации, чат встречи, связь с клиентским сервисом

- Продумать адаптивный дизайн, чтобы сайтом было удобно пользоваться и со смартфона, и с компьютера с большим монитором

- Использовать в интерфейсе визуалы, созданные другим дизайн-агентством

В процессе работы над проектом мы:

- Интегрировали элементы из брендбука в интерфейс платформы, сохранили эстетику, использовав фирменные цвета, шрифт и логотип

- Задизайнили экраны для трех разных точек входа: клиент, терапевт и бизнес

- Упростили интерфейс

- Создали с нуля кастомный календарь

- Подключили внешний видеочат для сессий с клиентами

- Настроили прием платежей без переплат за комиссию

- Бонус: сделали лендинги для партнерских проектов Поговорим.онлайн с брендами Аскона и Медси

Заказчик пришел не просто с идеей, а с готовым брендбуком: в нем уже были цвета, иллюстрации, логотип и шрифты. Брендбук разработало другое дизайн-агентство. Поэтому нам не нужно было подбирать цветовую палитру, шрифты и фоновые изображения.

Полноценные картины, которые изначально были в брендбуке, в интерфейс приложения не перенести. Но некоторые из них мы использовали в дизайне экранов авторизации и лендинга — там они смотрелись органично.

Мы сохранили уникальный стиль и эстетику, взяв из брендбука фирменные цвета, шрифт, логотип и отдельные иллюстрации.

И, конечно, общее настроение: картины со спокойными зелеными оттенками и растительными элементами стали для нас референсом, когда мы готовили дизайн-концепт проекта.

В сервисе «Поговорим.онлайн» у пользователя есть три точки входа: клиент, терапевт и бизнес. Для каждой из этих ролей платформа визуально выглядит по-разному, хотя и соединена общей концепцией. Заказчик предложил отразить это в дизайне еще на этапе авторизации. И мы сделали экраны с тремя разными иллюстрациями — использовали полноценные картины, созданные дизайн-агентством.

Клиенты видят самый «зелёный» экран: волшебный лес, в котором человеку предстоит познакомиться с собой в начале пути к осознанности и гармонии с окружающим миром.

Терапевты — светлую картинку, поскольку психологи приносят свет и знания. 

Бизнес — более официальный темный фон с контрастными элементами.

Посмотрите, как выглядят домашние страницы клиента и терапевта после авторизации: белый фон, минималистичные кнопки и редкие акцентные иллюстрации.

При разработке логики приложения мы учли, что пользователь может испытывать тревогу или быть в депрессии. В таком состоянии тяжело принять решение, даже если помощь необходима. Перегруженный интерфейс или любое дополнительное действие могут отпугнуть.

Один экран = одна большая зелёная кнопка. Это одно из главных правил в дизайне «Поговорим. онлайн». Так, пользователь сразу видит, куда ему нужно нажать, чтобы записаться на консультацию или оплатить сессию.

Боковое меню. Мы сделали постоянную навигацию слева от основного контента — например, на экране «Мои консультации» клиент сразу видит кнопки «История консультаций», «Мои терапевты» и FAQ. Ему не нужно лезть в шапку сайта или открывать гамбургер-меню, чтобы перейти в нужный раздел.

Обратная связь. Когда пользователь записывается на сессию или отменяет ее, в правом нижнем углу ему приходит уведомление о том, что всё прошло успешно. Это важно, чтобы клиенту не надо было перепроверять в календаре, получилось ли выполнить то или иное действие. Сервис моментально выдает яркий визуальный отклик.

В «Поговорим. онлайн» клиенту не нужно ждать, пока терапевт подтвердит запись на сессию — это происходит автоматически. Достаточно выбрать свободный временной слот и нажать «Записаться». Если у терапевта поменялась ситуация, он может в чате договориться с клиентом о другой дате. Если же терапевт вынужден отменить сессию, деньги клиенту вернутся в полном объеме.

Чтобы терапевты точно видели все назначенные сессии и приходили на них, надо было создать удобный и практичный календарь.

Вот какие фичи мы добавили:

Цветовая навигация. Слоты в календаре подсвечиваются разными цветами по своей тематике: сессия с клиентом или свободное окно. Благодаря этому нюансу в интерфейсе проще разобраться.

Бронь временных промежутков. Терапевту не надо бронировать в календаре все временные слоты вручную. Он может задать промежуток: например, с 12 до 18 часов. Время автоматически разобьется на интервалы по 55 минут. 5 минут — это стандартный перерыв.

Паттерн для расписания. Можно выбрать, когда повторять график на день: «каждый будний день», «каждый понедельник» и так далее. Это тоже упрощает работу с календарем.

Отмена нескольких сессий за раз. Если терапевту нужно отменить сразу несколько консультаций, он может сделать это одной кнопкой. При этом остальное расписание не «уедет», несмотря на то, что реальное время консультаций — не час, а 55 минут. Эти 5 минут перерыва сохранятся так, чтобы каждый слот начинался ровно в заданное время: 13:00, 14:00 и так далее.

Мы предложили клиенту разработку собственного видеочата — это хорошая разовая инвестиция на старте, которая в дальнейшем даст независимость от внешних сервисов.

Кроме того, мы уже внедряли такое решение на других проектах, и знали, что получится надежно и окупится со временем. Единственный минус — сроки и цена: это заняло бы минимум 200 часов.

Клиенту такой вариант не подходил — он решил запуститься быстрее. Тогда мы стали искать альтернативу: готовый сервис «из коробки», который нужно просто подключить к платформе. Сначала заказчик предложил использовать Twilio. Но это зарубежная платформа, и ее в любой момент могли заблокировать — пришлось бы всё переделывать. Мы посоветовали не рисковать.

После обсуждения и долгих поисков остановились на Agora — приложении для видеозвонков. Настройка заняла 30 часов.

В дальнейшем, возможно, мы еще разработаем для клиента свою платформу под эту задачу, если потребуется: всё-таки платить в Agora абонентскую плату за каждый звонок — слишком накладно.

Проблем с реализацией приема платежей почти не было: мы уже отработали логику на другом сервисе онлайн-психотерапии для заказчика из Англии.

Например, мы учли, что деньги у клиента не должны списываться сразу после брони сессии. Иначе возможны ситуации, когда пользователь передумает и вернет деньги — придется делать возврат, а за это заказчику нужно будет заплатить комиссию.

Вместо этого сделали так, чтобы деньги списывались за 24 часа до начала консультации — по правилам «Поговорим.онлайн», в это время уже нельзя оформить возврат, поэтому при отмене сессии деньги просто «сгорят».

Благодаря этому не придется гонять средства туда-сюда между платежными системами, а значит, заказчик в перспективе будет тратить меньше денег на комиссии.

Еще мы сделали так, что оплата, которая списывается за сутки до сессии, «замораживается» на escrow-аккаунте. Деньги на время становятся ничьими: уже не клиента, но еще не терапевта и платформы.

После завершения сессии, в течение 12 часов, мы разделяем деньги и «Поговорим. онлайн» получает свой процент, а терапевт оплату за сессию. Это позволяет «Поговорим.онлайн» платить налог только со своей выручки.

В рамках этого проекта перед нами стояли две дополнительные задачи: создание лендингов для партнерских проектов Поговорим.онлайн.

Первый проект был запущен в сотрудничестве с компанией Аскона, ведущим производителем и ритейлером товаров для здорового сна. Его цель — помочь людям справиться с тревожностью и улучшить качество сна. Для этого Поговорим.онлайн собрали команду терапевтов, специализирующихся на проблемах сна, готовых оказать профессиональную поддержку.

Визуальные решения для лендинга были разработаны с использованием иллюстраций из брендбука.

Посмотрите, что у нас получилось:

В темных тонах оформлена только главная страница лендинга, а для последующих разделов мы использовали светлые оттенки, чтобы создать ощущение легкости и визуального комфорта.

Также мы создали лендинг и дизайн платформы для совместного проекта Поговорим.онлайн и федеральной сети клиник Медси, известной своими высокими стандартами медицинского обслуживания и внедрением инновационных технологий.

Осенью 2023 года Поговорим.онлайн стали партнерами Медси по направлению онлайн-психологии в их мобильном приложении SmartMed. Теперь пациенты клиник могут получать видеоконсультации у терапевтов Поговорим.онлайн прямо через приложение.

Мы сделали версии для веб-приложения и мобильных устройств.

За время совместной работы почти 200 пациентов Медси прошли консультации у специалистов Поговорим.онлайн, а в общей сложности было проведено около 750 сессий.

Мы рады поделиться историями успеха наших клиентов. И особенно рады, что внесли свой вклад в создание такого важного и сильного проекта!

Поговорим.онлайн продолжает активно развиваться — весной 2024 года крупнейший российский медиахолдинг Shkulev Media стал их стратегическим партнером и вошел в состав акционеров.

Сегодня Поговорим.онлайн — это пространство, где соблюдаются самые высокие стандарты качества в индустрии, обеспеченные многолетним опытом и строгим отбором специалистов.