Дизайн Glory Mlory
306

Пользовательский интерфейс Tesla с сенсорным экраном: на примере UI Car-Dashboard

При поддержке канала https://t.me/uxidesign

В закладки

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

Для тех, кто водит машину более 10 лет, вождение современного автомобиля - совершенно другой опыт. Новые автомобили оснащаются камерами заднего вида, датчиками препятствий, системой помощи при парковке, помощи при смене полосы движения, адаптивным круиз-контролем, автопилотом и даже веб-браузерами. Многие из этих функций должны сделать вождение более безопасным и комфортным занятием. Так и будет, но только если дизайнеры автомобилей поймут, что человеческое внимание ограничено. И они должны проектировать сложные автомобильные особенности так, чтобы они не отнимали внимание от вождения.

Программные кнопки, требующие внимания

Модель S Tesla имеет несколько физических элементов управления - все они расположены на руле или очень близко к нему. Функции управления автомобилем, такие как круиз-контроль, автопилот, дворники и освещение, доступны через эти элементы управления. Но большинство «второстепенных» функций (включая камеру заднего вида, мобильный телефон, медиаплеер и климат-контроль) не имеют специальных физических элементов управления.

Вместо этого основным способом их выбора является 17-дюймовый сенсорный дисплей, расположенный на приборной панели между сиденьями водителя и пассажира. Несмотря на большой экран (в три раза больше iPad), он не может показать все, что еще больше усложняет ситуацию. В 9-й версии операционной системы Tesla некоторые функции помещены в расширяемое меню.

Сенсорный экран Tesla Model S.
Значок стрелки (третий слева в главном меню; вверху) открывает подменю с дополнительными элементами управления (внизу). Чтобы закрыть это меню, пользователи должны нажать значок «X», который теперь появился в исходном меню, вместо значка стрелки.

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

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

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

Плохой целевой дизайн

Целевое размещение увеличивает время взаимодействия

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

Раньше стандартное положение рук было 2–10 (соответствует цифрам 2 и 10 на часах). С распространением подушек безопасности и руля меньшего размера Национальная администрация безопасности дорожного движения (НАБДД) изменила свою рекомендацию, и теперь 3–9 расположение стало самым безопасным. Для обоих этих вариантов размещения оптимальное положение управления должно быть на среднем левом краю экрана, рядом с правой рукой водителя. Тем не менее, элементы управления модели S расположены в самом низу 17-дюймового экрана - область, которая является наихудшей из возможных (после правого края экрана).

Красная линия указывает расстояние между нормальным положением правой руки (в 3 часа) и областью управления.

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

В данном меню наиболее часто используемые функции должны быть самыми доступными. Тем не менее, решения Tesla относительно порядка элементов управления в меню в лучшем случае сомнительны. Первый вариант - это доступ ко всем настройкам и настройкам автомобиля - то, что вряд ли будет часто использоваться во время вождения. Камера заднего вида (существенная функция в автомобиле, вид сзади которого частично заблокирован подголовниками на задних сиденьях) доступна в меню со стрелками, как и сотовый телефон. Вместо того, чтобы находиться непосредственно над значком стрелки (чтобы минимизировать время перемещения пальца), Календарь, Энергия и Сеть (для веб-браузера) перечислены первыми. (Как часто вы будете использовать их во время вождения по сравнению с камерой заднего вида и телефоном?)

Целевой размер

Другим фактором времени достижения цели является размер цели: чем больше кнопка, тем быстрее она будет достигнута. Тем не менее, с версией 9 Tesla решила уменьшить свои кнопки (предположительно, чтобы разместить больше опций в видимой строке меню - 7 в версии 8 по сравнению с 10 или 11 в версии 9). Это искушение, которому поддались многие мобильные дизайнеры, но, к сожалению, это не приводит к пригодным для использования проектам.

