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