FG
Издание о Fable
  • Страница 1 из 1
  • 1
Архив - только для чтения
Форум » Архив » Уроки photoshop » Урок: Как создать стильный юзербар в фотошопе (Adobe Photoshop)
Урок: Как создать стильный юзербар в фотошопе
[SeVaPeR] Дата: Понедельник, 28.06.2010, 15:44 | Сообщение # 1

Гордость Альбиона
Группа: Проверенные
Сообщений: 503
Награды: 13
Репутация: 874
Статус:
Пользователь не в сети :(
Недавно создал урок специально для сайта ,по созданию стильных юзербаров в подпись пользователя
Я знаю что написал тему в неположеном месте, потом прошу модераторов или администраторов переместить тему в раздел "Фишки Фотошопа". (причина: не могу писать в разделе, так как он для чтения)

"Урок: Как сделать стильный юзербар на сайт в Фотошопе"
Итак. Открываем Adobe Photoshop CS. Создаем новый холст ("New") с размерами 350 x 19. Резолютность ставим на 72
Тип холста/Прозрачность ( Transparent ) .

У вас должна получиться такая моделька:

Далее открываем свою картинку приготовленную собственно для юзербара. Я например выбрал картинку абстракции. В колонке
Файла открываем свою картинку или из дериктории папки переносим её на серый "задний" план.
Далее, перемещаем картинку в свой созданый холст для юзербара. В панели кистей выбираем инструмент размещения.

После, оптимизируем картинку до нужного размера. Выбираем в столбике "Edit"(выбор) строку "Transform"(трансформация)

Выбираем в появившейся подстроке "Scale" (размеры).

Чтобы вам удобнее было формировать картинку отдалите её при помощи колесика на мышке. Или же горячими клавишами приближения и отдаления. CTRL + (естественно приблизить)
CTRL - (отдалить) . Если вы потеряете случайно формировку картинки, горячей клавишой редактирования размеров вы можете её восстановить (CTRL + T)
Итак, размер оптимизирован по вашему желанию. (Но не забывайте, маленькие картинки при уменьшении теряют свое свойство качества и объема. Так что лучше выбирать большие,яркие,и качественные картинки.

После придадим нашему юзербару немного узоров для стильности. Я использовал узоры Brush, скачать этот узор вы сможете по Леттитбиту.

Размещаем узор кисти на юзербар. Я выбрал черный цвет для создания узора.

У вас должен получиться примерно такой юзербар:

Теперь придадим юзербару немного объема, обводки и сделаем ему штифт. Открываем в меню слоев "Blending Options" (основные настройки)

Теперь отмечаем галочкой Inner Shadow ( Внутреняя тень), Bevel and Emboss (Объем и резолют) , и Stroke (Обводка) . Внутри ставим такие значения:



Теперь в конце, отмечаем параметр Pattern Overlay( Патерн). Установим юзербару шифт. Если вы незнаете как делать шифт юзербару, прочитайте в разделе Фотошопа. (урок пользователя OldToroniel)
Устанавливаем значение Оверлэя как вам удобнее.

У вас должен получиться примерно такой юзербар со штифтом.Немного смегчаем штифт то 32 до 41, чтобы узор не загораживал рисунок.
Примерно вот так:

Я дополнительно установил Векторную маску со стеклянным эффектом вверху. Чтобы сделать такой эффект- создайте фигуру шаровой образности,разместите её снизу или поверху юзербара.
Примините в общих натсройках прозрачность до 20 или 30 и эффект стекла будет готов. Подробнее можете обратиться ко мне с вопросами по этому эффекту.
Теперь мы сделаем текст. Нажимаем на буковку "T" в панели. Выбираем шрифт текста. Я выбрал специальный шрифт для юзербаров Hooge.Скачать вы можете его с моего урока по Летитбиту:

Приминяем текст на юзербаре. Я создал текст для нашего сайта fablegame.info. Делаем тексту спецэффекты. Заходим опять же в "Blending Options" и выбираем строку "Stroke" (обводка)
Устанавливаем эти значения:
(обязательно обратите внимание на "Inside"
нажимаем ок. и наш юзербар готов. Можете сделать штифт также шрифту для красоты. Наш юзербар теперь готов для постановления в ваши дневники, форумы , подписи и работы.
У меня получился вот такой юзербар:

Урок "Как создать стильный юзербар в Фотошопе " составил [SeVaPeR]. Сделано специально для fablegame.info, копирование на другие сайты только с разрешением создателя урока.
Вам также предоставляется возможность скачать этот урок, и подробнее прочитать о создании юзербаров. (скачать можете с ссылки нашего сайта по Летитбиту)




Сообщение отредактировал [SeVaPeR] - Понедельник, 28.06.2010, 15:49
 
Форум » Архив » Уроки photoshop » Урок: Как создать стильный юзербар в фотошопе (Adobe Photoshop)
  • Страница 1 из 1
  • 1
Поиск: