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