マガジンのカバー画像

Processing Tips & HowTo

27
本
Processing でのプログラミングに役立つ Tips やハウツーをご紹介。
運営しているクリエイター
deconbatch

#ジェネラティブ

Twitter 無限ループアニメーションの作り方

Twitter にアップされた無限ループ動画、ついつい見ちゃいますよね。 無限ループ動画といえば GIF 形式の動画が有名ですが、Twitter の場合 GIF ループ動画でなくともループさせることができます。 今回は GIF ループを使わない方法でやってみましょう。 どうやってループさせる？Twitter の FAQ に『Twitterに投稿された6.5秒以下の動画はすべて自動的にループ再生されます』とあります。 つまり、何も考えずに 6.5秒以下の動画を作ってアップ

deconbatch

グローバル変数を使わずにアニメーション：Processing Tips

グローバル変数はバグの元、明日の自分に優しくない。 できることなら使わずに済ませたい。 でも、Processing でアニメーションを作りたいとき、どうしましょう？ Processing でアニメーションする場合の定石Processing でアニメーションさせる場合、よくある構成はこんな感じです。 float グローバル変数; setup() {    グローバル変数 = random(100); } draw() {    グローバル変数の値によって描画するロジック

deconbatch

センス不要！色使いのコツ：Processing Tips

色使いのキレイなジェネレーティブアートって素敵ですよね。思わず見とれちゃいます。 私は作品作りするときに、どういう色を使ったら良いのか正直さっぱりわかりません。 いわゆるセンスが無いってやつです。 こういう「さっぱりわからない時」は理論に頼ります。 HSB を使えば大丈夫？Processing で作品作りをする際、RGB より HSB モードの方が使いやすいというお話を以前いたしました。 HSB を使えば角度＝色なので、角度を少し変えれば自然で微妙な色の変化を得られま

deconbatch

カラフルな作品作りは難しい？ 簡単便利な色指定方法 HSB のススメ : Processing Tips

私は Processing での作品作り、最初のころは白黒だけで作っていました。 その後だんだん慣れて灰色の濃淡を付けられるようになりましたが、カラフルな作品を作るのは難しいと感じて、なかなか手を出せずにいました。 そんな時に出会ったのが HSB。 『彼（HSB）と出会って私の日常は一変したの…』 このノートは、私と HSB の出会いの物語です。 Processing 標準の色指定方法Processing では 2種類の色指定方法（カラーモード）があります。 一つ

deconbatch

Processing でのデバッグ。バグが無いことに意味なんてあるのかな？

ポロロン♪ というわけで、みなさん楽しくデバッグしていますか？ このノートではプログラミング的なデバッグではなく、クリエイティブコーディング的に「正しく動く」とはどういうことかを考えてみます。 println() や Processing 3.0 系から標準装備されたデバッガを使ってのデバッグ手法は解説いたしません。 プログラミング的なデバッグについてはこちらのノートをご覧ください。 クリエイティブコーディング（Creative coding）において「正しく動く」と

deconbatch

Processing でのデバッグ。標準デバッガの使い方

プログラミングにデバッグは付きもの。 みなさんは Processing でのデバッグどうされてますか？ 変数値や条件分岐のちょっとした確認なら println() を入れるのも手軽にできて有効な方法です。 いまあるコードに手を入れたくないなという場合は Processing 3.0 系から標準装備されたデバッガを使うのもいいですね。 このノートでは、Processing 3.0 系の標準デバッガの使い方の簡単な説明をいたします。 デバッガとは？そもそもデバッガとは、以下

deconbatch

丸と四角の位置合わせ : Processing Tips

円（ellipse()）を使って作品を作っているときに、これを四角形（rect()）に変えたらどうなるだろう？ と試したくなることありませんか？ 私は常に試してみてます。 試した結果大して変わんない、つまんなくなることも多いのですが、驚くほど印象が変わることもあります。 そんな時に意識したいのが図形描画の位置基準です。 円と四角形の位置ズレ何も指定しないと、ellipse() の場合は円の中心が基準、rect() の場合は四角形の左上が基準となります。 同じ位置にそれ

deconbatch

Processing でアニメーション・動画を作成する簡単な手順：Processing How To

Processing をやり始めると、一度やってみたくなるのがアニメーション・動画の作成。 自分の作成した絵を動かしてみたい！ ですよね？ このノートでは、Processing を使ってパラパラ漫画方式でアニメーション・動画を作成する手順を解説いたします。 流れとしては以下です。 1.パラパラ漫画の全コマ（フレーム）の静止画を作成 2.作成したコマ（フレーム）を動画に変換 パラパラ漫画を作ったことのある方ならお分かりかと思いますが、対象を少しずつ動かした静止画を沢山作

deconbatch

map() を活用して作品作りを楽に：Processing Tips

このノートでは、Processing Tips の小ネタ、 ・ある範囲の値が欲しいとき計算を楽にしてくれる map() ・map() で指定した範囲ってはみ出すことないの？ の2本立てをお送りします。 map() で書けば簡単！コードもわかりやすい！ ある範囲のランダム値、たとえば 0 から 360 のランダム値とかが欲しいときってありますよね？ そんなとき、ランダム値なら val = random(360); ノイズ値なら val = noise(x) * 360;

deconbatch

アニメーション中の時間を自在にあやつろう！ タイミング編 : Processing Tips

Processing をやっていると、静止画だけでなくアニメーション（動画）にも挑戦したくなってきます。 このノートでは、アニメーションの中のあるタイミングで何かしたい、ある時間周期で何かしたいという場合の Tips を紹介します。 但し！ この方法は deconbatch の我流 Tips です。 他にもっといい方法があるかもしれませんので、その点ご了承ください。 いい方法見つけたら私にも教えてくださいね♥ まずは fps って何？ ： Processing でアニメー

deconbatch

ぼんやり光る効果を出す簡単な方法 その2 : Processing Tips

発光効果を得るためには blendMode(SCREEN) が必要ですということを、前回の「ぼんやり光る効果を出す簡単な方法 その1」でやりました。 今回は、単純なのっぺりした円じゃなくて、光り輝くリングを描く例を使って、Processing で超かんたんに発光効果を出す方法を解説します。 但し！ この方法は deconbatch の我流 Tips です。 他にもっといい方法があるかもしれません。 いい方法見つけたらぜひ私にも教えてくださいね♥ この記事は全文無料でお読

¥100
deconbatch

ぼんやり光る効果を出す簡単な方法 その1 : Processing Tips

発光効果、グロウ(glow)効果。 電球や星、ホタルなど、それ自体が光っているような効果を出したいことってありますよね？ このノートでは、Processing で超かんたんに発光効果を出す方法を解説します。 但し！ この方法は deconbatch の我流 Tips です。 他にもっといい方法があるかもしれません(きっとある)ので、その点ご了承ください。 いい方法見つけたら私にも教えてくださいね♥ この記事は全文無料でお読みいただけます。もしお気に召しましたら投げ銭お願

¥100
deconbatch