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