Читать


Главная » 2016 » Февраль » 13 » Урок 15. Рисуем мини-профиль в стиле фэнтези
13:05
Урок 15. Рисуем мини-профиль в стиле фэнтези

Ролевая игра, форум или портал на тему фэнтези отличаются особенным оформлением. И даже функциональные блоки обычно стилизуют под общую тему. Попробуем стилизовать мини-профиль.

Для стиля фэнтези присущи скруглённые углы в формах, мягкие тона, яркие акценты. Не говоря уже о текстурах дерева, металла, старой бумаги и т.д. Но мы ограничимся простыми формами и цветом. Допустим, задуманный проект имеет тёмную цветовую гамму на ещё более тёмном фоне. Обрисуем контур блока. Инструментом "Прямоугольник со скруглёнными углами" нарисуем фигуру.


Рисуем мини-профиль в стиле фэнтези


Если у вас версия фотошопа начиная с Photoshop CC 2014, то радиус скругления можно менять даже после того, как вы уже нарисовали фигуру. Нам нужна ещё одна фигура. Нарисуем её заново или продублируем первую и уменьшим радиус скругления углов. После чего отодвинем края получившейся фигуры от первой на равное для всех сторон расстояние (к примеру, 5 пикс.).


Рисуем мини-профиль в стиле фэнтези


По такому же принципу (только с помощью круга) нарисуем рамку для аватарки. Изображение разместим поверх уменьшенной окружности и нажмём Alt+Ctrl+G.


Рисуем мини-профиль в стиле фэнтези


Добавим объёма рамке. Для этого зайдём в стили слоя бОльшего круга и добавим тень.
Также можно добавить блик - дублировать фигуру, выбрать для неё светлый оттенок, увеличить и приподнять.


Рисуем мини-профиль в стиле фэнтези


Используя фигуру "Прямоугольник со скруглёнными краями", нарисуем подложки для Ника и расы пользователя:


Рисуем мини-профиль в стиле фэнтези


Добавим дополнительную информацию и ссылки. А под ними расположим кнопку выхода из аккаунта.


Рисуем мини-профиль в стиле фэнтези


Объём кнопке придадим в стилях слоя фигуры. А блик добавим также, как на рамку аватарки (трансформированная окружность поверх слоя -> Alt+Ctrl+G -> цвет белый -> прозрачность: 25%)


Рисуем мини-профиль в стиле фэнтези

Рисуем мини-профиль в стиле фэнтези

Рисуем мини-профиль в стиле фэнтези

Рисуем мини-профиль в стиле фэнтези


Теперь добавим красивую деталь - красную ленту. Как рисовать ленты и делать их переливающимися, мы пробовали в предыдущем уроке.
Возьмём "Перо" и нарисуем несколько составляющих:


Рисуем мини-профиль в стиле фэнтези


Заготовка ленты готова! Теперь нужно добавить блики и затемнения.


Рисуем мини-профиль в стиле фэнтези


Затем добавляем тень под ленту. Сделать это можно продублировав все составляющие ленты -> склеив слои-дубли -> затемнив, трансформировав, а также размыв получившийся элемент. Либо можно нарисовать тень кистью.
Дублируем ленту, отражаем её по горизонтали и двигаем на другую сторону под аватаркой.


Рисуем мини-профиль в стиле фэнтези


Теперь можно экспериментировать с получившейся заготовкой (попробовать наложить на подложки текстуру или добавить объёма всему блоку), разместить в блоке дополнительные элементы (к примеру, уровень игрока, если это ролевая игра) и всё! Готово!


Рисуем мини-профиль в стиле фэнтези


Исходник урока запакован в архив весом 187Кб

Скачать архив



Категория: Уроки | Просмотров: 555 | Добавил: M-Wizard | Теги: рисуем мини профиль, Веб-дизайн, фотошоп, бесплатный, урок | Рейтинг: 0.0/0

Всего комментариев: 0
avatar


НЕКОТОРЫЕ ПУБЛИКАЦИИ БЛОГА