Илья Бир­ман

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

🔍 Начните печатать, чтобы искать по книге или перейти к нужной странице по номеру

Удобно листать не только прокруткой, но и клавишами‑стрелками:

 
между важными местами
Shift
между
разворотами
Илья Бир­ман

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

Илья Бир­ман

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

Изда­тель­ство Бюро Гор­бу­нова
2017
Илья Бирман

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

Издательство Бюро Горбунова
2017
удк 655.262
ббк 85.15
Б64
Бир­ман И. Б.
Б64
Поль­зо­ва­тель­ский интер­фейс. —
М.: Изд‑во Бюро Гор­бу­нова, 2017
ISBN 978‑5‑9907024‑1‑7

Пред­став­ляем книгу Изда­тель­ства Дизайн‑бюро Артёма Гор­бу­нова — прак­ти­че­ское руко­вод­ство по поль­зо­ва­тель­скому интер­фейсу. Учеб­ник пред­на­зна­чен для дизай­не­ров, редак­то­ров, руко­во­ди­те­лей, раз­ра­бот­чи­ков и всех, кто при­ча­стен к созда­нию продуктов.

УДК 655.262
ББК 85.15
ISBN 978‑5‑9907024‑1‑7
© Изда­тель­ство
Бюро Гор­бу­нова, 2017

Оглавление

    Принципы 4

    Взаимодействие 86

    Язык 213

    Экраны 311

удк 655.262
ббк 85.15
Б64
Б64
Бирман И. Б.
Пользовательский интерфейс. —
М.: Изд‑во Бюро Горбунова, 2017
ISBN 978‑5‑9907024‑1‑7

Представляем книгу Издательства Дизайн‑бюро Артёма Горбунова — практическое руководство по пользовательскому интерфейсу. Учебник предназначен для дизайнеров, редакторов, руководителей, разработчиков и всех, кто причастен к созданию продуктов.

УДК 655.262
ББК 85.15
ISBN 978‑5‑9907024‑1‑7
© Издательство
Бюро Горбунова, 2017

Оглавление

    Принципы 4

    Взаимодействие 86

    Язык 213

    Экраны 311

Скрыто 17 разворотов

Двух­мер­ность ком­пью­тер­ного дис­плея про­во­ци­рует про­грам­ми­ста на упро­щён­ное, «линей­ное» пред­став­ле­ние функ­ций. Когда у про­граммы появ­ля­ется новая функ­ция, нужно про­сто доба­вить кнопку в конец тул­бара. За объ­еди­не­нием кно­пок в тул­бары сле­дует объ­еди­не­ние самих тул­ба­ров в сло­ё­ные пироги.

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

Примеры — программы «Е‑Фильм» и «Хром»

«Е‑Фильм»

«Хром»

Двухмерность компьютерного дисплея провоцирует программиста на упрощённое, «линейное» представление функций. Когда у программы появляется новая функция, нужно просто добавить кнопку в конец тулбара. За объединением кнопок в тулбары следует объединение самих тулбаров в слоёные пироги.

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

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

Консоль управления Микрософта — конструктор безразличных к смыслу административных интерфейсов

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

Консоль управления Микрософта — конструктор безразличных к смыслу административных интерфейсов

При­ло­же­ния на Айфоне пока­зы­вают уве­дом­ле­ния: при­шло письмо, скоро встреча или кому‑то понра­ви­лась ваша фото­гра­фия. Часто мало­зна­чи­тель­ные уве­дом­ле­ния отвле­кают от дела, но порой важно полу­чить их вовремя. Айфон не знает, какие уве­дом­ле­ния важ­ные, а какие — нет, поэтому чело­веку предо­став­ля­ется спе­ци­аль­ное меню для их настройки.

Меню выгля­дит проще, чем дерево на преды­ду­щем раз­во­роте, но поль­зо­ваться им так же тяжело. На пер­вом уровне — все уста­нов­лен­ные при­ло­же­ния. Это как мини­мум несколько десятков.

Для каж­дого при­ло­же­ния нужно решить, какую ком­би­на­цию пара­мет­ров уста­но­вить: где и в каком виде появится уве­дом­ле­ние, каким будет сопро­вож­даться зву­ком, скро­ется ли само или дождётся реак­ции поль­зо­ва­теля. Про­цесс настройки чудо­вищно утомителен.

В девя­той вер­сии Ай‑ОСа выби­ра­ется мак­си­маль­ное коли­че­ство уве­дом­ле­ний одного при­ло­же­ния в «Цен­тре уве­дом­ле­ний». Но это число лишено смысла. Если поста­вить пять, важ­ным может ока­заться шестое.

