micro:bitとProcessingでSerial通信して可視化する

はじめに

バイト先のプログラミング教室でmicro:bitを少し触り、楽しかったので色々試しています．
フィジカルコンピューティング系はやっぱり可視化したくなっちゃうのでProcessingとSerial通信してみました．

今回はmicro:bitに可変抵抗を繋いで，読み取った値をProcessingに送り，円の大きさを変える，ということをやります．

[追記:2021/04/03]
こちらの方法でもSerial通信出来ますので、使いやすい方をお試し下さい。
micro:bitの加速度をProcessingへ送り可視化する

また、この記事ではmicrobitからProcessingへ数値を送信していますが、反対にProcessingからmicrobitへ値を送りたい場合はこちらの記事を参考にしてみて下さい。
micro:bitとProcessingでメディアアート入門

micro:bit

micro:bitの「高度なブロック」の中に「シリアル通信」のブロックがあるのでそれを使います．

Processing

import processing.serial.*;
Serial microbit;

float val = 0;

void setup() {
  size(640, 480);
  String portName = Serial.list()[1];
  println(portName);
  microbit = new Serial(this, portName, 115200);
  microbit.clear();
  microbit.bufferUntil(10);
}

void draw() {
  background(0);
  ellipse(width/2, height/2, val, val);
}

void serialEvent(Serial microbit) {
  String str = microbit.readStringUntil('\n');
  str = trim(str);
  println(str);
  int sensors[] = int(split(str, ' '));
  println("sensors[0], "+ sensors[0]);
  val = map(sensors[0], 0, 1023, 0, 500);
}

配線

配線にワニ口-オスピンの自作ジャンプワイヤーを使いましたが，micro:bitの変換基盤も売っているので，それ使うとやりやすいと思います．

実行結果

つまみをグリグリやると円の大きさが変わります．

最後に

今回は簡単にSerial通信を試しましたが，色々と使えそうな気がしました．
通信の速度は通常で115200になっているみたいです．

冒頭でも書きましたがこちらの記事も参考にしてみて下さい。
micro:bitの加速度をProcessingへ送り可視化する
micro:bitとProcessingでメディアアート入門