Дизайнерская косметичка: как оформить статью

Семь советов автору, дизайнеру и пиар-специалисту от Марии Троицкой, графического дизайнера Nimax. Как грамотно добавить в статью картинки, удачно пошутить на превью и преподнести полезную информацию красиво и лаконично.

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

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

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

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

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

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

Тинькофф Журнал — любовь с первого взгляда и надолго. Превью делятся на «по существу» и «киберпанк, который мы заслужили».

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

Лентач — комментарии излишни. Замечу только, что для каждой рубрики есть шаблон, и мемы всегда так переработаны, чтобы стиль Лентача сохранялся. И пусть кто-нибудь скажет, что «этот бред» не работает.

Внимание! Для подобной стратегии остро необходимо отменное чувство юмора и способность быстро реагировать на текущие события.

Еще можно посмотреть на наши превью — стараемся выдерживать единство, но иногда освежаем концепцию постов. В основе — лаконичные фоны и 3D-графика. Про то, почему всем нужно учиться моделировать, где и как потом применять можно почитать в статье нашего арт-директора Павла Конюкова.

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

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

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

Вкладывать в каждую иллюстрацию глубокую метафору, тщательно продумывать костюмы персонажей, эмоции и декорации. Так делают, например, на The Village. Тут сразу прослеживается рубрикация и даже какой-то неуловимый сюжет, который переходит из скетча в скетч. Внутри статьи иллюстрация, скорее всего, будет одна и послужит обложкой, зато какой!

Стройность, качество и метафора требуют большого количества времени. А если статью нужно опубликовать уже вчера? Упростите картинки! Геометрические примитивы, стрелочки. Пусть изображения будут инфографичными.

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

В поиске и подборе метафор могут помочь Pinterest, Dribbble, а ещё сервис NounProject. Здесь много иконок, собранных со всего света, а в поиск можно вбить даже абстрактное понятие. Он часто помогает с определением стартовой точки для создания чего-то простого и быстрого.

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

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

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

Мы ведь договорились, что «Хочу» для идеалистов? Вот и помечтаем.

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

Моушн-графике очень благодарны «скучные» данные: графики, таблицы, показатели.

Мы тоже выпускаем анимации, чаще всего используем их в превью.

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

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

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

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

Если у вас есть возможность редактировать статью непосредственно перед отправкой в блог, внимательно смотрите, какие функции вам доступны. Так можно делать на VC и других UGC-СМИ. Может быть, получится поставить красивые сноски? Добавить «листалку»? Или вообще выпустить карточки для мобайла, как на Яндекс.Дзене? Не бойтесь посмотреть на публикацию шире!

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

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

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

Сдержанность скорее привлечет на фоне всеобщих пестроты и китча, и наоборот. Всегда смотрите, как с этой задачей справляются лидеры площадок, задавайтесь вопросом «Почему и как это работает?», не стесняйтесь спрашивать напрямую у авторов, если позволяет время. Такие привычки помогают лучше понять настроение площадки, отстроиться от конкурентов и перенять опыт.

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

Не хватает времени на полноценное исследование? Заходите в топ публикаций! Там всегда собраны самые удачные материалы блога. Просмотра трех-четырех вполне хватает на то, чтобы понять что «зайдёт» амбассадорам площадки и почему.

Внимательно следите за настроением блога и вашей компании. Если публикации «не заходят», проанализируйте свою аудиторию и при необходимости смените площадку. Иначе исследование конкурентов будет напрасно!

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

Выпускать к каждому материалу сопроводительный плакат, тест на закрепление или набор стикеров.

Аккуратно оформить инструкции, которые есть в статье — уже полдела! Сравниваете преимущества соцсетей? Оформите наглядную табличку по критериям. Безумный креатив и оригинальность здесь не нужны — это инструмент для удобства пользователя. На дополнительные материалы не всегда отведено время, старайтесь в первую очередь грамотно организовать пространство внутри текста.

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

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

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

В этом разделе не будет варианта «Хочу» и «Могу», это история, где нужно сделать «через не могу».

Прежде всего трезво оцените те данные, которые вам прислали. Так ли необходимы все цифры из графика для конкретной статьи? Уберите всё лишнее. Остальное разведите по цветам, нарисуйте крупные цифры. Если что-то необходимо указать под звёздочкой, не поступайте как дизайнеры рекламы в метро. Пусть такая информация будет читабельна, она не бесполезная — она уточняющая.

Здесь есть пара советов, которые не вошли ни в один из разделов, но идеологически важны:

Вы не узнаете, какие данные важны, а значит рискуете выпустить бес/не полезный материал. Лучше не тупить, а обсудить с автором важные моменты.

Возможно, вас любят за строгость или, наоборот, за непринужденность повествования, признайте себя! Трезво оценивайте: бьющиеся пиксели — это ваш фирменный почерк или некачественный контент?

Если вам необходима смена стратегии поведения, то прорабатывать ее нужно на всех уровнях. Одна сильно выбивающаяся статья ситуацию не изменит.

Даже если что-то не влезает в вёрстку и очень хочется выкинуть абзац — посоветуйтесь с автором. Это что-то легко может оказаться самой важной информацией.

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

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