Дизайн для НЕдизайнеров. Робин Вильямс. The NonDesigners The NonDesigners
 Скачать 6.88 Mb.
|
|
52 Часть 1. Правила дизайна Перед вами та самая визитка, с которой мы уже встречались. Во второй пример я добавила повторяющийся элемент – тяжелый жирный шрифт. Посмотрите на визитку и проследите за тем, как меняется направление вашего взгляда. Куда он переходит после того, как вы добираетесь до номера телефона? Не возвращается ли он в начало, к другому текстовому блоку с жирным шрифтом? При помощи этого визуального трюка дизай- неры и управляют взглядом читателя, чтобы приковать его внимание к странице на возможно более долгое время. Когда вы дочитываете все до конца, взгляд уходит за пределы визитки, не так ли? Куда теперь направляется взгляд после прочтения? Переходит от одного элемента блока, выделенного жирным шрифтом, к другому? Вероятно, так оно и есть, в этом и заключается суть принципа повтора – его применение позволяет увязать все элементы работы в одно целое, обеспечивает единство стиля. 53 Воспользуйтесь элементами, которые вы уже создали, и сделайте свой проект более цельным, превратив элементы в повторяющиеся графичес- кие символы. Все ли заголовки в документе набраны жирным шрифтом Times 14 пунктов? Может быть, имеет смысл заменить гарнитуру рубле- ной (скажем, Antique Olive Black) и увеличить кегль до 16 пунктов? Прин- цип повтора уже реализован, надо только усилить его и сделать более энергичным. Страница стала визуально интереснее, более упорядочен- ной и цельной. Создание повторяющихся элементов имеет смысл начать с заголовков и подзаголовков, поскольку они уже оформлены более или менее единообразно. Поэтому заложите фундамент цельности стиля, скажем, в оформлении заголовков, и сделайте их выразительнее. Ч Е Т Ы Р Е : П О В Т О Р 54 Часть 1. Правила дизайна Вы оформляете многостраничные документы? В таком случае принцип повтора выходит на первый план. Читателю должно быть очевидно, что сс. 7 и 12 принадлежат одной публикации. Страницы, показанные на этом развороте, взяты из одного документа. Можете указать все повторяю- щиеся элементы? Одинаковая двойная линейка в верхней части каждой страницы. Одинаковые шрифты заголовков и подзаголов- ков, а также отбивки сверху. Номера страниц оформлены единообразно. У текста есть «точка выхода» (выравнивание по нижнему краю страницы), но необязательно всегда выравнивать текст здесь, если в верхней если в верхней если в верхней если в верхней если в верхней части каждой страницы есть заметная точка части каждой страницы есть заметная точка части каждой страницы есть заметная точка части каждой страницы есть заметная точка части каждой страницы есть заметная точка входа входа входа входа входа..... Иногда документы выравнивают по нижнему краю (текст как бы стоит на странице, его верхний край может быть неровным, напоминая силуэты городских зданий на фоне неба), а не по верхнему краю (текст свисает с верхнего края, как белье, которое сушат на веревке). Выбрав какой-то из этих вариантов, надо последовательно его придерживаться. В нижней части каждой страницы расположена одинарная линейка. 55 Как можно заметить, что какому-то элементу отводится особая роль, если в оформлении нет единообразия? Строго соблюдая стилевое единство оформления, можно включить в публикацию неожиданные элементы, приберегая эффект неожиданности для тех составляющих, к которым вы хотите привлечь внимание читателя. Можете указать повторяющиеся элементы оформления этой книги? Ширина верхней колонки равна суммарной ширине двух нижних, благодаря чему они образуют общие внешние границы. Все статьи, фотографии или рисунки начинаются от одной линии в верхней части каждой страницы (обратите также внимание на примечание на предыдущей странице). Обратите внимание на треугольный буллит, повторяющийся в маркиро- ванном списке и в подрисуночной подписи на противоположной страни- це разворота. Эту фигуру вполне можно задействовать в оформлении публикации в любом другом месте. Ч Е Т Ы Р Е : П О В Т О Р 56 Часть 1. Правила дизайна Без неукоснительного соблюдения правила повтора не обойтись при со- здании образцов делового стиля (визитной карточки, фирменного блан- ка, конверта и т. п.). Причем необходимо, чтобы такие элементы сохра- нялись во всем разнообразии документов. Человек, получивший ваше письмо, должен понять, что оно пришло от того, кто неделю назад дал ему визитную карточку. Созданный вами макет должен позволить вы- ровнять напечатанный текст по одному из элементов оформления! Как видите, текст с ярко выраженным выравниванием по левому краю производит сильное впечатление. 57 Повтор помогает организовать информацию, служит читателю надеж- ным проводником, способствует объединению разнородных компонен- тов дизайна. Повторяющиеся элементы создают изысканную целостность, связывающую все воедино, даже в документе, состоящем из одной стра- ницы. Без повтора не обойтись и при создании серии одностраничных документов, образующих полный пакет. Повторяющиеся Повторяющиеся Повторяющиеся Повторяющиеся Повторяющиеся элементы: элементы: элементы: элементы: элементы: жирное начертание; светлое начертание; квадратные маркеры (буллиты); отступы; интервалы; выравнивание. Кроме хорошо заметных повторяющихся элементов, которые помогают ясно понять суть, персонаж этого документа может включить пару подобных элементов в свое сопроводительное письмо. Ч Е Т Ы Р Е : П О В Т О Р 58 Часть 1. Правила дизайна Если ваша фантазия загорается от какого-либо элемента, дайте ему зеле- ный свет! Его можно найти и в клип-арте, и в декоративном шрифте. Не бойтесь привнести в свою работу что-то совершенно новое, хотя бы и ради повтора, или взять что-нибудь очень простое и найти для него различные применения, меняя размер, цвет и угол зрения. Не всегда повторяющиеся элементы представляют собой точные копии, но они связаны так тесно, что родство между ними не вызывает сомнений. Повтор, организованный при помощи какого-нибудь графического элемента, может отказаться делом не только полезным, но и приятным. Вот таким незамысловатым триангулярным мотивом можно аранжировать и другой материал: конверты, открытки, воздушные шары и т. д. Все соберется воедино, даже если не изображать чайник на каждом предмете. 59 Нередко на страницу добавляется повторяющийся элемент, не имеющий к ней никакого отношения. В качестве примера можно назвать наскаль- ные изображения на бланке опроса или птиц странного вида на страни- цах отчета. Выберите в одном из ваших шрифтов несколько особенно симпатичных символов и украсьте страницы публикации их крупными изображениями в каком-нибудь неброском цвете, меняя размеры и угол поворота символов. Веселитесь на здоровье! Элементы дизайна, расположенные на полях, способствуют объединению двух или более документов, связанных общей темой, или фрагментов публикации (фона и переднего плана). Обратите внимание, как повторение пиктографических картинок образует связь между «постером» и этой страницей. Ч Е Т Ы Р Е : П О В Т О Р 60 Часть 1. Правила дизайна Руководствуясь принципом повтора, иногда можно взять элемент гото- вого дизайна и создать на его основе что-то новое. Помните этот фирменный бланк из главы 3? В качестве повторяющегося элемента я взяла две точки и поместила в них изображения Мамули и Папули. Стоит только начать, и творческий процесс доставит вам массу положительных эмоций – это я вам обещаю. 61 Вот еще один пример, показывающий, как дизайн может основываться на повторе. Заниматься этим просто приятно, надо лишь найти элемент, ко- торый вам понравится, и поэкспериментировать с ним! В ходе данного эксперимента я повторила одну из точек, сильно ее увеличила и поставила в круг Мамулю. Папулю я, наоборот, хотела исключить, поэтому поместила его белый контур в маленький черный кружок. Зачем понадобилось изображать Папулю в негативном свете (был белый, а стал черный)? В дизайне действует правило, справедливое и в жизни: если масла слишком много, то им и кашу запросто испортишь. Не перестарайтесь с повтором, попробуйте добиться единства стиля при помощи разнообразия. То есть, если повторяющийся элемент выразителен (например, круг), не повторяйте его в точности, а изменяйте (например, диаметр и цвет). Ч Е Т Ы Р Е : П О В Т О Р 62 Часть 1. Правила дизайна Иногда желаемого эффекта удается добиться, лишь намекая на повтор элемента. Попробуйте включить в композицию фрагмент знакомого пред- мета или расположите его как-то иначе. Если изображение знакомо читателю, то он сможет узнать его и по фрагменту. Изображение перца чили, конечно, есть на всех рекламных материалах Chile Fiesta. Здесь еще раз наглядно демонстрируются преимущества использования фрагмента повторяющегося изображения – зритель видит весь перец. Это означает, что фактически у вас есть картинка двойного размера за те же деньги. 63 Благодаря повтору ваши работы выглядят профессионально и приобретают вес. Зритель чувствует ответственный подход к делу, потому что решение применить повтор означает, что кто-то как следует подумал о дизайне. Никогда заранее не знаешь, что тебе придется собирать у себя девичник по случаю предсто- ящих одной из твоих подруг рoдов. Но когда это случится, вы будете знать, что все эти пригласи- тельные билеты, конверты и благодарствен- ные письма надо связать воедино, украсив их повто- ряющимися элементами. Это произведет впечатление на гостей, которые подумают, что вы наняли профессио- нального дизайнера. Ч Е Т Ы Р Е : П О В Т О Р 64 Часть 1. Правила дизайна В заключение о повторе Повторяющиеся визуальные элементы дизайна цементируют и усилива- ют документ, скрепляя его составные части. Положительная роль повто- ра очень сильна в одностраничных документах, а в многостраничных без него просто не обойтись (такие документы часто называют оформленны- ми в едином стиле ). Главная цель Цель повтора – объединить всю публикацию и сделать ее визуально ин- тереснее . Нельзя недооценивать власть визуального интереса – чем ин- тереснее выглядит работа, тем вероятнее, что ее прочитают. Как применять повтор Применение повтора надо рассматривать как работу в рамках единого сти- ля, а я уверена, что вы так и делаете. А теперь сделайте последовательно оформленную работу еще немного более последовательной – попробуйте превратить некоторые из однотипных элементов оформления в часть гра- фического дизайна, как это происходит с заголовком. Подчеркните заго- ловки линейкой толщиной в один пункт или расположите такую линейку в нижней части страницы. А что если увеличить ее толщину до четырех пунктов, чтобы сделать повтор более акцентированным и выразительным? Попробуйте добавить в дизайн элементы, предназначенные исключитель- но для создания повтора. Есть ли в вашей публикации нумерованные спис- ки? Что если подобрать для них характерный шрифт или напечатать но- мер вывороткой? Для начала надо найти повторы, которые уже есть, и усилить их. Поработав с повторяющимися элементами и привыкнув к самой идее, начните создавать повторы, чтобы усилить дизайн и чет- кость подачи информации. Повтор сродни подчеркиванию деталей туалета. Женщина, одетая в ши- карное черное вечернее платье и роскошную черную шляпу, может под- черкнуть свой наряд красными туфлями на каблуках, красной губной помадой и крошечным красным букетиком роз, приколотым к корсажу. Чего избегать Избегайте избыточного повтора, который действует на нервы и подав- ляет. Не забывайте о положительной роли контраста (ему посвящена сле- дующая глава и раздел о шрифтовом контрасте). Например, если бы женщина в черном вечернем платье надела не только красную шляпку, но и красные серьги, сумочку, туфли и пальто, такой повтор вовсе не имел бы эффект сногсшибательного и стильного кон- траста, а заглушил бы все остальные детали туалета, и впечатление было бы испорчено. 65 5 Контраст – это одно самых эффективных средств, позволяющих сделать страницу визуально более интересной: вызвать в читателе живое любо- пытство, притягивающее его взгляд, и создать стройную структуру из разрозненных элементов оформления. Запомните важное правило: кон- траст должен быть сильным, только тогда он работает . Не будьте Не будьте Не будьте Не будьте Не будьте мямлей мямлей мямлей мямлей мямлей. Контраст порождается различиями между двумя элементами. Если эле- менты «вроде бы» отличаются друг от друга, то это уже не контраст, а конфликт. Вот в чем все дело – правило контраста гласит: если эле- если эле- если эле- если эле- если эле- менты не похожи как две капли воды, сделайте их разными. По-на- менты не похожи как две капли воды, сделайте их разными. По-на- менты не похожи как две капли воды, сделайте их разными. По-на- менты не похожи как две капли воды, сделайте их разными. По-на- менты не похожи как две капли воды, сделайте их разными. По-на- стоящему разными. стоящему разными. стоящему разными. стоящему разными. стоящему разными. Для создания контраста есть масса способов. Можно противопоставить крупному шрифту мелкий; изящной гарнитуре старого стиля – жирную рубленую; тонкой линии – толстую; холодному цвету – теплый; гладкой текстуре – грубую; горизонтальному элементу (длинной строке текста) – вертикальный (высокую узкую колонку); большому интерлиньяжу – ма- ленький; небольшому рисунку – крупный. Но только помните – невозможно создать контраст, противопоставляя надписи, набранные кеглем 12 и 14 пунктов. Линия толщиной полпункта не контрастирует с линией в 1 пункт. Нет контраста между черным и тем- но-коричневым. Возьмитесь за дело всерьез. 66 Часть 1. Правила дизайна Представьте себе, что эти два «информационных бюллетеня» оказались на вашем столе. Какой из них вы возьмете первым? Компоновка элемен- тов в целом одинакова. Оба документа выглядят аккуратно и производят приятное впечатление. Информация в обоих одна и та же. Настоящее отличие только одно: в том, что справа, больше контраста. Мило и аккуратно, но ничто не притягивает к нему взгляд, а значит, ее никто и не прочитает. 67 Совершенно понятно, за счет чего здесь получается контраст. Для заго- ловков выбран более энергичный, жирный шрифт. Этот же шрифт я по- вторила (принцип повтора, помните?) в названии бюллетеня. Оно было набрано капителью, а теперь здесь есть строчные и заглавные буквы, по- этому я смогла увеличить кегль, что также способствовало усилению кон- траста. Раз заголовки стали такими сильными, то название вообще мож- но напечатать вывороткой, еще раз повторяя темный цвет и усиливая контраст. Эта страница сильнее притягивает взгляд, чем предыдущая, согласны? П Я Т Ь : К О Н Т Р А С Т 68 Часть 1. Правила дизайна Контраст играет ключевую роль в структурировании информации. Взгля- нув на страницу, читатель должен мгновенно видеть, что к чему. Перед вами довольно типичное резюме. Вся информация на месте, и если кто-то захочет ее прочитать, он ее прочтет, но внимание она не привлекает – это точно. Есть и ошибки: на странице сразу два типа выравнивания: по центру и по левому краю; интервалы между разными разделами слишком невырази- тельны; описания выполняемой работы смешиваются с основным текстом. 69 Обратите внимание, что применение контраста не только повышает при- влекательность страницы, но и делает намного яснее структуру и цель документа. Ошибки были без труда исправлены. Один тип выравнивания: влево. Как видите (см. рис. выше), один тип выравнивания не означает, что все выровнено по одному и тому же по одному и тому же по одному и тому же по одному и тому же по одному и тому же краю, а означает, что применено одинаковое выравнивание. Обе линии выравнивания выраже- ны очень отчетливо и усиливают друг друга (выравнивание и повтор в действии). Заметные заголовки: сразу видно, что это за документ, и каковы его ключевые положения (контраст в действии). Составные части разделены более широкими интервалами, чем строки в абзацах (контраст пространственных взаимосвя- зей; приближенность в действии). Заголовки и названия работ выделены жирным шрифтом (повтор в шрифтах заголовков); сильный контраст позволя- ет бегло просмотреть важные пункты. П Я Т Ь : К О Н Т Р А С Т 70 Часть 1. Правила дизайна Интересный контраст проще всего создать при помощи подбора гарни- тур (этому уделено основное внимание во второй части данной книги). Но не забывайте о линейках, цвете, подборе расстояний между элемен- тами, текстурах и т. п. Если для разделения колонок выбрана волосяная линия, то линия, вы- полняющая на той же странице другую функцию, должна иметь толщину хотя бы два (а лучше четыре) пункта, но ни в коем случае не полпункта и не один пункт. Если вы добавляете на страницу второй цвет, чтобы что- нибудь подчеркнуть, убедитесь, что цвета контрастируют друг с другом, – темно-коричневый или темно-синий цвет не будет убедительно контра- стировать с черным текстом. Контраст между шрифтами и линейками есть, но какой-то неубедительный. Линейки имеют разную толщи- ну. Это сделано специально или ошибочно? Благодаря сильному шрифтовому контрасту весь документ становится намного более динамичным и визуально привлекательным. Контраст между линейками стал более отчетливым, и сразу понятно, что так и должно быть. Вся таблица получилась вырази- тельнее и утонченнее; хорошо видно, где она начинается и где заканчивается. 71 Информационный бюллетень, сверстанный в две высокие узкие колон- ки, должен иметь несколько четких заголовков, создающих на странице контрастный горизонтальный вектор. Сочетание контраста с повторами, например при нумерации страниц, использовании буллетов или заголовков создает целостность и единство восприятия любого документа, независимо от его размера и количества страниц. Кроме шрифтового контраста, на этой странице наблюдается также контраст между длинным горизонтальным заголовком и узкими вертикальными колонками. Колонки являют собою примеры применения и повтора, и контраста. П Я Т Ь : К О Н Т Р А С Т |