Как в фотошопе сделать ленту
Главная » Разное » Как в фотошопе сделать ленту
Рисуем ленту, бант используя Фотошоп
1. Создайте новый файл — цвет фона неважен (у меня — белый), поскольку работа будет вестись на дополнительных слоях. Размер файла приблизительно 2000 х 600 пикселей, разрешение файла 300 пикселей на дюйм. В принципе, размер можете ставить по желанию, а высокое разрешение позволит добиться более качественного результата.
Создайте новый прозрачный слой (Ctrl+Shift+Alt+N).
Выберите инструмент Gradient Tool (Инструмент «Градиент» / Клавиша «G») и настройте собственный градиент, например, вот такой:
В настройках непрозрачности градиента чередуйте бегунки со 100% и 0% непрозрачности. Выберите в настройках линейный градиент и залейте этим градиентом Ваш новый слой так, чтобы получилась вот такая горизонтальная полоса:
2.
а). Выберите инструмент Magic Wand Tool (Инструмент «Волшебная палочка» / Клавиша «W») и в режиме «добавить к выделенной области» выделите прозрачные области слоя ниже и выше полосы градиента.
Затем инвертируйте выделение (Sift+Ctrl+I), чтобы выделенной оказалась залитая градиентом полоса.
б). Создайте новый слой ниже слоя с градиентом и залейте полученное прямоугольное выделение белым цветом.
в). Создайте ещё один новый слой — теперь выше слоя с градиентом. Выберите инструмент Paint Bucket Tool (Инструмент «Заливка» / Клавиша «G») с настройкой в виде заливки узором и залейте Ваше выделение одним из текстурных узоров — можно выбрать стандартный, например — вот этот:
3. Идем в инструменты цветокоррекции. Выбираем через меню Image — Adjustments — Hue/Saturation (Изображение — Коррекция — Цветовой тон/Насыщенность / Клавиши «Ctrl+U»), ставим галочку на режиме Colorize (Тонирование)…
… и тонируем нашу черно-белую текстурку. Затем меняем режим наложения этого слоя — Hard Light (Жесткий свет):
Теперь с нажатым Shift выделяем все три слоя (с белой полоской, с полоской, залитой градиентом и с полоской, залитой текстурой) и жмём Ctrl+Е, чтобы слить слои в один.
Основа для будущей ленты готова.
4. Создаем еще один новый файл — у меня 1800 х 1800 пикселей с разрешением 300 пикселей на дюйм. Цвет фона — по Вашему желанию, главное, чтобы он был контрастным по отношению к цветам ленточки. Перетаскиваем нашу ленточку на этот новый файл инструментом Move Tool (Инструмент «Перемещение» / Клавиша «V») (или выделяем её, копируем (Ctrl+C), переходим на новый файл и вставляем туда скопированное (Ctrl+V)). Делаем несколько слоёв-копий с ленточкой — можно простым перетаскиванием выбранного слоя в палитре слоёв на значок «Create a new layer» (Создать новый слой):
5. Приступаем к монтированию банта. Выбираем один из слоёв-копий, вызываем инструмент Free Transform (Редактирование — Свободное трансформирование / Сочетание клавиш «Ctrl+T»), и выбираем режим Warp (Деформация).
ВНИМАНИЕ: Если Ваша версия Photoshop более ранняя, чем CS-2, то вместо Warp-а (которого в более ранних версиях просто нет) можно использовать Filter — Liquify (Фильтр — Пластика).
Деформируем ленточку примерно вот так:
6. Проделываем то же самое со следующим слоем, чтобы получить нижнюю часть петельки:
7. По тому же принципу изгибаем следующие 2 слоя, чтобы получить вторую сторону банта. «Лишние» куски лент выделяем и удаляем. Для удобства дальнейшей работы объединяем слои, составляющие каждую петельку, в группы. То есть создаём новую группу и на палитре слоёв перетаскиваем в неё два слоя, составляющие одну из петелек банта. Затем создаём ещё одну группу — перетаскиваем туда вторые два слоя. Бант вполне может быть и попышнее — достаточно скопировать уже имеющиеся группы с петельками, затем с помощью трансформации поворота, сдвига искажения и перспективы (соответственно — Rotate, Skew, Distort и Perspective) покрутить и погнуть получившиеся группы-петельки, разместив их примерно вот так:
8. Бант должен иметь узелок. Используя инструмент Rectangular Marquee Tool (Инструмент «Прямоугольная область» / Клавиша «M») выделяем небольшой кусочек ленточки со слоя, еще не подвергавшегося трансформации.
…копируем выделенное (Ctrl+C) и вклеиваем на новый слой (Ctrl+V). Полученный кусочек трансформируем, примерно вот так:
9. Оставшийся не трансформированным последний слой с ленточкой дублируем. Изгибаем с помощью трансформации каждую ленточку, чтобы получить свободные концы ленты. Свой бант я решила сделать полупрозрачным, для чего у каждого из полученных слоёв (и внутри групп в том числе) я меняю режим наложения слоя с Normal (Нормальный) на Hard Light (Жесткий свет) (в зависимости от цвета Вашего банта и цвета фона Вы можете выбрать какой-нибудь другой режим наложения):
Теперь оживляем наш бантик, чтобы ленты выглядели более реалистично. При завязывании лента неизбежно сминается, собираясь в складочки. Добавим складочек нашему бантику:
10. Создадим собственный чёрно-белый непрозрачный градиент, примерно вот такой:
11. Заливаем этим градиентом в линейном режиме новый слой, созданный поверх всех имеющихся, примерно вот так:
12. Слой с градиентом тонируем с помощью инструментов цветокоррекции, например так же, как тонировали в самом начале урока слой с чёрно-белой текстурой.
Это делается, чтобы избежать чересчур резких теней в складках. Меняем режим наложения на Multiply (Умножение), чтобы видеть расположенные ниже слои. Создаём копию слоя.
13. Далее деформируем полученный градиент с помощью Filter — Liquify (Фильтр — Пластика), примерно вот так:
14. Теперь с помощью трансформации (Ctrl+T) разворачиваем слой и размещаем так, чтобы будущие складочки совпали с одной из ленточек. Применяем к слою с градиентом маску слоя и мягкой круглой кистью большого диаметра закрашиваем на маске чёрным цветом всю ненужную часть слоя, после чего можно подыскать другой режим наложения для складочек (я взяла Linear Burn (Линейный затемнитель)):
15. Теперь на ваш выбор – или копируем уже деформированный слой с маской и накладываем на оставшиеся фрагменты банта, или повторяем с недеформированной копией слоя предыдущие 2 шага. Можно на одну и ту же часть банта положить не один, а два или три слоя с градиентом, развёрнутые и деформированные немножко по-разному + с разными режимами наложения.
Это позволит создать более интересную игру свето-теней на складочках:
16. Далее предлагаю создать парочку новых слоёв поверх всех имеющихся и залить их новым непрозрачным линейным градиентом. Заливаем по диагонали – например, один слой из верхнего левого угла в нижний правый, а второй слой – из верхнего правого в нижний левый. Я сделала вот такой градиент (внизу на скриншоте – кусочек палитры слоёв с иконками того, что на этих слоях получится в результате):
17. Ну, и остаётся еще раз воспользоваться сменой режимов наложения слоя. На одном из полученных слоёв (верхнем) я поставила режим Hue (Цветовой тон), на втором – Overlay (Перекрытие). Можно еще подправить ластиком или с помощью маски слоя неаккуратные краешки лент, слегка «размазавшиеся» во время трансформации. Можно на отдельном слое в режиме Multiply (Умножение) добавить немного теней темной полупрозрачной широкой круглой кистью с мягким краем – на закруглениях ленты, на загибах, внутри петелек. Вот и все.
Надеюсь, кому-нибудь этот урок пригодится.
Желаю удачи и спасибо за внимание.
Финальный результат
Автор: HelgaArt.
Как нарисовать ленточку? —
08 декабря 14:38 2010 by Игорь Коваленко
Доброе утро, давайте сегодня нарисуем ленточку в Фотошопе, вот такую:
Сама задача не очень сложная и нарисовать точно такую же ленточку вы сможете быстро.
Сначала рисовать я буду шапку, и мне ленточки нужны позади герба, который я украду у РФ через Яндекс, ибо Гугл не выдал нормальных гербов:
Это крутой герб, но красная подложка меня все равно немного раздражала, да и на белом фоне без подложки орел будет круче. Долго же Я его вырезал:
Потом чуть обработал перфектумом и пошарпил, плюс вписал немного в белый фон. Немного увел желтый цвет в синий. Возможно это моя паранойя уже — но мне так больше нравится. 🙂
Вот что у меня получилось:
Ну а теперь собственно то, из-за чего я пост этот пишу. Будем рисовать ленточки, которые будут вылазить из-за герба.
Делать их можно через берн и додж, или через градиенты. У меня есть планшетка – поэтому я почти всегда делаю через берн и додж, но и мышкой это вполне удобно делать.
В общем, сначала нарисуем основу ленточки. Раньше, когда-то давно, я пытался рисовать ленточку полностью пентулом, но это бесперспективность полная. У меня все получалось криво и косо, вот как НЕ надо делать:
Ведь даже если не присматриваться – сразу видно что косая лента получилась. Может если вы супер точны – то попробуйте, вдруг получится. 🙂
Я делаю проще. Провожу линию, как должна извиваться лента:
Далее беру инструмент «Кисть». Выбирайте тот цвет, в котором у вас будет лента, саму кисточку выбирайте из стандартного набора «Каллиграфические кисти», вот такую:
После того как выбрали кисть, снова берем пентул, клик по нашему контуру правой кнопкой мыши, выбираем «Выполнить обводку контура». В появившемся окне, в выпадающем меню выбираем «Кисть», жмем ок.
Все это делаем на новом слое.
Должно выйти так:
И не надо ничего выводить с помощью одного лишь пентула 🙂
Ну как вы видите, у ленточки края прозрачные, поэтому я несколько раз дублирую слой с лентой, пока она не станет непрозрачной полностью, а затем склеиваю эти слои в один.
Кстати, ленточку вы можете без проблем сделать любой толщины, просто дублируйте слой, и каждый раз сдвигай его чуть вниз, пока не устроит толщина. У меня лента будет в виде флага России, поэтому я сделал ее немного толще:
Теперь при помощи того же пентула, равняйте края, убирайте косяки если они у вас вылезут.
Дальше я буду разукрашивать свою ленточку. Все просто – белый, синий, красный.
Немного про белый цвет на белом. Опять же, никаких проблем, просто делайте вместо белого чуть серый цвет, светло-серый. С ним и берном работать можно будет.
Дублируем слой с лентой, а нижний отключаем. Теперь выбираем слой-дубликат, и меняем его цвет на светло-серый через ctrl+u. Потом дублируем этот слой, меняем его цвет на синий, и двигаем слой чуть ниже.
Так же поступаем и с красным цветом. Потом сливаем все эти слои в один, выделяем самый первый слой с ленточкой (именно делаем из него выделение, не делая его видимым! Для этого достаточно зажать ctrl и кликнуть по иконке слоя.
А потом инвертировать выделение, нажав ctrl+shift+i). Затем удаляем все ненужные остатки ленточки.
У меня вышло так:
Флаг готов. Кстати я ещё как то писал урок о том как рисовать флаг, почитайте его, может быть что-нибудь полезное вынесите для себя.
Делаем объёмные ленточки
Пока писал этот текст, все же решил делать через берн и додж.
Выбирайте инструмент «Затемнитель» он же Burn –
С такими настройками:
И в местах, где у нашей ленты изгибы внутрь, проведите сверху вниз 1-2 раза – это будет тень.
Дальше возьмите инструмент «Осветлитель», он же Dodge –
С такими настройками:
И проведите сверху вниз, 1-2 раза там, где у ленты изгиб наружу, то есть на нас – это свет.
Вот так:
Теперь, я хочу, как всегда сделать грани. Для этого дублирую слой с лентой, через crtl+u делаю его белым, выделяю, зажав ctrl и кликнув по иконке слоя, выделение двигаю на 1 пиксель вниз (стрелочка вниз на клаве) и очищаю выделение нажав Backspac.
У нас осталась однопиксельная грань. Я сдвину эту грань вниз, на 1 пиксель (зажмите ctrl и нажми стрелку вниз), так как фон у нас белый и на нем эту грань просто не будет видно. В общем сдвигаю и режим этого слоя ставлю в «перекрытие». Так же добавляем и снизу ленточки:
Ну и финальный шаг, я добавлю немного шума на ленточку, чтобы у нее была текстура, для этого выбираю слой с лентой, иду в Фильтры>Шум>Добавить шум, проставляю количество 0,7:
Сейчас, я привел самый простой, быстрый и легкий способ рисования ленточки, можно посидеть подольше – результат будет лучше. Может потом, как-нибудь напишу продолжение урока.
Вот такой хедер получился в итоге у меня:
Если остались вопросы – спрашивай в комментариях. Поможем. [sc name=»728 text» ]
Создаем в фотошопе эмблему с имитацией загнутой ленты | DesigNonstop — О дизайне без остановки
Создаем в фотошопе эмблему с имитацией загнутой ленты
12
Сегодня мы будем создавать в фотошопе эмблему с имитацией загнутой ленты и надписью.
Для этого подготовим фон, воспользовавшись готовой текстурой из набора текстур. Осветлим ее в центре. Потом создадим параллельные прямоугольники и применим к ним стиль слоя. Далее сделаем три наклонных прямоугольника. Два из них будут краями ленты с характерными краями. Также применим к ним стиль слоя. Затем напишем текст, немного украсим его тенью. Добавим звезды по краям из стандартного набора произвольных фигур. После этого выделим все необходимые слои (или объединим в группу) и трансформируем всю фигуру, чтобы придать небольшой наклон.
Шаг 1.Создаем в фотошопе новый документ 500х250 пикселей, заливаем белым цветом.
Шаг 2.Воспользуемся текстурой N3 из этой подборки текстур. Вставим ее в наш документ, уменьшим и снизим прозрачность слоя до 35%.
Шаг 3.Выбираем инструмент «Кисть» (Brush). Выбираем большую мягкую кисть диаметром 500, цвет белый. Кликаем мышкой в центре нашего документа. Меняем режим наложения слоя на «Перекрытие» (Overlay).
Шаг 4.Создаем прямоугольник размером 245х47 пикселей, заливаем его цветом #aa7ba5.
Шаг 5.Применим стиль слоя «Внутреннее свечение» (Inner Glow), цвет #a26a9c.
Шаг 6.Получили такой результат.
Шаг 7.Делаем дубликат прямоугольника и передвигаем его немного ниже.
Шаг 8.Теперь, удерживая Ctrl, щелкаем по слою с нижним прямоугольником, чтобы выделить фигуру. Затем ниже двух прямоугольников создаем новый слой и заливаем выделение цветом #865981. После этого нажимаем Ctrl+T, передвигаем и вращаем фигуру так, чтобы она встала в позицию как на рисунке ниже.
Шаг 9. Применим стиль слоя «Перекрытие узора» (Pattern Overlay).
Шаг 10.Удаляем маленькие хвостики в углах нижней фигуры, выходящие за рамки всей композиции (они видны в Шаге восемь) и получаем такой результат.
Шаг 11.Делаем дубликат нижнего наклонного слоя, сдвигаем его вверх, как на рисунке ниже.
Шаг 12.Выделяем область, как на рисунке ниже, чтобы получился край флажка.
Шаг 13.Нажимаем Del, потом удаляем точащий хвостик слева и получаем такой результат.
Шаг 14.Сразу же делаем дубликат слоя и сначала трансформируем его по горизонтали, а потом по вертикали.
Сдвигаем нижний флажок, как на рисунке ниже и удаляем торчащие хвостики.
Шаг 15.Теперь пишем текст DESIGNONSTOP, цвет белый.
Шаг 16.Применим к тексту стиль слоя «Тень» (Drop Shadow).
Шаг 17.Получили такой результат.
Шаг 18.Теперь пишем текст БЛОГ О ВЕБ-ДИЗАЙНЕ, цвет белый.
Шаг 19.Скопируем стиль слоя из Шага 16 и получаем такой результат.
Шаг 20.Воспользуемся инструментом «Произвольная фигура» (Custom Shape Tool) и выберем из стандартного набора фотошопа фигуру 5 Point Star. Создадим две звезды по краям от текста DESIGNONSTOP, цвет #865981.
Шаг 21.Теперь либо выделяем все слои, участвующие в создании композиции из загнутой ленты и текста, либо просто объединяем их в группу, и после этого нажимаем Ctrl+T и вращаем одновременно все слои по часовой стрелке. Получили такой результат.
Оцените, пожалуйста, статью! (1 голос, в среднем: 5 из 5)
В момент церемониальной процессии, портрет скончавшегося человека, аксессуар первой необходимости. Так как фотоснимок с ликом покойника, будет фигурировать во многих местах. По требованиям обряда похорон, на фото, где запечатлен усопший, нужно вставить траурную ленту. Но вот у многих, возникают вопросы: черная траурная лента на фото. Должна, быть с какой стороны — слева или справа? Где и в каком углу крепится черная траурная ленточка на фотоЦерковь не дает строгого ответа относительно того, где и в каком уголке, и с какой стороны закрепить черную ленту на фото умершего. Но по сложившимся многолетним традициям, люди крепят траурную ленту на фото с правой нижней стороны. Вот, как — Если посмотреть на снимок фотографии, перед собой — то в правом нижнем уголке, обычно и закрепляется траурная лента на фото. С какой стороны закрепить траурную ленточку на фотографии умершего. |
Помогите пожалуйста
Ответ от Набросок[гуру]сделай на paint, без шуток намного прощеОтвет от Приспособленчество[гуру]Давайте фоту на почту пар сек сделаюОтвет от Андрей Нагайцев[гуру]- Бэрримор, когда английские судьи начали носить чёрные одежды? — Они их надели в день траура по королеве Виктории, сэр. — Но почему они их носят до сих пор? — Так ведь она всё ещё мёртвая, сэр!..Ответ от Игорь Ерёменко[новичек]Дебилы! Извините! Горе! Не дай вам Бог!
3 190 000 да 8 да 6 389 548 3 730 000 Фотошоп. Просто нарисовать полоску в углу.
Фотошоп онлайн на русском языке бесплатно и без регистрации.
Чтобы сделать фото нажмите на любую. 15 0 — 0 — 72 0 Фотошоп как вырезать волосы Фотографии для обработки в фотошопе Свадебные. Траурная лента фотошоп:файл проверен антивирусом Dr.Web.
Рисуем ленту, бант используя Фотошоп
1. Создайте новый файл — цвет фона неважен (у меня — белый), поскольку работа будет вестись на дополнительных слоях. Размер файла приблизительно 2000 х 600 пикселей, разрешение файла 300 пикселей на дюйм. В принципе, размер можете ставить по желанию, а высокое разрешение позволит добиться более качественного результата.
Создайте новый прозрачный слой (Ctrl+Shift+Alt+N).
Выберите инструмент Gradient Tool (Инструмент «Градиент» / Клавиша «G») и настройте собственный градиент, например, вот такой:
В настройках непрозрачности градиента чередуйте бегунки со 100% и 0% непрозрачности. Выберите в настройках линейный градиент и залейте этим градиентом Ваш новый слой так, чтобы получилась вот такая горизонтальная полоса:
2.
а). Выберите инструмент Magic Wand Tool (Инструмент «Волшебная палочка» / Клавиша «W») и в режиме «добавить к выделенной области» выделите прозрачные области слоя ниже и выше полосы градиента. Затем инвертируйте выделение (Sift+Ctrl+I), чтобы выделенной оказалась залитая градиентом полоса.
б). Создайте новый слой ниже слоя с градиентом и залейте полученное прямоугольное выделение белым цветом.
в). Создайте ещё один новый слой — теперь выше слоя с градиентом. Выберите инструмент Paint Bucket Tool (Инструмент «Заливка» / Клавиша «G») с настройкой в виде заливки узором и залейте Ваше выделение одним из текстурных узоров — можно выбрать стандартный, например — вот этот:
3.
Идем в инструменты цветокоррекции. Выбираем через меню Image — Adjustments — Hue/Saturation (Изображение — Коррекция — Цветовой тон/Насыщенность / Клавиши «Ctrl+U»), ставим галочку на режиме Colorize (Тонирование)…
… и тонируем нашу черно-белую текстурку. Затем меняем режим наложения этого слоя — Hard Light (Жесткий свет):
Теперь с нажатым Shift выделяем все три слоя (с белой полоской, с полоской, залитой градиентом и с полоской, залитой текстурой) и жмём Ctrl+Е, чтобы слить слои в один. Основа для будущей ленты готова.
4. Создаем еще один новый файл — у меня 1800 х 1800 пикселей с разрешением 300 пикселей на дюйм. Цвет фона — по Вашему желанию, главное, чтобы он был контрастным по отношению к цветам ленточки. Перетаскиваем нашу ленточку на этот новый файл инструментом Move Tool (Инструмент «Перемещение» / Клавиша «V») (или выделяем её, копируем (Ctrl+C), переходим на новый файл и вставляем туда скопированное (Ctrl+V)).
Делаем несколько слоёв-копий с ленточкой — можно простым перетаскиванием выбранного слоя в палитре слоёв на значок «Create a new layer» (Создать новый слой):
5. Приступаем к монтированию банта. Выбираем один из слоёв-копий, вызываем инструмент Free Transform (Редактирование — Свободное трансформирование / Сочетание клавиш «Ctrl+T»), и выбираем режим Warp (Деформация).
ВНИМАНИЕ: Если Ваша версия Photoshop более ранняя, чем CS-2, то вместо Warp-а (которого в более ранних версиях просто нет) можно использовать Filter — Liquify (Фильтр — Пластика).
Деформируем ленточку примерно вот так:
6. Проделываем то же самое со следующим слоем, чтобы получить нижнюю часть петельки:
7. По тому же принципу изгибаем следующие 2 слоя, чтобы получить вторую сторону банта. «Лишние» куски лент выделяем и удаляем.
Для удобства дальнейшей работы объединяем слои, составляющие каждую петельку, в группы. То есть создаём новую группу и на палитре слоёв перетаскиваем в неё два слоя, составляющие одну из петелек банта. Затем создаём ещё одну группу — перетаскиваем туда вторые два слоя. Бант вполне может быть и попышнее — достаточно скопировать уже имеющиеся группы с петельками, затем с помощью трансформации поворота, сдвига искажения и перспективы (соответственно — Rotate, Skew, Distort и Perspective) покрутить и погнуть получившиеся группы-петельки, разместив их примерно вот так:
8. Бант должен иметь узелок. Используя инструмент Rectangular Marquee Tool (Инструмент «Прямоугольная область» / Клавиша «M») выделяем небольшой кусочек ленточки со слоя, еще не подвергавшегося трансформации.
…копируем выделенное (Ctrl+C) и вклеиваем на новый слой (Ctrl+V). Полученный кусочек трансформируем, примерно вот так:
9. Оставшийся не трансформированным последний слой с ленточкой дублируем.
Изгибаем с помощью трансформации каждую ленточку, чтобы получить свободные концы ленты. Свой бант я решила сделать полупрозрачным, для чего у каждого из полученных слоёв (и внутри групп в том числе) я меняю режим наложения слоя с Normal (Нормальный) на Hard Light (Жесткий свет) (в зависимости от цвета Вашего банта и цвета фона Вы можете выбрать какой-нибудь другой режим наложения):
Теперь оживляем наш бантик, чтобы ленты выглядели более реалистично. При завязывании лента неизбежно сминается, собираясь в складочки. Добавим складочек нашему бантику:
10. Создадим собственный чёрно-белый непрозрачный градиент, примерно вот такой:
11. Заливаем этим градиентом в линейном режиме новый слой, созданный поверх всех имеющихся, примерно вот так:
12. Слой с градиентом тонируем с помощью инструментов цветокоррекции, например так же, как тонировали в самом начале урока слой с чёрно-белой текстурой. Это делается, чтобы избежать чересчур резких теней в складках.
Меняем режим наложения на Multiply (Умножение), чтобы видеть расположенные ниже слои. Создаём копию слоя.
13. Далее деформируем полученный градиент с помощью Filter — Liquify (Фильтр — Пластика), примерно вот так:
14. Теперь с помощью трансформации (Ctrl+T) разворачиваем слой и размещаем так, чтобы будущие складочки совпали с одной из ленточек. Применяем к слою с градиентом маску слоя и мягкой круглой кистью большого диаметра закрашиваем на маске чёрным цветом всю ненужную часть слоя, после чего можно подыскать другой режим наложения для складочек (я взяла Linear Burn (Линейный затемнитель)):
15. Теперь на ваш выбор – или копируем уже деформированный слой с маской и накладываем на оставшиеся фрагменты банта, или повторяем с недеформированной копией слоя предыдущие 2 шага. Можно на одну и ту же часть банта положить не один, а два или три слоя с градиентом, развёрнутые и деформированные немножко по-разному + с разными режимами наложения.
Это позволит создать более интересную игру свето-теней на складочках:
16. Далее предлагаю создать парочку новых слоёв поверх всех имеющихся и залить их новым непрозрачным линейным градиентом. Заливаем по диагонали – например, один слой из верхнего левого угла в нижний правый, а второй слой – из верхнего правого в нижний левый. Я сделала вот такой градиент (внизу на скриншоте – кусочек палитры слоёв с иконками того, что на этих слоях получится в результате):
17. Ну, и остаётся еще раз воспользоваться сменой режимов наложения слоя. На одном из полученных слоёв (верхнем) я поставила режим Hue (Цветовой тон), на втором – Overlay (Перекрытие). Можно еще подправить ластиком или с помощью маски слоя неаккуратные краешки лент, слегка «размазавшиеся» во время трансформации. Можно на отдельном слое в режиме Multiply (Умножение) добавить немного теней темной полупрозрачной широкой круглой кистью с мягким краем – на закруглениях ленты, на загибах, внутри петелек.
Вот и все.
Надеюсь, кому-нибудь этот урок пригодится. Желаю удачи и спасибо за внимание.
Финальный результатАвтор: HelgaArt;
Ссылка на источник;
Урок взят с Демиарта
Получите позолоту с этим учебным пособием по векторному баннеру с золотой лентой
Добавьте нотку роскоши к своим проектам с помощью этих блестящих векторных баннеров с золотой лентой. С легкостью создавайте векторные фигуры баннеров с искривленными прямоугольниками и применяйте к формам ряд градиентов, чтобы добиться позолоченного совершенства.
Детали руководства
- Программа : Adobe Illustrator CS5-CC
- Сложность : Средний
- Охватываемые темы : Создание формы, инструменты деформации, траектории смещения
- Расчетное время завершения : 30 минут
Окончательное изображение: векторы баннера с золотой лентой
Шаг 1 для создания векторов баннера с лентой
Давайте начнем с наброска основных форм, используемых для векторов баннера с лентой.
Будут ли они развеваться, как флаги, быть прямыми, вписываться друг в друга или изгибаться в разные стороны? Используйте инструмент Paintbrush Tool (B) с простой круглой каллиграфической кистью , чтобы набросать их. Сгруппируйте (Control-G) дизайны, которые вам нравятся, и заблокируйте их на панели Layers (или переместите их за пределы монтажной области , подальше).
Шаг 2
Инструментом «Прямоугольник» (M) нарисуйте узкий горизонтальный прямоугольник светло-золотым цветом (здесь используется #e7b964 ). Выберите форму и перейдите к Эффект > Деформация > Арка и примените 29% Изгиб . Разверните искривленную форму под Объект .
Шаг 3
Нарисуйте два маленьких прямоугольника по обеим сторонам векторной формы баннера с изогнутой лентой (с помощью инструмента Rectangle Tool ).
Используйте Pen Tool (P) , чтобы нарисовать треугольник на любом маленьком прямоугольнике. Выберите прямоугольник и соответствующий ему треугольник и Minus Front на панели Pathfinder . Поместите эти части под форму изогнутой ленты на панели Layers .
Шаг 4
Для следующей векторной формы ленточного баннера нарисуйте узкий горизонтальный прямоугольник и примените два эффекта деформации: Rise с Bend 31% и Flag с Bend 20% .
Шаг 5
Для хвостов вектора ленточного баннера я спланировал дизайн с помощью быстрого эскиза Paintbrush Tool и обвел его с помощью Pen Tool . Деформация хвосты 19% и -19% соответственно (или что-то другое, что лучше всего работает с изгибом, который вы применили к остальной части баннера.
Нарисуйте нижнюю сторону сложенной ленты с помощью Pen Tool , помня об изгибе ленты и о том, где находятся ее края.
Шаг 6
Цвета, выбранные здесь, являются просто заполнителями, так как градиенты будут применяться ко всем векторным компонентам ленточного баннера позже в этом руководстве.0004
Шаг 7
Для пары простых векторных баннеров нарисуйте длинные узкие прямоугольники. Перекройте меньший прямоугольник большим треугольником (нарисованным с помощью инструмента Polygon Tool ) и нажмите опцию Divide на панели Pathfinder . Удалите все лишние компоненты, чтобы остались два, показанные ниже.
Шаг 8
Снова начните с узкого горизонтального прямоугольника. Примените к нему два эффекта Warp : Shell Upper с изгибом из 10% и Arc с изгибом из 9% .
Развернуть под Объект .
Шаг 9
Нарисуйте два маленьких прямоугольника по обе стороны от только что искривленного вектора баннера ленты. Примените эффект Arch к каждой из Bend of 17% и . Поверните обе фигуры немного наружу (см. ниже).
Шаг 10
Сделайте два конца ленты, как это было сделано в Шаг 3 . Примените два эффекта Warp : Arch with Bend of 23% и Flag with Bend of 18% . Скопируйте (Control-C) и Вставьте (Control-V) конец ленты и отразите его по вертикальной оси , чтобы он хорошо расположился на другой стороне баннера.
Шаг 11
Теперь, когда мы создали наши основные векторные фигуры баннера ленты, давайте приступим к их рендерингу.
Большинство векторов баннеров будут иметь несколько слоев, созданных путем смещения путей каждой формы. Для этого Выберите фигуру, которую вы смещаете, и перейдите к Object > Path > Offset Path . Сдвиньте фигуру на -4px и повторите еще раз для только что созданной фигуры, чтобы у вас было три слоя друг над другом. Если вам нужна более толстая или более тонкая векторная форма баннера ленты, отрегулируйте величину смещения по мере необходимости.
Шаг 12
Выберите внешний и внутренний прямоугольники этого первого базового вектора баннера и примените градиент, показанный ниже, с помощью Панель градиент . Я хотел, чтобы золотые тона были теплыми, с #e6b9464 и #b4833e в качестве основных цветов, #edd87d в качестве бликов и #653f25 для основных теней.
Для яркой золотой полосы (средний прямоугольный слой) осветлите золотые цвета белым ( #ffffff ) и светло-желтым ( #edd87d ).
См. ниже дополнительные золотые тона и их расположение.
Шаг 13
Градиенты для этого векторного баннера с лентой в стиле обертывания имеют те же цвета, что и на рисунке 9.0009 Шаг 12 , но с другой настройкой: меньше бликов, более светлый цвет теней и более маслянистый желтый цвет в целом.
Шаг 14
Как и в случае с другими векторными рисунками баннеров, Сместите траектории каждой формы дважды для эффекта многослойной ленты. Количество цветов, размещенных в этом градиенте, меньше, чем в двух других, поскольку это меньший баннер и изогнутый, поэтому блики и тени будут реагировать непосредственно на движение самого баннера (блики вокруг центра, тени по краям и ниже).
Две фигуры под основной лентой имеют простой градиент #46210e и #dca24e . Другой основной градиент такой же, как использованный в шагах 12-13 , но #ede57d — это самый светлый цвет и единственный блик, присутствующий в градиенте.
Точно так же яркая лента в дизайне баннера на этот раз лишена белого цвета.
Шаг 15
Этот вектор баннера с изогнутой лентой имеет четыре цвета в градиенте, разбитом ниже. Самый темный цвет расположен в крайнем левом углу с двумя экземплярами ярко-желтого цвета, а остальные — теплыми золотисто-коричневыми тонами. Тот же самый градиент применяется, хотя и с поправкой на размер, к хвостовым частям ленты.
Шаг 16
К частям под вектором баннера ленты применен трехцветный градиент. Самый темный цвет расположен у сгиба верхней части ленты, а самый светлый цвет — у сгиба концов. При желании вы можете сместить основную форму ленты и хвосты для полос, как у других дизайнов лент, или оставить все как есть для «погруженного в золото» вида.
Этап 17
Цвета для этих частей такие же, как Шаг 16 . Здесь важно отметить, что основная форма ленты имеет плоский цвет ( #e7b964 ), а фигуры градиента, размещенные поверх, были Скопировано и Вставлено дважды, поэтому есть два угла, идущие к центру баннера.
чтобы подчеркнуть изгиб баннера. Градиенты заканчиваются на #e7b964 на 0% Opacity .
Маленькие изогнутые прямоугольники, образующие верхние сгибы вектора ленточного баннера, имеют эффектные коричневые и золотые градиенты, а их углы регулируются в Панель Gradient , параллельные краям небольших изогнутых прямоугольников.
Все, что блестит…
Все, что блестит, — золото, и эти векторные баннеры с лентами, несомненно, фантастически блестят. Добавьте блестящие фигуры с помощью инструмента Blob Bush Tool (Shift-B) или инструмента Pencil Tool , чтобы подчеркнуть законченный дизайн баннера. Играйте с более сложными формами сложенных лент, другими металлическими элементами и дополнительными золотыми графическими рисунками. Приятного творчества!
Автор: Мэри Винклер
Мэри работает под брендом Acrylicana®, создавая одежду, украшения и иллюстрируя для таких компаний, как Disney, Jakks Pacific, Envato и других.
Эти значки ссылаются на сайты социальных закладок, где читатели могут делиться и находить новые веб-страницы.
Создание реалистичной ленты в Photoshop — Photoshop Star
от Photoshop Star Staff
В этом уроке по Photoshop я собираюсь научить вас, как создать несколько реалистичную (что-то вроде мультяшной) ленту в Photoshop! Я уверен, что если вы внимательно прочитаете этот урок, даже новички смогут понять и следовать до конечного результата.
Вот что мы будем создавать в этом уроке:
1. Начало работы
Начнем с создания нового документа в Photoshop.
Я буду использовать небольшой размер 500 x 400 пикселей, так как это не будет для печати, мне не нужно делать его огромным! После создания документа в Photoshop создайте красивый, подходящий фон. Я буду смешивать вместе несколько разных текстур дерева, которые я нашел на сайте бесплатных текстур. Вот небольшой список мест, откуда можно получить хорошие текстуры:
- Mayang
- YotoФото
- ДевиантАРТ
Как выглядит? На мой взгляд DeviantART наверное лучший, так как там очень большой выбор текстур, не только текстур дерева.
На изображении выше я применил эффекты Filter > Render > Lightings с типом света Omni, чтобы придать ему немного больше интереса. 🙂 Доволен своим фоном? Я надеюсь, что это так! Давайте перейдем к следующему шагу.
2. Создайте форму ленты
Хорошо, давайте начнем с формы. Прежде чем приступить к работе, вы, возможно, захотите включить сетку ( View > Show > Grid ), затем измените настройки для него ( Edit > Preferences > Guides, Grids & Slices… ) Я рекомендую изменить линию сетки на каждые 10 пикселей только с 1 подразделением .
Хорошо, сделай форму. Возьмите Rectangular Marquee Tool и сделайте длинное выделение от верхней до нижней средней области.
Залейте выделение темно-красным градиентом, затем снимите выделение. Цвета, которые я использовал для своего градиента: 9.0009 #9a0c03 — #6c0a00 . После того, как вы заполнили выделение градиентом, сделайте еще одно треугольное выделение в нижней части ленты, это будет вырезанная часть. Сделать выбор будет проще, если у вас включена сетка.
Очевидно, что после того, как вы сделали свой выбор, вы должны нажать p Удалить, чтобы удалить выбранную область .
3. Применение эффектов к ленте
Теперь давайте сделаем ее немного более интересной. Начните с добавления стилей слоя (щелкните правой кнопкой мыши слой в палитре слоев и перейдите в меню 9).0009 Варианты наложения.
- Drop Shadow
- Внутреннее свечение
Нравится ли вам это? Давайте добавим к нему еще пару эффектов.
Найдите и достаньте Burn Tool и установите параметры Shadows , 10% . Слегка проведите кистью по ленте, чтобы придать ей немного больше эффекта. После этого вытащите инструмент Dodge Tool и установите параметры Highlights и 9.0009 50% . Повторите то, что вы сделали с инструментом затемнения, но в других местах, чтобы придать ему больше глубины.
Теперь выглядит немного лучше, правда? 🙂 Мы почти закончили, но я думаю, что нам нужно добавить несколько последних штрихов !
4. Добавление эффектов подсветки/тени и текста
Если вы хотите добавить немного текстуры на ленту, вы можете сделать это, выполнив следующие действия:
- Создайте новый слой, измените цвета на черный и белый. ( нажмите D ), затем примените Filter > Render > Clouds .
- Примените Фильтр > Эскиз > Chrome к слою с облаками, затем выберите пиксели ленты (удерживая клавишу Ctrl, щелкните миниатюру слоя с лентой).
- Инвертируйте ваш выбор и нажмите Удалить, это оставит вашу хромированную текстуру внутри ленты.
- Измените режим слоя для вашего слоя на Умножение и уменьшите непрозрачность примерно до 20-30% .
Вот что у меня получилось:
Если у вас получилось не очень хорошо, то вам не нужно об этом беспокоиться — осветления и затемнения должно быть достаточно. Сделав все это, мы можем добавить несколько приятных глянцевых бликов на баннер, но все это необязательно.
Начните с выбора пикселей вашего баннера (удерживайте клавишу Ctrl и щелкните миниатюру слоя), затем создайте новый слой. После создания нового слоя сократите выделение примерно на 2 пикселя (Выделение >
Заполните новое выделение очень темным градиентом (градиент от черного к прозрачному), затем измените режим слоя на Overlay или Soft Light и уменьшите непрозрачность примерно до 20-40% .
Продублируйте слой с тенью, инвертируйте его (ctrl+I) и переместите вниз примерно на 8-10 пикселей.
Крутой эффект? Да? Нет? Может быть?
Хорошо, мы должны закончить этот шаг, добавив текст, так что давайте сделаем это! Возьмите инструмент «Горизонтальный текст» и напишите текст горизонтально… как указано в инструменте.
Хорошо, теперь поверните текст на 90 градусов против часовой стрелки и переместите его на место. Я закончил, применив простой стиль слоя с тенью.
5. Последние штрихи
В качестве последних штрихов я применил фильтр искажения ко всей ленте/баннеру, затем объединил все это и применил несколько эффектов светофильтра.
Если вы хотите исказить форму вашего баннера, выполните следующие простые шаги:
- Во-первых, вам нужно объединить все слои ленты вместе, сделайте это, поместив их все в группу, затем выбрав группу и нажав CTRL+G .
- После слияния перейдите к Фильтр > Искажение > Волна или другой фильтр по вашему выбору. Для фильтра искажения волны вам придется возиться с настройками, чтобы получить приятный эффект.
Для фильтра искажения волны вам придется возиться с настройками, чтобы получить приятный эффект.Теперь, чтобы закончить, несколько простых стилей слоя:
- Filter > Render > Lighting Effects
- Edit > Fade Lighting Effects > 40%
- Редактировать > Плавная резкость > 30%
Как ты себя чувствуешь?
Надеюсь, вам понравился этот урок! Пожалуйста, оставьте комментарий, если вам нужна помощь или что-то в этом роде.
Нарисуйте ленту в Photoshop • Учебники по Adobe Photoshop
В этом простом уроке вы узнаете, как создать специальную ленту для веб-сайта.
Необходимые материалы
Шрифт Chunk Five
Скриншот PSD Tuts +
Шаг 1. Создайте новый документ и назовите его «Лента». В этом уроке используется размер 600×600 пикселей.
Шаг 2.
Создайте новый слой и назовите его «Фоновая текстура». Залейте его светлым цветом (я использовал #cccccc). Затем идем Filter — Noise — Add Noise (Фильтр — Шум — Добавить шум) и добавляем немного шума, чтобы придать текстуру слою. Я использовал такие настройки:
Amount (Количество): 10%
Распределение: Гауссово (Gaussian)
Монохроматическое (Monochrome): Active
Уменьшите непрозрачность (opacity) слоя Background Texture до 15%.
Шаг 3. Теперь создадим прямоугольник , в котором будем рисовать ленту. Я использовал Rectangle Tool (Прямоугольник) (U) с фиксированным размером 300×200 пикселей.
Поместите фигуру в центр холста и назовите слой «Обтравочная маска».
Шаг 4. Примените стили слоя к «обтравочной маске», чтобы добавить тень и обводку.
Шаг 5. Возьмите любое изображение (я использовал скриншот с сайта PSD Tuts) и поместите его в центр рабочего холста над слоем «Clipping Mask», затем перейдите Layer — Create Clipping Mask (Слой – Создать обтравочную маску).
Шаг 6. Теперь у нас есть изображение, на которое будет помещена лента. Инструментом Прямоугольник Инструментом (Прямоугольник) (U) нарисуйте основу для ленты. Поверните его на 35 градусов. Для этого используем Свободная трансформация (Free Transofirmation). Эту функцию можно активировать с помощью горячих клавиш. CTRL+T или через меню Edit — Free Transform (Редактирование — Свободное преобразование).
Убедитесь, что края ленты выходят за пределы прямоугольника.
Цвет ленты в данный момент не имеет значения, так как позже мы применим градиентную заливку. Назовите этот слой «Лента».
Шаг 7. Теперь создадим маску для слоя «Лента», которая скроет лишние области. Сделайте следующее:
1. Удерживая нажатой клавишу CTRL, щелкните миниатюру слоя «Обтравочная маска». Это загрузит прямоугольник выделения.
2. Нам нужно, чтобы лента немного выходила за границы прямоугольника, поэтому расширяем выделение на 4 пикселя командой Select — Modify — Expand (Выделение — Модификация — Развернуть).
3. Далее выберите слой «Лента» и создайте маску. Сделать это можно двумя способами:
а) Слой — Слой-маска — Показать выделение (Слой — Слой-маска — Показать выделенные области)
б) Нажмите на кнопку Добавить слой-маску (Добавить слой-маску) внизу панели слоев
Шаг 8. Давайте добавим несколько стилей слоя для ленты, чтобы добавить тень, свет и текстуру.
Тень (Тень) (внешняя тень)
Внутреннее свечение (Внутреннее свечение) (тестура)
Bevel and Emboss (Chamfer and Emboss) (свет по краям)
Gradient10 overlay (Градиент10 перекрытие) ) (цвет ленты)
Stroke (Обводка) (придает краям ленты четкость)
Получаем следующий результат:
Шаг 9.
Теперь нам нужно создать изогнутые углы на ленте. Помните, как мы расширили выделение на 4 пикселя?
1. Создайте новый слой «Углы» и поместите его над слоем «Фоновая текстура» и под «Обтравочной маской».
2. Выберите темный цвет (я использовал # 240500).
3. Берем кисть (B) размером примерно 9 пикселей со 100% жесткостью.
Используйте эту кисть, чтобы нарисовать маленькие круги в углах ленты. Поскольку слой находится под обтравочной маской, мы будем видеть только темную часть возле углов.
Чтобы лучше понять этот момент, посмотрите на изображение ниже. Вот как будет выглядеть наш документ, если мы уменьшим непрозрачность всех слоев над углами.
Шаг 10. Добавим немного текста. Я использовал следующие параметры:
Шрифт Chunk Five
24pt
Межбуквенный интервал 75
Цвет # 240500
Поместите текст на ленту и поверните на 35 градусов (используя трансформацию (CTRL + T), как в шаге 6).
Теперь добавьте стили слоя для текста.
У вас должно получиться что-то вроде этого:
Шаг 11. Теперь мы добавим стежки на ленту. Возьмите Text tool (Текст) (T) и напишите пунктирную линию из дефисов. Затем измените параметры текста:
Chunk Five Font
13pt
Расстояние между буквами 200
Цвет # 700404
Непрозрачность текстового слоя: 50%
Поместите текст на ленту и поверните его на 35 градусов, как мы делали шаги 6 и 11. Затем добавьте стили слоя, чтобы сделать стежки реалистичными.
Дублируйте текст и переместите его в конец ленты. Получаем следующий результат:
Шаг 12. Последнее, что нам нужно сделать, это применить маску стежков, чтобы они не выходили за края ленты. Для этого продублируйте слой-маску «Лента» и переместите его на слой со стежками.
