Мир — это наш интерфейс — эволюция дизайна пользовательского интерфейса

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

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

Эпоха инструментов

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

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

Эпоха машин

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

Одним из примеров этого является изобретение пишущей машинки в 1868 году Кристофером Лэтэмом Шоулзом. Мы начали нажимать физические клавиши, чтобы создавать слова, по-прежнему руками, но с помощью пишущей машинки вместо ручки. Это сэкономило время и помогло создать последовательный и практичный формат, который можно было быстро принять.

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

Эпоха программного обеспечения

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

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

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

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

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

Apple возглавила эту тенденцию под руководством Стива Джобса. Только когда Джонатан Айв стал более влиятельным в Apple, скевоморфный дизайн постепенно превратился в «плоский» стиль, отмеченный выпуском iOS7 в 2013 году. Мир был готов перейти к менее буквальным репликам и теперь мог оценить простота минималистского интерфейса.

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

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

Материальный дизайн изображает « поверхности и края материала, которые обеспечивают визуальные подсказки, основанные на реальности. Использование знакомых тактильных атрибутов помогает пользователям быстро понять возможности. Основы света, поверхности и движения являются ключом к передаче того, как объекты движутся, взаимодействуют и существуют в пространстве и по отношению друг к другу. ”

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

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

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

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

Сенсорные пользовательские интерфейсы дорого обходятся

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

Но, как знает любой достойный UX-дизайнер, легкость обнаружения и очевидность всегда побеждают. Среди UX-дизайнеров есть поговорка: «Если люди не могут что-то найти, значит, этого не существует».

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

Проблема усугублялась острой конкуренцией между Android и iOS, где iOS изначально лидировала и значительно сократила свои рекомендации по человеческому интерфейсу. Простота выглядела красиво, но дизайнеры скрывали уродливые или сложные компоненты, которые часто усложняли использование интерфейсов. Android эмулировал многие из худших вещей, реализованных Apple, и только после того, как был представлен Material Design, согласованность пользовательского интерфейса стала стандартом в дизайне Android.

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

Пользовательский интерфейс похож на шутку. Если вам нужно объяснить это, это не так уж хорошо. Мартин Леблан, iconfinder.com

Сенсорные интерфейсы работают только на достаточно больших экранах

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

Интернет вещей (IoT) расширяет использование наших повседневных устройств до интерактивных сред и является отличным примером правильной имитации реального оборудования, выдвигая функциональность на первый план. В отличие от Digital Crown, большие циферблаты функциональны и удобны.

Используя визуальные подсказки из оригинального дизайна термостата и включив то, как люди обычно используют циферблаты, Nest Learning Thermostat является примером продукта, который, будучи простым в использовании, легко вписывается в дом.

Force Touch, технология, впервые представленная в 2014 году во время представления Apple Watch, также была развернута на iPhone 6-го поколения и быстро распространилась на все типы устройств.

Пользовательские интерфейсы снова развиваются, чтобы имитировать древние подходы

Следующий уровень эволюции дизайна пользовательского интерфейса показывает, как все проходит полный круг. Apple Pencil — это лучшая аппаратная и программная технология, помогающая пользователям рисовать и писать в цифровом мире. Хотя Apple Pencil сделал эту идею популярной, не так давно (2007 г.) Джобс сказал: «Кому нужен стилус?» прежде чем представить технологию мультитач в iPhone.

У Стива Джобса было мнение об удобстве использования и сложности использования такого маленького стилуса на маленьком экране мобильного устройства; это закончилось тем, что не работало для Microsoft. Большинство ранних устройств Windows Mobile поставлялись со стилусом, а основной технологией сенсорного ввода были резистивные сенсорные экраны, для ввода которых часто требовалось стилус. Инструменты не подходили для того времени, вынуждая людей использовать пероподобное устройство для работы с мобильным пользовательским интерфейсом. Это не казалось естественным.

Когда портативные экраны стали больше, настало время использовать отдельный гаджет для ввода (рисования и рукописного ввода), похожий на перо. Именно по этой причине Apple Pencil дебютировал на большом iPad Pro вместо 9,7- и 7,85-дюймовых моделей меньшего размера.

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

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

Выходя за рамки сенсорного управления — VUI

Если маленькие экраны побудили дизайнеров исследовать другие способы взаимодействия с технологиями, новые варианты использования в разных контекстах вдохновили их на размышления о том, как люди могут использовать технологии.

Голосовые пользовательские интерфейсы помогают улучшить все виды пользовательского опыта, и некоторые считают, что к 2020 году голос будет обеспечивать 50% всех поисковых запросов.

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

Пользовательский интерфейс становится миром вокруг нас

Чтобы помочь окружающему миру стать пользовательским интерфейсом, Google Advanced Technologies and Projects (ATAP Lab) разработала Project Soli, новую сенсорную технологию, которая использует миниатюрный радар для отслеживания движения человеческой руки. Благодаря бесконтактному взаимодействию с помощью жестов взаимодействия кажутся физическими и отзывчивыми, поскольку обратная связь создается за счет тактильного ощущения касания пальцев друг друга.

Технологии и экраны, которые мы используем сегодня, исчезают в нашем окружении. IoT (Интернет вещей) и ИИ с голосовой поддержкой уже здесь. Это начало эпохи «окружающего интеллекта», когда множество устройств работают согласованно, чтобы помочь людям выполнять их повседневную деятельность. Как следствие, экранные пользовательские интерфейсы постепенно исчезают.

Как дизайнеры будут проектировать мир с искусственным интеллектом и «окружающим интеллектом»? Каковы последствия для будущей эволюции дизайна пользовательского интерфейса?

В этом «новом мире» речь пойдет больше о разработке опыта, а не пользовательского интерфейса.

• • •

Дальнейшее чтение в блоге Toptal Design:

• Проектирование VUI — голосового пользовательского интерфейса
• Темные интерфейсы. Хорошее и плохое. Что можно и чего нельзя делать.
• Эвристические принципы для мобильных интерфейсов
• Будущий дизайн пользовательского интерфейса без кнопок
• Переосмысление дизайна пользовательского интерфейса для телевизионной платформы