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

интерфейс

Теги в поле комментария

Как-то рассказывал, что поле для комментариев легко расширяет функциональность:

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

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

И ещё один плюс. Развернуть теги в отдельные поля проще, чем слова и фразы из сплошного текста.

27 ноября   интерфейс   комментарий   польза

График кофейного вкуса

Вкус кофе описывают по-всякому. Даже так:

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

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

P. S. Спасибо Лео за ссылку!

23 ноября   визуализация данных   график   интерфейс   кофе

Подсказка основных почтовых доменов

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

Пока реализацию встретил только у Али-экспресса. Отдельно отмечу, что классно знать о локально популярных доменах, как это делает Али:

19 сентября   интерфейс   подсказка   поле ввода

Модальность меню-бара в Мак ОС

У элементов бывает сложное поведение, ошибки которого проявляются редко. Но это не значит, что о них не стоит думать. Даже если чинить дороже, знать об ошибках полезно, чтобы внятно отвечать на вопросы как минимум. Поэтому рассказываю о забавном сочетании правил в Мак ОС. Поскольку это не просто сервис, а целое ОС, уверен, что негодующих по этому поводу пользователей достаточно.

Меню приложения в Мак ОС прибито к верхнему краю экрана, независимо от положения и состояния приложения. Это удобно, потому что легче попасть — вместо прицельного клика легко упереть курсор в верхнюю границу и двигать вправо-влево. В этом же меню живут иконки статусов особых приложений, поиск, центр уведомлений и меню самой ОС (яблоко в начале строки).

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

Чтобы закрыть приложение, запускают диалоговое окно «Завершить принудительно» в меню-яблоке, выбирают в нём зависшее приложение и жмут кнопку «Завершить принудительно».

На картинке выше невозможная ситуация. Если приложение зависло, то открыть «его» яблоко не получится, придётся идти в работающее. Вместо того, чтобы дать разобраться с неработающим приложением, которое сейчас в локусе внимания, ОС отправляет в другое приложение, чтобы запустить принудительное завершение. При этом элементы справа той же строки работаю как ни в чём не бывало. Эта модальность дезориентирует. Чтобы отследить, что происходит и где граница неработающего в первый раз нужно осознать, что происходит что-то мутное и сфокусироваться на работоспособности яблока. Происходит это на фоне зависшего приложения и желания его скорее перезапустить.

Чтобы не сталкиваться с этой модальностью, жму на клавиши.

  1. ⌥⌘Esc вызывает диалог «Завершить принудительно».
  2. Удерживание ⌥⌘⇧Esc закрывает активное приложение в любом состоянии.
2018   интерфейс   Мак   модальность

Стиль кнопок и текста

Синхронизирую кнопки с текстовыми стилями. Обычно стилей 4-5, кнопок хватает трёх: размером с основной текст и с подзаголовоки 2-го и 3-го уровней. Или 2-го и 4-го — зависит от задачи. Для массового и броского — 1-го.

Такая синхронизация немного гасит шум и сильно упрощает сбор строк из текста и кнопок. А наличие принципа разгружает голову. При умелой вёрстке упрощает ЦСС и корректировки.

Синхронизирую кегль, интерлиньяж и разрядку, если кнопки не капительные. Начертание чаще сохраняю для жирных и полужирных и «поджирняю» для нормальных и прямых текстовых стилей.

2018   вёрстка   интерфейс   типографика
Ранее Ctrl + ↓