人間になりたい類人猿

人間以前の技術屋ブログ

デレステ フォトスタジオの「○○ちゃんっぽく!」を検索できるサイトを作った話

先日行われた、IM@S Engineer Talk2019にて発表した

speakerdeck.com


で語られなかった裏話をブログに書く。
あと正直検索サイトのpv数がクソクソ少ないので、ネット上にリンクを増やしたい。
主な話は上のスライドを見てもらえらば。

①サイト紹介

y-osaru.github.io
デレステのフォトスタジオにある「○○ちゃんっぽく!!」を閲覧できるサイト。

②なぜ作ったの?

スライドの通りで、○○ちゃんっぽくが覚えられないし、正直似たやつ多くね?って疑問もあったので。
※実際にまとめてみると、パット見は似ているが、ちゃんと違う。

③なぜこの技術を選んだのか

最初の構想時は自分の知識upも含めて、
nuxt.js×Travis CI×github pagesにしようと思っていた。(もしくはfirebase hosting)
しかしスライドにもある通り、素材作りで難航が見えた。

素材は月一で増えていくし、速度重視でやりたかったので、今のペラ一htmlになった。
※あと誰かに先越されるのも嫌だった。

多分余裕とモチベがあったら↑の環境に載せ替えるかも。
載せ替える事でのユーザメリットとか特に無いからまた別案件になりそうだけど。

④実は作った裏で……

作って、調子乗ってハッシュタグつけてつぶやいたら比較的バズった。

いえーいと思って、寝て、次の日。
突然フォロワーからリプが来て、

僕「え……何かしたかな……」と思ったら
フォロワー「Firebaseで402エラー出てる」
僕「( ゚д゚)(ふぁーってか402?402??)」

そう。最初は画像をCloud Storage for Firebaseに置いてたのだ!(何でだろうね……)

とりあえず出社しつつ調査。
課金エラーだったけど、容量もそんなに入れてないし……と思って、
しかもコンソールでもバケットにアクセス出来ない状態だった。

調べてみると当時、Firebase自体で丁度障害が起きていて、それの影響だと思っていた。

しかし昼前に復旧を確認した後にコンソール行ってもバケットが見れない。

試しに課金してみたら、直った。
(「GB ダウンロード済み」(多分ネットワーク(下り)の事だと思う)の上限を突破してしまってたみたい。)

なので、github pagesに置き換えた(読み込みは多分遅くなるが、仕方ない)

(ってか課金上限に引っかかるとコンソールですらただのエラー(問題が発生しました)で返すのどうなん?)

⑤運用面

画像のスクショが面倒というのは今もそうなのだけど、
デレステデレステ側のID順で途中に追加される為、それに合わせてデータを作るのが結構めんどい。
※追加された順にはリストが並ばない。

⑥最後に

まぁ正直デレステ側でプレビューしながら確認出来ればこんなサイトいらんのじゃよ!!
あとPWAのアイコン変えないとね……「ちゃんぽく検索」だわ。
まぁ「ちゃんぽい検索」でも良いけど( ˘ω˘)

おわり

今年一番推して、押しきれなかった作品「ときめきアイドル」の話

アプリのオンライン運営終了によせて

ちょこちょこ人に会う度に推してた、アプリ「ときめきアイドル」が2019/1/15で終わる。
https://www.konami.com/games/tokimeki-idol/app_info.php?topic=service
やってたアプリの終了に立ち会うって初めての経験だから、年末の良い機会なのでこのアプリの良い所と悪かった所を書き留めようと思う。

続きを読む

アイマスMRに影響されてフレデリカを召喚した話

アイマスMRで「DMM VRシアターの映像ってどうやってんだろ。」と興味を持ち、
調べてみると「ペッパーズ・ゴースト」と呼ばれる方法でやっているらしい。
簡単に出来そうなのでフレデリカを召喚してみた話

DMM VRシアターで使ってる映像技術

そもそもDMM VRシアターってどうやってキャラクターを映してるかを調べてみると、DMM VRシアターの公式HPで仕組みが載っている。
vr-theater.dmm.com
引用画像
https://vr-theater.dmm.com/img/pc/about/pic_holographic01.png

