Когда всё работает… но на самом деле нет
Организация образовательных поездок редко выглядит как выстроенный процесс. Чаще это набор таблиц, переписок, звонков и согласований, которые держатся на людях, а не на системе. В какой-то момент всё начинает ломаться: информация теряется, сроки съезжают, а любое изменение тянет за собой цепочку новых задач.
С похожей ситуацией к нам в БВДС пришёл проект платформы образовательного туризма для Фонда науки и технологий Республики Татарстан. Этот проект мы делали вместе с нашим партнёром — Круассан Студио, и именно такой формат нам особенно близок: когда мы подключаемся как часть команды и работаем не только с визуалом, но и с логикой продукта.
На поверхности задача звучала довольно просто — сделать сервис, который помогает подбирать маршруты под конкретный запрос: по бюджету, возрасту группы, длительности и тематике. Но на практике речь шла о гораздо более сложном аспекте — собрать разрозненные процессы в одну понятную цифровую систему.
Сначала логика, потом дизайн
В таких проектах бессмысленно сразу идти в визуал. Если просто нарисовать интерфейс, ничего не поменяется — станет аккуратнее, но не проще.
Поэтому мы начали с базы: разобрали, как вообще устроен процесс, кто взаимодействует с системой, какие шаги проходит, где возникают сложности. Это помогло увидеть общую картину и понять, как всё должно работать на самом деле.
Дальше мы собрали варфреймы — простую структуру будущего продукта. Это тот этап, где проверяется, удобно ли пользоваться системой в принципе.
И только после этого перешли к визуалу, сценариям и состояниям интерфейса. Параллельно важно было сделать макеты такими, чтобы их можно было спокойно передать в разработку и не возвращаться к базовым вопросам.
Одна платформа — разные задачи
Главный вызов был не в сложности интерфейса, а в том, что у платформы сразу несколько типов пользователей.
Организаторы поездок — это, например, учителя или административный персонал школы. Им важно быстро найти маршрут, понять, подходит ли он, и оставить заявку. Без лишних шагов и сложных решений, поэтому они ценят простоту и официальность сервиса. Он должен восприниматься ими, как ресурс, которому можно доверять, ведь они несут ответственность за организацию перед школой и родителями
Туроператоры работают иначе. Они живут внутри системы: добавляют маршруты, обрабатывают заявки, ведут документы. Для них это уже рабочий инструмент продвижения и управления, который должен помогать, а не замедлять процесс. Они хотят показать маршруты красиво, выделиться среди конкурентов и получать понятные заявки.
Администраторы платформы смотрят на всё сверху. Им важно видеть, что происходит в системе целиком, контролировать процессы и управлять данными. Они модерируют контент, управляют пользователями, оценивают статистику платформы и востребованных направлений.
И задача была в том, чтобы всё это не развалилось на три разных продукта, а работало как единая система. Совместно с партнёрами мы продумали сценарии по каждой группе пользователей и собрали карту пользовательских историй, чтобы в процессе проработки продукта ключевые фичи не потерялись. Аналитическая работа и UX-дизайн — одни из самых ключевых этапов при разработке больших сервисов, так, мы можем увидеть всю картину функциональности и избежать большого количества итераций правок в будущем. Также этого помогает спрогнозировать масштабируемость системы и заложить фундамент для её дальнейшего развития.
Первым делом — общая визуальная стилистика и паттерны
Часто под разработкой макетов в дизайне понимают только лишь красивые картинки интерфейса с цветными кнопками и фирменными иллюстрациями, но в реальности — до готовых макетов мы проходим этап не только пользовательской аналитики, но и визуальной. На этом этапе нашими задачами были: попасть в потребности целевой аудитории, нишу и при этом сохранить визуальную связь с Фондом науки и технологий. Здесь мы разделили работу на два направления:
Первое — исследование пользовательских паттернов, или того, как пользователи уже привыкли работать с похожими платформами. Мы сделали упор на анализ прямых конкурентов, но также рассмотрели несколько косвенных, и пришли к тому, что аудитории важны следующие вещи:
- Прозрачная демонстрация официального статуса (бейджи «проверенный оператор», отметки о верификации, документы в карточке маршрута);
- Оформление маршрутов в виде удобных карточек с ключевой информацией, вынесенной в теги;
- Гибкая система фильтров, с помощью которой пользователи типа «Искатели» смогут отфильтровать весь поток туров под конкретно свою задачу;
- Подборки по категориям для пользователей типа «Скроллеры», и для того, чтобы увеличивать среднее время, проведённое на платформе;
- Эмоциональная подача, так как платформа в первую очередь направлена на работу с людьми, взаимодействующими с детьми и организующими путешествия не просто для галочки, а из мотивации создать эмоциональные воспоминания.
Второе — разработка визуальных концепций, учитывающих контекст сферы и фирменный стиль заказчика. Мы предложили три направления: от эмоционального и дружелюбного до строгого, но нескучного, сразу представили эскизы первого экрана, чтобы было понимание, как работает каждый из стилей. Клиент очень быстро определился с концепцией и мы приступили к прототипированию.
Каркас, на котором держится всё
Благодаря чёрно-белым прототипам сервиса мы с командой Круассан Студио смогли сэкономить много времени на переделывание готового дизайна и смогли сосредоточиться на продумывании функциональных преимуществ сервиса. Уже на этом этапе мы определили, как будут выглядеть основные инструменты управления: поисковая строка ручного поиска, ИИ-поиск по запросу пользователя, карточка тура, отдельная страница экскурсии, списки маршрутов и даже чаты туроператоров и организаторов. Так как мы работали с партнёрами и вместе брейнштормили над прототипами, проверяли друг за другом и много обсуждали, со стороны заказчика практически не было правок. Мы выстроили работу итеративно: готовили все экраны в рамках одной группы пользователей, собирали UI Kit и передавали в разработку, а на следующих этапах, если что-то требовало изменений — минимально вносили правки в предыдущие макеты. Это позволило запараллелить дизайн и разработку, благодаря чему мы в итоге сильно сократили сроки финальной сдачи.
Красивые картинки
Хотя дизайн интерфейсов — это не про красивые картинки, а про функциональность, мы уделили большое внимание визуальной составляющей: виду карточек, иконкам, кастомным иллюстрациям — это всё работает на удобство пользователя и скорость совершения целевого действия на платформе.
Главная страница оформлена, как и в большинстве сервисов бронирования и путешествий, в виде поисковой строки с возможностью выбора дат. Здесь также реализован переключатель с ручного поиска на ИИ — ключевую фишку платформы, которая позволяет подобрать нужный маршрут быстрее и без необходимости настройки фильтров или изучения большого количества карточек. Ещё на главной мы отобразили блок с персонализированными подборками для пользователя и предусмотрели блок с популярными маршрутами по Казани — так, наиболее востребованные маршруты будут получать больше просмотров, и здесь открывается пространство для монетизации при дальнейшем развитии продукта.
У каждого тура есть отдельная страница, на которой размещена ключевая информация о маршруте: фотографии точек, программа тура, маршрут на карте с отдельными поп-апами под каждую достопримечательность, отзывы, документация от туроператора, а также предложения с похожими маршрутами.
В рамках личного кабинета туроператора мы проработали вид всех маршрутов и заявок, чтобы их было удобно просматривать, сортировать с помощью системы фильтров и принимать решения об управлении.
Для остальных ключевых блоков мы также проработали дизайн-макеты: система уведомлений, чаты между пользователями, режим редактора маршрута, управление документацией и так далее.
Доработка с помощью нейросетей
В рамках нашего взаимодействия с продуктом была разработана только десктопная версия продукта, а также полноценный UI Kit, благодаря чему команда Круассан Студио смогла с помощью инструментов вайбкодинга собрать версии для других разрешений — телефона и планшета. Со своей стороны мы подготовили всё таким образом, чтобы материалы было удобно передать в нейронку, и переиспользовать при дальнейшем развитии продукта.
Такие проекты хорошо показывают, что цифровой продукт — это не просто набор экранов. Это способ навести порядок в процессах и сделать работу системы прозрачной. И часто главный результат — это не новый интерфейс, а ощущение, что всё наконец стало понятно и работает так, как должно.
Если у вас сейчас похожая ситуация — много разрозненных инструментов, постоянные согласования и ощущение, что всё держится на людях — возможно, дело не в количестве задач, а в том, что системе просто не хватает структуры.