Значки для управления медиаплеером («Воспроизведение / Пауза», «Нравится», «Далее») меньше рекомендуемого размера сенсорной мишени 1 см х 1 см. Однако вкладки в нижней части дисплея медиаплеера («Радио», «Потоковая передача», «Телефон» и т. Д.) намного больше (и они также содержат метку и значок - практика, которую мы настоятельно рекомендуем).

Случайные прикосновения

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

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

Карта всегда на экране

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

Тем не менее, приложение карты Tesla всегда отображается в фоновом режиме всех приложений. В результате строка состояния (в самой верхней части экрана) может быть не читаемой, поскольку сливается с текстом карты. Более того, может быть совершенно неуместно (и потенциально отвлекать) видеть ярко окрашенную улицу, появляющуюся между двумя окнами приложения, как на скриншоте ниже. Кроме того, тот факт, что ни одно приложение не может быть отображено в верхней части экрана, не только лишает пользовательский контроль (и противоречит одной из 10 эвристик юзабилити), но и является расточительным, заставляя пользователей видеть в верхней части небольшую часть карта, которая несет очень мало информации.

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

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

Понимание отображаемой информации может стимулировать

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

  • Старомодное зеркало заднего вида с боковыми зеркалами и поворотом головы влево / вправо, чтобы проверить наличие полосы движения
  • Камера заднего вида (В предыдущих версиях ОС Tesla можно было прикрепить ее в верхней части основного сенсорного экрана. Теперь она никогда не находится в самом верху, поэтому, чтобы взглянуть на нее, ваши глаза должны двигаться с дороги вниз на сенсорный экран.)
  • Функция вспомогательного движения по полосе на дополнительном экране, которая отображает красную линию, когда вы включили сигнал поворота, но полоса недоступна

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

Проблема в том, что ни один из этих источников информации не является полным (например, вид сзади зеркала частично заблокирован подголовниками), и к тому времени, когда вы их все проверяете, вы уже достигли пункта назначения. Таким образом, то, что в итоге делает большинство людей, - это быстрое сокращение затрат на взаимодействие и использование только одного из этих источников информации. Какую из них вы, скорее всего, выберете? С наименьшим взаимодействием: помощник по полосе отображается на дополнительной приборной панели, которая всегда появляется, когда включен сигнал поворота.

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

Итак, если люди в конечном итоге выполняют одну и ту же задачу быстрее, это хорошо, верно? Было бы хорошо, если бы это решение гарантированно работало при любых обстоятельствах. На самом деле, Тесла предостерегает от того, чтобы полагаться исключительно на помощь при смене полосы движения. Даже за исключением ошибок датчиков (которые встречаются чаще, чем можно было бы ожидать), может быть сложно правильно интерпретировать отображаемую информацию. Проблема заключается в том, что пользователь может не распознать, к какой полосе применимы вспомогательные дорожки. Чтобы понять почему, представьте, что вы едете по дороге с тремя полосами движения и хотите переключить полосы с крайней правой полосы на среднюю. Когда вы включите сигнал поворота, автомобиль может показать, что полоса свободна. Но, как только вы достигнете средней полосы движения, машина покажет информацию о переходе на левую полосу движения, поскольку ваш сигнал поворота все еще включен. Тем не менее, пользователи не всегда в полной мере осведомлены о местонахождении своего автомобиля - так как они могут проверить вспомогательный дисплей полосы движения, включить переключатель полосы движения, а затем снова проверить дисплей, заметить красное предупреждение (которое на этот раз будет относиться к переключению на следующую полосу), неверно истолковать это как относящееся к их текущей цели и паниковать, свернув машину обратно в исходную полосу.