ガラスのような透過もするし反射もする素材に斜め45°から映像を映してあげる事で実現しているようだ。
ディズニーランドのホーンテッドマンションもこれを使っているのだとか。行ったこと無いけど。

実際にやってみる。

ググってみると、台形をピラミッド状に組み合わせる作例が載っていた。
参考:スマホで手軽に3Dホログラム映像を見る方法。マックスむらいが飛び出すぞ! | AppBank – iPhone, スマホのたのしみを見つけよう

これを実際に作ってみて、やってみた。


制限事項と作る時のTipsとか

  1. まずあくまで"平面"なので、横から見ても横向きの絵が見えるわけではない。
  2. 背景は黒の必要あり
  3. 台形のパーツそれぞれを作って組み合わせるのは結構面倒なので、下のように台形を組み合わせた形で作る方が多分楽

f:id:wannabehuman:20180516222025j:plain:w200

まとめ

今までARでアイドルを召喚してきたが、
f:id:wannabehuman:20171230011552j:plain:w400
こんなにも簡単に召喚する方法もあったのか……
これ透明なタッチスイッチと組み合わせて、映すモノを単純な映像からアプリケーションにすれば擬似的に触れる事も可能だろうな。
こんなイメージで。
f:id:wannabehuman:20180516224019p:plain:w400

デレPが行くSideM3rdライブ

SideMは315でした

先日静岡公演にて千秋楽を迎えた
THE IDOLM@STER SideM 3rdLIVE TOUR
〜GLORIOUS ST@GE!〜

たまたま仙台2日目が当たって、その後静岡1日目を友人が当ててくれて、無事神速一魂とFRAMEに落ちました。
という訳で、このまま何も残さないのは寂しいのでブログにまとめました。
一言で言うと

なんだぁ?あのカッコイイ/可愛い生き物は。
同じ3次元の男性じゃないだろ。
あれは2次元か4次元。

続きを読む

アイマス一公演で折られるUOは「」本

俺は一体あと何本このUOを折ればいい……

ここ数年でアイマスのライブに行くことが多くなった。
アイマスのライブって電池式のペンライト以外にもケミカルライト/サイリウムと呼ばれる物をよく使う。
特にオレンジ色で輝度の高いサイリウムを使う人が多くて、通称UO(ウルトラオレンジ)と呼ばれている。
※実際の商品名は違うのだけど、UOでざっくり一括りにされている感覚。

https://stat.ameba.jp/user_images/20151019/22/akemi-madoka/79/0e/j/o0800060013459286146.jpg?caw=800

使うタイミングとしては盛り上がる曲が主で、そういう曲だと折る時のパキパキという音が周囲から聞こえてくるレベル。
で、これ一本一本も売っているけど、大体25本入りの箱で買う人が多い。
ここで一つの素朴な疑問が……

一体UOは1公演で何本折られて、それが何円分なのか

実際に計算してみた……

※色々前提条件とかはざっくり決めていくので超話半分で見てもらえるとありがたい。
まず一曲で折られる本数とその金額を計算する。
大体一曲に折る本数が、両手で4本を1番/2番で入れ替えて8本、SSAのアリーナモードのキャパが22500人なので、

22500人 × 8本 = 180,000(18万本) ※もうこの時点で割とヤベーイ……

で、UO一本の単価が2,300円 / 25本で92円なので

180000 * 92 = 16,560,000円(約1660万円)

これが1曲で消費される本数と金額。

これが "1曲"で 消費される本数と金額。

次にここから一公演で折られる本数と金額を求める。
一公演で折る曲は大体8曲くらいなのでこれを8倍するだけで良いので
※4thSSA、5th各地方公演から。5thSSAはメドレーがあってイレギュラーすぎるので除外

180,000本 * 8曲 = 1,440,000(約140万本)

16560000円 * 8曲 = 132,480,000円(約1億3千万円)

が一公演で消費されている事になる。

まとめ

結論:アイマスのライブでは1公演でUO140万本、約1億3千万円分が消費されている。

まぁ箱はもう少し安い箱を買うし、全員が全員折る訳でもないし、キャパも機材等々あるので多少減るので、この数字はざっくり。
しかし数字にしてみるとすごいな……
この数字、去年の24時間テレビの番組内での募金額とほぼ同程度みたい。

