class="p1">Чтобы дашборд соответствовал брендбуку, применить к нему корпоративную тему недостаточно. Новые цвета могут снизить контрастность, новые шрифты – исказить макет.

Для профессионального результата проверяйте свою работу по пунктам чек-листа из главы 4.5. И не забудьте про элементы фирменного стиля.

■ Цвет фона правильно распределился по всей панели: белых пятен между диаграммами нет.

■ Стандартный шрифт заголовков и надписей (в том числе в карточках) изменился на фирменный.

■ Размер нового шрифта оптимален для дашборда: подписи расположены горизонтально и легко читаются.

■ Между элементами диаграмм, которые нужно сравнивать, достаточно контраста, и они не сливаются.

■ Карточки KPI не потерялись на общем фоне из-за использованной темы: они хорошо заметны.

■ Фон интерактивных срезов также оформлен в нужных цветах: на нем не осталось белых пятен.

■ На дашборде есть все необходимые элементы корпоративного стиля, как например логотип.

5.3 Создаем дашборд в темной теме

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

Некоторые нюансы не уложить в чек-лист – они потребуют опыта и насмотренности. Именно поэтому я рекомендую использовать светлую тему – с ней объективно проще.

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

Дашборд в темной теме рекомендую создавать из копии светлой. Скопируйте лист с фирменной версией и дайте ему понятное название. Так вы сохраните и светлый и темный дашборды в корпоративном стиле.

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

● Логотип стал неразличимым на темном фоне.

● Черный шрифт заголовков также стал невидимым.

● Синие карточки KPI не вписываются в новое оформление.

● Фон диаграмм остался светлым – это не соответствует темной теме.

● Оформление срезов также не соответствует темной теме дашборда.

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

Заголовок дашборда и логотип

Лист с копией светлого фирменного дашборда я назвал «Чистовик темный» – на нем и буду проводить преобразование.

Первое, что привлекает внимание, – это померкший логотип. Из-за нового фона он стал неразличимым. Мы возьмем вариант из темной темы в презентации PowerPoint, так же как делали это в предыдущей главе.

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

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

Заголовки диаграмм

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

Линия под заголовками

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

Выделяем ячейку с заголовком диаграммы.

На вкладке меню «Главная» нажмем на кнопку «Границы».

В выпадающем меню выбираем «Тип линии» → самую широкую линию.

Дальше в том же меню нажимаем на «Цвет линии»: из предложенных вариантов нужно выбрать оттенок на тон светлее нашего фона.

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

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

Новый цвет для карточек

Они бросаются в глаза в первую очередь – насыщенный синий цвет не гармонирует с новой темой нашего дашборда. Если для белого фона я рекомендовал использовать светлый серый или голубой цвет карточек, то здесь по такому принципу возьму оттенок фирменного коричневого, только на 25 % светлее. Получится, будто карточки вдавлены в подложку.

Настройка графика

Фон графика

Он по-прежнему остался в светлой теме, а нам нужно привести его в соответствие с цветом всего дашборда. Для этого выделяем область построения и на главной вкладке меню кнопкой «Цвет заливки» выбираем самый темный оттенок коричневого – тот же, что мы использовали для фона дашборда.

Линия на графике

Теперь новая задача – на таком фоне померкла синяя линия графика. Изменим ее цвет на зеленый. Для этого выделим область построения графика и вызовем меню правой кнопкой мыши. Здесь нужно использовать обе кнопки – «Заливка» и «Контур».

Метки данных на графике

Цвет для меток данных выбираем уже в ленте меню. Обычно я делаю их в цвет линий или столбиков, но на темном фоне такой вариант будет читаться плохо. Поэтому и для меток «План», и для меток «Факт» выбираю оттенок на несколько тонов светлее соответствующих линий графика. С красным это несложно – нужный цвет есть в доступной палитре.

А вот зеленые оттенки в раскладке цветов не подойдут – слишком уж «неоновые». Поэтому меткам для этой линии подберем цвет самостоятельно. Вот как я это делаю.

Выделяю метки данных для линии «План».