Этот пример указывает на важную дилемму, с которой сегодня сталкиваются дизайнеры и производители автомобилей. Новые функции, такие как автопилот (или самостоятельное вождение), помощь в полосе движения, обнаружение столкновений и т. д., Могут заменить хорошо усвоенные традиционные привычки водителя, такие как оглядывание через плечо или проверка зеркал. Если эти функции использовать проще, чем выполнять жесты и действия, которые мы изучали в автошколе, то они заменят эти действия ( мы всегда выбираем решение, которое требует наименьших усилий - не потому, что мы ленивы, но потому что мы работоспособны). Вот почему мы слышим в новостях о том, что люди наносят макияж, играют в игры или даже спят за рулем - потому что современные автомобили делают это безопасным. Тем не менее, мы как дизайнеры несем ответственность за создание правильной модели мышления и предоставление людям правильного понимания того, как работают наши системы, чтобы гарантировать, что, вытеснив эти старомодные модели поведения, мы не сделаем вождение более опасным.

О хорошем

Как мы отмечали выше, в пользовательский интерфейс Tesla можно внести множество улучшений. Но есть и несколько элементов хорошего дизайна.

  • Большой экран - плюс: это дает возможность видеть несколько окон приложений рядом. Переключение приложений может быть затруднительным (так как оно включает в себя несколько нажатий и просмотр экрана), но возможность видеть несколько из них (например, камеру заднего вида и карту или медиаплеер) одновременно облегчает задачу водителя. Вождение - это ситуация, когда людям действительно необходим одновременный доступ к нескольким источникам информации (например, к карте и камере заднего вида), и одновременный просмотр всех этих окон значительно снижает нагрузку на рабочую память пользователя. (Напротив, даже на самых больших планшетах люди редко разделяют экран, чтобы показывать несколько окон одновременно, хотя эта функция уже давно используется.)
  • Приложение карты обогащено информацией, конкретно для Tesla. Например, несмотря на то, что приложение основано на Google Maps, у него есть несколько параметров, характерных для владельцев Tesla:
  • a. расположение нагнетателей автоматически отображается на карт
  • b. при навигации к пункту назначения на карте показано, сколько заряда останется в батарее на момент достижения пункта назначения
  • c. навигационное приложение позволяет пользователям получать указания, основанные на использовании полос автопарка

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

4. Tesla всегда подключена к Интернету и может получать обновления по воздуху. Эту функцию можно рассматривать как как плюс, так и как минус. Преимущество заключается в том, что ошибки могут быть быстро исправлены, веб-сайт может менять цвета с одного дня на следующий. Аналитические данные о драйверах можно легко подключать, сообщать об ошибках и исправлять проблемы. К сожалению, постоянно меняющийся интерфейс может также создать потенциально фатальные проблемы, если ожидания пользователей, сформированные в предыдущих версиях, теперь внезапно нарушаются. (Кроме того, нужно верить, что производитель автомобилей будет использовать только безопасные, хорошо протестированные версии операционной системы.)

Выводы

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

Оригинал статьи: Tesla’s Touchscreen UI: A Case Study of Car-Dashboard User Interface.

Материал опубликован пользователем. Нажмите кнопку «Написать», чтобы поделиться мнением или рассказать о своём проекте.

Написать
{ "author_name": "Glory Mlory", "author_type": "self", "tags": [], "comments": 1, "likes": 0, "favorites": 9, "is_advertisement": false, "subsite_label": "design", "id": 70030, "is_wide": false, "is_ugc": true, "date": "Fri, 31 May 2019 19:31:29 +0300" }
{ "id": 70030, "author_id": 301918, "diff_limit": 1000, "urls": {"diff":"\/comments\/70030\/get","add":"\/comments\/70030\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/70030"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 199114, "last_count_and_date": null }

1 комментарий 1 комм.

Популярные

По порядку

0

Езжу на механике. Менее чем через год вождения перестал держать обе руки на руле. Да, где-нибудь за городом, где много поворотов или на серпантинах держу руль обеими руками, но в условиях городской езды оно зачем? Тут чаще переключаешь коробку передач правой, езда более медленная и размеренная

Ответить
0
{ "page_type": "article" }

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } } ]
Компания отказалась от email
в пользу общения при помощи мемов
Подписаться на push-уведомления
{ "page_type": "default" }