成果物 www.youtube.com レイトレーシングなどに比べてシンプルで高速に銀の球体が表示できています。これで、猫の瞳の光沢を表現する手段が切り開かれました。光沢を持つ物体の表現にもこれからチャレンジしていきたいです。 仕組み 画面上の位置から、球に…

成果物 www.youtube.com ※ここでの鏡面は平行投影で背景を反射する鏡面を指しています。 MatCapのような仕組みを使えば鏡面を高速に計算できるのではということで実装してみました。角度を渡すだけで反射光を返してくれるので、面白いゆがみ方をした鏡面も作…

成果物 www.youtube.com 入力したのはとげとげの多角形なのに、こんなにも曲線的なVoronoi図ができて驚きました。恐らく、頂点と、辺の二等分線が曲線になるためだと思われます。あらゆる線も入力できるので応用が期待できそうです。 仕組み 多角形の最も近…

成果物 www.youtube.com 当分前に作った流体シュミレーションのプログラムを使って、画像を変形させてみました。最近は大した成長がないので、頑張っていきたいです。 仕組み 流体シュミレーションの速度成分に沿って、Mesh Deformationを使って、画像を変形…

成果物 www.youtube.com 前回書いた猫の目を、こっちを見続けるようにしてみました。こっち見んなモーフの正式名称はHollow Mask Illusionみたいです、科学館にも置いているようなものです。 仕組み 実際の凹凸を反転させると、常にこちらを見続けるように見…

成果物 www.youtube.com 重力でひかれあう物体は独特の動きをして面白いのでアニメーションを作ってみました。 仕組み 万有引力に沿って引合せ、衝突したら小さい方を削除し、速度、質量を引き継ぐ仕組みにしています。 コード Merge by Gravityという名前で…

成果物 Processingで処理する方が便利なので、愚直にUDPでぶっ飛ばしております(笑)ちなみに今回は、ジェスチャーセンサーのカラーセンサーを使っています。意外ときれいな模様が撮れて満足です。カメラをつかえばいいことに気が付いたのはだいぶ後でした() …

成果物 今回は、ねこを描くという本を読んで猫の目を描いてみました。デジタルで描いても良かったのですが、目が非常に疲れていたので、鉛筆で描かせていただきました。非常にリアルなのですが、実際に書き始めた時、写真と非常に違和感を感じました。しかし…

成果物 www.youtube.com 以前3000ピースほどのナイアガラの滝を作ったことがあり、Unityでもっとすごいものを作りたいと思ってやってみました。しかし、Unityにすると今度は物理演算の精度の問題があり、3000ピースも積むことができませんでした。いつかリア…

成果物 www.youtube.com 音があるとさらにいいと思いますが、今回は、断念しました。リアルのドミノも昔結構やっていたので、時間があったらまたやってみたいです。 コード Image Dominoというシーンを開いてください。 github.com

