Илья Бир­ман

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

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

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

 
между важными местами
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

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

Но мало при­ду­мать пра­ви­ла, их нуж­но вопло­тить физи­че­ски. Это вопло­ще­ние — неотъ­ем­ле­мая часть интерфейса.

Вспом­ним азбу­ку Морзе. Совре­мен­ные еди­нич­ки и ноли­ки 101010 ничем не луч­ше точек и тире • — • — • —. Разни­ца в пра­ви­лах коди­ро­ва­ния сооб­ще­ний несу­ще­ствен­на в срав­не­нии с раз­ни­цей в про­пуск­ной способ­ности совре­мен­ных средств пере­да­чи инфор­ма­ции и телеграфа.

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

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

Интер­фейс —
зло

Матери­аль­ные сред­ства — физи­че­ский источ­ник потерь полез­но­го дей­ствия в интерфейсе.

Итак, интер­фейс — это набор пра­вил и мате­ри­аль­ные сред­ства, кото­рые обес­пе­чи­ва­ют вза­и­мо­дей­ствие по этим правилам.

...и их физическое воплощение

Но мало при­ду­мать пра­ви­ла, их нуж­но вопло­тить физи­че­ски. Это воплощение — неотъемлемая часть интерфейса.

Вспомним азбу­ку Морзе. Совре­мен­ные еди­нич­ки и ноли­ки 101010 ничем не луч­ше точек и тире • — • — • —. Разни­ца в пра­ви­лах коди­ро­ва­ния сооб­ще­ний несу­ще­ствен­на в срав­не­нии с раз­ни­цей в про­пуск­ной способ­ности совре­мен­ных средств пере­да­чи инфор­ма­ции и теле­гра­фа.

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

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

Матери­аль­ные сред­ства — физи­че­ский источ­ник потерь полез­но­го дей­ствия в интерфейсе.

Интер­фейс — зло

Итак, интер­фейс — это набор пра­вил и мате­ри­аль­ные сред­ства, кото­рые обес­пе­чи­ва­ют вза­и­мо­дей­ствие по этим правилам.

...и их физическое воплощение

Человечность

Хоро­ший интер­фейс начи­на­ется с человечности.

Я забы­ваю имена людей, дела и про­пу­щен­ные звонки. Кто‑то путает лево и право. Люди посто­янно оши­ба­ются рас­клад­кой кла­ви­а­туры. Чело­веч­ность дизайна выра­жа­ется в том, чтобы под­стро­ить пред­мет дизайна под чело­века с его сла­бо­стями, а не застав­лять чело­века под­стра­и­ваться под предмет.

Хоро­ший дизай­нер рас­по­ло­жит над­писи над, а не под кноп­ками, чтобы не заго­ра­жи­вать их пальцами.

Пульт телевизора
ББК

Пульт телевизора ББК

Человечность

Хороший интерфейс начинается с человечности.

Я забываю имена людей, дела и пропущенные звонки. Кто‑то путает лево и право. Люди постоянно ошибаются раскладкой клавиатуры. Человечность дизайна выражается в том, чтобы подстроить предмет дизайна под человека с его слабостями, а не заставлять человека подстраиваться под предмет.

Хороший дизайнер расположит надписи над, а не под кнопками, чтобы не загораживать их пальцами.

Поду­мает о том, где ока­жется адрес на сло­жен­ном бланке.

Не допу­стит появ­ле­ния сооб­ще­ния «Вы не запол­нили одно или несколько полей». Ком­пью­тер знает, какое или какие именно поля не запол­нены. Зачем застав­лять чело­века искать их взглядом?

Подумает о том, где окажется адрес на сложенном бланке.

Не допустит появления сообщения «Вы не заполнили одно или несколько полей». Компьютер знает, какое или какие именно поля не заполнены. Зачем заставлять человека искать их взглядом?

Центральный экран в «Опеле»

Пред­ло­жит найти бли­жай­шую заправку встро­ен­ным в машину навигатором.

Не ста­нет застав­лять чело­века под­би­рать зна­че­ния в про­цен­тах так, чтобы в сумме полу­чи­лось сто.

Центральный экран в «Опеле»

Предложит найти ближайшую заправку встроенным в машину навигатором.

Не станет заставлять человека подбирать значения в процентах так, чтобы в сумме получилось сто.

Типичная таблица размеров интернет‑магазина одежды

Выбор размера в интернет‑магазине джинсов «Гетвеар»

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

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

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

Для «Гет­ве­ара» мы сде­лали иначе — чело­век выби­рает раз­мер в при­выч­ной для него системе, не заду­мы­ва­ясь о переводе.

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

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

Принцип:
пусть потеет машина

Типичная таблица размеров интернет‑магазина одежды

Выбор размера в интернет‑магазине джинсов «Гетвеар»

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

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

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

Для «Гетвеара» мы сделали иначе — человек выбирает размер в привычной для него системе, не задумываясь о переводе.

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

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

Принцип:
пусть потеет машина

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

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

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

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

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

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

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

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

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

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

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

  • bureau.ru

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

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

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

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

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

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

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

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

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

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

  • bureau.ru

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