Создание HUD'a для стрима (Photoshop CS6)

  • На форуме авторизация через STEAM, что позволяет авторизироваться за несколько секунд. Только не говорите, что вы в нем не зарегистрированы :)
  • Сообщение на форуме - гарантированный способ доставки ваших слов владельцу данного проекта. Просто зарегистрируйтесь здесь и создайте где-нибудь тему

Heiliger Krieg

Тяну4ка
ПРАВИТЕЛЬСТВО
3 Окт 2015
243
476
186
Awards
11
22
Нефти и липового мёда
SID
STEAM_0:1:13126402
Приветствую в данной теме. Сегодня мы поучимся "рисовать" HUD к вашему стриму, с помощью программы Photoshop CS6.
Вступление:
HUD
- Украшение для стрима, которое отображается на экране у конечного пользователя. В то время как сам стример продолжает играть в обычную для него игру, его зрители видят картинку несколько иную. Обычно HUD используется только в качестве косметики для стримера и не перекрывает никаких важных игровых таблиц и самого интересного на мониторе, то есть, игры.
Как видит HUD стример (игрок):
GMOD1.jpg
И как видит его зритель:
GMOD.jpg
А теперь поговорим о процессе. Для начала нам нужно определиться с задумкой худа, будет ваш стрим серьёзным и брутальным или наоборот облеплен цветочками и "штобы пони скакале".
Я выбрал для себя пафосную серьёзную тему, с обилием тёмных карбоновых материалов.
В самом начале работы нам понадобится скрин из игры.
ВНИМАНИЕ: СКРИН ДОЛЖЕН ПОДХОДИТЬ ПОД ВАШИ НАСТРОЙКИ И РАЗРЕШЕНИЕ ЭКРАНА, ТО ЕСТЬ СДЕЛАН ВАМИ!
А теперь откроем Photoshop и посмотрим на наш скрин. По сути, в выбранной вами игре должен быть свой HUD, на котором обычно находится полоска здоровья. На TRIGON.IM это всё у нас внизу. Дальше нам понадобятся "линейки". Активировать их можно сочетанием клавиш Ctrl+R.
upload_2017-3-4_0-37-40.png

Разграничиваем области, где HUD'a быть не должно, то есть обводим HUD игры (у меня HUD располагается снизу, по всей ширине экрана, и справа, по середине).
Порисульки, ах-ха-ха, наконец-то!
С помощью инструмента "Прямоугольник" рисуем письки одну большую фигуру на половину экрана и сразу ставим ей прозрачность пониже. Растрируем слой, кликнув по нему ПКМ и выбрав пункт "Растрировать слой". Дальше режем HUD, тут нам и пригодятся наши линейки, которые мы бережно, пиксель к пикселю подогнали под размеры HUD'a игры.
(экхе, тут скрина нет, потому что, хм, его нет)
Теперь накладываем любой материал. Располагаем слой с материалом поверх слоя с прямоугольником-зачатком будущего HUD'a и создаём из материала обтравочную маску. Теперь ваш материал будет светиться только в пределах вашего прямоугольника.
upload_2017-3-4_0-50-28.png

Далее работаем по образцу и вот наш HUD готов.
upload_2017-3-4_0-52-25.png

Осталось только добавить немного косметики по вашему усмотрению. Я выбрал текст, поле для музыки и обводку градиентом.
Вышло, в итоге то, что вышло. Теперь осталось поговорить о том, куда пихать HUD. Я, использую OBS, поэтому и покажу на его примере. HUD должен располагаться выше слоя с игрой, но ниже остальных слоёв. Выглядеть это должно так.
upload_2017-3-4_0-56-54.png

P.S. Слой "TAMP" - картинка, частично перекрываемая HUD'ом, поэтому и находится именно там.

Поздравляю, ваш HUD к стриму готов. Теперь вы профеSSионал. Осталось только купить нормальное железо, микрофон и коронную фишечку в бюро коронных фишечек.
Написал: +Raynor+
ПОСЛЕСЛОВИЕ:
pp.userapi.com_c626322_v626322745_14ab6_0AvPDfxxkkg.jpg
 
Последнее редактирование:

Infernal Vogel

Серверный пушной писец
ПРАВИТЕЛЬСТВО
27 Июн 2015
316
491
199
Awards
15
/dev/null
steamcommunity.com
SID
STEAM_0:1:56347097
Triggered.

Осталось только купить нормальное железо, микрофон и коронную фишечку в бюро коронных фишечек.
Ты забыл дописать "И еще мозг, если конечно у вас его еще нет. Можно купить со скидкой введя промокод!"
Лови лукас крч. Хоть что-то годное среди остальной каши :D
 

Victor98NH

Всеобщий любимец
Гражданин
4 Ноя 2016
908
303
154
Awards
5
SID
STEAM_0:0:58860927
Гайд очень полезный, хотя я считаю, что HUD на стриме лишняя вещь.