Шрифт марвел комикс. Шрифт в комиксе: наборный или рисованный

Шрифт в комиксе: наборный или рисованный

Выступление 11.11.2010 по Скайпу в Московском комикс-клубе

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


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

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

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

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

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

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

Многим знакома коллекция комиксных шрифтов компании Blambot. Замечательные шрифты, отлично передающие традиции рисованных шрифтов из американских комиксов.

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

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

Никакая готовая библиотека шрифтов не даст вам такого шрифтового разнообразия, как ваша собственная фантазия и талант.

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

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

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

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

И выходные данные...

Подобным образом в своей книге поступил и Крэг Томпсон.

Включая выходные данные...

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

Ну, хорошо. Давайте вспомним, что мы здесь, а не на обратной стороне Земли. И нас не учили рисовать красивые буквы руками. Или мы вообще художники-самоучки (как я, например). И нам сложно располагать буквы ровно, равномерно и красиво даже в маленьком комиксном "пузыре". Что же нам делать, если мы хотим и стиль сохранить, и силы сэкономить? Выход есть.

Сделать свой шрифт!

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

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

Затем растровый файл открывается в любом векторном графическом редакторе, поддерживающем функции трассировки, и трассируется строго в черно-белом режиме. Лишние объекты (мусор внутри букв) нужно удалить, а количество вершин у букв лучше максимально уменьшить, иначе шрифт будет очень "тяжелым" и с ним неудобно будет работать.

Буквы надо подогнать по размеру и по одной перетаскать через буфер обмена в шрифтовой редактор. В данном случае я использовал Фонтлаб Студио 5.0. Буквы помещаются в соответствующие глифы. Для кириллицы нужно выбрать соответствующую кириллическую кодировку (например, Виндовс 1251 для Виндовс ХР).

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

Шрифт готов! По крайней мере, пока вам не захочется внести в него изменения. Вы можете установить его в систему и начать использовать в своем комиксе.

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

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

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

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

Итоговый результат:

Шаг 1

Откройте программу Photoshop. Создайте новый документ (Ctrl + N) или перейдите Файл - Новый (File > New) со следующими размерами: 2000 px по ширине и 2000 px по высоте (Разрешение (resolution) особой роли не играет, т.к. мы используем пиксели). Я назвал новый документ “Текст для книжки с комиксами”.

Шаг 2

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

Примечание переводчика: тип градиента Радиальный (Radial).

Шаг 3

Создайте новый слой. Залейте этот слой любым цветовым оттенком, а затем уменьшите значение Заливки (fill) до 0%. Дважды щёлкните по данному слою, чтобы появилось окно стилей слоя. Примените следующий узор.

Примечание переводчика: автор применяет узор “ Gray Grunge 128 х 128 pixels”, если у вас нет данной текстуры, примените похожую текстуру.

Шаг 4

Кисть (Brush tool (B)), установите размер кисти 1957 px. Вы можете использовать любой цветовой оттенок на своё усмотрение. Теперь добавьте полутон в центре изображения, как показано на скриншоте ниже. Также, поменяйте режим наложения для данного слоя на Свечение (Luminosity), а также уменьшите значение Заливки (Fill) до 16%.

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

Шаг 5

Создайте новый слой. Выберите инструмент Перо (Pen tool (P)), нарисуйте фигуру, как показано на скриншоте ниже.

Шаг 6

Идём в закладку Контуры (Paths), дважды щёлкаем по контуру, который мы только что создали, и выбираем опцию Создать выделение (Make Selection). Нажмите ‘ОК’.

Шаг 7

Залейте выделенную область любым цветовым оттенком на своё усмотрение. Далее, дважды щёлкните по слою с фигурой, чтобы применить следующие стили слоя Наложение цвета (Color Overlay) и Тень (Drop Shadow).

Шаг 8

Добавьте стиль слоя Тень (Drop Shadow)

Шаг 9

Создайте новый слой. Создайте активное выделение, удерживая клавишу ‘Ctrl’+щёлкните по миниатюре слоя с фигурой, которую вы нарисовали в предыдущем действии. Ещё раз выберите полутоновую кисть, примените кисть, как показано на скриншоте ниже. Вы можете использовать любой цветовой оттенок на своё усмотрение.

Шаг 10

Дважды щёлкните по новому слою, чтобы применить стиль слоя Наложение градиента (Gradient Overlay). Не забудьте уменьшить значение Заливки (Fill) до 0%.

Примечание переводчика: тип градиента Линейный (Linear), режим наложения Умножение (Multiply).

Шаг 11

Создайте новый слой. Далее, с помощью инструмента Перо (pen tool), создайте контур вокруг фигуры, которую мы создали. Создайте выделение, а затем залейте выделенную область цветовым оттенком #000000. Расположите данный слой ниже слоя с фигурой.

Шаг 12

Выберите инструмент Горизонтальный текст (type tool), я напишу слово “POW!”, как в данном примере, но вы можете напечатать любое слово на своё усмотрение. Я использовал шрифт Komika Axis, размер шрифта 125.5 pt.

