🔍 Начните печатать, чтобы искать по книге или перейти к нужной странице по номеру
Удобно листать не только прокруткой, но и клавишами‑стрелками:
разворотами
Пользовательский интерфейс
Пользовательский интерфейс
Представляем книгу Издательства Дизайн‑бюро Артёма Горбунова — практическое руководство по пользовательскому интерфейсу. Учебник предназначен для дизайнеров, редакторов, руководителей, разработчиков и всех, кто причастен к созданию продуктов.
Оглавление
Принципы 4
Взаимодействие 86
Язык 213
Экраны 311
Представляем книгу Издательства Дизайн‑бюро Артёма Горбунова — практическое руководство по пользовательскому интерфейсу. Учебник предназначен для дизайнеров, редакторов, руководителей, разработчиков и всех, кто причастен к созданию продуктов.
Оглавление
Принципы 4
Взаимодействие 86
Язык 213
Экраны 311
Классические форумы злостно нарушали правило «Один объект — одна ссылка».
Представьте себе усложнённый эксперимент Фиттса, где чёрных полос очень много, но попадать нужно строго в определённые. Похожим испытаниям разработчики форумов подвергали своих пользователей в интерфейсе.
«Они отдали себя общению». Артём Горбунов о форумах
Классические форумы злостно нарушали правило «Один объект — одна ссылка».
Представьте себе усложнённый эксперимент Фиттса, где чёрных полос очень много, но попадать нужно строго в определённые. Похожим испытаниям разработчики форумов подвергали своих пользователей в интерфейсе.
«Они отдали себя общению». Артём Горбунов о форумах
С дырами
Уведомлять физлиц о налоге, который с них не удержали, надо по‑новому
Без дыр
Уведомлять физлиц о налоге, который с них не удержали, надо по‑новому
Связанная проблема — «дырявые» цели. Часто встречаются ссылки, разбитые на несколько строк, у которых клик между строк не срабатывает.
Пока браузеры сами не научились «склеивать» такие ссылки в единую область, это приходится делать веб‑разработчикам.
Прокрутите медленно вверх и вниз мимо ссылок
С дырами
Уведомлять физлиц
о налоге, который с них
не удержали, надо
по‑новому
Без дыр
Уведомлять физлиц
о налоге, который с них
не удержали, надо
по‑новому
Связанная проблема — «дырявые» цели. Часто встречаются ссылки, разбитые на несколько строк, у которых клик между строк не срабатывает.
Пока браузеры сами не научились «склеивать» такие ссылки в единую область, это приходится делать веб‑разработчикам.
Прокрутите медленно вверх и вниз мимо ссылок
Если ссылка относится к расположенной рядом картинке, они должны образовывать общую нажимаемую область.
Если ссылка относится к расположенной рядом картинке, они должны образовывать общую нажимаемую область.
Проекты на сайте Ильи Бирмана
Движение и клик — один жест
Когда мы видим объект, мы перемещаем к нему курсор, а затем нажимаем кнопку мыши. Но это один жест: мы не меняем принятое решение о клике по пути. Поэтому плохи элементы, появляющиеся при наведении и закрывающие собою цель: человек нажимает не туда, куда хотел.
Предположим, вы хотите перейти по ссылке в «Телеграме». Вы уже увидели её в тексте и начали двигать мышь к ней.
Но пока вы ведёте курсор, под ним вдруг оказывается всплывающая панель стикеров.
Даже если вы успеваете её заметить, рука продолжает «по инерции» вести мышь до того места, где была ссылка. В итоге вы кликаете и отправляете стикер.
Какими были бы результаты эксперимента Фиттса, если бы поверх мишени иногда выезжала закрывающая её полочка?
Движение и клик — один жест
Когда мы видим объект, мы перемещаем к нему курсор, а затем нажимаем кнопку мыши. Но это один жест: мы не меняем принятое решение о клике по пути. Поэтому плохи элементы, появляющиеся при наведении и закрывающие собою цель: человек нажимает не туда, куда хотел.
Предположим, вы хотите перейти по ссылке в «Телеграме». Вы уже увидели её в тексте и начали двигать мышь к ней.
Но пока вы ведёте курсор, под ним вдруг оказывается всплывающая панель стикеров.
Даже если вы успеваете её заметить, рука продолжает «по инерции» вести мышь до того места, где была ссылка. В итоге вы кликаете и отправляете стикер.
Какими были бы результаты эксперимента Фиттса, если бы поверх мишени иногда выезжала закрывающая её полочка?
Выпадающие меню на сайтах не учитывают, что движение и клик — один жест. Когда наводишь на пункт главного меню, из него выпадает подменю. Заранее о таком не догадаться — элемент не типичен для интернета, да и выглядит как обычная строка ссылок.
После клика видишь, что выпало меню, но браузер уже загружает следующую страницу. Теперь уже кликать бесполезно — жди, пока загрузится страница.
Интернет‑банк «Альфа‑клик»
Выпадающие меню на сайтах не учитывают, что движение и клик — один жест. Когда наводишь на пункт главного меню, из него выпадает подменю. Заранее о таком не догадаться — элемент не типичен для интернета, да и выглядит как обычная строка ссылок.
После клика видишь, что выпало меню, но браузер уже загружает следующую страницу. Теперь уже кликать бесполезно — жди, пока загрузится страница.
Интернет‑банк «Альфа‑клик»
Бирман Илья Борисович
Пользовательский интерфейс
Арт‑директор и издатель Артём Горбунов
Дизайнер обложки и фотограф
Владимир КолпаковИллюстратор Андрей Кокорин
Разработчики Рустам Кулматов
и Василий ПоловнёвМетранпаж и тестировщик Сергей Фролов
Помощники Юрий Мазурский
и Александра Шабалдина
Книга набрана шрифтами
«Бюросериф» и «Бюросанс»Дизайн‑бюро Артёма Горбунова
Большая Новодмитровская улица,
дом 36, строение 2
Москва, Россия, 127015
Бирман Илья Борисович
Пользовательский интерфейс
Арт‑директор и издатель Артём Горбунов
Дизайнер обложки и фотограф
Владимир КолпаковИллюстратор Андрей Кокорин
Разработчики Рустам Кулматов
и Василий ПоловнёвМетранпаж и тестировщик Сергей Фролов
Помощники Юрий Мазурский
и Александра Шабалдина
Книга набрана шрифтами
«Бюросериф» и «Бюросанс»Дизайн‑бюро Артёма Горбунова
Большая Новодмитровская улица,
дом 36, строение 2
Москва, Россия, 127015