書いた人:kn1cht
『ぼっち・ざ・ろっく!(ぼざろ)』のアニメは、放送が終了してからも圧倒的な人気を誇っていますね。
どのくらい人気かというと、一発ネタの立て看板を作ったら万バズしてしまうほどです。
さて、ぼざろの原作コミックを出版している芳文社のアカウント「まんがタイムきらら編集部」では、放送中に多数のコマ画像が「ぼっちちゃんよくばりセット」と称して配布されていました。
バイトを辞める決心をした時にお使いください #ぼっち・ざ・ろっく#ぼっちちゃんよくばりセット
— まんがタイムきらら編集部 (@mangatimekirara) 2022年12月24日
【原作コミックス1~5巻好評発売中!】https://t.co/jEUHONPPY8 pic.twitter.com/iJs6LNgP3G
ぼざろのコマ画像は、アニメ化前からSNS等でネタ画像として目にする機会が多かった(「いいいいイキってすみません…」「憂鬱な月曜日が始まった」など)ので、その文化を拡大する形で作品の盛り上がりをより高める取り組みだったと思います。
配布画像は、放送中に投稿されたものだけでも69枚にのぼります。いざ投稿したいときにいちいち探すのもけっこう大変です。
pic.twitter.com/CApFH9p17G https://t.co/bhNcy6UbTg #ぼっち・ざ・ろっく!
— けいえぬ (@kn1cht) 2022年12月30日
そこで、bozaro.vercel.app(btr)というWebアプリを作って公開しました。
- 画面上の"btr"という文字を押すたびにランダムに画像が変わる
- 左のメニューから目的の画像を探せる
- tweetボタンから画像をツイートできる
といった機能があります。
技術的な詳細は、ぼざろオンリーに出す合同誌のネタにしたいので省略するとして、本記事ではこのアプリの特徴などを軽くご紹介します。
こんばんは!きらら同好会です。
— 東大きらら同好会 (@UTKiraraCircle) 2022年12月30日
当会は3/18に綿商会館で開催の「ぼっち・ざ・おんりー!」( @BocchiTheOnly )に申し込みました。
受かればぼっち・ざ・ろっく!の本が出るはずですのでよろしくお願いいたします……!
元ネタ
NEW GAME!の画像を閲覧・ツイートできるzoi.herokuapp.com(zoi)が元ネタです。2014年頃から存在する老舗の(?)Webアプリですね。
pic.twitter.com/PZ2SryiUlW / https://t.co/gKT1rjrehx #NEWGAME!
— けいえぬ (@kn1cht) 2021年11月22日
機能、ページデザインについてはzoiのものを踏襲しています。GitHubリポジトリもあるのですごく参考になりました。
zoiはAngularJS + Expressで作られており、今となっては時代を感じさせられる構成です。また、公開先のHerokuも今年2022年秋に無償プランが終了し、個人のネタアプリの公開先としては利便性が低下してしまいました(逆にzoiが生きているということは、作者の方が課金してくださっているということですかね……?)。
そこで、btrはNext.jsで制作し、Vercelにデプロイすることで無料運用を実現しています。本当はbtr.vercel.appにしたかったのですが、3文字ドメインは押さえられてしまっているのか使えませんでした。
画像の表示とツイート
これもzoiの真似をした部分です。btrでは、表示、ツイートともきらら編集部アカウントによる元のツイートの画像を使用します。
zoiで使われている画像は公式から許諾されたものではないので正直グレーなのですが、btrのものは公式が「お使いください」「#ぼっちちゃんよくばりセット」などと添えてツイートしたもののみを掲載しているので、安心してご利用いただけます。
ツイート機能では、画像をアップロードする代わりに画像ツイートのURL(例:pic.twitter.com/YMYv8PYbX6)を投稿します。ツイートボタンや画像投稿ボットなどで古くから用いられている方法です。文字列だけを投稿すれば画像付きツイートになるので、Webアプリ側で複雑なことをしなくて済み最高ですね。
この仕様を応用すれば、pic.twitter.comで始まるURLをコピペすることで、リプライなどでもぼっちちゃんよくばりセットを貼り付けられます。
画像URLの収集
制作で一番大変だったのが、公式配布画像のURLを取得して設定ファイルに書き込む作業です。Twitter APIの改悪などで完全な自動化は難しく、結局69枚の大部分を温かみのある手作業で設定しました。
作業にあたっては、湯の沢氏によるnote記事「きらら編集部公式配布画像メモ」にかなり助けられました。アニメの序盤ではきらら編集部が#ぼっちちゃんよくばりセット タグを使っていない、使用OKの文言がないといった例外も多いため、この記事のおかげでリストアップが大幅に省力化されました。すばらしい作業をありがとうございます!
ご意見・ご要望
何かありましたらリポジトリへのIssue, Pull Requestをお待ちしております!
さいごに
つかってくれー(承認欲求モンスター)