Всё это далеко от того, что вол­нует поль­зо­ва­теля. Было бы полезно полу­чать уве­дом­ле­ния от одних людей и не полу­чать от дру­гих — неза­ви­симо от при­ло­же­ния. Когда при­хо­дит раз­дра­жа­ю­щее уве­дом­ле­ние, была бы полезна кнопка «нико­гда такое не пока­зы­вать». Если при­шло во время встречи — «напом­нить после встречи». Когда ста­вишь будиль­ник — «и заодно отклю­чить уве­дом­ле­ния до утра».

Список приложений

Параметры выбранного приложения

Параметры выбранного приложения

Список приложений

Параметры выбранного приложения

Параметры выбранного приложения

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

Меню выглядит проще, чем дерево на предыдущем развороте, но пользоваться им так же тяжело. На первом уровне — все установленные приложения. Это как минимум несколько десятков.

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

В девятой версии Ай‑ОСа выбирается максимальное количество уведомлений одного приложения в «Центре уведомлений». Но это число лишено смысла. Если поставить пять, важным может оказаться шестое.

Всё это далеко от того, что волнует пользователя. Было бы полезно получать уведомления от одних людей и не получать от других — независимо от приложения. Когда приходит раздражающее уведомление, была бы полезна кнопка «никогда такое не показывать». Если пришло во время встречи — «напомнить после встречи». Когда ставишь будильник — «и заодно отключить уведомления до утра».

Икона тех­но­за­ви­си­мо­сти — куар­код. Тут видно каж­дый бит, что наве­вает вос­по­ми­на­ния о моде­мах с их харак­тер­ным зву­ком соединения.

Когда можно про­чи­тать всё о кар­тине в музее, про­сто наведя на неё теле­фон — это вол­шеб­ство. Но если наво­дить нужно не на кар­тину, а на рас­по­ло­жен­ный рядом чёрно‑белый квад­рат, то вол­шеб­ство теряется.

Технологии — под капот

Икона технозависимости — куаркод. Тут видно каждый бит, что навевает воспоминания о модемах с их характерным звуком соединения.

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

Технологии — под капот

Привычка

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

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

Без привычки

Для малень­кого ребёнка надеть и зашну­ро­вать ботинки — дело, пол­ное слож­но­стей. Нужно в пра­виль­ной после­до­ва­тель­но­сти сде­лать пару десят­ков точ­ных дви­же­ний. Каж­дый шаг при­хо­дится обдумывать.

Внимательно, медленно

По привычке

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

Быстро, невнимательно

Привычка

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

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

Без привычки

Для маленького ребёнка надеть и зашнуровать ботинки — дело, полное сложностей. Нужно в правильной последовательности сделать пару десятков точных движений. Каждый шаг приходится обдумывать.

Внимательно, медленно

По привычке

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

Быстро, невнимательно

Скрыто 394 разворота

Бир­ман Илья Борисович

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

  • Арт‑дирек­тор и изда­тель Артём Горбунов

  • Дизай­нер обложки и фото­граф
    Вла­ди­мир Колпаков

  • Иллю­стра­тор Андрей Кокорин

  • Раз­ра­бот­чики Рустам Кул­ма­тов
    и Васи­лий Половнёв

  • Мет­ран­паж и тести­ров­щик Сер­гей Фролов

  • Помощ­ники Юрий Мазур­ский
    и Алек­сандра Шабалдина

  • Книга набрана шриф­тами
    «Бюро­се­риф» и «Бюросанс»

  • Дизайн‑бюро Артёма Гор­бу­нова
    Большая Новодмитровская улица,
    дом 36, стро­е­ние 2
    Москва, Рос­сия, 127015

  • bureau.ru

Бирман Илья Борисович

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

  • Арт‑директор и издатель Артём Горбунов

  • Дизайнер обложки и фотограф
    Владимир Колпаков

  • Иллюстратор Андрей Кокорин

  • Разработчики Рустам Кулматов
    и Василий Половнёв

  • Метранпаж и тестировщик Сергей Фролов

  • Помощники Юрий Мазурский
    и Александра Шабалдина

  • Книга набрана шрифтами
    «Бюросериф» и «Бюросанс»

  • Дизайн‑бюро Артёма Горбунова
    Большая Новодмитровская улица,
    дом 36, строение 2
    Москва, Россия, 127015

  • bureau.ru

Закладки
Добавьте закладки
Ничего не нашлось