Как разместить на А4 сырые данные фискальных чеков? Вторая часть

Здравствуйте! Я делаю сервис верификации фискальных чеков. Столкнулся с личной болью: пришлось в суде доказывать, что чек не поддельный. Обычная бумажка ничего не значит. Сервис проверки чеков, который есть у ФНС ещё хуже, чем любые другие аналогичные сервисы. Они просто теряют на половине пути часть данных. Сейчас я заключил договор с ФНС, у меня есть прямой доступ к полным сырым данным чеков (JSON). Условия договора: я предоставляю бесплатный публичный доступ к своему сервису. Данные есть, а макета нет. Задача: разместить весь этот массив (100+ служебных ключей, узлы, вложенные массивы товаров) на стандартном листе А4. Листов может быть несколько, но формат узкой чековой ленты или ветки (tree view) не годится — будет 10 страниц пустоты. Нужна плотная, технически точная, но читаемая вёрстка. Документ должен выглядеть как серьёзный аналитический отчет, где сохранены оригинальные ключи. Главное: сохранить вообще все ключи/значения. Также непонятно, как быть с переводом ключей/значений на русский язык: отдельно предоставлять словарь или же дублировать перевод прямо в отчёте. Пример массива данных: https://pastebin.com/82x6JG4n Попытка сверстать: https://dialora.github.io/receipt/ Встречали ли вы удачные патерны или концепты для вывода таких тяжелых массивов на А4? Как бы вы подошли к организации этого пространства?

В прошлом совете мы навели относительный порядок в основном теле таблицы и добились, чтобы на первый лист влезало больше позиций:

Было
Стало

Снова вооружившись Кодексом, попробуем продолжить повышать компактность вёрстки. Займёмся шапкой. Чтобы не сойти ума от текущей сложной подачи и побыстрее увидеть, как можно более эффективно использовать пространство, разместим всё просто в столбик. При этом сразу вынесем за пределы таблицы данные, понятность которых не вызывает сомнений:

Было
Стало

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

Было
Стало

Пойдём ещё дальше и перестанем отрывать данные от лейблов (и ещё кое‑где сократим лейблы без потери смысла):

Было
Стало

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

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

Было
Стало

Уплотним вёрстку, поставив получившиеся блоки в две колонки:

Было
Стало

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

Напоследок сравнение, с чего мы начали и на чём остановились:

Было
Стало

Приглашаю предложить свои идеи по улучшению в комментариях!

P. S. Последовательно избавляться от лишнего и наводить порядок в оставшемся я учу на курсе «Типографика и вёрстка». Записывайтесь, пока есть места.

Типографика в вебеТаблицыДоработка вёрсткиУВЛ
Отправить
Поделиться
Запинить

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

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