Примечание переводчика: вначале напишите букву “ P” или ту букву, с которой начинается ваш текст, вначале автор применяет стили слоя к слою с буквой “ P”.

Шаг 13

Продублируйте слой с буквой “P”, расположите дубликат слоя ниже оригинального слоя с буквой “P”. Мы используем дубликат слоя позже. Находясь на оригинальном слое с буквой “P”, добавьте следующие стили слоя.

Шаг 14

Добавьте стиль слоя Контур (Contour)

Шаг 15

Добавьте стиль слоя Внутреннее свечение (Inner Glow)

Шаг 16

Добавьте стиль слоя Глянец (Satin)

Шаг 17

Буква “P” должна выглядеть, как на скриншоте ниже.

Шаг 18

Помните, мы продублировали слой с буквой “P”, теперь, перейдите на дубликат этого слоя. Используйте клавиши направления со стрелками, нажмите клавишу со стрелкой вправо 5 раз, а также нажмите 5 раз клавишу со стрелкой вниз. При смещении дубликата слоя, должен быть активен инструмент Перемещение (Move tool).

Шаг 19

Находясь на дубликате слоя, который вы только что сместили, ещё раз продублируйте его (сместите полученный дубликат слоя 5 раз вправо и 5 раз вниз). Повторите предыдущие шаги, создав ещё три слоя с буквой “P”. Таким образом, в общем, у вас должно получиться 6 слоёв с буквой “P”, включая оригинальный слой с буквой “P”.

Примечание переводчика: 1. Каждый дубликат слоя смещайте 5 раз вправо и 5 раз вниз 2. Все дубликаты слоёв должны быть ниже оригинального слоя с буквой “ P” 3. Всего дубликатов будет 5.

Шаг 20

Сгруппируйте 5 дубликатов слоёв с буквой “P” в одну группу, а затем примените следующие стили слоя.

Примечание переводчика: стили слоя примените к слою с группой.

Шаг 21

Добавьте стиль слоя Внутренняя тень (Inner Shadow)

Шаг 22

Добавьте стиль слоя Глянец (Satin)

Шаг 23

Добавьте стиль слоя Наложение градиента (Gradient Overlay)

Примечание переводчика: тип градиента Линейный (Linear).

Шаг 24

Добавьте стиль слоя Внешнее свечение (Outer Glow)

Шаг 25

Ваша буква “P” должна выглядеть, как на скриншоте ниже.

Шаг 26

Далее, мы применим полутоновую кисть к созданной букве “P”. Перейдите на оригинальный слой с буквой “P”, создайте активное выделение вокруг данной буквы. Создайте новый слой, выберите инструмент Кисть ( Brush tool). Я использовал цветовой оттенок #000000. С помощью полутоновой кисти добавьте полутон на букву, как показано на скриншоте ниже.

Шаг 27

Поменяйте режим наложения для данного слоя на Перекрытие (Overlay).

Шаг 28

Повторите те же самые шаги для букв ‘O’,’W’, включая восклицательный знак.

Шаг 29

Создайте новый слой, выполните активное выделение всех букв от первой до последней буквы (P, O, W, включая восклицательный знак), нажимая и удерживая клавиши ‘Ctrl’ и ‘Shift’. Залейте выделенную область чёрным цветом.

Шаг 30

К созданному слою, примените стиль слоя Тиснение (Bevel and Emboss).

Шаг 31

Уменьшите Заливку (Fill) для данного слоя до 0%.

Шаг 32

Далее, мы повторим Шаг 29, чтобы добавить обводку. Создайте новый слой, расположив его ниже всех слоёв с текстом. Создайте активное выделение всех букв от первой до последней буквы (P, O, W, включая восклицательный знак), нажимая и удерживая клавиши ‘Ctrl’ и ‘Shift’. Залейте данный слой чёрным цветом. К данному слою, добавьте чёрную обводку.

Шаг 33

Преобразуйте данный слой в смарт-объект, щёлкнув правой кнопкой мыши по слою и в появившемся окне выбрав опцию Преобразовать в смарт-объект (Convert to Smart Object). Добавьте стиль слоя Тень (Drop Shadow).

И мы завершили урок! Надеюсь, что вам понравился этот урок, и вы узнали сегодня что-то новое.

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

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

2. Если переводить название этого шрифта, получится что-то типа “куриная задница”. Я не знаю почему так. Мне этот шрифт приглянулся необычной формой и . Думаю вполне уместен в каких-то мультипликационных заголовках и всяком таком. Имеет как прописные, так и строчные символы.

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


4. Этот мне напоминает шрифт из старых мультиков, типа “Ну, погоди!”. Ну там когда авторов перечисляют в титрах. Похож очень по-моему. В общем для стенгазет, новых годов и прочих подобных детских тем. Подойдет идеально.


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


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


7. Утонченный, резковатый, слегка разнузданный. Не знаю где я его видел, то ли в комиксах, то ли в мультиках?


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