某囲碁リーグ用のスコアボードツールを開発してみた話
この記事のターゲット：配信画面をリッチにすることに興味がある人
配信で綺麗だったりかっこいい洗練された画面があるじゃないですか
Abemaとかの企業の配信ならまだしも、ユーザーの有志で行われているゲームの大会でもやたらキレイなのがあるんですね
企業でも組織でもない、予算も人的リソースもないユーザー同士の集まりでこんなにクオリティの高い放送を実現できています、
有志たちで開催してるユーザー大会よりはるかにスポンサーからお金が出ている組織なら負けてはいられないはずです。
で、この手の画面の総称をスコアボードと呼ぶというらしいのですが、それを知ったのもつい最近8月20日のこと。そして世の中にはそれ用のツールが存在するらしいと同時に知りました。
調べてみるとこれは実は大体とある定番のツールを使ってるらしいんです。
そんな何もしらない状態から1週間で使われるかもわからない専用ツールを開発しました。
最初に某新設の囲碁リーグの（というか囲碁の配信全般の）画面もうちょっと洗練されないかなと、お節介ながら手助けする独自ツールを開発してみようかと思ったのがきっかけで、
いや、ちょっとまてよ、わざわざ作らなくても世の中に汎用的に使えるツールがあるんじゃないかと思って調べまくったことを記録しておきます
StreamConrol
前述言った定番のツール、それがこのStreamControlです。
どうもこれがこの手のスコアボードツールの始祖と言えるツールのようです
HTMLをOBS側にブラウザソースで取り込むというシンプルな仕組み。
HTML側ではツールから出力したデータをポーリングし更新。
どうもこれがこの手のツールの基本的な形式のようです。
しかもこのツール、データ更新用のUIをXMLで組んでカスタムできる仕組みでかなり汎用的に使える代物。
なんだいいのがあるじゃんと思って落として色々いじってみたんですが
どうカスタムしてもCSVからデータを流し込めず（CSVを手作業でいじっても空のデータで上書きされてしまいリードオンリーとして使えない）
少なくともプルダウンのリストではオートフィルはできず（画像のs01、s02の部分）、テキストインプット欄に途中まで入力してサジェストからオートフィルを発火させるしかないようです。
しかもそれすらもサジェストが上手く行く時と行かない時があり理想のツールの開発は難航。
データの流し込みを断念して毎回いちからデータを入力するのは面倒すぎるので断念しました。
ここからスコアボードツール探しの旅が始まりました。
YMSB
次に見つけたのがYMSBというツールです。
チームの星取やリストにもデフォルトで対応していて、CSVでデータの流し込みにも対応してるしUIも使いやすそうでうこれめっちゃいいじゃんと思ったのですが、
配信しているプレイヤーとUIを操作する人間を別々で想定し、ローカルで動くバージョンの配信をやめたようで、遠隔操作に対応する方法がかなり大仰で遠大だったので断念しました。
https://oreshufu.com/ymsb/remote41
BraceBracket（Webサービス版）
ブラウザだけで完結するとてもお手軽なサービス
しかしUIをカスタマイズできず限られた用途にしか使えなかったので断念。
LatteCon
UIが洗練されていてレイアウトの品揃えもよく某囲碁リーグに向いてそうと思いダウンロードしカスタマイズにトライ。
しかしCSV等でデータを流し込む機能がなくチームのメンバーをイチから入力するのが手間だったのでもっといい選択肢があるはずと見送りました。
TournamentStreamHelper
はっきり言って機能とプリセットのレイアウトの多さはこれが他の追随を許さないほど充実しています。
しかし多機能すぎて自分の使いたい機能だけに絞って覚えたり、カスタマイズして使うには複雑すぎたので断念。
レイアウトの画面はどれも洗練されているのでデザインだけ他に流用できそうです。
自分用にデータをカスタマイズし多機能を使いこなす根気がある人はこれをオススメします。
スコラボ / スコマド
スコラボはオーバーレイのレイアウトを作ってブラウザソースで取り込むためのURLを発行するサービス
そしてスコマドはそのスコラボで使える素材を売買してるサイトっぽいです
こんなのあったんだと、全然知らない世界で感動したのですが、チーム戦のオーバーレイに使えそうなものはありませんでした。
Vtuber向けっぽいですが、雑談メインの放送には使えるそうです
その他発見したり試したもの
KeepTheScore（Webサービス）
https://keepthescore.com/
FlexScore（Webサービス）
https://www.flexyscore.net/
Scoreboards for Streamers - Wolf Studios
https://wolf-studios.tv/scoreboards/
OBS Plugins
※内容や安全性を保証するものではありません
- Versus Ⓡevolution scoreboard 2.4
- GameMaster v2.1.1
- Simple JSON File Scorekeeper
- TeleScore - Fully Customizable Open Source Scoreboard Software
参考リンク
独自の配信専用ツール開発について
結局どれも痒いところに手が届くものがなくしっくり来なかったので、スコアボードツール探しの旅を終えて、観念して自作することにしました。
さて、ここからの有料部分ではどういった技術によって今回作ったツールを開発したか技術的な内容を記して行きたいと思います。
最初はLatteConを改造して使おうと思ってたのですが、生のJavaScriptでのデータバインディングの体験が地獄すぎたので結局スクラッチで作ることになりました。
まだ全然中身を書いてませんが、もし有料でも（現在のプランの価格でも）読みたいという方がいらっしゃれば追記します。
【 囲碁コンテンツ開発に専念させるプランB 】プラン以上限定 支援額：50,000円
月額：50,000円