2018年3月24日土曜日

フラクタルジェネレータ「Chaotica」がヤバい!

前回のアブストラクト・アートのススメでアブストラクト絵への熱が炎上してまいりました。
ここでは激ヤバアブストラクト(フラクタル)ジェネレータ「Chaotica」の使い方を、色々ベタベタ触って掴んだところから解説してみる回になります。

思ったより日本語解説が少ないようなので、アブストラクトの布教ついでにこのソフトも広まってほしいナァと思っています。
クリエイティブな遊び道具としても優秀ですよ。

Chaoticaとは

Chaotica(かおてぃか)とは
「初心者でもプロでも使えるよう設計されている、次世代のフラクタルアートアプリケーション」
「初心者はランダムなフラクタルを作って高画質な壁紙やアニメーションを楽しむことができます」
「プロの人は特にこの速いレンダリングエンジンに驚くでしょう。高品質なアニメーションや印刷向けの巨大な画像を簡単に制作でき、このリアルタイムで操作する感覚はあなたのワークフローを劇的に加速させます」
だそうです。(chaoticafractals.comよりガバ訳)

まずランダムに生成される絵がすごく多様で何度も再生成を押したくなる!!(単に僕がランダム好きなせいでもあるけど)
多様に無限に出てくるランダム絵で初心者を掴んでおきながら、難しすぎないUI、いじるとすぐ適用される速さ、小数第10位くらいまで打てるパラメータの細かさなどが「自分で生成してみたい」という想像力を引き立てる手引きをしっかり行ってくれています。 それくらい使いやすいです。まさに次世代のアプリケーション。

実際に僕はChaotica触ってから半年経ってないのにこの惹かれようなので、好きになる人は本当に好きになると思います。

ダウンロードはhttps://www.chaoticafractals.com/downloadより、手持ちのOSに合わせてダウンロードします。なんとWinとMacとLinuxの三種の神器に対応!!!!!!!!!!!
ちなみにフリー版で作った絵は商用不可ですので「こいつ...出来る!」と思ったらHDかStudioを購入しましょう。

インストール

Linux版しか使ってないのでとりあえずそれだけ。WinとMacの人はごめんね。
Linuxの場合インストール作業は要りません。
  1. ダウンロードする
  2. デスクトップやホームなど好きなところに解凍
  3. 端末から $ cd /(解凍した場所)/ で移動
  4. ./chaotica で実行すると起動

まずはランダムを楽しもう

起動直後の画面はおおむねこんな感じ。(ちょっと見やすいように並べ替えてるかも)

いきなり出てくる [Parameter browser] というウィンドウで、ランダムに抽出されるフラクタルを選んで生成することができる! なんとパラメータをいじることなくフラクタルの完成!
無限に違うパターンが出てくるので個人的に飽きない!

このウィンドウ内に好きなのがない...という人は、左下側の [New random worlds] を押すとリストを更新できます。
Number の数を増やすとリストに表示されるパターンが増えます。
Min iteratorsMax iterators は、とりあえず数値を増やすとパターンがフンワリしたものになり、減らすと癖の強いパキッとしたものばかりになります。iteratorの詳細は後々。

[Palette] ボタンを押すと、気に入ったパターンの色だけを変えたものがリストされます。Color nodesの数値は増えるほどカラフルにゴチャゴチャになると思います。

[Transforms] を押すと、色をそのままに形だけ変えたパターンをリストします。
[Shaders] はPaletteボタンと似て色パターンをリストします。こっちのほうがスタイル良くカラフルかも。
[Selectors] はよく分かんないです...。形は変わらないのですが、暗くて隠れていた線が浮き彫りになったりするので押してみる価値はあります。

色を好きなように変えてみる

色変更はペイントソフトを扱ったことがある人はかなりピンと来やすいと思います。こちらは扱ったことのない人向けなので、分かる人は飛ばしてもだい...いや大丈夫じゃないかも...。
勝手にウィンドウ並べ替えられてるけどこっちのほうがやりやすいのでこの状態で進めます
ランダムで出たこのカッコイ〜感じのをサンプルにしていきます。
上のメニューのWindowから、Palette editorを押して曲線と虹の載ってるウィンドウを出します。

上の段Hueは色相といって、赤とか青とかを変更します。
真ん中のSaturationは鮮やかさを変更します。下げると白や灰色になります。
下のValueは明度です。下げるほど暗くなり、上げると鮮やかに光ります。
一番下のPreviewは、そのポジションの色が今どういう色になっているのかを示しています。 色変更の適用は若干時間がかかる反面、このプレビューはリアルタイムなので、こちらを見ながら変えるとスムーズです。

左クリック(ドラッグ)でマーカーを編集し、右でエディタの中を移動できます。

試しに赤みのある配色から青みのある配色にしてみます。

Hueの左側にあった大きな山をひとつ下げて潰しました。 プレビューの赤いグラデーション部分が青くなり、適用された画像も青くなっています。

二枚目はValueのへこんで暗くしていた部分を引き上げて明るくしてみました。 全体的に白くなってしまいましたね。

カーブをいじったことのない人には非直感的かもしれませんが、慣れると自然な配色からドキツい配色まで自在になるので何とかコツを掴みます。

ちなみに白を使いたい時はValueを上げてSaturationを下げる必要があります。

どこがどの色を表しているのか?

プレビューは虹色なのになぜ生成される画像は虹色にならないのか。 ポイントはここ。
この△、iterator(イテレータ)というパラメータのカタマリが持つ色のポイントみたいなのを表しています。
イテレータについては後述しますが、簡単に言うと「Aを作るパーツ」「Aを曲げるパーツ」など、組み合わさった図形に見えて実は色々分断されているんですね。
その個々のパーツが、それぞれに色を持てるというわけなのです。

試しにこの4番目の△付近の色を真っ赤に変えてみます。

ちょっっっと分かりにくいけど、曲線のしっぽが赤くなりました。

先ほどアクセントの色を赤から青に変えた時も、いじったのは△の近くでしたので、色を変える時はこの△の近くを狙っていきます。



かなりギザギザにすると局所的に色を変えることができたりできなかったりします。

背景色を変えたい場合は真ん中の一直線になってるカーブ下のBackground colourで、RGB値で指定します。
全部ゼロで黒、全部1で白です。

△の位置は変えられないの?

変えられるけど後述です。 そこだけ読みたい人はブラウザの検索機能で「Palette location」を探してください。

無から形を作る

フラクタルやアブストラクトはそもそも現実の物を表現する用途には基本的に向かないので、明確に「火を作りたい」とか「水を表現したい」とかはコツを掴まないと難しいようです。
まあ適当にやっても許されるのがアブストラクトなので、適当に何かを作ってみます。

メニューの File から New empty world を選択して無の世界を出します。
さっきいじったPalette editorが残りっぱなしでしたが、ここで主に使うのはこの図にあるWorld editor、Node editor、World nodesの3つです。

要約

ざっくり言うと
  1. New iteratorを押してイテレータを作る
  2. イテレータ内にtransformを作ってバリエーションを選択
  3. バリエーションの数値をいじる
  4. Post affineを追加して場所を移動させる(任意)
の繰り返しです。 イテレータをいくつも配置することで絵が作れます。
ちなみにランダム生成のサンプルとして出した図形は4つのイテレータで出来ているので、これを4回繰り返すだけでいいんですね。

World editorの中の、[New iterator] を押します。 これがちょっと先述した「パーツ」ことイテレータになります。
でもWorld editorに赤い矢印が出来ただけで特に何も起きません。

が、World nodesのリストにIterator1というのが出来ています。 ここのツリーを開いていって、Transformを選択します。

選択した状態で、World editor内の [New transform] を押すと、リスト内のツリーがもうひとつ開けるようになります。





