🍄

粘菌の一生のシミュレーション

に公開
Zenn CLI
WebGL
Three.js
Jules
idea

Julesはすごい

https://jules.google.com/

  • julesは簡単に言えば「プロンプトを入力しただけで、動くプログラムを作成、テスト、GitHubにデプロイ」してくれる、完全自立型エージェントです。
    また、対話形式でペアプログラミングすることもできるし、仕様変更などにも柔軟に対処してくれます。
    既存のコードのデバックにも力を発揮します。
    ただ、今は利用者が多いからか、処理速度が遅くなることがありますね。
    このプログラムは、Javascriptとgitの10から15年前の知識しかない筆者が、julesを用いてあっというまに完成させたものです。
    わからないところは、すべてCopilotに尋ねて修正しました。
    このような時代になった、という事に非常に驚きを感じた次第です。

  • 良い点
    コードを書く必要はありません。作る人はプロンプトを作るだけです。
    修正を指示しても、変更内容を事前に確認してくる。
    GitHubを利用するので、コード管理が非常に楽である

  • 悪い点
    利用人数が多いためか、非常に処理が重くなる場合がある。本格的に使う場合は、有料プランに入るのが良い（それだけの価値はある、と思います）
    生成されたコードを理解し、修正を加える時に分からなくなることがある（当たり前です）
    デバッグは思わぬ副作用を生むことがあります。

粘菌の一生をシミュレーションした

mountain

方針

  • 粘菌の一生は以下のように進む

🧬 粘菌の生活環（例：キイロタマホコリカビ Dictyostelium discoideum）

  1. 胞子の発芽
    胞子が発芽すると、アメーバ状の単細胞が出現します。
    この細胞は土壌中のバクテリアなどを餌にして増殖します。
  2. 集合（飢餓状態）
    餌が枯渇すると、約10万個のアメーバが cAMP(サイクリックAMP) という化学物質の波に誘導されて集合します。
    集合した細胞は融合せず、 ナメクジ状の移動体（slug） を形成します。
  3. 分化と移動
    移動体の前方1/3は柄細胞に、後方2/3は胞子細胞に分化する運命を持ちます。
    この移動体は光や乾燥などの刺激に応じて移動を止め、次の段階へ進みます。
  4. 子実体の形成
    柄細胞が死んで構造体を支え、胞子細胞が胞子塊を形成します。
    これが最終形態である 子実体（fruiting body） です。
  5. 胞子の散布と再発芽
  • 子実体から胞子が放出され、適切な環境下で再び発芽してアメーバ状細胞となり、サイクルが繰り返されます。
  • この一連の過程は、条件が整えば約24時間で完了することもあります。

これをシミュレートするにあたり、５部分に生活環を分割する

  1. 菌の広がり
  2. アメーバの出現
  3. キノコのような子実体を形成
  4. 胞子を放出
  5. 再び菌の広がり

粘菌のえさは、バクテリア

🦠 粘菌が食べる主なバクテリアのタイプ
1.グラム陰性菌
例：Escherichia coli（大腸菌）、Pseudomonas属
粘菌はこれらを好んで捕食する傾向があります。
特に研究室での培養実験では、E. coliがよく使われます。
2. グラム陽性菌
例：Bacillus属、Streptomyces属
土壌中に多く存在し、粘菌の餌となることがあります。
3. 放線菌（Actinomycetes）
腐葉土や朽木に多く、粘菌が分解・吸収する対象になります。
4. その他の微生物

大腸菌を食べてくれるありがたい菌である

これらの情報を元に、Google Julesに作成を依頼

  • Three.jsを使う

以下のプロンプトを入力

WebGLを使用し、粘菌の一生を描くアプリケーションを作ります。 
Three.jsをCDNから使用します。 
胞子>ワーム>アメーバ>子実体>胞子をループします。 
地面にグリッドを表示します。

SlimeMoldCycle Document

  • シミュレーションを管理するクラスは以下のように作ってもらいました

SlimeMoldCycle クラス ドキュメント

このドキュメントは、nenkin.js内に存在するSlimeMoldCycleクラスについて詳細に解説します。このクラスは、シミュレーションにおける一体の粘菌のライフサイクル全体を管理します。

クラス概要

SlimeMoldCycleクラスは、一体の粘菌インスタンスの状態と挙動をカプセル化します。一連のフェーズを通じてアニメーションを制御し、成長、変態、繁殖の連続的なループを創り出します。

プロパティ

