Рустем Даутов
18 ноября 2015
Советы почтой каждую неделю
Пожалуйста, получите наше письмо, чтобы подтвердить свой адрес:
Вы подписаны на «Советы за неделю»:

Здравствуйте! Недавно столкнулся вот с такой задачей. Точнее, от меня руководители требуют. Как правильно поступить?

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

Вопрос: может быть такое выравнивание или это грубая ошибка?

(Вторая часть. Перерисовываем)


В прошлом совете я объяснил, почему выключка по формату выглядит плохо и не подходит для обложки диска.

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

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

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

В плане вёрстки и настроения иллюстрация делает почти всю работу. Но из одного названия непонятно, что это за диск.

Добавим короткое пояснение. Ради этого уменьшим иллюстрацию и изменим композицию:


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

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

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


Кажется, всё.

Но!

Получилась скукотища: нейтральная вёрстка, почти случайный шрифт — шлёпнуть чужую картинку и вёрстку по шаблону слишком легко. Хочется круче. Хочется, чтобы каждый элемент обложки попадал в тему. Переделаем!

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

О культурных традициях
Фотографии Артёма Горбунова

Надписи заполняют свободное пространство и образуют цельную композицию. Попробуем сделать что-нибудь похожее:


Надпись сделана из погнутого шрифта «Ориго»

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

О выходе из прямоугольника

Лицевая сторона готова. В следующем совете займёмся задней.

P. S. Это был совет по средам о вёрстке и типографике в вебе. Хотите знать всё об интерлиньяжах, полях, отступах, кеглях, выравниваниях и модульных сетках? Присылайте вопросы.

P. P. S. Открыт набор в Школу стажёров до 24 июля или пока есть свободные места. Занятия с 28 августа.

 

Поделиться

Комментарии

Алексей Афанасович
18 ноября 2015

А допустимо ли зеркалить иллюстрацию, чтобы персонажи шли вправо?

Миша Нозик
20 ноября 2015

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

Совет об иллюстрациях:
http://artgorbunov.ru/bb/soviet/20140707/

Дмитрий Сырпин
21 ноября 2015

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


Цель рубрики — обсуждение вопросов дизайна всех видов, текста в дизайне и взаимоотношений дизайнеров с клиентами.

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

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

Вот такой веб 2.0.

Сделали страницу для обучающего сервиса по безопасности. Как навести порядок? Вторая часть 1




Недавно всплыло

Кто ты? 1 Столкнулся с проблемой, когда долго общаешься с клиентом, и потом выясняется, что его не устраивает порядок цен. Часть 1 2 Расскажите об обратной связи в интерфейсе 1 Расскажите об управляемости: программа 2