1本折る度に100円徴収すれば、3時間ちょっとで24時間TVを超えられる。強い。

以上。

デレステのアタポンイベント計算機を作った

TL;DR

デレステもなんやかんやリリース日から始め、約2年半の月日が経って正直イベントも担当かよほど絵が刺さらないと上位報酬まで走らない程度にモチベは下がっている。
どのmasterでも死ななくなって周回が作業化し、段々と面倒くさくなってきている。
だからこそ、「あと何回プレイすれば目標ポイントに到達するのか」があるといいなぁと。
という訳で作ってみた。
https://y-osaru.github.io/atapon/atapon_calc.html

※ペライチのhtmlというロックな作り。
※一応、アタポン計算機はいくつかあるけれど、何か自分で作った方が入力内容とか決められるし良いなって。
他の人も作りたくなった用に自分が使った計算式を共有する。
(間違ってたら教えて下さい。でも強い言葉で言われると泣きます。)

0.まず前提

この計算機で最低限求める物は

  • 通常楽曲のプレイ回数
  • イベント楽曲のプレイ回数
  • 総ポイント数
  • 総アイテム数

とする。
また、スタミナ19/スコアS前提にして、PLvは気にしない。

1.計算式

先ずはダダダッと変数定義
目標ポイント数:P_{goal}
通常楽曲1回のポイント数:P_{normal}
通常楽曲1回のアイテム数:I_{normal}
イベント楽曲1回のポイント数:P_{event}
イベント楽曲1回の消費アイテム数:I_{event}
現在のポイント数:P_{now}
現在のアイテム数:I_{now}
1回のログインボーナス:L
残り日数:D
通常楽曲プレイ回数:C_{normal}
イベント楽曲プレイ回数:C_{event}
総ポイント数:P_{total}
総アイテム数:I_{total}
余りアイテム数:I_{rest}

次にP_{goal}を求める式をうにうに考えると以下の様になる。
 P_{goal} = P_{normal} \times C_{normal} + P_{event} \times C_{event} + P_{now}

C_{normal}C_{event}の関係は以下の通りなので
C_{event} = \frac{I_{normal} \times C_{normal} + L \times D + I_{now}}{I_{event}}

これをP_{goal}の式に当てはめると
P_{goal} = P_{normal} \times C_{normal} + P_{event} \times (\frac{I_{normal} \times C_{normal} + L \times D + I_{now}}{I_{event}}) + P_{now}

これをC_{normal}について解くと、以下のようになる。結構美しい感じの式。

C_{normal} = \frac{I_{event} \times (P_{goal} - P_{now}) - P_{event} \times (L \times D + I_{now})}{P_{normal} \times I_{event} + P_{event} \times C_{normal}}

これが求まれば、先程のC_{event}の式に当てはめれば良い。

P_{total}I_{rest}
P_{total} = P_{normal} \times C_{normal} + P_{event} \times C_{event} + P_{now}
I_{total} = I_{normal} \times C_{normal} + L \times D + I_{now}
I_{rest} = I_{total} - I_{event} \times C_{event}

になる。これで計算式は出来た。

2.実は……

さっきの計算式で完璧。実装すればOK……ではない。
実際はC_{normal}C_{event}は少数になるので、整数にすると\lfloor C_{normal} \rfloor\lfloor C_{event}\rfloorになる。
この値で計算すると、当然P_{goal}P_{total}が超えられない事がある。

その為、計算機では以下の様な形で調整を行う事にした。

もしP_{goal} > P_{total}ならば、P_{goal} \leq P_{total}になるまで以下を繰り返す
I_{rest} < 150
→ 通常楽曲1回プレイ
150 \leq I_{rest} < 300
→ イベント楽曲等倍1回プレイ
300 \leq I_{rest} < 600
→ イベント楽曲2倍1回プレイ
600 \leq I_{rest}
→ イベント楽曲4倍1回プレイ

3.プログラムに……

コードはここに。
github.com


以上。

LTする時に考える事

最近アイマス界隈のイベント等でLTする事があった。

過去、技術営業的な事や、展示会でアテンドしてたりもしたので、正直上手くは無いけどそこまで下手じゃないと思ってる。
そんな自分がLTする時に気をつけてる事、考えてる事を書く。

続きを読む