暴カワで ビデオシンセサイザーを 導入する技術 yuchi 2024/10/18 ビジュアル演出概論 #001

自己紹介 yuchi / Naoki Katahira ソフトウェアエンジニア(SRE) 主にECサイト構築サービスのインフラを見ている 趣味で様々なことをしている Link: yuchi.io Twitter(現X): @F_YUUCHI

様々な趣味 ● ハードウェア設計(自作キーボード等) ● VJ ● DJ ● 配信(の機材)

VJ 配信DJイベント”The NAYA”を主催しているパイクサイスというチームでVJを やったりしている 個人宅の納屋にLEDテープを数百メートル施工し、業務用プロジェクターを入 れて演出を行っている

No content

No content

本題

暴カワでビデオシンセサイザーを導入した話 暴カワとは ● 正式名:暴力的にカワイイ というイベント ● 去年と今年はお台場で野外音楽フェスとして開催 ● 昨年は4000人の来場者数 ビデオシンセサイザーとは ● 音に合わせて映像を出してくれる装置(ざっくり) ● あまり機種は多くない

暴カワでビデオシンセサイザーを導入した話 ● LanPageさんで使用したビデオシンセのプリセット作成をした ● DJブースから gaburyuさんが操作をして映像を作っている ○ ジェネ系VJをDJの人にやってもらった

暴カワでビデオシンセサイザーを導入した話 ● 具体的には写真の青い背景の箇所に出ているオブジェクトの映像

https://x.com/YACAINDAHOUSE/status/1843241756093276351/

使用したビデオシンセサイザー Critter & Guitari社のEYESYという機種 ● それぞれの映像モードを元に、音声入力、5つのノブ、1つのトリガーで映 像を作ることができる ● 中身はRaspberry Pi Compute Module 3(組み込み版ラズパイ) ● 出す映像のカスタマイズが可能でオリジナルの映像モードを作成可能 https://www.critterandguitari.com/eyesy

https://www.youtube.com/watch?v=xIxchxVhVI0

使用したビデオシンセサイザー ● Python2+pygameを使用してEYESYの映像生成機能が動いている ● Pythonでオリジナルのモードを作成できる ● マニュアルにも”5. EYESY のプログラミング ”として簡単な関数やAPIの 例が載っている ○ https://umbrella-company.jp/manuals/critter_and_guitari_eyesy_manual.pdf https://www.critterandguitari.com/eyesy

ライブ使用しにくい問題点 ● 問題点: HDMI出力がMASTERの1本しかない ○ OSD(= On Screen Display)画面と呼ばれている機能でタイトル や、入力音量、現在の設定などを表示できる ○ これらはMASTER出力に表示される ● 音量ゲインが映像の動きと直結しているため、入力音量のメーターの確認 /調整が必須 →ライブ本番中に設定を確認しようとすると会場のLEDディスプレイにも出てし まう

https://www.critterandguitari.com/manual?m=EYESY_Manual

今回の演出は EYESYの映像の上にフレームを重ねる表現をすることに なった →OSD画面を隠すスペースができる！！！

No content

No content

No content

結構はみ出てる

クロップする？

いいえ

OSD画面のカスタマイズ EYESYはモデル以外もシステムレベルでカスタマイズ可能&オープンソースで 公開されている https://github.com/critterandguitari/EYESY_OS ● engines/python/osd.py にOSDの設定がpygameで書かれている ○ すべてカスタマイズ可能

例:音量メーター # input level pygame.draw.rect(screen, etc.BLACK, (20, 205, 220, 30)) mode_str = " Input Level:" text = font.render(mode_str, True, etc.WHITE, etc.BLACK) text_rect = text.get_rect() text_rect.x = 20 text_rect.centery = 220 screen.blit(text, text_rect) draw_vu_480(screen, etc, 115, 210) 1行目で背景の黒い長方形の 描画処理が書かれている ● pygame.draw.rect: pygame を使って長方形を描画 ● etc.BLACK: 色は黒 ● 20: 左(x:0)からx:20 ● 205: 上(y:0)からy:205 ● 220: 長方形の幅x(px) ● 30: 長方形の高さy(px)

No content

No content

うまく隠れた

例:音量メーター # input level pygame.draw.rect(screen, etc.BLACK, (400, 20, 220, 30)) mode_str = " Input Level:" text = font.render(mode_str, True, etc.WHITE, etc.BLACK) text_rect = text.get_rect() text_rect.x = 400 text_rect.centery = 35 screen.blit(text, text_rect) draw_vu_480(screen, etc, 490, 25) 素朴に座標をずらす ● pygame.draw.rect: pygame を使って長方形を描画 ● etc.BLACK: 色は黒 ● 400: 左(x:0)からx:400 ● 20: 上(y:0)からy:20 ● 220: 長方形の幅x(px) ● 30: 長方形の高さy(px)

OSD画面のカスタマイズ もっとカスタマイズすれば、VUメーター以外を消したり、サイズを小さくしたり、 VUメーターのデザインも変えられる ● 今回のように、上からフレームを被せない場合も、極力目立たないようなデザイン にカスタマイズ可能 ○ 今回は開発時間の制約上座標を移動させるに留めました ● かなりライブユースなビデオシンセにできる

今回作成したモードについて LanPage 3名それぞれのイメージカラーや新曲の歌詞から着想を得て、1か ら作成したり、既存モデルのカスタマイズを行ったりしました

まとめと感想 ● 一癖あるビデオシンセだったが、カスタマイズによってライ ブで十分使えるレベルに出来ることが分かった ● オープンソース & システムレベルでカスタマイズできるの は最高 ● ビデオシンセ(EYESY)を少しでもライブで使いたいと思った 人に参考になれば幸いです

ご清聴ありがとうございました