Inkscape уроки: рисуем щит в графическом редакторе. Рисуем иконку щита в фотошоп

Как нарисовать щит для эмблемы клана в paint.net.

Этот несложный урок подготовлен по просьбе одного из участников форума и посвящен тому, как нарисовать стилизованный щит в paint.net. Например такой.

Первое с чего мы начнем, это то как сделать контур будущего щита. Создадим новый слой выше слоя с фоном. Используем для создания контура инструмент paint.net линия или кривая .

Первая линия.

Вторая линия.

Создайте копию слоя с получившимися линиями. Примените к копии слоя инструмент из меню paint.net "Слои" Отразить горизонтально. Если контуры сразу не совпадут, то можно переместить один из слоев так, как нужно. Или доработать ластиком . После чего объединить два слоя с линиями, что бы получилось так.

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

Выполните следующие действия:

  • Выделите область внутри большого контура щита.

  • Создайте новый слой выше.

  • Заполните выделенную область градиентом . Цвета любые, которые вам нравятся, я использовал серый и светло-серый.

  • Отключите видимость слоя с большим контуром щита.
  • Выполните те же самые действия для малого контура щита.

    Переместите слой с малым контуром щита на самый верх. Включите его видимость и нарисуйте на нем две такие линии.

  • Выделите область внутри линий на малом контуре щита.

  • Создайте новый слой выше.

  • Заполните выделенную область градиентом . Цвета любые, которые вам нравятся, я использовал зеленый и темно-зеленый.

  • Отключите видимость слоя с малым контуром щита.
  • К слою с малым щитом, заполненным градиентом, примените эффект paint.net "Тень" .

    Сделаем блик.

    Возьмите кисть paint.net большого размера. Создайте новый слой. Белым цветом нарисуйте так.

    Установите прозрачность слоя с белым бликом 80.

    Выполните следующие действия.

  • Выделите область малого изображения щита, на слое заполненным градиентом.

  • Создайте новый слой выше. Можно переместить его выше других слоев, но ниже слоя с бликом.

  • Используйте инструмент кисть paint.net и темно-серый цвет. Нарисуйте такие контуры по краю выделенной области.
  • Не снимая выделения, примените к выделенной области стандартный эффект paint.net "Гауссово размытие" . Я использовал радиус размытия 30.

    Создайте новый слой выше всех слоев, но ниже слоя с бликом. Нарисуйте какой-нибудь символ или то, что вы хотите видеть на щите.Я использовал стандартный шрифт Windows Webdings и нарисовал первый попавшийся символ - это оказалось галочка.

    Для придания объема рисунку на щите я выполнил следующие действия.

  • Выделите область символа на щите.

  • Создайте новый слой выше.

  • Заполните выделенную область
  • В этом уроке мы нарисуем сияющий щит в Фотошопе с нуля. Щиты широко применяются в рекламных объявлениях в Интернете. Они представляют собой символ уверенности, надёжности, защиты. Идея использования щита - вызвать у покупателей или пользователей положительные ассоциации о продукте или услуге.

    Конечный результат:

    Шаг 1

    Создайте новый документ в Фотошопе с параметрами, показанными на скриншоте. Сохраните его под именем «Shield.psd». В процессе работы рекомендуется сохранять свой проект (Ctrl + S) , чтобы не потерять изменений.

    Шаг 2

    Выберите инструмент Многоугольник (Polygon Tool) (U) . На верхней панели задайте 3 сто

    роны и нарисуйте чёрный треугольник, как показано на скриншоте.

    Откройте панель Инфо (Окно > Инфо) (Window > Info) . Кликните на иконке плюса (+) и выберите Пиксели (Pixels) как единицу измерения. На панели инструментов выберите слой с треугольником и инструмент Перемещение (Move Tool) (V) . После этого перейдите в меню Редактирование > Трансформирование контура > Масштаб (Edit > Transform Path > Scale) .

    На верхней панели введите следующие значения ширины и высоты:

    Теперь нужно расположить треугольник прямо в центре холста. Для этого выберите слой треугольника и фона. На верхней панели нажмите на кнопки выравнивания по вертикальным и горизонтальным центрам.

    Работать с векторными фигурами очень удобно из-за возможности изменить их формы при помощи якорных точек. Далее Вы увидите, как мы превратим треугольник в щит, используя всего 3 якорные точки.

    Шаг 3

    Выберите инструмент Угол (Convert Point Tool) и наведите курсор на левый верхний угол треугольника. Указатель сменится на белую стрелку, а это значит, что инструмент сменился на другой - Выделение узла (Direct Selection Tool) (A) . Дело в том, что инструмент Угол (Convert Point Tool) виден только тогда, когда выделена хотя бы одна якорная точка. Поэтому сначала выделите левую верхнюю точку.

    Как только точка будет выделена, снова наведите курсор на неё и увидите, что он сменится на перевёрнутую букву V. Это и есть указатель инструмента Угол (Convert Point Tool) . Кликните на якорной точке и потяните мышь вправо вверх. У якорной точки появятся два рычажка. Как Вы поняли, этим инструментом в Фотошопе создают изогнутые линии. Рычажки нужны для того, чтобы направлять линии, образующие угол. Их можно контролировать через точки на концах. После того, как вы создали изогнутую линию, переключитесь на инструмент Выделение узла (Direct Selection Tool) (A) . Им будет удобнее пользоваться и безопаснее.

    Сейчас у Вас по-прежнему должен быть выбран инструмент Угол (Convert Point Tool) . Зажмите клавишу Alt и потяните нижний рычажок вправо вверх.

    Шаг 4

    Инструментом Угол (Convert Point Tool) создайте изгиб в правом верхнем углу треугольника.

    Удерживая Alt , потяните нижний рычажок влево вверх.

    Шаг 5

    Теперь займитесь нижним углом.

    Теперь можно переключиться на инструмент Выделение узла (Direct Selection Tool) (A) , так как все углы были сглажены. Этим инструментом мы продолжим изменять форму щита.

    Вам нужно получить следующую форму:

    Шаг 6

    Назовите слой с фигурой «shield outer». Кликните на нём правой кнопкой мыши и выберите пункт Растрировать слой (Rasterize Layer) . После растеризации Вы больше не сможете изменять форму фигуры.

    Шаг 7

    Сейчас мы добавим несколько стилей, которые сделают щит сияющим и металлическим. Кликните дважды на слое «shield outer» и настройте стили так:

    Тиснение (Bevel & Emboss) : Стиль - Внутренний скос, Метод - Плавное, Режим подсветки - Осветление, Режим тени - Умножение.

    Примечание переводчика: переведены только текстовые значения параметров, так как параметры, имеющие цифровые значения, остаются на своих местах независимо от языка программы.

    Выберите контур Кольцо (Ring) :

    Контур (Contour) : контур Полукруг (Half Round).

    Шаг 8

    Теперь настройте стиль Внутреннее свечение (Inner Glow) : Режим - Замена тёмным, Метод - Мягкий, Контур - Кольцо (Ring).

    Шаг 9

    Следующий стиль - Наложение градиента (Gradient Overlay)

    Откройте Редактор градиента (Gradient Editor) . На градиентной цветовой полоске кликните на середине, чтобы добавить новую контрольную точку цвета. Как только появится новая точка и будет выделена, Вам станут доступны параметры Цвет (Color) и Позиция (Location) . Кликните на цвете параметра Цвет (Color) , чтобы открыть Редактор цвета (Color Picker) . Там Вы сможете ввести RGB код цвета. Чтобы удалить контрольную точку цвета, кликните ней и потяните мышь вверх или вниз.

    Добавьте две контрольные точки на градиентную полоску.

    Результат после применения стилей:

    Шаг 10

    Установите цвета по умолчанию (D) . Выделите слой с формой щита (удерживая Ctrl , кликните на миниатюре слоя). Сожмите выделение на 15 пикселей через меню Выделение > Модификация > Сжать (Select > Modify > Contact) .

    Шаг 11

    Создайте новый слой (Ctrl + Shift + Alt + N) и залейте выделение чёрным цветом (Alt + Backspace) .

    Уберите выделение и назовите слой «shield base mid» .

    Шаг 12

    К слою «shield base mid» примените следующие стили:

    Внутреннее свечение (Inner Glow) : Режим - Осветление, Метод - Мягкий, Контур - По Гауссу.

    Шаг 13

    Наложение градиента (Gradient Overlay) : Режим - Нормальный, Стиль - Линейный.

    Шаг 14

    Внешнее свечение (Outer Lower) : Режим - Осветление, Метод - Точный.

    Результат:

    Шаг 15

    Выделите слой «shield base mid», создайте новый слой «shield inner» и сожмите выделение на 15 пикселей. Заполните его чёрным цветом.

    Шаг 16

    К слою «shield inner» примените следующие стили:

    Тиснение (Bevel & Emboss) : Стиль - Внутренний скос, Метод - Плавное, Контур - По Гауссу, Режим подсветки - Осветление, Режим тени - Умножение.

    Контур (Contour) : Полукруг (Half Round).

    Шаг 17

    Наложение градиента (Gradient Overlay) : Режим - Нормальный, Стиль - Линейный.

    Шаг 18

    Внешнее свечение (Outer Glow) : Режим - Умножение, Метод - Мягкий, Контур - Кольцо.

    Результат:

    Шаг 19

    Выделите слой «shield inner». Создайте новый слой «shield core» и сожмите выделение на 6 пикселей. Заполните его цветом RGB (0, 114, 188).

    Шаг 20

    Примените следующие стили к слою «shield core»:

    Внутреннее свечение (Inner Glow) : Режим - Умножение.

    Глянец (Satin) : Режим - Осветление основы.

    Наложение градиента (Gradient Overlay) :

    Шаг 21

    Синяя часть щита должна отражать свет. Сейчас мы создадим блик на щите. Все слои отражения будут иметь в названии слово «refl». Выделите слой «shield core», сожмите выделение на 15 пикселей, создайте новый слой refl left mid и заполните выделение белым цветом.

    Шаг 22

    Уберите выделение (Ctrl + D) . Инструментом Овальная область (Elliptical Marquee Tool) (M) создайте выделение, показанное на скриншоте.

    Шаг 23

    Теперь нужно выделить оставшуюся часть левой половины белой формы. Выберите инструмент Лассо (Lasso Tool) (L), зажмите клавишу Shift и добавьте к выделению то, что находится слева.

    Шаг 24

    Инвертируйте выделение (Ctrl + Shift + I) .

    Нажмите Delete , чтобы удалить правую половину белой формы.

    Шаг 25

    Уберите выделение (Ctrl + D) и примените фильтр Размытие по Гауссу (Фильтр > Размытие > Размытие по Гауссу) (Filter > Blur > Gaussian Blur) .

    Шаг 26

    Вы по-прежнему должны находится на слое «refl left mid». Добавьте к нему маску.

    Белый цвет маски означает, что содержимое слоя полностью видно. Чёрный цвет на маске скрывает участки слоя. Сейчас мы создадим плавный переход между синим щитом и белым бликом.

    Выберите мягкую кисть с 50% непрозрачностью, убедитесь в том, что маска активна и начните закрашивать белую область от левого края. Чтобы вернуть белую заливку, смените цвет на кисти на белый. Маска не влияет на пиксели слоя, поэтому относится к разряду безвредных средств Фотошопа.

    Шаг 27

    Выберите инструмент Перемещение (Move Tool) (V) . Затем уменьшите непрозрачность слоя до 24%.

    Шаг 28

    Создайте новый слой «refl top». На нём мы создадим ещё один блик таким же способом, как и первый.

    Примените фильтр Размытие по Гауссу (Gaussian Blur) со значением 3 пикселя.

    Добавьте маску и мягкой кистью сотрите часть заливки.

    Шаг 29

    Выделите слой «shield core», создайте новый слой «refl lower» и залейте выделение белым цветом. Удалите правую половину заливки.

    Выделите слой «refl lower», выберите любой инструмент выделения, кликните правой кнопкой мыши на холсте и выберите пункт Трансформировать выделенную область (Transform Selection) .

    Кликните правой кнопкой мыши на холсте ещё раз и выберите режим Искажение (Distort). Потяните угловые точки, как показано на скриншоте, чтобы изменить форму выделения.

    Нажмите Enter, чтобы применить изменения. Удалите выделенную часть (Delete) .

    Примените фильтр Размытие по Гауссу (Gaussian Blur) со значением 1 пиксель. Уменьшите непрозрачность слоя до 50%.

    Шаг 30

    Создайте ещё два слоя: «refl left side» и «refl right side». Нарисуйте блики на по бокам.

    Примените тот же фильтр размытия и уменьшите непрозрачность до 50%. На этом мы закончили создание бликов.

    Шаг 31

    Создайте новый слой «ribbon front» над слоем «refl right side». Инструментом Прямоугольная область (Rectangular Marquee Tool) (M) создайте выделение в форме небольшой полоски и заполните его 50% серым цветом.

    Активируйте режим Деформация (Редактирование > Трансформирование > Деформация) (Edit > Transform > Warp) .

    На верхней панели выберите тип деформации Арка (Arch) .

    Потяните верхнюю точку сетки вниз, чтобы изогнуть полоску в другую сторону. Нажмите Enter , чтобы применить изменения.

    Шаг 32

    К слою «ribbon front» примените следующие стили:

    Обводка (Stroke) : Положение - Внутри, Режим- Нормальный, Тип обводки - Цвет.

    Шаг 33

    Внутреннее свечение (Inner Glow) : Режим - Осветление, Метод - Мягкий.

    Шаг 34

    Наложение градиента (Gradient Overlay) : Режим - Нормальный, Стиль - Линейный.

    Шаг 35

    Создайте копию слоя «ribbon front» и опустите её под оригинал. Инструментом Перемещение (Move Tool) (V) сдвиньте слой на холсте на несколько десятков пикселей вверх.

    Шаг 36

    Инструментом Прямоугольная область (Rectangular Marquee Tool) (M) выделите левую половину полоски.

    Шаг 37

    Вырежьте выделенную часть на отдельный слой (Слой > Новый > Вырезать на новый слой (Layer > New > Layer via Cut) . Расположите две половинки, как показано на скриншоте.

    Шаг 38

    Инструментом Прямоугольная область (Rectangular Marquee Tool) (M) обрежьте правую и левую полоски. Назовите слои «ribbon left end» и «riboon right end».

    Шаг 39

    Измените стиль градиента слоя с левой частью полоски «ribbon left end».

    Шаг 40

    Измените угол градиента для слоя «ribbon right end».

    Шаг 41

    Сейчас мы соединим части ленты. Создайте два слоя: «ribbon left fold» и «ribbon left fold». Инструментом Прямоугольная область (Rectangular Marquee Tool) (M) создайте полоску и измените её форму в режиме Искажение (Distort) . Соедините фронтальную часть ленточки с задними.

    Сейчас мы скопируем стили. Кликните правой кнопкой мыши на иконке fx у слоя «ribbon left end». Выберите пункт Скопировать стиль слоя (Copy Layer Style) . Затем кликните на слое «ribbon left fold» и выберите пункт Вклеить стиль слоя (Paste Layer Style) . Таким же способом скопируйте стили правого конца ленты на соединительную часть.

    Шаг 42

    Измените настройки градиента слоя «ribbon left fold»:

    Шаг 43

    Настройки градиента слоя «ribbon right fold».

    Шаг 44

    Инструментом Многоугольное лассо (Polygonal Lasso Tool) (L) создайте треугольное выделение на конце ленты.

    Шаг 45

    Нажмите Delete , чтобы сделать вырез. Сделайте то же самое на правой стороне.

    Шаг 46

    Инструментом Горизонтальный текст (Horizontal Type Tool) (T) напишите «PREMIUM QUALITY». Шрифт «Times New Roman» размером 48pt. Примените деформацию Арка (Arch) и измените изгиб.

    Шаг 47

    К текстовому слою примените следующие стили:

    Тиснение (Bevel & Emboss) : Стиль - Контурное тиснение, Метод - Плавное, Режим подсветки - Осветление, Режим тени - Умножение.

    Контур (Contour):

    Шаг 48

    Наложение цвета (Color Overlay):

    Шаг 49

    Внешнее свечение (Outer Glow)

    Шаг 50

    Уменьшите непрозрачность слоя «refl top» до 50%.

    Шаг 51

    Создайте новый слой над предыдущим текстовым и напишите на нём «PSD». Шрифт «Times New Roman» размером 122pt, цвет - чёрный. Примените следующие стили:

    Тиснение (Bevel & Emboss) : Стиль - Внутренний скос, Метод - Жёсткая огранка, Режим подсветки - Осветление, Режим тени - Умножение, Контур - Конус.

    Наложение цвета (Color Overlay):

    Внешнее свечение (Outer Glow) : Режим - Умножение, Метод - Мягкий.

    Надоели крики Кати и Степы из комнаты за обладание какой-то фигней… Посадила Степана рисовать рядом с собой. - Мам, я нарисую Александра Македонского на коне! - Надо же, думаю, как здесь все зависит от собственности на желание… Вчера присоединился к Катиному рисованию и говорил, что не умеет рисовать собаку. Хотя умеет, потому что рисовал пару раз точно. Но это он спонтанно подключился к желанию сестры порисовать, образа/идеи рисуемого вероятно не возникло. Вот и получилось: курицу «не могу», собаку «не могу»...

    Читать полностью...

    Что ты нарисовал?

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

    Продолжаем изучать графический редактор Inkscape уроки которого совсем не сложные. Сегодня, хочу предложить вам нарисовать щит вместе со мной. Я выбрал форму щита на свой вкус, ну а вы можете нарисовать щит другой формы, которая нравится вам. Спрашиваете, как можно сделать щит другой формы? Сейчас узнаем.

    Inkscape уроки: рисуем щит

    Конечно же, в первую очередь нам нужно нарисовать форму щита. Ее можно нарисовать двумя способами. Первый – это оконтурить квадрат и вытянуть его с помощью узлов. Второй способ нарисовать форму щита – создать сначала его половину при помощи сетки, а затем продублировать, отразить по горизонтали и соединить обе половины. Я выберу второй способ, а рисуя другие Inkscape уроки , я обязательно покажу первый. Нажимаем «Вид – Сетка » и при помощи кривых Безье создаем половину щита.

    Когда половина готова, убираем сетку, дублируем половину (Ctrl+D ), отражаем по горизонтали (Н ) и соединяем верхние и нижние узлы. Если вдруг вы забыли, как соединять узлы, то посмотрите урок «Как рисовать сердце». У меня получилась абсолютно симметричная форма щита.

    Далее нужно залить цветом щит, и продублировать один раз. У меня темно-зеленым цветом залита нижняя часть щита, а верхняя — светло-зеленым. Теперь нужно удалить половину верхнего щита. Я рисую прямоугольник и располагаю его точно посередине щита.

    Выполняю операцию «Разность» (Ctrl+ - ).

    Теперь можно залить нижнюю часть щита линейным градиентом. Добавьте три опорные точки и расположите их как на рисунке. Далее дадим каждой точке свой цвет слева направо: белый, 7.5% grey, 40% grey, белый, 2.5% grey.

    Таким же образом раскрашиваем правую половину щита, только уже добавляем две опорные точки. Цвета слева направо: 50% grey, 20% grey, 10% grey, 7.5% grey.

    В уроке «Inkscape уроки: рисуем щит» основа щита готова, и нам бы не помешал небольшой фон на задний план. Для этого дублируем нижний щит, и заливаем его цветом #536c67 . Опускаем на задний план клавишей End и стрелочками подвигаем чуть вправо и вниз, как на рисунке.

    Начинаем работать уже над основной частью щита. Дублируем нижний серый щит, заливаем цветом #536c67, и уменьшаем клавишей (<).

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

    Выполняем между ними операцию «Разность» (Ctrl+ -). Кусочек, который остался, заливам цветом темнее — #374845 .