WebでProcessingしよう - HasCanvas

前の記事で紹介したTweetPosterでは、ツイート画面の背景に、Twitterのブランドを意識した画像を配置している。まあ、そんな凝った絵ではなく、水色の空に雲がもくもくと漂う感じの、簡単な絵だ。

こんな感じの絵を作るにはProcessingを使うのがいい。ついでに、久しぶりにJavaScriptバージョンのProcessingであるところのProcessing.jsをチェックしてみようかな……と思って色々調べていたところ、HasCanvasなる派生プロジェクトを見つけた。

HasCanvasはProcessing.jsを使って実装された、ウェブベースのプログラミング・プラットフォームだ。ウェブ上でProcessingのスケッチを書き、リアルタイムに動作を確認することができる。完成したスケッチは、その場で即シェアすることもできる。

Processing.jsにはいくつかの制約があって、オリジナルのProcessingほど凝ったことができるわけではないのだけれど、簡単なスケッチを書いて人に見せるという目的においては、これはとても便利なプラットフォームだ。

今回作成したスケッチはhascanvas.com/CloudySkyに置いてある。今度ヒマがあったら、これにアニメーションを付けてみよう。