そのツリーを開いて、New variationという項目を選択すると、Node editor内がこんなメニューになります。
これがイテレータにとって大事なやつです。

Transform typeの選択ボックスを押すと色んな名前が並んで出てきます。これを組み合わせて絵を作っていきます。

適当に選んでもいいのですが、何も表示されないバリエーションもあるので「pie」を選んで進めようと思います。

花みたいな図形が出てきました。
Node editor内で、バリエーションの選択の下にpie_rotation、pie_slices、pie_thicknessなど、パラメータを指定できるボックスが増えましたね。

これはpie専用の設定で、それぞれ角度、花びらの数、花びらの太さを設定できます。

好きなように入れてiterator1の設定は終わり!
このようにイテレータを作って、transformを追加して、typeを変更して、数値をいじって、の繰り返しをするだけです。


pieのイテレータをそのままに、新規作成したイテレータに「julia」というバリエーションをつけて置いてみます。
pieの特徴を残しつつ、juliaバリエーションの変形を適用させることができました。

World editor内の矢印を、場所を移動させたり曲げたりすると適用される形も変わってきますので、なんか良さげになるまでいじります。 pieなどの変化が起きないバリエーションもあるので注意。

Post affineの話

紫のiteratorにを追加してEiバリエーションを入れました。曲線がオシャレ〜
あと色は見やすいように変えただけなのでイテレータの操作で変わったわけではありません
要約で任意と言いましたが、必要になる人は必要になってきます。
Post affineとは見た感じで言うと位置や全体的な大きさを変更するパラメータのことです。デフォルトや未設置の状態だと殆どのパーツがド真ん中に集結します。 これはこれで良いのですが、いじることでつけられる個性もすごくあるので損はありませんよ。

ノードツリー内のflam3 transformと書かれているところを選択すると、Node editorのメニューに [Add post affine] [Remove post affine] などのボタンが出ます。これのAddのほうを押すとPost affineを設置できます。
こちらは1つのイテレータにつき1つしか設置できません。

設置すると、World editorの中にそのイテレータに応じた色の点線状の矢印が出てきます。これを通常の矢印と同じようにいじり回すことで、イテレータそのものの位置を変えることができます。

redイテレータ(赤矢印のやつ)のPost affineを大きくして右に寄せて傾けてみました。
中央に寄っていたpieの花が少し散らばったようです。

violetイテレータが作っていた曲線模様の位置が気に入らなかったので、ここにPost affineを追加して位置を修正します。なんかイイ感じ。





Palette locationの話


ブラウザの検索機能で飛んできましたか?そうじゃない?
作ったイテレータ達に個別の色をつけてあげたいのですが、これだけグチャグチャに色設定してあるにも関わらずみんな同じ色です。

最初に説明した色設定のところにある通り、このカーブ下についている小さな△がポイントです。
△がひとつしかないということは、全てのイテレータが同じ地点(Location)の色を取得しているのです。 これを変更するとカラフルに作れます。

全てのイテレータのツリーの中に、Shaderという項目がついていると思います(今はpieのShaderを選択)。 これを選択するとNode editor内にPalette locationという数値入力ボックスが出ます。
最初は0.0になっていますので、ここに1以内の数値...適当に0.2を入力します。
ひとつだけカーブ下の△が移動しました! そしてpieの花の色が紫になっています。

violetイテレータのPalette locationを0.6に変更。 これで3つのイテレータ全てが異なる色を取得するようになりました。
元から色カーブをかなりいじっているので程よくカラフルになっています。

これでイテレータの作成から配置、配色すべてが完了!

レンダリングの下準備

これで制作は完了ですが、画像として生成するのにはもうひと手間が必要です。
Chaoticaの公式説明にあるとおり壁紙を作って楽しむこともできるので、作りたい画像に向けて微調整を行います。 これによって作ったイテレータが崩れることはないので安心してね。

Render settings

これは究極に面倒くさかったらそのまんまでもいいと思います。

