x
 
Илья Банюк
23 февраля 2021
Советы почтой каждую неделю
Пожалуйста, получите наше письмо, чтобы подтвердить свой адрес:
Вы подписаны на «Советы за неделю»:

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


Илья!

Футбольные таблицы

Похоже, при­шло время орга­ни­зо­вать советы про фут­боль­ные таб­лицы в серию. Это уже тре­тья часть.

Футбольные таблицы

В таб­лице про­блема с тео­рией бли­зо­сти. Под­писи стоят посе­ре­дине между лини­ями, а числа стоят ближе друг к другу, чем к линиям.

Из‑за того, что подпи­си выров­нены по цен­тру фор­мата, тяжело срав­ни­вать числа. При­хо­дится бегать гла­зами из цен­тра влево, а затем до конца вправо.

Линии в таб­лице могут вве­сти в заблуж­де­ние. Напри­мер, по фраг­менту ниже можно поду­мать, что «Ман­че­стер Сити» нанёс больше уда­ров в створ, чем уда­ров по воро­там, что абсурдно. К тому же длины линий «Удары в створ» и «Удары мимо» не скла­ды­ва­ются в длину линии «Удары по воро­там», хотя по логике должны.

Чтобы понять, в чём дело, надо смот­реть на числа.

Но что важ­нее, из‑за линий может сло­житься потен­ци­ально оши­боч­ное впе­чат­ле­ние, что «Ман­че­стер Сити» доми­ни­ро­вал в матче. При бег­лом взгляде на таб­лицу видно, что синих линий больше. Но не каж­дая синяя линия — пре­иму­ще­ство «Сити». Напри­мер, «Вне игры» и «Неза­би­тые пенальти» явно отри­ца­тель­ные пока­за­тели, а «Сейвы» и «Удары от ворот» — спорные.

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

Ува­жа­е­мые совет­чики, поде­ли­тесь в ком­мен­та­риях вашими иде­ями по улуч­ше­нию таблицы.

P. S. Это был вторничный совет о дизайне интерфейсов. Присылайте вопросы.

Поделиться
Отправить

Комментарии

Андрей Кретинин
23 февраля 2021

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

Дарья Иванова
24 февраля 2021

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

Константин Мозговой
24 февраля 2021

Андрей, Дарья, согласен с вами. Но если сделать наоборот, то цифры команды будут с одной стороны, а её точки с другой. Тоже будет сложно воспринимать. Как решить эту проблему, я не придумал. В настоящем проекте я бы посоветовался с футбольными экспертами.

Илья Каровин
25 февраля 2021

Ворота можно раскрасить в цвет команды.


Цель рубрики — обсуждение вопросов дизайна всех видов, текста в дизайне и взаимоотношений дизайнеров с клиентами.

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

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

Вот такой веб 2.0.

8 5 1




Недавно всплыло

Какие приложения вы используете для съёмки и обработки фотографий на телефоне? Продолжение 2 Как начинающему автору отстаивать свою позицию? И нужно ли это делать? 2 Как-то это всё выглядит сухо и безлико 2 Расскажите о процессе издания 1