jasonwebb/reaction-diffusion-playground

Add a UI

jasonwebb opened this issue · 3 comments

jasonwebb commented
  • Presets dropdown
  • Sliders for
    • feed rate (f)
    • kill rate (k)
    • diffusion rate for A (dA)
    • diffusion rate for B (dB)
    • timestep
  • Render style control
    • Radios or dropdowns for various presets
    • Gradient bar with configurable color stops
    • HSL mapping
  • Initial "seed" patterns
    • Circle
      • Radius
    • Square
      • Width
      • Height
      • Rotation
    • Text
      • Text input for custom text
      • Font size
      • Rotation
    • Image
      • File upload for custom image
      • Image fit
      • Scale
      • Rotation
  • Save canvas as image
  • Pause/play button
  • Reset button
  • Clear canvas button
jasonwebb commented

Need to pick a UI library that either has an API for custom components or at least exposes basic things like menu position and expanded/collapsed state so custom components can be tacked on.

Tweakpane looks solid.

jasonwebb commented

Examples of UIs in other RD simulators

Red Blob Games

https://www.redblobgames.com/x/1905-reaction-diffusion/

red-blob-games

Reaction-Diffusion Simulation in Three.js by Jonathan Cole

https://jons.website/projects/reaction-diffusion/

jonathon-cole

Reaction diffusion system (Gray-Scott model) by @pmneila

http://pmneila.github.io/jsexp/grayscott/

pmneila

Multiscale Turing Patterns by Ricky Reusser

https://rreusser.github.io/multiscale-turing-patterns

ricky-reusser

jasonwebb commented

Turns out that multiscale Turing patterns are not just a matter of mixing multiple sets of f/k/dA/dB parameters together - its a different fundamental model altogether. As such, I'll plan on breaking that out into a separate sketch with a separate UI.