Леттеринг в фотошопе и создание логотипа
Здравствуйте, дорогие читатели!
В предыдущей публикации я рассказала о том, как создают концепции будущих логотипов. А сегодня мы научимся работать с нарисованным от руки леттеринг логотипом в фотошопе.
Итак, начнем по-порядку:
создадим рукописный леттеринг логотип
отрисуем эскиз лого в Photoshop
Рукописный логотип в стиле леттеринг
Я нарисую от руки логотип моего блога на основе разработанной концепции. Для этого, при помощи линейки и простого карандаша создаю разметку на альбомной листе формата А4. Беру простой карандаш твердости 2H чтобы получился едва заметный контур.
Затем рисую штрихи букв. В процессе рисования приходится часто подправлять линии, поэтому под рукой у меня всегда хороший ластик.
Когда штрихи обозначены, перехожу к процессу добавления декоративных элементов.
В данном случае я рисую штрихи, имитирующие нажим
широкого пера. Когда все готово, контуры букв обвожу простым карандашом. Карандаш у меня твердостью 2B, для яркого выделения. После этого
закрашиваю тем же грифелем штрихи с нажимом. Букву «О» между словами «блог» и «дизайне» рисую в виде подковы.
Подправив некоторые детали и получив понравившийся результат, тонким черным маркером аккуратно обвожу контур всех элементов логотипа. Затем закрашиваю некоторые области черным маркером с широкой кистью.
Создание логотипа в фотошоп
Для отрисовки логотипа в графическом редакторе необходимо отсканировать эскиз. Когда все готово, открываю эскиз в Photoshop, при
этом нажимая «Файл» — «Открыть». Затем выбираю нужное изображение и нажимаю «Открыть». На экране появился мой эскиз, но в маленьком масштабе.
Увеличиваю масштаб до 20%, меняя значение в левом нижнем углу окна с эскизом. Слой 1, появившийся в панели инструментов «Слои», переименовываю
в «скан».
Нажимая Ctrl J, создаю копию слоя «скан» и переименовываю его в «logo». Слой «скан» делаю невидимым, нажав на иконку «глаз перед слоем». Выделяю слой «logo» и удаляю задний план с карандашной разметкой. Для этого на панели инструментов нажимаю на «Волшебная палочка» и щелкаю в любую область заднего фона. Появляется выделение. Чтобы захватить все участки фона, при зажатой клавише Shift щелкаю волшебной палочкой на необходимых участках. Когда все нужные области выделены, нажимаю Del. Уменьшаю прозрачность слоя «logo» до 50%.
Итак передо мной появилось изображение, с которым я дальше буду работать.
Перехожу к не менее ответственному заданию. Прорисую логотип по контуру инструментом «Перо».
Создаю новый слой «Фигура 1». Нажимаю на значок «Перо» или горячую клавишу «P». Ставлю первую опорную точку, затем последующие.
В итоге замыкаю контур и нажимаю на значок «Фигура» на панели инструментов в верхнем горизонтальном меню редактора.
Чтобы скорректировать толщину и изгибы контуров до нужных размеров, использую полезные клавиши. Одна из них инструмент «Перо+». При помощи него можно добавлять новые опорные точки по контуру. Инструмент «Перо-» удаляет ненужные точки. Если новая опорная точка поставлена неправильно, отменяю действие, нажимая на пункты меню «Редактирование» — «Шаг назад». При этом удаляется не вся кривая, а только крайняя опорная точка.
Для выравнивания контура, я работаю с «усиками», выходящими лучами из выделенной точки кривой. Подтягивая «усики», контур принимает различные изгибы.
Также при зажатой клавише Ctrl можно уменьшать и увеличивать длину усика опорной точки.
Стоит немного попрактиковаться и получится прекрасный результат.
И вот что у меня получилось:
© 2017 sndesign-market.ru. Блог о коммуникационном дизайне
Хромированный автомобильный логотип в Фотошоп, Уроки
Сегодня в уроке Фотошоп вы узнаете, как создать яркий, сияющий логотип для автомобиля при помощи стилей слоя и инструмента «Текст» (Type Tool). Этот урок подходит для начинающих любителей Фотошоп, поскольку не требует обширных знаний в данной программе.
Давайте начнем!
Превью финального результата:
Шаг 1.
Создаем Новый документ (Ctrl+N) в Фотошоп размером 600х450 рх, с разрешением 72 рх/дюйм в режиме RGB с прозрачным фоном (Transparent). Устанавливаем цвета переднего и заднего плана по умолчанию программы, нажав на клавиатуре «D» (черный и белый). Заполняем созданный слой цветом переднего плана – черным (меню Edit-Fill…или сочетание Alt+Backspace).
Теперь сделаем наш фон металлического цвета, включающего несколько оттенков серого, имитируя дверь автомобиля. Для этого воспользуемся панелью «Стили слоя» (Layer-Layer Style или двойной клик по миниатюре слоя) и выберем эффект «Наложение градиента» (Gradient Overlay) с линейным (Linear) стилем и углом 90°. В диалоговом окне этой опции открываем Редактор градиентов (Gradient editor), нажав на цветовую шкалу, и, устанавливаем цветовые значения для градиента слева-направо: #858585 позиция (location) 0%, #4E4E4E позиция 20%, #676767 позиция 40%, #FFFFFF позиция 80%, #FFFFFF позиция 85%, #DADADA 40%.
По завершении настроек градиента, присваиваем ему имя, затем нажимаем в диалоговом окне клавишу «Новый» (New) и видим наш градиент в наборе программы. Чтобы применять его дальше в нашей работе, сохраните градиент в любое место вашего компьютера, нажав на клавишу «Сохранить» (Save) справа диалогового окна.
Шаг 2.
Не закрывая окна «Стилей слоя» (Layer style), активируем параметр «Наложение цвета» (Color Overlay) и устанавливаем режим смешивания на Умножение (Multiply). Щелкаем по цветовому квадрату и вводим значение цвета для опции #990000 (красный). Непрозрачность (Opacity) установите на 100%.
Шаг 3.
Далее, пишем цифры будущего логотипа «4х4» шрифтом из ресурсов урока «TS Block» или любым другим жирным печатным шрифтом, используя серый цвет #999999. Для этого, активируем инструмент «Текст» (Type Tool). По завершении, нажимаем в верхнем меню значок Commit (галочку). Подводим курсор к первой цифре «4» и выделяем ее (об ее активизации говорит яркий голубой цвет). Открываем панель «Символ» (Окно-Символ (Window-Character)) или нажимаем на самый крайний значок в верхнем меню, открывая окно настроек текста. Выполняем следующие настройки для цифры: кегль (размер букв) 170 рт, кернинг метрический (Metrics), трекинг (межбуквенное расстояние) -160, смещение базовой линии 0 рт, стиль написания — псевдокурсивный (Faux Italic), метод сглаживания – резкий (sharpe).
Затем, выделяем знак умножения «х» в словосочетании, установив курсор рядом и проводя им по знаку, и редактируем его в панели «Символ» (Character). Здесь обязательно настройте опцию «Смещение базовой линии», чтобы приподнять знак, как на оригинальном промышленном логотипе.
Выполните настройки со скриншота ниже:
Скопируйте первую цифру «4», выделив ее курсором и нажав сочетание Ctrl+C (Копировать). Теперь установите курсор за знаком «х» и вставьте цифру в это место, нажав Ctrl+V (Вставить).
Обратите внимание, что знак умножения должен касаться обеих цифр, это важно.
Шаг 4.
Двойным кликом по миниатюре слоя с логотипом открываем «Стили слоя» или нажимаем на иконку внизу панели слоев с буквами fx. Находим параметр «Обводка» (Stroke) и в диалоговом окне нажимаем на цветовой квадрат. Внизу окна открывшейся палитры активируем флажок «Только Веб-цвета» (Only Web Colors) и указываем цвет обводки # #666666. Выбираем позицию обводки снаружи (Outside) размером 3 рх.
Шаг 5.
Далее, мы из созданной обводки сделаем отдельный слой. На миниатюре текстового слоя нажимаем по значку fx правой кнопкой мыши и выбираем из меню команду – Создать слой (Create Layer). Помещаем его ниже текстового слоя.
Шаг 6.
Теперь у нас есть еще один текстовой слой, который назван по имени эффекта, используемого на нем, в данном случае обводки. Для наглядности я переместил его на холсте, чтобы вы увидели небольшую разницу между этими двумя слоями. Мы будем добавлять стили слоя также на него, чтобы добиться реалистичного тиснения логотипа. Но начнем мы с оригинального слоя с эмблемой, а слой-обводку пока отложим.
Шаг 7.
Добавим несколько эффектов при помощи «Стилей слоя» на оригинал логотипа. Он будет выполнять функцию 3d тиснения позади основной эмблемы.
Дважды щелкаем по миниатюре текстового слоя и находим параметр «Наложение градиента» (Gradient Overlay). В окне опции открываем редактор градиентов (Gradient Editor) и загружаем сохраненный градиент «Хром», который применяли на слое с фоном.
Следующим эффектом будет «Обводка» (Stroke). Настройки следующие: размер 2рх, положение внутри. В разделе «Тип обводки» этого диалогового окна выбираем «Градиент» (Gradient) и указываем снова наш сохраненный «Хром», но активируем флажок Инверсии (Reverse) и изменяем стиль на Зеркальный (Reflected). Масштаб (Scale) ставим на 150%.
Выполняем настройки для опции «Тиснение» (Bevel and Emboss): глубина (Depth) 145%, размер (size) 2рх, угол (angle) 90°, высота (attitude)
И, последний эффект «Внутренняя тень» (Inner Shadow) с такими значениями: непрозрачность (Opacity) 55%, угол (angle) 20° без глобального освещения (Global Light), смещение (distance) 2 рх, размах (choke) 90%, размер 1 рх.
Шаг 8.
Теперь мы возвратимся к слою-обводке и добавим на него некоторые стили слоя. Мы создадим впечатление хромированной тисненой поверхности логотипа при помощи стилей «Тиснение» (Bevel and Emboss) и «Внешнее свечение» (Outer Glow). Вы можете изменить угол тиснения и его оттенок по своему желанию, чтобы ваш логотип выглядел настоящим.
Выполните настройки параметров со скриншота ниже:
Шаг 9.
Далее, создадим черную пластиковую основу, которая находится у таких логотипов сзади, в контакте с поверхностью машины. Дублируем текстовой слой (Ctrl+J или перетяните слой на иконку нового слоя внизу панели) и удалям с дубликата все стили слоя (клик правой кн.мыши на миниатюре слоя и выбираем команду – Очистить стиль слоя (Clear layer styles)). Откройте окно «Стили слоя» (Layer Style) двойным кликом по миниатюре и выберите параметр «Тень» (Drop Shadow), выполните настройки: угол 90°, смещение (distance) 3 рх, размах (spread) 100%, размер (size) 7 рх. Используйте цвет для тени # 202020, нажав на цветовой квадрат рядом с режимом смешивания. Завершив настройки, преобразуйте полученную тень в отдельный слой, как мы это делали в шаге 5 и поместите его над слоем «Фон» (Background).
Шаг 10.
Чтобы сделать логотип трехмерного вида, применим к отдельному слою-тени некоторые стили слоя. Также добавим нашей фигуре тень, чтобы эмблема выглядела реалистично прикрепленной к корпусу автомобиля, а не висела в воздухе.
На слое «Тень» открываем «Стили слоя» (Layer Style) и находим параметр «Тиснение» (Bevel and Emboss)
Затем, выполняем настройки для эффекта «Тень» (Drop Shadow): режим смешивания Умножение (Multiply), угол 90°, смещение 5рх, размах 0%, размер 5рх.
Шаг 11.
Добавим поверх нашего логотипа тонкую полосу свечения, которая образуется при попадании лучей света на металл. Заполните верхний слой-копию текста белым (ffffff) цветом (Edit-Fill..или Shift+F5), предварительно выделив ее (Ctrl+клик по иконке этого слоя). Затем, выберите инструмент Прямоугольное выделение (Rectangular Marquee Tool) c радиусом растушевки (Feather) 3 рх (укажите в верхнем меню) и создайте тонкую полоску немного выше середины текста. Теперь, нажмите внизу панели слоев на иконку Маски слоя (Layer Mask), она выглядит как круг в квадрате.
Шаг 12.
Далее, откройте окно «Стили слоя» (Layer Style) и выберите параметр «Внешнее свечение» (Outer Glow) и выполните настройки: режим смешивания – Экран (Screen), непрозрачность (opacity) 75%, размах (spread) 15%, размер 15 рх.
Шаг 13.
Для завершения работы мы добавим блик на край логотипа. Скачайте набор бликов в формате PNG из ресурсов урока и загрузите их в фотошоп. Выберите большую вспышку вверху.
Шаг 14.
Скопируйте (Ctrl+C), а затем вставьте (Ctrl+V) блик в наш документ и поместите его выше всех слоев в панели. Измените размер блика при помощи трансформирования (Edit-Free Transform или Ctrl+T) и расположите его на левом краю первой цифры «4» в начале световой полосы.
Вот и все! Наш логотип готов. Вы можете попробовать использовать другой шрифт или эмблему. Не забудьте про соединение букв или фигур на вашем личном логотипе, иначе результат будет нереалистичным.
Желаю удачи!
Используемые материалы:
Шрифт «TS Block»
Блики
Adobe Photoshop — Как создать логотип из огня?
спросил
Изменено 6 лет, 7 месяцев назад
Просмотрено 920 раз
Мне нужно сделать вариант логотипа «из огня» для рекламы. Взгляните на изображения ниже. Последнее — это тест, который я провел с логотипом Apple, используя этот набор прозрачных огней. Как видите, ЭТО СТРАННО.
Я знаю, то, что я пытаюсь сделать, это нелегко. Но я считаю, что у меня продвинутые навыки фотошопа. Тем не менее, все, что я пробовал, остается супер странным! Как вы думаете, возможно сделать эти изображения только с помощью фотошопа? Как бы вы это сделали? Может с кистями?
- Adobe-Photoshop
- эффекты
2
Если вы не связаны с Photoshop и знаете кое-что об Illustrator, возможно, вы можете попробовать создать в нем собственное пламя. Вот по этой ссылке вы найдете руководство по созданию векторной трехмерной горящей спички. Вы можете перейти к той части, где автор фокусируется на создании пламени.
Это можно сделать полностью в Photoshop, но наличие графического планшета, способного считывать наклон и вращение стилуса, сделает это проще. В противном случае существует множество изображений пламени, которыми вы можете манипулировать и комбинировать.
Вам также могут пригодиться готовые огненные кисти. Чтобы создать эффект, вы можете использовать несколько слоев, каждый с различным расположением штрихов. Вы можете получить лучшие результаты, сохраняя размер лизунов пламени постоянным и изменяя их масштаб в соответствии с вашей основой.
Зарегистрируйтесь или войдите в систему
Зарегистрируйтесь с помощью Google
Зарегистрироваться через Facebook
Зарегистрируйтесь, используя электронную почту и пароль
Опубликовать как гость
Требуется, но не отображается
Опубликовать как гость
Электронная почта
Требуется, но не отображается
Нажимая «Опубликовать свой ответ», вы соглашаетесь с нашими условиями обслуживания, политикой конфиденциальности и политикой использования файлов cookie
Создание логотипа неба — Учебные пособия для дизайнеров
Последнее обновление пн, 05 сентября 2022 г. |
Учебники для дизайнеров
В этом уроке я объясню очень простой и понятный способ создания последнего логотипа Sky. Мы будем использовать стили слоя и корректирующие слои, чтобы добиться эффекта прозрачного стекла, который пригодится и для многих других графических объектов.
Я использовал Adobe Photoshop CS3 для создания результатов этого урока, но, безусловно, более ранние версии программы также будут полностью пригодны. Этот урок не требует глубоких знаний Photoshop, и каждому будет легко следовать.
Результат обучения показан ниже:
Если логотип неба не то, что вы ищете, загляните на боковую панель или перейдите по этой ссылке учебника по логотипу Photoshop, чтобы получить еще несколько руководств по логотипам
- Ищете логотип Adobe Illustrator Sky?
- В TVARK большой выбор вещей Sky
Шаг первый:
Во-первых, вам нужно скачать шрифт, который используется для создания логотипа неба. Вы можете найти его по этой ссылке здесь: http://www.dafont.com/sky-logos.font
(обновление: похоже, шрифта больше нет. Я попытаюсь найти новое место для it.)
После установки различных файлов шрифтов TrueType они должны автоматически загружаться для использования в Photoshop. Если нет, перезапустите Photoshop и повторите попытку.
Шаг второй:
Создайте новый документ с белым фоном размером 500 x 300 пикселей. Выберите «Horizontal Type Tool» и, используя шрифт «Sky TV Channel Logos», введите число «8» размером 400pt в текстовое поле, используя черный цвет. Убедитесь, что в раскрывающемся меню сглаживания выбран параметр «Сглаживание».
Теперь у вас должно получиться что-то вроде этого:
Шаг третий:
Здесь начинается самое интересное! Используя только стили слоя, мы можем добиться потрясающего эффекта прозрачного стекла. Если вы используете текст того же размера, что и я, эти настройки будут идеальными. В противном случае вам, возможно, придется немного изменить их в зависимости от размера текста, но в основном они останутся прежними.
Откройте меню «Стили слоев», щелкнув маленький значок «fx» в нижней части палитры слоев или дважды щелкнув свой слой в палитре. Первый стиль, который мы добавим, это «Bevel and Emboss». Убедитесь, что настройки были изменены в соответствии с показанными на скриншоте ниже:
Глубина: 225%
Размер: 4 пикселя
Использовать глобальное освещение: Не отмечено
