Вчера я одолжил у друга Tesla Model 3. Через 5 минут езды в автомобиле начало запотевать лобовое стекло. Но я не смог найти дефростер на большом экране управления, которым так славятся автомобили марки Tesla. В отчаянии я нажал значок CAR, что привело меня к экрану настроек. В общем, тупик.
Разочарованный, я открыл боковые окна, чтобы очистить лобовое стекло. Нажимая каждую кнопку на руле, я случайно включил голосовое управление и, наконец, смог заставить дефростер включиться. Это произвело на меня очень странное впечатление, и я решил написать в твиттере о том, как это было неприятно:
Только что впервые проехался на Tesla (я знаю, немного запоздало). UX центрального дисплея был на удивление плохим. Я никак не мог найти, как включить дефростер. В конце концов пришлось использовать голосовые команды, после чего появился значок климат-контроля. Довольно опасно.
— Скотт Дженсон (@scottjenson) 28 декабря 2021 г.
Но я и не подозревал, что Тесла обновил пользовательский интерфейс всего несколькими днями ранее. И это оказалось более чем спорно.
Довольно суровые оскорбления и нападки в стиле ad homimum в ответах на мой твит прискорбны, но это ведь Twitter. Однако я был удивлен явным высокомерием и демонстрацией эффекта Даннинга-Крюгера. Эти люди буквально ничего не знают о человеческом восприятии или производительности. Кто-то ошибся в интернете! У меня нет иллюзий, что этот пост убедит TeslaBros в чем-либо, но это интересный пример дизайна UX, который может чему-то научить. Стоит рассмотреть проблему подробнее.
Оригинальное расположение кнопок v10
Новая версия v11
Проблема на самом деле не такая уж и сложная: изначально внизу была видна иконка дефростера. С последним обновлением от декабря 2021 года теперь он скрыт за индикатором температуры. При нажатии на температуру открывается подокно со значком дефростера. Итак, да, это всего лишь 2 касания против 1, но это не может быть так уж плохо, верно?
У Эдварда Тафта есть визуальное правило: 1+1=3. С одной строкой на экране у вас есть только один объект, но добавление второй строки делает кое-что интересное — оно добавляет третий «объект» на экран, отрицательное пространство между ними. Все хорошие визуальные дизайнеры хорошо понимают этот эффект.
В UX-дизайне у нас есть когнитивный эквивалент. Если у вас есть две кнопки, создается третий «объект», решение, которое пользователь должен принять, на какую кнопку нажать. Эта когнитивная нагрузка невидима и редко обсуждается, но она может стать настоящим источником путаницы.
1+1=3 — это одна из причин, по которой существуют международные стандарты для большинства автомобильных значков. Общие и хорошо понятные значки снижают когнитивную нагрузку и помогают пользователям легче осваивать новые устройства. Вот стандартная иконка «Дефростер». Даже Тесла использует его!
Это одна из причин, почему жесткие кнопки так эффективны в автомобилях «старой школы». Все они используют одни и те же стандартные значки, чтобы новым пользователям было проще просматривать их и находить нужный без какого-либо обучения.
Версия программного обеспечения v10 имела стандартный значок дефростера в нижнем ряду. Я хотел бы обсудить плюсы и минусы цифровых и физических кнопок позже, но сейчас я хочу сказать, что предыдущая версия v10 действительно удовлетворяла мои потребности. Я бы просканировал пространство и легко нашел кнопку. Я не против Telsa, я против v11.
Но при переходе на v11 эта панель значков была изменена. Значок дефростера исчез. Никакое «сканирование известного значка» не сработает. Вместо легкой задачи, которую можно выполнить в любой момент, она заменена задачей, требующей обучения: я должен ЗНАТЬ, где она прячется. Я вообще-то должен RTFM. Признаю, что это не самая сложная вещь в мире для изучения. Но когда я двигаюсь со скоростью 70 миль в час по оживленной трассе с запотевшим стеклом усложнения ни к чему… Вот почему автомобильный UX так сложен. Именно контекст и серьезные последствия делают его гораздо более важным, чем в плохо разработанном мобильном приложении.
Самое главное, что в 99% автомобилей на дороге сегодня мне не нужен RTFM, чтобы поворачивать, разгонять, тормозить, использовать сигналы поворота или включать чертов дефростер. Вот почему эти вещи стандартизированы. Есть много вещей, для которых мне, вероятно, понадобится руководство, но не для этих основ. Дизайн v11 сломал это.
Этот новый редизайн использует общий подход к плоскому дизайну: использование простых текстовых меток в качестве кнопок. Когда я искал значок дефростера, я увидел показания температуры, но не предположил, что индикатор температуры может быть кнопкой. В более спокойной ситуации я, вероятно, нажал бы на него, но вместо этого, в легкой панике, я нажал на значок CAR, который завел меня в тупик.
Сделать температуру похожей на кнопку — один из способов улучшить этот значок. Это все равно требовало бы 2 касания, и я бы по-прежнему утверждал, что это опасно, но, по крайней мере, имел бы место более сильный визуальный сигнал, который помог бы мне найти решение.
Автомобильный дизайн — это сложно. «Двигайся быстро и ломай вещи» Tesla отлично подходит для приложений для телефона Swipe-Right, но в автомобиле, где на карту поставлены жизни, они не могут быть так бесцеремонны. Конечно, удаление половины пуговиц выглядит красиво, но за это приходится платить. Визуальный дизайн — не единственная переменная, которую нужно оптимизировать. Я бы предложил ранжировать основные функции, которые вы хотите быстро найти, и поместить их в нижнюю панель. Если это не сработает, я бы поработал над опцией «еще», которая направляет мой взгляд на эти дополнительные скрытые кнопки. Наконец, если вы ДОЛЖНЫ поместить его под метку температуры, потеряйте эстетику плоского дизайна и сделайте его больше похожим на кнопку.
Я хочу, чтобы было совершенно ясно, что это мои первоначальные мысли, и, как и любой правильный дизайн UX, они требуют прототипирования и тестирования для их дальнейшей доработки. Окончательное решение, вероятно, представляет собой некоторую вариацию. Сейчас я предлагаю не конечное решение, а цель, ориентированную на пользователя, которую я пытаюсь достичь.
Разочарованный, я открыл боковые окна, чтобы очистить лобовое стекло. Нажимая каждую кнопку на руле, я случайно включил голосовое управление и, наконец, смог заставить дефростер включиться. Это произвело на меня очень странное впечатление, и я решил написать в твиттере о том, как это было неприятно:
Только что впервые проехался на Tesla (я знаю, немного запоздало). UX центрального дисплея был на удивление плохим. Я никак не мог найти, как включить дефростер. В конце концов пришлось использовать голосовые команды, после чего появился значок климат-контроля. Довольно опасно.
— Скотт Дженсон (@scottjenson) 28 декабря 2021 г.
Но я и не подозревал, что Тесла обновил пользовательский интерфейс всего несколькими днями ранее. И это оказалось более чем спорно.
Довольно суровые оскорбления и нападки в стиле ad homimum в ответах на мой твит прискорбны, но это ведь Twitter. Однако я был удивлен явным высокомерием и демонстрацией эффекта Даннинга-Крюгера. Эти люди буквально ничего не знают о человеческом восприятии или производительности. Кто-то ошибся в интернете! У меня нет иллюзий, что этот пост убедит TeslaBros в чем-либо, но это интересный пример дизайна UX, который может чему-то научить. Стоит рассмотреть проблему подробнее.
Оригинальное расположение кнопок v10
Новая версия v11
Проблема на самом деле не такая уж и сложная: изначально внизу была видна иконка дефростера. С последним обновлением от декабря 2021 года теперь он скрыт за индикатором температуры. При нажатии на температуру открывается подокно со значком дефростера. Итак, да, это всего лишь 2 касания против 1, но это не может быть так уж плохо, верно?
1+1=3
У Эдварда Тафта есть визуальное правило: 1+1=3. С одной строкой на экране у вас есть только один объект, но добавление второй строки делает кое-что интересное — оно добавляет третий «объект» на экран, отрицательное пространство между ними. Все хорошие визуальные дизайнеры хорошо понимают этот эффект.
В UX-дизайне у нас есть когнитивный эквивалент. Если у вас есть две кнопки, создается третий «объект», решение, которое пользователь должен принять, на какую кнопку нажать. Эта когнитивная нагрузка невидима и редко обсуждается, но она может стать настоящим источником путаницы.
Стандарты значков + аппаратные кнопки
1+1=3 — это одна из причин, по которой существуют международные стандарты для большинства автомобильных значков. Общие и хорошо понятные значки снижают когнитивную нагрузку и помогают пользователям легче осваивать новые устройства. Вот стандартная иконка «Дефростер». Даже Тесла использует его!
Это одна из причин, почему жесткие кнопки так эффективны в автомобилях «старой школы». Все они используют одни и те же стандартные значки, чтобы новым пользователям было проще просматривать их и находить нужный без какого-либо обучения.
Tesla v10 была похожа на дизайн автомобилей старой школы
Версия программного обеспечения v10 имела стандартный значок дефростера в нижнем ряду. Я хотел бы обсудить плюсы и минусы цифровых и физических кнопок позже, но сейчас я хочу сказать, что предыдущая версия v10 действительно удовлетворяла мои потребности. Я бы просканировал пространство и легко нашел кнопку. Я не против Telsa, я против v11.
Иконка, иконка, у кого есть иконка?
Но при переходе на v11 эта панель значков была изменена. Значок дефростера исчез. Никакое «сканирование известного значка» не сработает. Вместо легкой задачи, которую можно выполнить в любой момент, она заменена задачей, требующей обучения: я должен ЗНАТЬ, где она прячется. Я вообще-то должен RTFM. Признаю, что это не самая сложная вещь в мире для изучения. Но когда я двигаюсь со скоростью 70 миль в час по оживленной трассе с запотевшим стеклом усложнения ни к чему… Вот почему автомобильный UX так сложен. Именно контекст и серьезные последствия делают его гораздо более важным, чем в плохо разработанном мобильном приложении.
Самое главное, что в 99% автомобилей на дороге сегодня мне не нужен RTFM, чтобы поворачивать, разгонять, тормозить, использовать сигналы поворота или включать чертов дефростер. Вот почему эти вещи стандартизированы. Есть много вещей, для которых мне, вероятно, понадобится руководство, но не для этих основ. Дизайн v11 сломал это.
Плоский дизайн — проигрыш
Этот новый редизайн использует общий подход к плоскому дизайну: использование простых текстовых меток в качестве кнопок. Когда я искал значок дефростера, я увидел показания температуры, но не предположил, что индикатор температуры может быть кнопкой. В более спокойной ситуации я, вероятно, нажал бы на него, но вместо этого, в легкой панике, я нажал на значок CAR, который завел меня в тупик.
Сделать температуру похожей на кнопку — один из способов улучшить этот значок. Это все равно требовало бы 2 касания, и я бы по-прежнему утверждал, что это опасно, но, по крайней мере, имел бы место более сильный визуальный сигнал, который помог бы мне найти решение.
Что делать?
Автомобильный дизайн — это сложно. «Двигайся быстро и ломай вещи» Tesla отлично подходит для приложений для телефона Swipe-Right, но в автомобиле, где на карту поставлены жизни, они не могут быть так бесцеремонны. Конечно, удаление половины пуговиц выглядит красиво, но за это приходится платить. Визуальный дизайн — не единственная переменная, которую нужно оптимизировать. Я бы предложил ранжировать основные функции, которые вы хотите быстро найти, и поместить их в нижнюю панель. Если это не сработает, я бы поработал над опцией «еще», которая направляет мой взгляд на эти дополнительные скрытые кнопки. Наконец, если вы ДОЛЖНЫ поместить его под метку температуры, потеряйте эстетику плоского дизайна и сделайте его больше похожим на кнопку.
Я хочу, чтобы было совершенно ясно, что это мои первоначальные мысли, и, как и любой правильный дизайн UX, они требуют прототипирования и тестирования для их дальнейшей доработки. Окончательное решение, вероятно, представляет собой некоторую вариацию. Сейчас я предлагаю не конечное решение, а цель, ориентированную на пользователя, которую я пытаюсь достичь.
ExConfessor
По-моему, автор текста допускает ту же ошибку, что и люди, переходящие, к примеру, с Windows на Linux. Он возмущается тем, что ему приходится (страшное дело!) учить новый способ сделать нужную вещь, но при этом не задумывается, что старый способ, к которому он привык, когда-то тоже ему не был известен и тоже нуждался в изучении.