Render settings内で、WidthHeightをピクセル数で指定します。これは生成される画像の横幅と縦幅に相当します。 スマホ向けなら縦長に、デスクトップ向けなら横長にするといいんじゃないでしょうか。
フリーやHD版ではサイズに制限がついていまして、フリーでは1.23mpix(1108四方)までが限界です。 Twitterのヘッダー画像(1500x500)は作れます。

Lock aspect ratioにチェックを入れると縦横比を固定します。 たとえばWidthに40、Heightに30と入れてからチェックをすると、どんなに拡張しても4:3の比率を維持し続けます。

Save alphaをチェックすると、黒や白にしていた背景を透過にします。 これと好みの背景(グラデーションとか)とを組み合わせたい!という人向けですが、目に見えてる状態で生成されるとは限らないので注意です。

AA levelはよく分かんないです。2のままでいいと思います。
Ultra qualityはなんか強そうなチェック項目ですが体感としてはあんまり...。ハイクオリティを目指したい人は入れよう。

Anti-aliasing modeは画像のボケ具合が変わります。お好みでどうぞ。

カメラの位置を変える

せっかく色編集を終えたばかりのところをイテレータ編集に戻して申し訳ないんですが、最終的にやることがもうひとつあります。
デスクトップ向けに壁紙を作る場合、作ったイテレータを右に寄せて左側を地味にすると置いたデスクトップアイコンが見えやすくなると思います。そういうことをやります。 単純なのでパパッとできますよ。
World editor内にある [Toggle camera transform] を押すと、白い矢印がイテレータと同じように登場します。

動画編集のように、イテレータの位置ではなくカメラの位置を変えることで全体の位置を調整します。
回転させて角度を変えることもできますし、矢印の長さを変えてズームインアウトすると思わぬ景色が現れたりします。
イテレータと違って全体が歪むので両軸同じ長さで90度を保ったほうがいいと思います。
とりあえずこれで完了! 納得行くまで適当に移動させて回してズームするだけです。
Node editorに矢印の状態(長さや角度)を入れるボックスがあるので、ここにマイナスを挿入すると左右反転や上下反転を実現できます(ここでは入れていません)。

レンダリング

Chaoticaを含むフラクタルジェネレータは全て計算のみで絵を生成するので、計算が終わって絵が出来上がるまでを待つ必要があります。 でないと計算が粗くて画質の悪い絵が出てくるからです。

新規作成した時からパソコンが唸りをあげてフル稼働しているのではないでしょうか? 実はパラメータを変更するたびにChaoticaは画像の計算をゼロからやり直してしまいます。
なのでパラメータの変更をせずに待っていれば計算中の画像をより綺麗に計算し続けてくれるので、もう色もカメラもサイズも大丈夫かなってなったらそのまま放置しましょう。

ちなみにこれが作ってすぐの状態。

グラデーションになっている部分が微妙にブツブツザラザラして見えます。これがどんどん消えていくんです。

レンダリング時間やサンプリングレベル(画像の綺麗さ?)はこのウィンドウの下部に出ているので、これも生成の目安になります。

一時間近くレンダリングさせ続けたやつ。

サンプリングレベルは12以上だとそれなりに綺麗に見えると思います。

もういいかなって思ったらCtrl+Shift+Sで画像として保存します。
パラメータなどをchaos形式で保存する場合はCtrl+Sで。

ちなみにこのウィンドウ右にあるボックスは全体の色味調整のためのもので、もし一部を光らせたいとか全体的に赤みをかけたいとかあったらここをいじります。

完成!

めちゃめちゃ壁紙っぽい!

この回で作ったChaoticaのデータも一応置いておきます: http://0xconfig.net/stock/chaotica24_tutorial.chaos
改変などはご自由にどうぞ。



追記(180530) 
Render settings内の Stopping SL にチェックを入れると、ボックスに入ってる数値のサンプリングレベルに到達後に自動で計算を停止するようになります。 過度なレンダリングや負荷を避けたいという時に使えます。

0 件のコメント:

コメントを投稿