bubble_visual_various

NCCの春合宿でやってたやーつ 2016/03/31

何で作ったか

春合宿でIDE作るという設定？だったけどIDEを作る過程がいまいちわからなかったので、
時間もなかったしでとりあえず「IDEに触れる」の重視でJSかじり始めてたからということで「p5js」で何か作った。
最初はソート何種類か作ろうとしたけれども時間内にできそうになかったから、ビジュアルをいろいろ工夫してみる方向で頑張ってみた。
ちなみに使ったソートはバブルソート。

使い方

半角で1～5のボタン押してビジュアルのモード変えられる

デザイン

その1:ノーマルに棒グラフ

その2:棒グラフの配置を円にした

その3:バブルソートだけに泡っぽくした

(ちなみに値マックスに到達したときとソート完了したときに弾けてる)
(あと、泡っぽくx座標はちょっぴりランダムにしてちょぴりずらしてる)

その4:棒グラフのトップの部分に文字おいてる感じ？

その5:文字の大きさを値次第にして位置は均等に並べてる

(文字は簡単に出来るけどなんとなく面白くなるから一回やってみたかった)

最後に

p5jsがProcessingとJSのいいとこどりと言われたけれども…
自分まだJSかじりたてでJSの良さまでまだわかってなかった状態なので
ぶっちゃけこれProcessingでも出来るな…で終わってしまった。
とりあえずHTMLとCSSの勉強します。
ソートのデザインはもう少し時間かけてもっといろいろ作りたかったからまた今度やろうかと…。