18 заметок с тегом

интерфейс

Уплотнение столбцов в таблице

Таблицы удобнее читать, когда столбцы стоят плотно и взгляд не перепрыгивает большие дыры, идя по строке. Второй плюс узких столбцов — их больше влезает в ширину экрана. Особенно это актуально в информационно насыщенных таблицах. Часто узкому содержанию мешают широкие заголовки, как в столбцах Е и F :

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

Повторюсь: приём подойдет только для случаев, когда столбцы связаны по смыслу. Сначала собираю заголовки в один через запятую. И сбиваю содержание плотнее:

Заголовки связаны со столбцами только порядковым положением. Такой связи бывает недостаточно. Поэтому усиливаю связь цветом. Достаточно одного не крайнего столбца на каждые три-четыре столбца. Красить лучше со смыслом, но можно и механически через один:

Теперь нужно придумать, что делать с сортировкой. У исходной таблицы заголовки могли быть кликабельными. Теперь так не получится.

Добавляю линейку, отделяющую содержание от заголовка. Режу её на кусочки по ширине каждого столбца делаю повыше и превращаю в кнопки:

Тестируйте перед внедрением.

26 января   интерфейс   компактность   таблица

Криптовотч

Смотрите, какой сайт с котировками криптовалют — cryptowat.ch

Терминальный минимализм такой. Я бы побился за меньшее число линеек — много шума от них:

В карточке ещё интереснее:

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

23 января   интерфейс   разряды   таблица

Кнопки на автоключах

Такой ключ у Фольксвагенов, у Шкод и Ауди похожие:

Кнопки похожи и стоят в ряду. Внешний вид подразумевает, что работают они одинаково. Верхняя кнопка разблокирует машину, нижняя — заблокирует, а средняя — разблокирует только багажник. Правда, непонятно тогда, как его заблокировать. Только со всем автомобилем? Или повторное нажатие в среднюю кнопку тоже сработает?

На деле средняя включает программу «Разблокируй багажник и заблокируй после того, как его закроют». Эта программа вписывается в сценарий «Достать багаж, который займёт руки, и не беспокоиться о блокировке багажника, достаточно умудриться его закрыть».

Через 1,5 года я обратил внимание на среднюю кнопку. И после пары раз запомнил, как работает. Внешним видом это не объяснить, но можно намекнуть, что не так же, как соседние. Вот пульт какой-то модели Тойоты. Очевидно, что «багажник» отличается:

Кстати, ещё непонятно, почему такая функция только у багажника. Программа была бы удобна для всех дверей — люди багаж везде возят.

14 января   автомобиль   интерфейс

Фичеризм

Есть такой термин «фичеризм», от слова «фича» (feature с английского — свойство). Этим термином ругают излишние возможности, функции изначально цифровых, но теперь уже любых продуктов. Непонятные людям функции тоже попадают под фичиризм.

Бывает супердёшево завернуть элемент в ссылку и добавить новую связь между сущностями. И люди будут быстрее добираться куда нужно. Но дело чуть сложное, по-моему.

Вместе с возможностью приходит ответственность. Легко пойти по новой ссылке, но получится ли операция в целом быстрее или путь назад займёт больше времени, чем раньше. И вот человек перед выбором. А любой выбор сжигает мышление. Количество решений, которые человек принимает за единицу времени ограничено. Потом придёт усталость и работа на автомате. Если выбор будет сложным, ошибки будут чаще. Это вольный пересказ Максима Дорофеева, которого советую читать.

У меня план примерно такой:

  1. Не пустить в работу функции, которые дублируют существующие.
  2. Спроектировать путь, чтобы понимать контекст, в котором функция применяется. Путь — набор действий от начального состояния до полностью решённой задачи. Взяли обычную фотографию — получили состаренную в фотошопе. Выбор монохромного режима и цвета, наложение текстур, затемнение углов... Всё это один путь.
  3. Убедиться, что пути с использованием новой функции не дублируют существующие пути и не порождают паразитные пути. Тут может понадобиться полноценная дорожная карта с хайвеями и переулками.
  4. После внедрения функции следить, как люди прокладывают маршруты. И если что-то ломается, проходить список заново.
8 января   интерфейс   фичеризм   функция

Комментарии к сущностям в системах

В системах бывают комментарии. Например в ЦРМ у клиента или заказа. Стыдно признаваться, что не жаловал эти поля. Видел их так: чёткого назначения нет, используются раз в сто лет, не укладываются в формат, ломают таблицы.

Крутой Анатолий Буров показал другую сторону. Одно поле комментария расширяет функционал системы, как несколько полей сразу. Люди могут писать в комментарии что угодно, любые данные, для которых нет полей. С хорошим поиском совсем сказка.

А в таблице можно делать так:

Анатолий Буров добавляет
Комментарии — это дешёвый способ сделать систему устойчивой к изменениям в окружающем мире.

Когда мы выкатываем интерфейс, есть вероятность, что в ближайшие пару лет он будет работать в первозданном виде. При этом условия будут меняться: появятся новые сценарии и новая информация, которые сложно предусмотреть заранее (если б могли предусмотреть, предусмотрели бы :—)

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

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

21 декабря   интерфейс   комментарий   польза   табличка
Ранее Ctrl + ↓