Расположение текста
I. на аватарах by Electrimafried
- используем задний план, как границы для расположения текста
http://i50.tinypic.com/333hnxh.jpg
Итак, у нас есть вот такой аватар, вполне симпатичный сам по себе, но украшенный надписью, он будет смотреться ещё более интересно. Лучшее место для расположения текста на нём – это река у подножия гор. Это наиболее свободное пространство на картинке, плюс горы и прочие прелести пейзажа формируют для нас прекрасные границы.
http://i48.tinypic.com/afc12w.jpg
В вопросе украшения аватара текстом один из наиболее важных моментов, к которому я ещё вернусь, – выбор шрифта. Если вы вкладываете какой-то смысл в написанное и хотите, чтобы ваш текст был легко читаем, лучше выбрать какой-то простой шрифт: Arial, Verdana, Tahoma, все они прекрасно подойдут. На этом аватаре используется Baskerville, размером в 10px.
http://i49.tinypic.com/4k9oiq.jpg
Ну что, текст уже смотрится вполне неплохо, но мы можем сделать его ещё лучше и, что немаловажно, оригинальнее. Для этого нам нужно повернуть его. Идём в Редактирование >> Свободное трансформирование.
http://i50.tinypic.com/2j3m8ex.jpg
Вокруг нашего текста появилась рамка http://i48.tinypic.com/67qcuv.jpg, а это значит, что теперь мы можем его крутить-вертеть, как нам заблагорассудится. Выбираем какую-то линию на изображении и поворачиваем текст параллельно ей.
http://i48.tinypic.com/2s9401t.jpg
И voilà наш аватар готов.
- изгиб текста
С этим эффектом нужно быть аккуратным, он далеко не всегда хорошо смотрится на изображении. Опять же, лучше его использовать там, где есть для этого предпосылка, в нашем случае, изгиб.
http://i50.tinypic.com/731lzs.jpg
На этот раз шрифт American Typewriter, размер 12px. При помощи свободного трансформирования поворачиваем его так, чтобы он был рядом с изгибом волны.
http://i45.tinypic.com/e0k29.jpg
Проверим, чтобы в палитре слоёв был выбран именно наш слой с текстом и нажмём кнопку http://i45.tinypic.com/25ztic5.jpg, находящуюся на верхней панели, под меню фш. В появившемся окне выбираем деформацию аркой и уменьшаем процент изгиба, ориентируясь на изгиб волны на картинке. После этого вы можете заметить легкий перекос надписи, но это легко исправляется при помощи Искажения по вертикали.
http://i48.tinypic.com/2v10qjd.jpg
And there you go!
http://i48.tinypic.com/2lkb7lz.jpg
- одно слово, заднего плана нет
Разберёмся, что нам делать, когда на аватаре только один наш герой, нет особого заднего плана и масса вариантов, куда вписать текст.
http://i49.tinypic.com/4fu5qd.jpg
Для начала стоит обратить внимание на границы персонажа и общие углы аватара.
http://i46.tinypic.com/2dbp540.jpg http://i48.tinypic.com/29kx6it.jpg
Похоже, что у нас есть два неплохих варианта: макушка Тимона и правый нижний угол аватара.
http://i46.tinypic.com/2cem8ow.jpg http://i47.tinypic.com/331owg2.jpg
Первый вариант смотрится более выигрышно, но и второй ничего.
Можно ещё вписать текст, ориентируясь на изгибы фигуры персонажа.
http://i48.tinypic.com/rh759v.jpg
То есть, по сути, когда у нас нет определенного заднего плана, лучше всего вписывать текст, следуя контуру фигуры персонажа.
- несколько слов, заднего плана нет
Практически та же история, что и с одним словом – очертания нам в помощь.
http://i47.tinypic.com/291p64l.jpg
Мы расположим текст, ориентируясь на контур шляпы Джека. Для написания текста в несколько строк лучше всего использовать несколько слоёв, а не набирать его в один, так будет проще отрегулировать их расположение.
http://i50.tinypic.com/2mb9r6.jpg
- создаем задний фон для текста
Окей, скажем, на вашем аватаре много мелких деталей, задний план забит под чистую и, в общем-то, текст всунуть некуда.
http://i48.tinypic.com/14t4vid.jpg
К счастью, существуют уловки, чтобы обойти такую, казалось бы, безвыходную ситуацию: мы сделаем собственный фон для текста. Сначала создадим новый слой, ткнув кнопку http://i46.tinypic.com/2ahf9tu.jpg в палитре слоёв и уменьшим непрозрачность этого слоя до 85%.
http://i48.tinypic.com/2d6jmma.jpg
Затем, используя инструмент Прямолинейное лассо http://i46.tinypic.com/2j0ny1h.jpg, выберем какую-то область для нашего текста - лучше, если в ней будут присутствовать углы – и зальём её чёрным цветом, используя инструмент Заливка http://i46.tinypic.com/25kk3za.jpg.
http://i50.tinypic.com/2nsuamc.jpg
Теперь выберем какую-нибудь гранжевую кисточку http://i50.tinypic.com/25ri0rs.jpg, непрозрачность 33%
http://i49.tinypic.com/whbp6h.jpg
И добавим её к заднему плану, чтобы он лучше вписывался в общую картину.
http://i47.tinypic.com/dgl5lf.jpg
Возможно, вам захочется вписать текст в полностью черную часть заднего фона, но будет лучше, если вы немного вынесете его за границы чёрного – смотреться будет интереснее. Ну, и, конечно, повернёте его, ориентируясь на линии фона.
http://i49.tinypic.com/2efi9vq.jpg
II. на подписях by gryphongfx (также применимо и к логотипам/эпиграфам/баннерам/шапкам/как угодно назовите, обоям для рабочего стола и, в общем-то, любой другой графике)
Ключевое слово (keyword) всегда должно быть больше никнейма (nickname) по размеру или визуально более заметным, и находиться они должны близко друг к другу. Не где-то рядом, а близко.
http://i47.tinypic.com/15gqrlf.jpg
'кей, вот это плохой пример. Смотрится так, будто эти два слова не имеют вообще никакого отношения друг к другу.
http://i48.tinypic.com/xqax6v.jpg
Это смотрится неплохо, но можно сделать лучше.
http://i48.tinypic.com/142swlc.jpg
А вот это уже хорошо. Правильное расположение, и, как следствие, текст смотрится значительно интереснее. Первый вариант подойдёт, если текст состоит из двух слов, второй – если из трёх.
Выбор цвета.
by Electrimafried
Обычно чёрный и белый смотрятся удачно на любом изображении, но если вы всё же хотите добавить немного цвета, пара подсказок для вас.
http://i46.tinypic.com/14xgzna.jpg
Вне зависимости от того, какой цвет вы хотите использовать (красный, желтый, зеленый, синий…), на изображении зелёным отмечены оттенки, использовать которые можно практически всегда (естественно, если они вписываются в общее изображение. Сочетать салатовый с ярко-красным, конечно, не стоит), жёлтым – то, что можно использовать только при определённых условиях (например, когда задний план представляет собой ровный, яркий цвет, без каких-либо мелких деталей) и красным – то, что использовать не стоит ни при каких условиях – эти оттенки выжигают глаза, и это не в переносном смысле.
Читаемость текста, тень.
by Chr
Наверно, самый простой способ сделать текст более заметным и легко читаемым.
http://i49.tinypic.com/2hi9h6c.jpg http://i46.tinypic.com/21jt7b7.jpg
Тень накладывается очень просто. Пишем наш текст и идём в Слой >> Стиль слоя >> Тень или, стоя на нашем слое в палитре слоёв, кликаем правой кнопкой мыши и выбираем Параметры наложения из меню, а в появившемся окне выбираем графу Тень и ставим галочку в чекбоксе. Для меня первый вариант удобнее, потому что окно открывается уже там, где нужно мне и от меня не требуется никаких дополнительных действий.
http://i47.tinypic.com/xptyy8.jpg
http://i49.tinypic.com/24z95kj.jpg
В появившемся окне меняем настройки на свои и получаем тень, благодаря которой текст смотрится интереснее, лучше вписывается в общую картину и не теряется на ровном заднем фоне.
http://i48.tinypic.com/6tppxk.jpg
Почему именно такие настройки.
Непрозрачность 100%. Поскольку я поместила текст под колорку, чёрный цвет начал отдавать фиолетовым, и тень стала светлее, как следствие – начала сливаться с фоном, чтобы избежать этого я повысила непрозрачность до 100%.
Угол обычно выбирается произвольно, следуя вкусовым предпочтениям артера. Однако помните, что угол в 0º или 180º сделает ваш текст визуально более плоским, при 145º он приобретёт объёмность, ну и так далее. С углами, как и с любыми стандартными настройками, стоит экспериментировать, отхождение от норм может сделать текст интереснее.
Смещение в 1px. Это наиболее удачное смещение (максимум 2px для жирных шрифтов), если вы ставите свой задачей легкость читаемости текста. Если же тень идёт как украшение, смещение может быть любым.
http://i49.tinypic.com/2504exh.jpg
Здесь, например, смещение 12px, а угол 30º.
Размер в 0px. Чем больше размер, тем более размытой будет тень.
Кстати, тень не обязательно должна быть черной, как и точно повторять тень предыдущего слова не должна, как и быть тенью как таковой. Мы можем сделать её дополнительным элементом декора.
http://i47.tinypic.com/156abd0.jpg
Отличаются два слоя углами наложения. По умолчанию фш приравнивает все тени друг к другу, чтобы иметь возможность делать углы разными, нужно убрать галочку из чекбокса Глобальное освещение.
http://i50.tinypic.com/24evng6.jpg http://i49.tinypic.com/qyg139.jpg
К слову, есть хитрость по поводу выбора цвета текста, неразрывно связанная с тенью. В случае, когда у нас есть пустой светлый фон, мы можем оставить текст вообще прозрачным. Тогда вся ответственность будет лежать на тени. Сразу предупреждаю, далеко не на всех аватарах смотрится хорошо. И да, лучше, чтобы угол был 145º, 45º и все в таком духе, чтобы было заметно, как тень обрисовывает прозрачный текст.
http://i46.tinypic.com/209gi1u.jpg
Выделение и украшение текста.
I. на аватарах by Electrimafried
- варьируем размер слов
Варьирование размера слов позволяет сделать текст визуально более интересным. Для такого приёма лучше всего подходят жирные шрифты, но обычные печатные тоже смотрятся неплохо. На этом аватаре использован Poplar Std.
http://i46.tinypic.com/2ujh75f.jpg http://i45.tinypic.com/10eovnr.jpg
Видите, насколько более интересной выглядит второй аватар по сравнению с первым?
Размер шрифта последовательно для каждого слова: 18, 12, 19 и 20. И, как вы можете заметить, слово "happy" набрано заглавными буквами, это сделано для того, чтобы акцентировать на нём внимание. Ну, и конечно, расположение текста сориентировано на очертания фигуры Скара.
- варьируем шрифты
Метод давно и хорошо известный на сфш и довольно часто используемый. Заключается в том, что для слова, на которое мы хотим обратить внимание, выбираем иной шрифт, чем для остального текста. Хорошо смотрятся вместе простые печатные шрифты и хитроумные рукописные, они оттеняют друг друга. Простые шрифты вообще можно сочетать практически с чем угодно – гранжевыми, готическими – главное, не забывать о том, что ваш второй шрифт должен вписываться в изображение, украшая его, а не уродуя. А вот лепить вместе гранж и гот будет не разумно, они утяжелят друг друга и напрочь испортят ваш аватар. И, самом собой, выбранные шрифты должны быть легко читаемы.
Да, при использовании этого метода, важно помнить, что варьирование не значит, что нужно писать каждое следующее слово новым шрифтом. Два – это потолок. Да и перенасыщать аватар выделениями не стоит. Два, максимум три слова можно подчеркнуть таким образом, да и то, три уже на грани. Конечно, есть исключения. Например, когда выделяется какая-то буква и повторяется на протяжении всего текста, но и здесь умеренность вам в помощь. Слишком много – не слишком красиво.
http://i46.tinypic.com/28qkd2.jpg
При помощи техники варьирования шрифтов и их размеров можно получить действительно очень интересные результаты, как, например, мои любимые текстовые текстуры: http://i47.tinypic.com/2n8alnr.jpg
II. на подписях by gryphongfx
- прозрачные слои
Создадим две копии нашего текстового слоя (стоя на слое с текстом в палитре слоёв, набираем на клавиатуре Ctrl+J) и перетащим их под оригинал (поочерёдно кликаем на оба в палитре слоёв, удерживая клавишу Ctrl, и мышкой тащим их ниже). Немного увеличим размер среднего слоя и сделаем нижний в два раза больше (я использовала шрифт EuroseWide Heavy, размер оригинального текста 24px, среднего 28px, нижнего 32px), после чего изменим непрозрачность слоёв-копий: среднего до 35-40%, нижнего до 10-20%, и вот, что мы получим в итоге:
http://i49.tinypic.com/xaw6ye.jpg http://i50.tinypic.com/2whl6ci.jpg
- использование инструмента "Произвольная фигура"
Выбираем в палитре инструментов Произвольную фигуру http://i48.tinypic.com/2yuncwl.jpg, а в верхней панели, нажав на маленькую стрелочку, указывающую вниз – форму, которая нам нравится.
http://i49.tinypic.com/142fqy8.jpg
Дальше встаём на наше изображение и, нажав и удерживая левую кнопку мыши, растягиваем нашу форму. У нас появился контур. Идём в палитру слоёв и создаём новый слой http://i47.tinypic.com/10rmi5t.jpg, затем в контуры (если они у нас уже не открыты среди меню на рабочем столе фш, то их можно найти в Окно >> Контуры).
http://i47.tinypic.com/akv18h.jpg
Там нажимаем кнопку Загрузить контур или выделенную область и видим, что у нас выделился наш контур.
http://i49.tinypic.com/ndojyb.jpg
Заливаем его цветом при помощи инструмента Заливка http://i46.tinypic.com/2ynm06e.jpg, а дальше уже по вашему вкусу: изменяем непрозрачность, режим наложения, поворачиваем и прочая, и прочая.
http://i47.tinypic.com/69n6zn.jpg
- слова, начинающиеся с одинаковой буквы
Текст, в котором присутствуют два слова, начинающихся с одной и то же буквы, можно сделать гораздо более интересным и оригинальным при помощи этой техники. Возьмём слова try и tutorials, напишем их одинаковым шрифтом и размером на отдельных слоях и расположим строго друг под другом.
http://i46.tinypic.com/vncdv7.jpg
А теперь возьмём и удалим первую букву из обоих слов и заменим их одной большой, чтобы получилось так (для "интересности" можно её немного повернуть):
http://i48.tinypic.com/fwkrxk.jpg
Этот же приём подойдёт для, например, совместных работ. Вместо того чтобы скучно писать
http://i45.tinypic.com/29behpv.jpg
попробуйте написать (два слоя, разные углы поворота)
http://i45.tinypic.com/fxe977.jpg
смотреться будет намного лучше.
- слово позади слова
Расположим текст так, чтобы первое слово немного "залезало" на второе, а затем пойдём в Слой >> Стиль слоя >> Тень, угол поставим 90º и получим "перекрытие" второго слова первым. 3d в действии)
http://i47.tinypic.com/30ry0x1.jpg http://i45.tinypic.com/fcii52.jpg
Что ещё…
Не бойтесь стирать куски текста (вы же не боитесь стирать части текстур), это может дать довольно интересные результаты и, в случае, если у вас сложное изображение, поможет тексту гармоничнее вписаться в него.
Не останавливайтесь перед экспериментами с настройками в меню Параметры слоя. Я не стала перечислять и наглядно демонстрировать их все, но там действительно имеется масса всего любопытного.
И ещё одно "не". Не используйте язык, которого вы не знаете.
Недавно, пересматривая чужие аватары, я наткнулась на одну очень симпатичную работу. Милая девочка-блондинка, цвета сливочной ириски колор и одно-единственное слово в тексте. Pussy. Я, как лингвист, догадываюсь, что автор имела ввиду "кошечка", но написала она "влагалище" (вернее даже ещё более грубое выражение, но я не буду приводить его здесь). Потому что в английском языке в наши дни это слово чаще используется именно в этом слэнговом значении. Кошечка будет Pussycat. Проблема решаема элементарно - нужно всего лишь заглянуть в словарь, но кому не лениво рыться в словаре, right?
