В прошлый раз, когда я рассказывал о деталях улучшения веб-дизайна в Photoshop, многие друзья посчитали, что я недостаточно говорю, а некоторые хотели узнать, как создать специальные текстовые эффекты в Photoshop. На самом деле, в современном веб-дизайне не так много широко используемых текстовых эффектов, а методы их реализации также очень просты. Поэтому я надеюсь, что следующий контент будет полезен новичкам в веб-дизайне.
В этом уроке основное внимание будет уделено двум ключевым словам: «градиент» и «тень».
1. Слова с большей текстурой
Давайте сначала посмотрим на ЛОГОТИП на картинке. Он выглядит более текстурированным. Текст вытянут наружу и не прикреплен жестко к веб-странице. Если вы посмотрите внимательно, вы легко обнаружите, что Brightkite использует цветные «градиенты» для текста. Да, цвет текста - это не одноцветная заливка, а "градиент". Почему "градиент" выглядит более фактурным? Это потому, что он имитирует эффект естественного освещения, то есть светлая часть находится над основной? text и слабый свет внизу. В то же время не игнорируйте еще одну деталь — «тень» текста.
Так как же это сделать?
Обратите внимание на цифры 2 и 3 на рисунке. Если вы все еще не знаете, как добавить градиент, дважды щелкните пустое место справа от «Имя слоя» на панели слоев или нажмите вторую кнопку на панели слоев. изображение ниже (на панели слоев ниже), чтобы открыть панель «Стили».
«Наложение градиента», а затем установите, как показано ниже. В качестве цвета градиента выберите два цвета одного цвета, но с «темным и светлым контрастом». Например, в примере это светло-зеленый и темно-зеленый. имитировать эффект освещения.
Хорошо, осталось только тень. Как обычно, нажмите «Тень» в левой части панели стилей, а затем установите ее, как показано ниже:
Давайте посмотрим на другие дизайны веб-сайтов, в которых используется этот метод: