bufferでシーンチェンジエフェクト

はじめに

この記事はHSP (Hot Soup Processor)でバッファを使うときに知ったことの覚え書きです。
最初に、私が大学の課題として作成したものをおいておきます。

Phantomizer (Short ver.) MV - Kuyuri Iroha

Source code: https://t.co/fSVw8RXGPO
niconico: https://t.co/6KeiYHx7pg
YouTube: https://t.co/wa6LOjUI4j#HSP #EP演習 #creativecoding

— いろはクユリ (@kuyuri_iroha) 2018年6月11日

（ソースコードをコピペしても必要ファイルがかなり多いため動きません。ご了承ください。 ） 今回はこのプログラムで使ったHSPのバッファについて、使っていて気がついたことを書いてゆきます。 # HSPのバッファって何？ そもそもHSPのバッファとはなんなのでしょうか。今回の記事で扱うバッファとは `buffer ウインドウID, 幅, 高さ` の命令で呼び出すものを指します。私は特に専門的な人でもないので、私の持っているイメージを軽く説明します。 [](https://gyazo.com/20801f71e3427e2f48e9d191a38caba4)

画像のように、レイヤーのと似た役割をしてくれて、加算 減算などの合成もできます。一般的にバッファというとデータの一時的な保存領域の総称で、頂点バッファ、深度バッファなどがありますが、HSPでは仮想ウインドウ（カラーバッファのように使えるもの）のことを"バッファ"と呼んで使うようです。

シーンチェンジエフェクト

私のプログラムでは白と黒しか使わない関係上、減算して色を反転させるなどの処理はしていましたが、加算、乗算等の合成はあまりしていません。
一番バッファの恩恵が得られたのは、動画の0:43からのサビのシーンチェンジです。これはスクリーンいっぱいのバッファを細切りにして、時間をずらして移動させているだけですが、これを応用するとGlitchのようなエフェクトもかけられます。
横方向へスライドしてシーンが変わる部分の実装は下記のようになっており、縦方向も同様の処理をして実装しています。

effect.hsp

setease 0.0, 1280, ease_quartic_out
divNum = 50
repeat divNum
    ease = geteasef(double(frame) - 2962.0 - (double(cnt) / 5.0), 20)
    gmode 0, 1280, 720 / divNum, 255
    pos ease, 720 / divNum * cnt
    gcopy 5, 0, 720 / divNum * cnt
loop

イージングを使って動かしていますが、基本的には

1. gmodeで スクリーンの縦 / 分割数 の幅を指定。
2. posを使って座標を指定。
3. gcopyでウインドウID 5 のバッファの指定した座標と同じ位置から指定した大きさの部分を現在の描画バッファに書き込む。

という内容の処理を分割数分repeatすることで実現できます。

参考

http://masudahp.web.fc2.com/hsp3/kiso/hspk022.html -HSP3.0-ウィンドウと画像表示
-> buffer 周りの基本的な使い方がサンプル付きで記されています。
https://twitter.com/motions_work/status/858335224626790400 -「HSP Twister」 (by @FMS_Cat )
-> Catさんのこの作品を見て、HSPでバッファが使えることを知りました。めちゃくちゃかっこいいです。