成果物 AviUtlでもよく使われる極座標変換を実装してみました。本家に忠実に、画像の中心が円の中心になり、画像の高さが円の半径になるようにしました。 仕組み 画像のUV(0極座標変換後の角度を求め、それに従って、Mesh Deformationを使って変形しています…

成果物 小学生の時、あと何秒で学校が終わるかよく計算していたので、p5.jsでも実装してみました。目標の日時までの差、残りの、時間or分or秒を表示してくれます。正月に限らずカレンダーマークから任意の日付を選択できます。 仕組み 現在時刻と目標の時間…

成果物 色相はループしているので、オフセットしていったら面白いのではないかということで作ってみました。なかなか予想外の動き方でした。恐らく多くの画像編集ソフトにも搭載されている機能だと思います。 仕組み 各画素で、色相、彩度、明度を取得し、色…

成果物 www.youtube.com 画像を明るくしたり、暗くしたりするときに使う、ガンマ値を実装してみました。特徴をとらえたまま、明るさを変更できるので非常に便利です。ガンマ値を高くしたかえる仙人も渋くて面白いです。 ちなみにHSBでガンマ値を変えるとこん…

成果物 www.youtube.com ※これは、Processingで動物を描くための試作です。怪しいものではございません。 今回は、マウスを見つめる目を作ってみました。目の形を変えればもう少しかわいくなるはずなのですが、技術的に難しく、恐ろしい仕上がりになりました…

成果物 ソーシャルディスタンスを保つために、林へと進化しました。あつまれ ※実在する企業、商品とは関係ありません。 こうしてみると、それぞれの作品の癖がものすごく感じられます。ちなみに、今回は、逆三角形の文字配置にしてみました。下にカメの肖像…

成果物 赤外線フォトリフレクタを使ったテルミンが多いのですが、超音波距離距離センサーを使うと距離に比例する音程が出せるかなと思って作ってみました。ちなみに、本物は電磁波を使っているようです。 非常に恐縮なのですが、音声はGithubに保管させてい…

成果物 www.youtube.com 物凄く今更な感じですが、ネタが切れてきたのでメビウスの帯を作ることにしました。 コード Mobius Bandという名前で追加しています。 github.com

成果物 ※そもそも、ヒエログリフにはないアルファベットがあり、そうした文字は無理やり置き換えられています。特にxは2文字で近似されていましたが、こちらの都合で置き換えています。 こちらのサイトのヒエログリフ変換を参考にしました。 日本語/英語から…

成果物 今回は、気軽に利用できるようにしたかったので、久々にp5.jsを使ってみました。任意の文字数だけずらしたシーザー暗号が作れるようにしました。 参考 シーザー暗号 - Wikipedia コード editor.p5js.org

成果物 www.youtube.com ダイヤモンドのように数字を並べて、正方形からはみ出た部分を押し込んでいくように魔法陣を作るのがバシェー方式（Bachet's Method）です。奇数×奇数の魔法陣を簡単に作ることができます。今回は、数字に従って色を割り当て、どのよ…

成果物 今回は、ハムスターを描いてみました。今回は、ラフを3回も描いて、きれいな輪郭を目指しました。今回は、普段と違ってアンビエントオクルージョン的なシェーディングにしてみました。ふわふわでマットな質感が上手に再現できた気がします。今回は、…

成果物 www.youtube.com 円弧を使って、サイバー風の時計を作ってみました。実際の時計の動きに近くなるように工夫しました。文字盤の線のデザインで苦戦しました。 仕組み そのまま、minute()をもとに分針を表示すると、非常にかくかくした、違和感のある動…

成果物 凄く今更な感じがしますが、Quicksortを実装してみました。sortのアニメーションは出尽くしているので、作りませんでした。開始位置と終了位置が指定できるので、便利です。 仕組み 少し難しいのでWikipediaの解説を見ることをお勧めします。コードも…

成果物 Goldが… 絵文字に！$(*´▽｀*)$ 思ったより簡単に作成することができました。他にも面白い拡張機能が思いついたら作ってみようと思います。 仕組み ページを構成するテキストを.replaceで置き換えています。 こちらのサイトをもとにして作成しています…

成果物 www.youtube.com ます、図を構成するPolygonから、グラフを作成します。頂点がリンクされているので、A Starアルゴリズムなどが簡単に適用できます。実際の血管も細胞を避けてなるべく最短で通るはずなので、実際の血管とかなり近い構造になっている…

成果物 www.youtube.com 思ったいたものとは違いましたが、これはこれでありかもしれません。 小さいサイズではよりきれいなものが出来たのですが、フルスクリーンに拡大するときに上手くいきませんでした。 仕組み 前回作ったPerlin CurveをPerlinノイズに…

成果物 www.youtube.com 今回は、zのオフセットを変えた2つのパーリンノイズの差の絶対値を表示してみました。どうしても色が薄くなるので、適切に乗算しています。いつもよりPerlinノイズの変化がはっきり読み取れるのは、絶対値表示にした事が原因かもしれ…

成果物 吸い込まれていくようなタイピング www.youtube.com 今回は、Scaleを使ったタイピングまとめです。吸い込まれていくタイピングは偶然できてしまったのですが、本作より出来がいいかもしれません。 回転するようなタイピング www.youtube.com シンプル…

成果物 www.youtube.com Box2Dを使って打った文字が落下し積み重なっていくようにしました。 仕組み Box2DのBoxesのサンプルをもとにしています。まず、落下防止の床を作成します。文字が打たれるたびに、箱を生成し、箱の座標に合わせて文字を動かしていま…