Школа
Интерфейс

Как расположить элементы, чтобы данные любого размера смотрелись хорошо?

Здравствуйте! Делал карточки рассылок и столкнулся с проблемой — когда рассылки большие (на них в основном и расчет), все хорошо, но когда числа маленькие — отступы становятся ужасно большими. Вариант с прыгающими данными мне не нравится, все‑таки хочется соблюдать колонку. Как можно расположить элементы, чтобы данные любого размера смотрелись хорошо?

Андрей Бугрецов
1 мар 2022
👁 6224  
Интерфейс

Как расположить элементы, чтобы данные любого размера смотрелись хорошо?

Здравствуйте! Делал карточки рассылок и столкнулся с проблемой — когда рассылки большие (на них в основном и расчет), все хорошо, но когда числа маленькие — отступы становятся ужасно большими. Вариант с прыгающими данными мне не нравится, все‑таки хочется соблюдать колонку. Как можно расположить элементы, чтобы данные любого размера смотрелись хорошо?

Андрей Бугрецов
1 мар 2022
👁 6224  
Илья Бирман
Арт‑директор и соавтор курса «Пользовательский интерфейс и представление информации»
Полезно
Непонятно
Войдите в Бюросферу, чтобы голосовать

Не даже сразу понял, о чём вы пишете. На словах «отступы становятся ужасно большими» я вижу космических масштабов отступ:

Его надо убрать первым делом, в нём же вообще никакого смысла. Это как разместить холодильник и плиту в разных концах квартиры. Заодно выровнял элемементы:

Видимо, вас смущают цифры слева, что где‑то там 20, а где‑то 0 или 1? С этим вообще никакой проблемы нет; разные значения — нормально для таблицы. Даже полезно, чтобы цифры разного масштаба выглядели разными, это ведь ускоряет визуальное восприятие. У вас с этим проблема обратная: из‑за батареи иконок всё выглядит слишком одинаковым. Рассылки с 20 письмами почти не отличаются от рассылок с одним.

Чтобы эту проблему решить, надо убрать одинаковые, повторяющиеся элементы:

Я обвёл слово «чел.» и знак %, потому что они как раз помогают отличить эти столбики от других, их есть смысл оставить. Смотрите, насколько легче дышать:

Теперь можно всё это упорядочить, выровнять числа по разрядам для удобства сравнения, убрать бессмысленную бледность, подписать колонки:

Полезно
Непонятно
Войдите в Бюросферу, чтобы голосовать
Отправить
Поделиться
Поделиться
Запинить
Твитнуть

Комментариев пока нет

Цель рубрики — обсуждение вопросов дизайна, веб-разработки, переговоров, редактуры и управления.
Комментарии модерируются. Мы публикуем комментарии, которые добавляют к уже сказанному новые мысли и хорошие примеры.

Рекомендуем другие советы