Реализация перехода из офлайна в онлайн. На примере Walmart
Previous
выбрать за меня
9 советов для повышения эффективности карточек вашего товара
Next
инфографика, создание, контент, контент-маркетинг
Контент-маркетинг

Инфографика: как работать со свободным пространством?

Автор: Анна Шаховская30.11.2015

«Свободное пространство часто используется для создания сбалансированной гармоничной композиции. Оно позволяет управлять вниманием читателя точно также, как фотограф заставляет зрителя смотреть на пустое пространство на портрете, просто сместив персонажа с центра композиции и направив его взгляд в сторону освободившегося места.» Марк Болтон из A List Apart.

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

Что же такое свободное пространство?

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

Давайте с вами посмотрим на страницу сайта  Basecamp. Во-первых, обратите внимание, каким красивым и лаконичным является дизайн сам по себе. А затем взгляните на свободное пространство, которое на рисунке ниже помечено синими прямоугольниками.

инфографика, создание, контент, контент-маркетинг

Страница сайта Basecamp

инфографика, создание, контент, контент-маркетинг

Страница сайта Basecamp

Великолепная работа со свободным пространством.

Почему свободное пространство настолько важно?

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

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

инфографика, создание, контент, контент-маркетинг

Без свободного пространства

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

Все еще сомневаетесь? Давайте рассмотрим другие доказательства.

1. Свободное пространство улучшает читабельность.

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

Давайте посмотрим на примере. Сначала взгляните на текст, расстояние между строчками которого выдержано правильно. Легко читается, интересно и информативно.

инфографика, создание, контент, контент-маркетинг

Правильно заданный интерлиньяж

Теперь тот же самый текст, но с неправильным интерлиньяжем. Полный бардак. Не читабельно и соответственно неинформативно.

инфографика, создание, контент, контент-маркетинг

Неправильно заданный интерлиньяж

2. Свободное пространство улучшает восприятие и понимание информации.

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

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

инфографика, создание, контент, контент-маркетинг

Порядок

3. Пустое пространство управляет вниманием.

В дизайне, маркетинге или обучении порой очень важно уметь направить внимание читателя на какой-то конкретный объект. Многие дизайнеры решают этот вопрос, просто сделав этот элемент больше остальных. Тем не менее, это не единственный выход из ситуации. Более того, это не самый лучший выход. Если вам нужно заставить читателя нажать на кнопку или запомнить определенное число, окружите эту кнопку или число большим количеством свободного пространства. Это будет отличным способом решения задачи.

Взгляните на сайта японского промышленного дизайнера Микия Кобаяши. Он выполнен в минималистском стиле. Посмотрите, как используя большое количество свободного пространства, Кобаяши умело сфокусировал внимание читателей на нужном объекте.

инфографика, создание, контент, контент-маркетинг

Сайт Микия Кобаяши

4. Свободное пространство создает атмосферу.

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

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

инфографика, создание, контент, контент-маркетинг

UAC Studios

Что нужно, чтобы профессионально управлять свободным пространством?

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

1. Визуализируйте самое главное.

Перед тем как приступить к созданию инфографики, нужно сделать две важные вещи.

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

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

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

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

инфографика, создание, контент, контент-маркетинг

Беспорядочный vs сбалансированный.

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

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

Помните: инфографика — это место, где бал правит графика, а не текст.

2. Никогда не забывайте о выравнивании.

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

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

инфографика, создание, контент, контент-маркетинг

Выравнивание элементов

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

3. Помните о балансе и простоте.

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

Давайте рассмотрим несколько приемов, которые позволят нам управлять свободным пространством с помощью баланса.

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

инфографика, создание, контент, контент-маркетинг

Белое свободное пространство

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

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

инфографика, создание, контент, контент-маркетинг

Фон

инфографика, создание, контент, контент-маркетинг

Фон

  1. Стремитесь к простоте. «Не бойтесь оставлять много свободного пространства!». Как говорит Марк Болтон из A List Apart, свободное пространство не значит пустое. Это две абсолютно разные вещи. Не старайтесь вместить на холсте как можно больше элементов. Вместо этого придерживайтесь правил минимализма и больше экспериментируйте со свободным пространством. Это переведет вашу работу на качественно новый уровень, сделает ее элегантнее и читабельнее. Рисунок ниже – отличный этому пример.

инфографика, создание, контент, контент-маркетинг

Минимализм

Реакция на статью
поделюсь
0%
интересно
0%
полезно
0%
не уверен
0%
скучно
0%
где автор?
0%
Комментарии
Оставить отзыв

    You must log in to post a comment

    ПОДПИШИТЕСЬ НА НАШУ РАССЫЛКУ!
    Уведомления о новостях, статьях и инфографике будут приходить раз в неделю.
    ПОДПИШИТЕСЬ НА НАШУ РАССЫЛКУ!
    Позвольте нам обновлять ваши знания раз в неделю.