Я в интернете

РСС    Джейсон-фид

Есть автоматические трансляции в Тумблер и Же-же. Если не работает, напишите мне: ilyabirman@ilyabirman.ru.

Словарь-справочник проектировщика пользовательского интерфейса

Представляю новый раздел на моём сайте — Словарь-справочник проектировщика пользовательского интерфейса. Мы запускаем его небольшой редакцией, состоящей из Александры Озкан, Настасьи Тулаевой и меня в роли главреда.

Справочник — сверхплотное описание терминов из области проектирования интерфейса, предназначенное для профессионалов. Такая подача помогает бывалому дизайнеру вспомнить о нюансах, которые он не держит в голове, а новичку — развить внимательность и любопытство. Но кроме этого мы рассчитываем, что в справочник можно будет отправить нейросеть примерно с таким промтом: «прочитай, что там написано про все используемые в нашем интерфейсе штуки, и скажи, что нужно исправить».

Это не просто перечень определений — их и так можно найти в интернете. К каждому термину в справочнике мы предъявляли простое требование: от его наличия должна быть польза. В редких случаях определение полезно само по себе, но чаще всего мы задавали вопрос к каждому термину так: что проектировщику нужно знать об этом? И старались дать качественный ответ.

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

Подписаться на блог
Отправить
6 комментариев
Marat S 20 дн

Что значит «ср. Авторизация» ?

Илья Бирман 19 дн

Сравни.

Аleksandr Kharkov 20 дн

Мне не хватает перевода терминов на английский.

Victor CG 20 дн
  • Нападалка Маркетинговый попап
  • Пипка Хвостик у балуна
  • Заусенцы
  • Вибрация Оптический эффект

Возможно это — словарь жаргона И.Б.

Илья Бирман 19 дн

А как вы называете эти элементы? Какие более принятые термины бы вы предложили?

Андрей Аквес 19 дн

Илья, справочник классный, но им очень сложно пользоваться. Это же не книжка Атабекова, на ней не надо экономить бумагу. Из-за попытки как можно больше всего показать одновременно, приходится идти на ухищрения: делать текст мелким, столбики узкими, добавлять переносы, свешивать первую строчку, оставлять слишком узкий отступ между абзацами и пр. За счёт экономии места нагружается внимание читателя. Например:

  1. Прих. постоянно расшифр-ть «польз-лей», «и-фейс» и «эл-ты». Это вдвойне сложно, когда рядом есть такие же чёрточки в «дизайн-системах» и переносах слов («ущер-бом»). В одном из столбиков вообще есть строчка «ский дизайн экранов и эл-тов и-». Но мне быстрее и легче прочитать слово целиком, правда!
  1. Алфавитная сортировка мало помогает. Сложно быстро найти «Консистентность», потому что там шесть столбиков, в которых «Конструктор», который по алфавиту должен быть позже, всё равно находится выше.
  1. Я не хочу «См. Прицеливание» , когда вижу «Угол экрана». Но совершенно не против, если в «Углу экрана» будет скопипасчен тот же самый текст, что и в «Прицеливании».
  1. Из-за columns «Якорь» разделился аж на четыре колонки (наверное, тут нужен break-inside: avoid;). В нём же «https://» в одном столбике, а «example.com/#anchor;» в другом.

А ещё было бы круто добавить группировку по категориям.

Victor CG 19 дн

А как вы называете эти элементы?

С «пипкой» точно сложно.

Как вариант решения (не обязательно лучший), можно попробовать разделить термины в справочнике по степеням общепринятости, жаргонности, и даже языку; baloon в английском используется 40+ лет везде, «балун» на русском — совсем нет. Дальше настроить связи элементов — плоские, или иерархией, чтобы понять: балун = baloon = выносной элемент + выноска + графический образ.

Можно категориями/тегами решить, если быстрорастворимых вариантов искать.

Еще момент, о котором пишет Андрей выше, поддержу. Верстка выглядит скомканной, попыткой упихнуть максимум букв в пиксели, как будто они платные. Вертикальный ритм сдавленный, строки рвутся и переносятся где попало, и так далее. Бумаги нет, экономить нечего. Межстрочник, опять же, всё сдавливает в кашу.

Anton Platonov 17 дн

Есть проблемы в юэкс справочника. Нажимаю в параграфе «Скеоморфизм» ссылку со слова «мусор» — попадаю неведомо куда.

После ручных поисков параграфа «Мусор» до меня дошло, что мне хотели помочь и перенаправили сразу на «Информационный мусор» вместо промежуточного. Спасибо, но меня это, честно говоря, только привело в замешательство. Я сразу беглым взглядом заметил, что попал мимо буквы М, чего я совсем не ожидал.

Кроме того, переходы прокруткой плохо сочетаются с вёрсткой текста колонками. Вместо параграфа «Информационный мусор» я вижу только заголовок и первое предложение, а весь остальной текст параграфа оказывается выше границы области видимости. Текст параграфа продолжается в соседней колонке наверху, но вертикальная прокрутка вверх при переходе докрутилась только до заголовка.

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

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

Илья Бирман 16 дн

Вы правы, в этой навигации есть что улучшать.