Предыдущий проект Следующий проект

Мобильное приложение IsDocIn

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

Мы спроектировали интерфейс мобильного приложения для конечного пользователя, разработали дизайн для iOS и Android, а также сверстали интерфейс в нативное приложение.

Кейс IsDocIn

Проектирование и прототипирование

Заказчик предоставил детально проработанные User Stories, что позволило нам быстро начать работу над прототипом мобильного интерфейса. Мы консультировались с клиентом, как экспертом в области работы медицинских специалистов, и его бэкенд-командой касательно процесса записи на прием. Соблюдение всех требуемых процедур и создание при этом простого и понятного интерфейса было настоящим вызовом. Но сформировав четкое виденье целей проекта и составив перечень необходимых функций, мы успешно создали интерактивный прототип.

Прототип IsDocIn

Пользовательское тестирование

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

Мы провели более продвинутый вариант «коридорного тестирования», когда тестерами выступали сотрудники нашей компании. Так как целевая аудитория приложения — все активные пользователи смартфонов, это было оправдано. Для тестирования мы подготовили несколько основных сценариев, описывающих действия пользователя. Тестирование записывалось с помощью интеграции InVison-прототипа с сервисом Lookback. Всего было записано 16 сессий.

Первый сценарий

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

Второй сценарий

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

Третий сценарий

Этот тест заключался в проверке того, как пользователь будет редактировать созданную запись. Мобильное приложение позволяло добавить напоминание в календарь телефона, сменить дату записи или запросить ранний прием.

Дизайн интерфейса

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

Хотя приложение разрабатывалось под iOS и Android, мы выбрали универсальное решение по навигации внутри приложения. Табы позволяют постоянно держать важные элементы навигации на виду. При этом мы прячем таб-бар, когда необходимо удержать человека на экране, например в момент создания или редактирования записи на прием.

Запись на прием

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

Запись на прием в IsDocIn

Верстка и логика работы интерфейса

Для построения пользовательского интерфейса в Android мы использовали нативные библиотеки обратной совместимости, которые позволяют внедрять в проекты новейшие подходы как в отображении, так и в оптимизации работы UI. С их помощью мы создали единый интерфейс для разных версий ОС.

Придерживаясь требований руководств от Google, мы реализовали анимированные переходы между экранами, а также паттерны взаимодействия со списками. Некоторые элементы дизайна (такие как календарь и радар-прогрессбар) были созданы с нуля, что позволило осуществить гибкую настройку виджетов.

Разрабатывая приложение для iOS, мы использовали новые возможности:

  • Класс UISearchController, с помощью которого производится поиск в имеющихся данных, например, поиск специалистов из списка.
  • Класс UIAppearance, который позволяет задавать некоторые параметры и стили (цвет, шрифт и т. д.) для элементов интерфейса до их непосредственной загрузки. Это экономит время и предотвращает дублирование кода, поскольку мы задаем общий стиль один раз.
  • Refactor to Storyboard… — средство Xcode, с помощью которого можно классифицировать и компоновать экраны одной тематики, облегчая работу с большим количеством экранов в storyboard.

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

Над проектом работали:

  • Максим
    Максим

    Дизайнер

  • Олег
    Олег

    Дизайнер

  • Александр
    Александр

    Android-разработчик

  • Артем Крыщук
    Артем Крыщук

    Android-разработчик

  • Виктор
    Виктор

    iOS-разработчик

Наши проекты