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

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

Lab Board

На сайте Lab Board использованы красивые последовательные тона, тонко выполненные градиенты и большие тени.

SE Ranking

SE Ranking показывают график прямо на домашней странице сайта. Графики просты и легки для понимания. Использованы светлые оттенки, которые хорошо дополняют друг друга.

Dropbox Transparency

На странице Dropbox’s Transparency показаны интересные данные о том, сколько правительственных запросов получает сервис. График красиво разработан, грамотно подобраны цвета и проработаны разделения.

Shoplo

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

Stripe Connect

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

Appfigures

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

CA Technologies

CA Technologies сделали выбор в пользу максимального упрощения. Они использовали синие линии и легкий градиент, которые становится прозрачным у горизонтальной оси. Простота делает график чрезвычайно простым для понимания и идеально сочетается с направлением бренда и цветами пользовательского интерфейса.

Median for Mac

Сайт Median построен вокруг скриншотов их приложения для Mac и почти полностью оформлен при помощи графиков и диаграмм. Они просты и продолжают цветовую палитру бренда Median.

Unamo

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

Tapdaq

На домашней странице Tapdaq также используются линейные графики в блоке просмотра. Синяя и фиолетовая линии прекрасно дополняют друг друга, а затухающий градиент привлекает внимание к данным.

Автор статьи Ben Bate

Перевод — Дежурка

Смотрите также:

• 11 примеров веб-портфолио, на которые можно ровняться в 2019-м
• 5 способов сделать лучшую навигацию на сайте
• 20 примеров иллюстративной инфографики