🙂 Дизайн сложных таблиц

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

На практических примерах автор рассказывает:
— Какой шрифт лучше использовать в таблицах
— Как правильно выравнивать значения в ячейках
— Как отделять разряды чисел
— Как оформлять единицы измерения и сортировку
— Как группировать строки и столбцы

В заключение Андрей объяснил, как обогатить таблицу инфографикой, цветами, диаграммами и даже интерактивами

awdee.ru/complex-tables-design

#awd_article #awd_tables

👨‍🎨 15 Figma-плагинов для создания таблиц и графиков

Эти плагины помогают в пару кликов создавать и настраивать таблицы, импортировать данные из гугл-таблиц, генерировать любые типы графиков на основе реальных данных и в целом автоматизировать работу с табличными данными и их визуализацией. Мы также добавили набор компонентов для проектирования таблиц в Figma

awdee.ru/15-figma-plugins-for-creating-tables-and-charts

#awd_figma #awd_tool #awd_graphs #awd_tables #awd_dataviz #awd_infographic

🙂 Дизайн сложных таблиц, графиков и диаграмм рассеяния

Хотим напомнить, что недавно у нас вышли четыре отличные статьи Андрея Маркелова о дизайне сложных таблиц, графиков и диаграмм:
— Дизайн сложных таблиц
— Дизайн графиков. Шкалы
— Дизайн графиков. Линии
— Дизайн диаграмм рассеяния

#awd_article #awd_graphs #awd_tables #awd_dataviz #awd_infographic

🙂 Как правильно визуализировать данные

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

В конце статьи вы найдёте множество ссылок на тему визуализации данных для более основательного погружения в предмет и поиска вдохновения

awdee.ru/how-to-visualize-data-properly

#awd_article #awd_graphs #awd_tables #awd_dataviz

🙂 Дизайн сложных таблиц, графиков и диаграмм рассеяния

Хотим напомнить, что у нас на сайте есть четыре отличные статьи Андрея Маркелова о дизайне сложных таблиц, графиков и диаграмм:
— Дизайн сложных таблиц
— Дизайн графиков. Шкалы
— Дизайн графиков. Линии
— Дизайн диаграмм рассеяния

#awd_article #awd_graphs #awd_tables #awd_dataviz #awd_infographic

🙂️️️️️️ Как полосы в таблицах влияют на скорость работы с ними

Продуктовый дизайнер Иван Емелюшкин написал статью о том, когда стоит делать таблицы полосатыми, а когда достаточно ограничиться разделительными линиями или вообще не разлиновывать таблицу

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

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

А ещё он посоветовал подсвечивать строку при наведении курсора, чтобы пользователь точно не ошибся при выборе

awdee.ru/how-stripes-in-tables-affect-the-speed-of-working-with-them

#awd_article #awd_tables

🙂️️ Тонкости UI-дизайна больших таблиц с данными

Перевод статьи Эндрю Койла о том, как правильно оформлять интерфейсные таблицы, которые содержат много данных

В материале он делится следующими практическими советами:
— Располагайте столбцы по важности и визуально выделяйте ключевые столбцы
— Закрепляйте столбцы c данными, задающими контекст
— Закрепляйте заголовки столбцов
— Позволяйте менять порядок столбцов и скрывать/отображать отдельные столбцы
— Подумайте, как настраивать плотность отображения информации
— Внедряйте фильтрацию поиском
— Добавляйте готовые фильтры

awdee.ru/ui-considerations-for-designing-large-data-tables

#awd_article #awd_tables