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

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

И нужно было привести ее к такому виду:

 

Итак назад к теме. Начну с общих советов, закончу конкретными, предметными.

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

2. Делайте паузы в работе хотябы каждый час. Желательна полная смена места работы (выйти на улицу, либо на балкон). Если курите - курите, если не курите - просто подышать свежым воздухом (выгулять собаку, либо еще чего-то придумать).

3. Хорошо продумайте какими инструментами необходимо пользоваться (внутри фотошопа, естественно). Например, мне, слегка впадло много двигать мышкой и постоянно менять инструменты, потому всю отрисовку я делал только с помощью 4-х операций: выделение, свободное трансформирование, редактор уровней насыщенности черного и в редких случаях обьеденение выбраных слоев.

4. Итак, прежде всего необходимо выбрать необходимую область и вырезать ее. Далее с помощью редактора насыщенности черного привести ее примерно к такому виду:

( на данном этапе я уже отредактировал птицу и пару букв из текста )

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

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

7. Еще одна особенность самых распространенных шрифтов: некоторые буквы можно отразить относительно какой-то оси и получить их же. Например, буква "О": если ее поделить осью пополам вертикально, либо горизонтально, и отразить относительно этой оси, то мы получим ее же. Туда же можно отнести "Т", "М", "П" и некоторые другие. 

8. Есть несколько вариантов отрисовки (можно отрисовать линиями, трансформациями, кисточкой и еще многими способами), но лично мне нравится способ отрисовки трансформациями. В принципе, он является обьедененным методом отрисовки кисточкой и копи/паста. 

В данном случае я выбираю необходимые квадраты с цветом, с помощью комбинации CTRL+T включаю режим свободной трансформировки и растягиваю цвета на те, которые мне нужны. Этот способ очень хорош для вертикальных и горизонтальных линий, которых в шрифтах уйма. Главной задачей есть убрать все ненужные изменения в цветах, убрать все "рваные" края символов.

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

10. Как раньше в статье упоминал, в некоторых моментах необходимо делать отражения некоторых элементов букв.  Также варианты отражений/копирования букв очень здорово экономят время и нервы, так что очень советую ими пользоваться :)

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

Материалы взяты с сайта  www.peterburg-art.ru (в данный момент лишь доступного по адресу http://peterburg-art.ru.swteh.ru/).