p5.jsで加算ブレンド

p5.jsでは、blendMode関数を指定することで簡単に加算合成ができます。

OpenSiv3DでNatureOfCodeのRepellerを実装してみました。

書籍NatureOfCodeで、パーティクルシステムや重力加速度などを学んで、いちから実装できるようになったので、いつも使っているp5.jsではなく、気になっていたC++のOpenSiv3Dで実装してみました。C++はstd::vectorや値渡し時のコピーコンストラクタの動作などを学びながらなので、いろいろ修正する箇所は多いですが、まずは動かせたので良かったです。

ソースコード

 

VSCodeでVisualStudio2017のcl.exeを使う場合、VsDevCmd.batとVSCMD_START_DIRに注意

Visual Studio 2017では、コマンドプロンプトでcl.exeなどの開発ツールを呼び出す方法がVsDevCmd.batに変わりました。このバッチファイルは初期設定でディレクトリー移動をしてしまうので、現在のディレクトリーから移動したくない場合は、環境変数VSCMD_START_DIRを使います。

set “VSCMD_START_DIR=%CD%”

https://developercommunity.visualstudio.com/content/problem/26780/vsdevcmdbat-changes-the-current-working-directory.html

環境構築

vscodeをインストール後、拡張機能cpptoolsをインストールします。https://code.visualstudio.com/docs/languages/cpp などを参考に、c_cpp_properties.jsonとtasks.jsonを.vscodeディレクトリーに用意します。以下build.batは、プロジェクトのルートディレクトリーに配置します。c_cpp_properties.jsonは自動生成です。

build.bat

.vscode/tasks.json

tasks.jsonは、”command”をbuild.batに書き直してそれ以外は、デフォルトのままです。argsは使ってません。

vscodeの設定ファイルは、.vscode内、build.batはルートディレクトリー

これで、Ctrl+Shift+Bで、コンパイルできるようになります。

まとめ

ひとまず、VisualStudio2017がインストールされた環境で、vscodeでもC/C++プロジェクトを開発できるようにしました。また、この設定により、Ctrl+Shift+Bでビルドできるようになりました。ただし現時点では、かなり手順が必要で面倒です。cl.exeにこだわる必要がない場合は、Bash on Windowsか、単純にエディターとコマンドプロンプトでもよさそうです。

 

p5.jsで絵文字(emoji)を表示するのは簡単

p5.jsはブラウザーベースなので、絵文字をコピーして文字としてそのまま表示できます。絵文字が使えると、単純な文字を表示するだけでも楽しくなるのでよいですね。

 

p5.jsでMatrix Sequencer(マトリックスシーケンサー)を作ってみました。

マトリックスシーケンサーは、五音音階(ペンタトニックスケール)で適当に音を鳴らしても不協和音にならずに良い感じのちょっとした曲が作れます。tonematrixというFlashのアプリがありますが、このような見た目と綺麗な音ができれば理想ですが、ひとまずは、マトリックスシーケンサーとして動作するようにしました。

http://tonematrix.audiotool.com/

p5.jsを使うと、セルを用意するのと、音を出す部分は数個のAPIを呼び出すだけなので、ソースコードもかなりすっきりしていて120行ぐらいです。マトリックスシーケンサーが作れると、これを応用してリズムマシンや音ゲーを作れそうです。

ソースコード

https://github.com/dev001hajipro/matrix_sequencer

デモ

https://dev001hajipro.github.io/matrix_sequencer/