2024-06-01 色で遊ぶ

土曜日。7:00起床。睡眠時間はまだ曖昧なままだが、とりあえず早起きは出来ているのでまあいい。日報を書き始めたせいか、昨日までとは少し気分も変わり、インプット業務にも少しメリハリが出てきた。ただ、朝に予定したスケジュールとはまだほど遠い。

起きて、たまっていたメールを片付けて、Three.jsのモックに取り掛かる。ポストプロセッシングの仕様に慣れてきたので、単一のシェーダーをあれこれとかけてその効果を確かめる。全部で10ぐらいは作っただろうか。いつの間にか昼になり、夕方近くになり。たった1点のサンプルコードを書くだけでも5時間、6時間とかかってしまう骨の折れる作業だった。
完全にBlenderの学習をやる時間を失ってしまう。

ささっと昼食をとって、次は昨日から始めたp5.jsを今日も触った。
とりあえずp5.jsは大元にp5というクラスが存在し、そのクラスに用意された静的メンバーやp5インスタンスを通してすべての機能の実行や描画を行う。ライブラリのように機能ごとのクラスが用意されているわけではないので、なかなか取っ掛かりの部分が難しい。
とりあえず今日は色周りの使い方を学ぶサンプルを作成した。

用意されているサンプルコードを見て、写経コーディングをしながら、このメソッドはこういう意味、このイベントリスナーはどのイベントを拾っている等を学んでいくのが楽しい。上のサンプルはコンテンツ上のマウス位置からカラーチャートの分割数を確定し、そのrowとcolumn数に沿って、各セルの色の色相と彩度を計算して描画するというものだが、そもそもやった事のないアプローチでなかなか面白い。これをパーティクルでやったらまた面白いだろうなと容易に想像できる。

こちらはランダムに左右両端の色を決め、その間をp5.jsに用意されているカラーモードごとの計算メソッドを使って補間させるというサンプル。マウス位置で分割数を決めて、分割数が多ければ滑らかなグラデーションになるというもの。かなり複雑でイメージがつき辛いアプローチだが、p5.jsだと10行程度のコードで実現できる。しかも動作がメチャクチャ軽くて驚く。

こんな事をやっている間にもう寝る時間になる。ポートフォリオの制作は進まなかったが、とりあえず1日、クリエイティブな気分は維持出来た。ちゃんと納得いく1日になったのはいつぶりだろう。明日もいい1日になったらいいな。

未来のファンファーレ この手で鳴らせ
夢が私を掴んで離さない
(ももいろクローバーZ 『追憶のファンファーレ』より)

2024-06-02 いよいよ玉井詩織スペシャルウィーク

日曜日。8:30起床。短時間の睡眠ながらも、仮眠は控えることが出来たのでそれなりに充実した1日。
今日は午前中から「ももいろインフラーZ」の放送があって、「玉井詩織 colorS リリースパーティー」も含めて、ももクロのラジオが4番組もあって、ライブこそないが、まさに『ももクロデー』といった雰囲気。明日のソロアルバムのフラゲ日に備えて少し気分が上がって嬉しかった。

インフラーZを見終わり、Three.jsのシェーダーの学習を続ける。今日はボカシ効果を加えるシェーダーをいろいろと試して、あとはブリーチバイパスフィルターのような全体の画作りを作るようなシェーダーも試した。
相変わらず、Three.jsのシェーダーの仕様がなかなかハマらず、時間がたくさんかかる。

おそらく、自分がまだ用語を知らないだけなので、やっているうちに徐々にスピードアップするんじゃないかと思っているんだが、文献がほとんど英語なので、どれだけ日本人のWeb開発でthree.jsが使われていないかを物語っている。一応、ビジネスチャンスだと捉えよう。

ある程度、シェーダーを使ってくると、これMatterportのSceneにもかけられるのかな?とかアイディアが浮かんでくる。来週中にはThree.jsの学習を一旦終えて、モックアップを作っていく予定なので、そこで試すアイディアをリスト化していかないと。

ラジオを聴きながらあれこれしている内に、やっぱりブレワイをやりたくなってくる。ゼルダというコンテンツとその世界に浸る時間が面白すぎるのだという当たり前の事に気が付き、もしかするともっと落としたゲームならすぐに飽きて仕事に戻れるのでは?と、今日はブレワイは控えて「ペルソナ5」をやり始めた。そしたら案の定、2時間程度で飽きてきた。やっぱりそうか。

来週は玉井詩織スペシャルウィークで毎日が忙しい。明日はアルバムのフラゲ日だし、5日からはソロコン遠征。帰ってきたらリリースイベントで早朝から川崎だ。今日のうちに早寝早起きを心がけて、さっさと寝る事にする。

2024-06-03 今年も黄色に華やぐ

月曜日。6:00起床。とりあえず3日坊主は過ぎた。
午後は詩織ちゃんのソロアルバム「colorS」を新宿に引き取りに行くため、しっかりと計画を立てて1日を過ごす。朝はまずThree.jsのシェーダーの学習を進められるところまで進めた。とりあえずオリジナルのシェーダーの作り方、またシェーダーに利用する言語を学んだが、GLSLという言語仕様に基づいて、JavaScriptでGLSLの仕様で解釈させるため決まったプロパティとメソッドを用意したクラスとして実装すること。GLSL自体はC言語ベースの言語であり、その理解が必要な事が分かった。

とりあえずこれだけわかれば触りは出来る。今日は3Dの描画データをテクスチャの元にして、簡単なグレースケール変換を加えられるシェーダーを作成した。しかしこれだけでも1時間2時間とかかる。とても何かを試すという段階にまでいけないため、今後のThree.jsコンテンツの制作の柱としてシェーダー開発を入れる事にした。
モックアップを作っていく段階において、自分らしさ、自分が出来る事を専門化するのは重要だ。Three.jsを触っていてなんとなく可能性を感じるところとして、
1. シェーダーを利用して高度なグラフィックアニメーションが展開するWebサイト
2. Blenderで作成したモデルを利用した質のある世界観の中でVR的体験が得られるWebコンテンツ
といったところが今後10年で高めていく目標だろうと思う。まずはシェーダー開発とBlenderか。

午後から仕事はお休みして、渋谷でお昼ごはん。昨日から食べたかったとんかつをツキウマまで出向いて食べる。相変わらず安くて美味しい。今日はホタテクリームコロッケも一緒に頼んでしまった。
腹を満たして、次は新宿のタワーレコードに行き、予約していたアルバムを受け取る。特典で付いてきた「No Music, No Idol」のタワレコポスターがとてもいい。

帰りに中目黒の駅で黄色の花で構成したフラワーブーケがあったので、それも買ってきてアトリエに飾った。華やかな今年の玉井詩織生誕祭にベストマッチ。これだけで心もずいぶん華やぐ。

明日から詩織ちゃんの誕生日休暇になるので、遠征から帰ってくるまでは一旦、仕事はストップしよう。帰ってきたら気分を充実したところでポートフォリオサイトの制作に入る。調べたこと、学んだ事が生かされたサイトになるといいな。まずはコンテンツを考えなきゃな。
夜、「泣くな向日葵」のライブ映像が公開。ももクロチーム一丸となって祝う準備が整った。