Осенью 2016 года я закрыл свою первую компанию и присоединился к Oscar. Миссия Oscar – обеспечить медицинское страхование в 21 веке. Моя задача состояла в том, чтобы провести редизайн наших мобильных приложений, построенных с нуля в React Native.
Весь процесс потребовал массу исследований, прототипирования, тестирования и разработки. В конце концов, мы придумали решение, которое, по нашему мнению, сделает медицинское обслуживание понятнее, доступнее и удобнее.
Вот что для этого понадобилось.
Ревизия и инвентаризация
Когда я добрался до Оскара, я быстро начал планировать 1 на 1 со всеми нашими внутренними командами продакт-менеджеров, чтобы лучше понять приложение.
Я обнаружил, что предыдущая версия приложения не обновлялась более двух лет. В то время Оскар накопил серьезный технический и дизайнерский долг. Наше iOS приложение состояло на 1/3 Obj-C, 1/3 Swift и 1/3 React native.
Мой *самый* первый проект на самом деле состоял в обновлении ленты сообщений, которую вы видите в крайнем правом углу. К сожалению, мы только разместили его в старом «Профиле здоровья»,
После встречи со всеми я начал собирать в Sketch мобильную карту iOS и Android приложений. В общем, у меня получилось около 50-60 скриншотов, которые нужно было собрать вместе. Цель заключалась в том, чтобы лучше понять продукт и увидеть, где существуют несоответствия. Поскольку мы перестраивали оба приложения в React Native, было также полезно провести инвентаризацию всех компонентов нашего пользовательского интерфейса и посмотреть, где у нас были расхождения в размерах.
Одна вещь, которую я сразу заметил – это то, что визуальный бренд и индивидуальность Oscar также эволюционировали. Мобильное приложение больше не соответствовало нашим сайтам и маркетинговым материалам, и мы хотели убедиться, что новый мобильный дизайн хорошо согласован с ними.
К счастью, мне посчастливилось работать с действительно талантливыми людьми. Спасибо Максвеллу, Эмили и всей команде Output. Восхитительные и удовлетворяющие элементы брендинга, которые вы увидите во всем приложении, были сделаны в сотрудничестве с ними, и это действительно оживило приложение.
Делая шаг назад и устанавливая цели
Как только у нас появилась общая картина, мы начали сбор road map и установили более широкие цели для редизайна. Мы сразу же поняли, что мы хотим облегчить людям возможность найти медицинскую помощь, поговорить с врачом и получить доступ ко всей информации о своем здоровье в одном месте.
Мы также хотели, чтобы недостаточно используемые функции, таких как обмен сообщениями с консьержем и запись на прием, стали более востребованными. Доступность будет улучшена за счет введения более крупных размеров шрифта и более темных цветов с более высоким контрастом для улучшения удобочитаемости.
Предлагаемая информационная архитектура для мобильных приложений
Цель состояла в том, чтобы пересмотреть информационную архитектуру приложения, чтобы в будущем приспособиться к новым функциям. У нас есть некоторые интересные новые функции, которые появятся в течение следующего года, и нам нужно больше пространства для расширения.
Доверяйте процессу
После создания road map и согласования наших целей, Адам Карнас и я организовали несколько внутренних интервью. Мы побеседовали со всеми продакт-менеджерами Oscar, чтобы понять, где были ключевые точки трения пользователей в пределах существующего приложения. Мы также использовали онлайн-обзоры и запросы в службу поддержки, чтобы собрать прямой фидбек участников.
После консолидации заметок я с Адамом составил дизайнерский бриф, в котором изложены цели проекта, комментарии заинтересованных сторон, истории пользователей и ключевые сроки выполнения проекта. Мы согласовали это с командой инженеров и убедились, что все, что мы наметили, было выполнимо.
Процесс, процесс, процесс.
Когда мы добрались до подходящего места, мы собрали три разных дизайна для тестирования. Один из них, который динамически изменялся на основе местоположения и доступных сервисов (вариант A), версия «Что видишь, то и получишь», где все наши основные функции были доступны с главного экрана (вариант B), и тот дизайн, который был рекомендован нами, чтобы направлять участников к вещам, которые мы хотели, чтобы они закончили или сделали (вариант C).
Наши оригинальные концепты прототипов для тестирования пользователями (A, B и C слева направо).
Затем мы провели предварительный раунд пользовательского тестирования с членами Oscar. Мы показали им все три прототипа и получили фидбек в течение часа. Все интервью были записаны и задокументированы, чтобы мы могли вернуться и изучить поведение и реакцию пользователей.
Это я в толстовке Pablo в нижнем правом углу.
Некоторые из участников теста не были на 100% уверены в дизайнах, которые мы им показали. Другие дали нам критические отзывы и сказали. Были также пользователи, которые очень хорошо знакомы с приложением, и другие, которые почти не использовали его.
После обработки всех отзывов первого раунда тестов мы быстро поняли, что Вариант B стал победителем. Затем начали совершенствовать взаимодействия, шаблоны навигации и визуальный дизайн для этого прототипа, убедившись, что все будет работать одинаково на iOS и Android устройствах.
Добро пожаловать домой
Три вещи, которые мы хотели подчеркнуть на главном экране: найти врача, поговорить с врачом и поговорить с вашим консьержем. Иллюстрация также динамически изменяется на основе города, в котором вы находитесь.
Доступность
Важной темой в этом редизайне была доступность. Мы хотели, чтобы пользователи имели контекст за нашими услугами и использовали преимущества, которые были для них бесплатны.
Улучшенная телемедицина
Поговорить с доктором и консьержем – две наши самые важные функций. Мы хотели создать более персонализированный опыт и сделать разговор с врачом, менее пугающим.
Вся история вашего здоровья в одном месте
Страхование здоровья – безумно сложная вещь. Большая победа для нас заключалась в том, чтобы в первую очередь собрать самую важную информацию о здоровье наших пользователей. Ваш страховой план, результаты анализов, рецепты и история всегда должны быть доступны.
Улучшенное обучение новых пользователей
Обучение – одна из самых важных частей нашего продукта. Мы хотели научить, как пользоваться нашими новыми услугами и преимуществами, которые входят в страховой план пользователей.
Восхитительный опыт
Сделайте опыт приятным. Синхронизация количества пройдённых шагов была одной из наших наиболее часто используемых функций. Таким образом, мы решили поощрять пользователей, когда они достигли своей ежедневной цели.
Загрузка пользователем файлов
Это была еще одна функция, которую мы создали с нуля во время процесса переработки приложения. Она позволяет пользователям добавлять контекстные изображения или документы, когда они разговаривают со своим консьержем. Это помогает нам лучше соответствовать вашим потребностям.
Просмотр результатов
На прошлой неделе мы выпустили обновление приложения и тщательно отслеживали взаимодействие и поведение пользователей. Вот некоторые предварительные числа за последние 7-10 дней. Действительно рад получать данные и использовать их для принятия более обоснованных дизайн решений.
Основные выводы
Как команда, мы много узнали о процессе редизайна и передовом опыте перехода от проектирования к разработке. Вот некоторые из ключевых выводов:
- Когнитивная перегрузка реальна. Участники предпочли более прогрессивный поток информации с меньшим количеством вариантов на каждом этапе. Не подавляйте людей слишком большим количеством вариантов сразу.
- Вопрос названий. Стандартная отраслевая терминология, такая как диспансеризация, не является интуитивной для пользователей. Там, где это возможно, лучше использовать вместо этого поясняющий описательный язык.
- Всегда группируйте связанную информацию. Объединив связанную информацию о здоровье в одну вкладку, мы делаем ее понятной и упрощаем пользователям к ней доступ.
- Персонализация. Участники хорошо отреагировали на реальные фотографии своих консьержей и иллюстрации с привязкой к геотаргетингу.
- React Native лучше всех. Хотя для реорганизации кода всего приложения в React Native потребовалось немного больше времени, это даст разработчикам больше времени для создания новых функций, а не для поддержки отдельных версий приложения.
Будущие обновления
В ближайшие месяцы команда проведет дополнительные обновления, которые помогут пользователям сохранить предпочтительных врачей, медицинские центры и консьержей в одном месте. Все это помогает им принимать более обоснованные решения о том, каких врачей посетить и когда это сделать.
Мы также начали систематизировать наш дизайн-процесс, построив компоненты пользовательского интерфейса как часть нашей мобильной анатомии в React Native. Это позволяет быстро выполнять итерацию, ускорять время разработки и поддерживать согласованность дизайна.
Хочу посмотреть, что получится.
Выражаю благодарность всей дизайн команде Oscar за помощь в работе над этим релизом. Frank G, Maxwell Holyoke-Hirsch, Gabe Schindler, Josh Long, Adam Karnas, Gabbie Williams, Anthony Zhang, Emili Hsu ??
Перевод статьи Regy Perlera
Топ коментарі (0)