ギンの備忘録

デジタルアートやプログラミングやテクノロジー関連のこと。

2020-01-01から1年間の記事一覧

p5.jsで正多角形を描く方法

p5.jsで正多角形を描画する関数を作成していきます。 自分でShapeを作るにはbeginShape()とvertex()とendShape()を使えば自作図形を描くことができます。 正多角形 正多角形(外周) 描画例 参考文献 正多角形 正多角形は一つの円周上に等しい角度間隔で点を…

p5.jsでのシェーダー(GLSL)入門(4)図形を変形する

前回までフラグメントシェーダーを中心に、p5.js で書いた図形の描画を変化させてきました。 gin-graphic.hatenablog.com 今回は頂点シェーダー(バーテックスシェーダー)を利用して、図形の位置や形を変えてみます。 GLSLで図形の変形 図形の移動 図形の拡…

p5.jsでネオンモーション

p5.jsでネオンモーションを作りました。 かなり良い出来。 ずっと見てられる。 www.youtube.com

p5.jsでのシェーダー(GLSL)入門(3)シェーダーの描画を動かす

前回までは静止した描画を行ってきました。 gin-graphic.hatenablog.com 今回はp5.jsから変数を渡すことで、動的にGLSLでの描画を変化させ、動画を作りたいと思います。 シェーダー描画を動かす まとめ 参考文献 p5.jsでのシェーダー(GLSL)入門 シェーダー…

p5.jsでのシェーダー(GLSL)入門(2)図形にシェーダーを適用

前回はp5.jsからシェーダーを呼び出して、画面全体にGLSLで描画を行いました。 gin-graphic.hatenablog.com 今回はシェーダーの適応範囲を変え、p5.jsで描画した図形を対象にしていきます。 シェーダーを図形に適用 図形を一色で塗りつぶす 図形内にGLSLで描…

数学から創るジェネラティブアート - Processingで学ぶかたちのデザインを購入

「数学から創るジェネラティブアート - Processingで学ぶかたちのデザイン」という参考書を購入しました。 数学から創るジェネラティブアート ―Processingで学ぶかたちのデザイン作者:巴山 竜来発売日: 2019/04/17メディア: Kindle版 数学と芸術のつながりに…

p5.jsでのシェーダー(GLSL)入門(1)描画してみる

この記事はp5.jsは知っている、使ったことがあるけど、シェーダーとかGLSLは扱ったことがないという人に向けて書いていきます。 p5.jsを知らないという方は、調べてみて下さい。 p5.jsはクリエイティブ・コーディング用のJavaScriptライブラリで、様々なコン…

モチベーションが下がりつつある

自分の性格的にわかっているが、段々クリエイティブコーディングに対してモチベーションが下がりつつある。 理由はわかっている。 別の趣味に興味が移っている。(カメラ熱が出てる) 趣味の中でもローテーションみたいなものがあるんですよね。 3,4個の趣…

自作PC構成メモ(2020)

9月中頃にデスクトップPCがなくなりました。 gin-graphic.hatenablog.com そんなわけでデスクトップPCを組み替えました。 グラフィックボードとSSD,HDDは今まで使っていたものをそのまま流用。 新規購入したのはCPU、マザーボード、メモリ、電源、ケースです…

p5.jsのP2DとWebGLの透過度による描写の違い

p5.jsのP2DとWebGLの透過度によって描写が異なっている様な気がします。 ブラウザ上では違いが分からないのですが、画像として保存した時に差異が顕在化しました。 比較のために半透明の四角形を明度、彩度を変えて描写したものを見てみましょう。 保存形式…

「岸辺露伴は動かない」がドラマ化らしいのでp5.jsで作品をつくる

露伴先生のイメージをp5.jsで形にしました。 ヘアバンドとピアス。 ジョジョの奇妙な冒険第4部のスピンオフである、岸辺露伴は動かないがドラマ化されるみたいですね。 ドラマは12月28~30日午後10時に3夜連続で放送ということで、年末楽しみです。 ドラマ「…

最近p5.jsで作った動画作品201008

ここ最近p5.jsで作った作品たち。 ジェネラティブアートというかクリエイティブコーディングという部類に当てはまる。 特に動画を作るのが面白い。 作品の中でカラフルな色使いをするのが好きみたい。 はじめはモノクロのジェネラティブアートとかを作ってみ…

No.002-Processingアート

モノクロと赤緑青で作って見てるけど、その内面倒になるかも

No.001-Processingアート

Processingで作った作品 正確にはp5jsですが No.001

デスクトップパソコンが壊れた

一昨日のこと、デスクトップのパソコンが壊れました。 この一、二ヶ月の間電源スイッチが不調でした。 押したときに戻らない。押し込んだままになることがたまにありました。 良くないと思いながらも、面倒で放置していたところ、一昨日も同じように電源スイ…

4章-円を描く間違った方法「ジェネラティブ・アートーProcessingによる実践ガイド」

「ジェネラティブ・アートーProcessingによる実践ガイド」の4章「円を描く間違った方法」を実践しました。 三角関数を用いて円を描くところから始まり、ノイズを加えた円描きます。 最後には線分を用いて中心、半径、回転角にノイズを加えて描く「Wave Clock…

3章-線を引く間違った方法「ジェネラティブ・アートーProcessingによる実践ガイド」

「ジェネラティブ・アートーProcessingによる実践ガイド」の3章「線を引く間違った方法」を実践しました。 直線を引くところから始まり、何種類かノイズを扱い、ノイズを加えた線を描きます。 参考書の図3.1~図3.11までを手元で再現した結果になります。 表…

ジェネラティブ・アート―Processingによる実践ガイドを購入

先日、「[普及版]ジェネラティブ・アート―Processingによる実践ガイド」というProcessingの参考書を購入しました。 Processingというのは電子アートとビジュアルデザインのためのプログラミング言語です。 数年前に出会って存在は認識しており、軽く触ってみ…

プロフィール

本ブログは管理者であるギンによるブログです。 クリエイティブ・コーディング ジェネラティブアート デジタルアート このあたりに関する記事を書いていく予定です。 簡単に自己紹介 名前:ギン 仕事:エンジニア 趣味でクリエイティブ・コーディングに取り…