プロパティ 型 説明
scene THREE.Scene 粘菌のオブジェクトが追加されるThree.jsのシーン。
basePos THREE.Vector3 ライフサイクルが展開される地面上の基準位置。
color number この粘菌インスタンスの基準色。
phase number ライフサイクルの現在のフェーズ（0から3）。
phaseTime number 現在のフェーズが開始してからの経過時間。アニメーションのタイミング制御に使用。
WORM_SEGMENTS number ワーム形態を構成する球体の数。
wormHeadPos THREE.Vector3 ワームの頭部の現在の3D座標。
wormPath Array<THREE.Vector3> ワームの頭部が通過した最近の経路を保存する配列。体の描画に使用。
wormSpheres Array<THREE.Mesh> ワームの体を形成する球体メッシュの配列。
spores Array<Object> 胞子を表現するオブジェクトの配列。各胞子はメッシュ、位置、進行方向を持つ。
mushroomCap THREE.Mesh キノコの傘のメッシュ。
mushroomStem THREE.Mesh キノコの柄のメッシュ。
myceliumLines Array<Object> 成長する菌糸ネットワークを表現するオブジェクトの配列。
amoeba THREE.Mesh 集合および変態フェーズで使用される中心的な球体メッシュ。

ライフサイクルのフェーズ

ライフサイクルはphaseプロパティによって制御され、0 -> 1 -> 2 -> 3 -> 0のループで進行します。

  • フェーズ0: 菌糸の広がり (_animatePhase0_MyceliumGrowth)
    • 地面からシリンダーが出現し、外側に向かって広がり、菌糸ネットワークをシミュレートします。
    • フェーズ1に遷移します。
  • フェーズ1: 菌糸の集合 (_animatePhase1_MyceliumGather)
    • 菌糸が中心に向かって収縮します。
    • 菌糸が後退するにつれて、中心にアメーバ状の球体が出現し成長します。
    • フェーズ2に遷移します。
  • フェーズ2: ワームとキノコの発生 (_animatePhase2_WormAndMushroom)
    • アメーバはワーム状の生物に変態し、周囲を動き回ります。
    • ワームは再び中心に集まり、キノコの形に変態（モーフ）します。
    • フェーズ3に遷移します。
  • フェーズ3: 胞子の拡散 (_animatePhase3_SporeRelease)
    • 生成されたキノコが胞子を放出し、胞子はゆっくりと落下します。
    • 胞子が着地すると、新しい菌糸が初期化されます。
    • フェーズ0に戻り、サイクルが再開されます。

メソッド

constructor(scene, basePos, color)

  • 説明: SlimeMoldCycleの新しいインスタンスを初期化します。
  • パラメータ:
    • scene: シミュレーション用のTHREE.Scene。
    • basePos: このインスタンスの基準位置となるTHREE.Vector3。
    • color: このインスタンスの16進数カラーコード。
  • 詳細: すべての初期プロパティを設定し、開始フェーズ用の菌糸データを生成し、_initObjects()を呼び出して必要なThree.jsメッシュを作成します。また、初期状態のアメーバが非表示であることを保証します。

_initObjects()

  • 説明: シミュレーションに必要な初期THREE.Meshオブジェクト（アメーバやワームの球体）を作成するためのプライベートなヘルパーメソッドです。これらのオブジェクトは、しばしば異なるフェーズ間で再利用されます。

dispose()

  • 説明: シーンからすべてのメッシュを削除し、それらのジオメトリとマテリアルを破棄することでリソースを解放します。これは、シミュレーションからサイクルが削除された場合にメモリリークを防ぐために重要です。

animate(t, dt)

  • 説明: メインのSimulationクラスから毎フレーム呼び出される、主要なアニメーションの入り口です。
  • パラメータ:
    • t: シミュレーションの総経過時間。
    • dt: 前のフレームからの経過時間（デルタタイム）。
  • 詳細: phaseTimeをインクリメントし、現在のphaseに応じたswitch文を使用して、ライフサイクルの現在のステージに適したアニメーションメソッドを呼び出します。

アニメーションメソッド (_animatePhase...)

これらのプライベートメソッドは、ライフサイクルの各フェーズをアニメーション化するための具体的なロジックを含んでいます。これらは、様々なThree.jsオブジェクトの位置、スケール、不透明度を操作して、対応するフェーズの視覚効果を創り出します。アニメーションの最後に、phaseプロパティを変更してサイクルの次のステージに遷移する責任を負います。

結論

AIペアプログラミングは、ちょっとしたアニメーションの作成には便利である。
Javascriptの知識は少しあったにせよ、Three.jsを知ってから、ここまで作るのに、５日ほどである。

Discussion