ギンの備忘録

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

GENUARY2022へ参加した話（p5.jsの作品振り返り）

p5.js 作品

f:id:gin_graphic:20220131215129p:plain:w400

目次

はじめに

GENUARY2022は1月のひと月の間に、毎日出されるお題に対して作品を作るコーディングチャレンジです。 この記事ではGENUARY2022へ投稿した作品を一つ一つの振り返りと全体を通うじての感想を書いていきます。

GENUARY2022に参加して、31日中26日作品を投稿しました。
その作品のツイートが↓になります。
from:@gin_graphic #GENUARY2022 - Twitter Search

Day1

220101a - OpenProcessing

GENUARY2022の雰囲気がわからない状態での最初の作品。
難しいことをせず、三角形を10000個並べました。

Day2

220102a - OpenProcessing

昨年10月ごろにディザリングは挑戦していました。
更に同じ頃に作っていた和柄のタイルと組み合わせれば面白いかなという発想で作りました。

Day3

220103a - OpenProcessing

GENUARY2022に参加するのに難しい技術は必要ないよねというメッセージを込めて、あえてテキストのみシンプルなものを作ってみました。
ちょっと攻めたかなとも思ったけど、意外にもいいねを多くもらえて嬉しかった。

Day4

220104a - OpenProcessing

Tyler HobbsさんのFidenzaという作品シリーズの次の次というお題。
Fidenzaは以前から憧れていた作品で昨年の11月頃のこれとか、 Fidenzaを参考にさせてもらっていました。

今回はFidenzaに近づけつつ、影をつけたり、好きな色を使ったりして作りました。
見てくれた方の反応がとても良かった記憶があります。

Day5

220105a - OpenProcessing

以前作ったこれがお題に近かったので、その派生作品。

Day6

休み

Day7

休み

Day8

220108f - OpenProcessing

シンプルにsin関数のカーブ。
複数のnoiseの入った線で、一つのカーブを作るというアイディアです。

Day9

ここで急にBlenderにチャレンジ。純粋にBlenderに興味のあった時期でした。
夕焼けのビル群をイメージして作りました。ガラスマテリアルが綺麗だったので、それを使ってみたくて取り入れてます。

Day10

休み

Day11

前に作った作品のアルゴリズムを自分の手で再現してみました。
縦、横、斜めに順番に線をランダムな長さで書いていく様なルールです。

はじめて手書きのジェネラティブアートを作成して、とても刺激的で楽しかった。
ルールさえ作ってしまえば、紙とペンでもジェネラティブアートを描けるんですよね。

Day12

220112b - OpenProcessing

パッキングはこれまでやったことがなかったので、調べねがら自分なりに作りました。
円を使うだけでは物足りなかったので、多角形を重ねたものを使いました。

選んだ色が綺麗だからか、反応が良かったです。

Day13

前日のパッキングで作ったものをサイズを変え、多角形を回転させてみました。

Day14

220114a - OpenProcessing

作ったこのないものを作るということで、Matter.jsを使ってみることにしました。
Matter.jsが物理演算をしてくれるライブラリで、図形が落下して重なるのをシミュレーションしてみた作品です。

Day15

220115a - OpenProcessing

前日に引き続き、Matter.jsを用いて砂の落下をシミュレーション。
透明の板を真ん中に置いていて、そこに砂が溜まってから再度落ちるというアイディアです。

Day16

220116b - OpenProcessing

色のグラデーションに失敗するということで、真ん中のほんの少しの幅だけグラデーションになってしまったという作品。
ちょっと伝わりづらかったかなとも思いましたが、まぁそれも込みで。

Day17

220117a - OpenProcessing

三色というお題で、おもしろい事できないかなと考えた末、だんご三兄弟が思いつきました。
インスパイアされ、団子三色兄弟というダジャレっぽいところから発想を膨らましてみました。

Day18

220118a - OpenProcessing

団子三色兄弟を一回で終わらせるのがもったいなかったので、それを動画にしてみました。
VHSっぽさは下を応用してみました。

gin-graphic.hatenablog.com

Day19

テキストを使えということで、団子三色兄弟でテキスト使っていたので。

deconbatchさんに背中を押され（これとこれ）、
この後、団子三色兄弟の作品で多数のGENUARY2022のお題に参加するきっかけとなりました。

Day20

220120a - OpenProcessing

団子三色兄弟で海を作りました。
波打つ動きはsin関数とnoise関数で作ってます。

Day21

220121a - OpenProcessing

これまでの作品を組み合わせるお題。Day14とDay17で、Matter.jsと団子三色兄弟の組み合わせ。

Day22

220122b - OpenProcessing

一年後に違って見えるものということで、Javascriptの日付取得を使ってみました。
ついでに、コードをテキストとして表示するという遊びも入れてみた。

Day23

220123a - OpenProcessing

抽象的な草木をイメージして、緑色の団子三色兄弟をランダムに配置。

Day24

220124a - OpenProcessing

疑似乱数を自分で作るという、かなりプログラミング寄りのお題。
調べながら初めて疑似乱数を作ってみました。
見た目は中々ランダムになっているので良かった。たまにはこういう視点も面白い。

Day25

休み

Day26

休み

Day27

220127a - OpenProcessing

5色のカラーコードが指定されているので、それを使った団子三色兄弟。
背景と文字色とかを含めて5色使えました。

Day28

セルフポートレートということで、自分をスマホで写真撮って、読み込んで遊びました。
去年の5月に作ったやつを参考にして、グラデーションの線を使ってます。

GENUARY2022に投稿した中で一番いいねしてもらえました。なんでだろう、元の素材が良いからですか？

Day29

220129a - OpenProcessing

等角図がお題だったので、平面上の円を等角図でみた場合を描画して、そこに顔を描きました。
我ながら変な発想で作ったと思う。面白いから良いのだけども。

Day30

220130a - OpenProcessing

「Designing Math.」を買ったので、 それを参考に、生物っぽさを出してみました。
白い四角形の中に塗りつぶした四角形を描いたところがポイント。

Day31

220131a - OpenProcessing

シンプルに反転した団子三色兄弟でネガティブスペースを表現。

おわりに

一ヶ月間ほぼ毎日のようにお題に沿った作品を作るのは初めての経験でした。
自分以外の人が決めたお題を膨らますのは、楽しい時間でもあり、同時に苦戦したりもして大変さもありました。
アイディアを膨らます良い訓練にもなった気がします。

続けている内に、見た人がどう思うのかなとか、この作品の意味伝わるかなとか、いつの間にか考えるようになっていました。
自分以外の参加者の方々を意識した作品作りができるようになったのは、とても大きな変化でした。
関わった人がみんな楽しめていたら良いですね。

もちろん、他の人が同じお題で作った作品を毎日見るのもとても楽しかったです。
人それぞれの個性が見えたり、自分じゃ作れないものや想像できない作品に刺激をもらっていました。
一方的に参加していた方々との共有体験みたいなものを感じています。

GENUARY2022はこれで終わりです。ちょっと寂しいですが、やっと終わった安堵感もあります。 GENUARY2022のような他の人と歩幅を合わせる作品作りは貴重な体験でした。 自分自身の日々の作品作りは遊びの延長なので、マイペースにこれからも続けていきたいと思います。