PlayStation Experience 2016
Стрим-центр14 в эфире
Потомственный циклонер покоряет ХК БРЕШЬ leegumbo стримит Path of Exile
☠ Капитан XopBaT ☠ DreamSails стримит Hearthstone: Heroes of Warcraft
ТОП СТРИМЕР (НЕТ) ♥ Ooops_Gaming стримит Counter-Strike: Global Offensive
stream center intro slide 1

«Канобу» и «ВКонтакте» запускают «Стрим-центр» — сервис для тех, кто любит смотреть и проводить прямые трансляции. Наш сервис поможет делиться стримами с «ВКонтакте», Twitch и YouTube и обеспечит новую аудиторию, которой будет интересен именно ваш контент.

«Стрим-центр» доступен на любой странице «Канобу» — достаточно нажать на стрелку в верхнем правом углу и развернуть сетку с активными стримами. Вы также можете открыть чат, кликнув на иконку сообщения в правом углу.

Кнопка «Добавить стрим» позволит поделиться прямой трансляцией. После нажатия вы увидите три активных поля. В первой строке нужно вписать адрес канала, остальные поля заполнит наш сервис.

stream center intro slide 4

Делиться стримами — это просто! Попробуйте сами. Обратите внимание, что после добавления стрима ваша трансляция сначала отправится на рассмотрение модераторов.

8 1 306
4 мин.

Дневник разработки Tanks of Twitch. Часть 2. Выбираем движок и встраиваем Твитч

Введение

Привет, это вторая часть дневника разработки Tanks of Twitch. (Первая часть, Третья часть)

Этот проект участвует в GamesJamKanobu, поэтому рекомендую сначала ознакомиться с самим проектом: http://gamesjam.org/2799/

Tanks of Twitch - это многопользовательская пошаговая Twitch-only игра. Игроки автоматически разбиваются на команды и их цель проста: уничтожить друг друга (по сути team deathmatch) и выиграть турнир. Команды управляют своим танком путем ввода сообщений в чат. Игра входит в категорию Twitch Plays.

Выбор движка

Дневник разработки Tanks of Twitch. Часть 2. Выбираем движок и встраиваем Твитч - Изображение 1

В начале, я был полон решимости делать все на Lumberyard. Он Амазоновский. И все, что нужно для работы с Твитчом, в нем уже есть. Новый для меня движок. Должно быть интересно.

Да, и несмотря на всю свою излишнюю скромность, всегда считал себя мега-крутым программистом: “Да я тут за полчаса во всем разберусь”.

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

Пока Lumberyard, привет Unity.

Интеграция с Твитчом. Код. Twitch Plays.

Для интеграции с Твитчом, я не вчитывался в API, не изучал его возможности и не писал враппер твитча на C#. Как и обычный Unity-программист, я просто купил плагин для работы с Твитчом: Twitch Chatter. Он обойдется в десять баксов и своих денег он стоит.

С его помощью можно подключиться к любому каналу и:

  • Получать все сообщения, написанные пользователями.
  • Отправлять сообщения в этот чат.

Вот и все! Чтобы реализовать функционал Twitch Plays больше ничего и не нужно!

Дневник разработки Tanks of Twitch. Часть 2. Выбираем движок и встраиваем Твитч - Изображение 2

В данном отрывке кода мы подписываемся на сообщения в чате и обрабатываем их.

А вот с чем я не ожидал проблем, так это с интерфейсом Твитча. Но, как оказалось, самые жирные проблемы ждали меня именно здесь.

Интерфейс Твитча и пользователь. Они не должны были встретиться.

Или, может, я просто не стандартный пользователь и просто не могу разобраться в современных веяниях интерфейсов. Может у вас все получится лучше. =)

Футер

Как сделать, чтобы у вашего стрима был красивый футер (с описанием управления, правилами, соцсетями, контактами и тп)? Если кратко, то никак.

Чтобы оформить футер, вам нужно создать несколько блоков, см. картинку:

Дневник разработки Tanks of Twitch. Часть 2. Выбираем движок и встраиваем Твитч - Изображение 3

Их можно редактировать. И на уме крутится: "Я сейчас сделаю хорошо". Но не сделаете. По крайней мере, не сразу.

Для начала, хочется отметить уникальный язык разметки, в котором, чтобы сделать малый перевод строки (типа "br") нужно добавить в конце абзаца ДВА ПРОБЕЛА. У меня мозги до сих пор не свыклись с этой логикой, поэтому я, добавляя строчку в чейнджлог, продолжаю делать ошибки.

Следующая загвоздка: после того, как вы все заполнили - вы не можете знать в каком порядке блоки будут расставлены. Блоки расставляются по столбикам. Учитывая, что у всех разное разрешение, количество столбиков варьируется от одного до трех. Первые точно будут в ряд, а вот все остальные блоки наполнят “столбики”, где будет больше всего свободного места. Отсюда вытекает следующая неувязочка.

Вы хотите изменить порядок блоков, чтобы было красиво. И тут на вашу радость даже присутствует драг-н-дроп. И вы, вроде, пытаетесь переместить блок в новое место, но он снова перемещается обратно, как будто вы ничего и не делали. И так в любом браузере. И, судя по интернету, этот баг не чинят уже как минимум год. Другие стримеры, чтобы поменять блоки местами, советуют менять СОДЕРЖИМОЕ блоков местами. Это так же прикольно, как ложкой опустошать ведро с водой.

После того, как вы наигрались с драг-н-дропом и поняли, что он не фига не работает, вы решаете последовать совету бывалых, описанный выше (поменять содержимое блоков), переключаете режим редактирования и режим предпросмотра - вроде все ок, обновляете страницу и видите что все не на своих местах на хрен. Вы рвете на себе рубашку и гневно кричите: “Х**** С УШАМИ!!!”

Успокоившись, я сделал вывод, что на самом деле драг-н-дроп работает, но визуально в редакторе это не отображается. В итоге, чтобы переместить блок: я его перемещаю, вижу как эта сволочь возвращается в то место, откуда я его начал тянуть, жму F5, и только после этого, блок находится там где я хотел!!! 2016 год на дворе, ну-и-ну.

Оффлайн-баннер

Для моей игры был бы очень полезен оффлайн-баннер. Что-то типа: “Стрим упал, извините. Я его скоро подниму”. Я даже посмотрел видеоуроки, как его вставить. Но у меня просто отсутствует этот функционал. Может, у меня санцкионная версия Твитча? Или ее можно подключить только будучи партнером Твитча? Я так и не понял.

Вставка плеера Твитча на другой сайт

Задача: вставить плеер Твитча прямо в страницу игры: http://gamesjam.org/2799/

Я думал, что я сейчас просто загуглю "embed twitch stream" и все мои проблемы решатся. Гугл старался, всячески пытался мне помочь, но, в конце концов, мы на пару с ним не справились. Те решения, которые я находил, либо не работают, либо используют какой-то сторонний сервис.

Тогда я просто решил посмотреть, как это реализовано на другом сайте. Оттуда я и утащил строчки кода, которые и вставил в страницу игры на GamesJam.org, заменив ссылки на свой канал. Как же все-таки хорошо, что у html-страниц доступен исходный код =)

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

Спасибо, что прочитали. Комментируйте, голосуйте, играйте!

#tanksoftwitch #gamesjam #gamesjamkanobu #twitch

1 комментарий

[Hearthstone] Плевать на лор, но не на баланс