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