A WebGPU browser
Use a recent browser that supports WebGPU. If WebGPU is unavailable, the simulation cannot run.
Learn Math and Physics through Simulations
with AI
You can create breathtakingly beautiful 3D simulations with the help of AI
even without programming knowledge.
Example request:
Create a schema for an N-body simulation.
What you need
GPUSims uses WebGPU. It requires a recent browser and a compatible graphics processor. To create a simulation, keep GPUSims open in one browser tab and an AI chat open in another tab.
An AI chat
The AI creates the schema and completes the WGSL code. GPUSims tells you what to copy at each step.
Sign-in is optional
You can browse and create simulations without signing in. Google sign-in is required only when publishing.
Use the Gallery
Click Browse Gallery, then select a simulation. Its page shows the canvas, its controls, and any explanation that was published with it.
- Select a thumbnail or title to open a simulation.
- Use sliders and menus to change values such as gravity, speed, size, or time step.
- Drag with the left mouse button to rotate a 3D view.
- Drag with the right mouse button to move the viewpoint.
Move between GPUSims and an AI chat
Click Start Building. Complete the numbered steps in order. GPUSims creates the fixed parts of the GPU program, while the AI writes the simulation-specific parts.
- Click Copy AI System Prompt and paste it into a new AI chat.
- Ask the AI to create a simulation schema.
- Paste the complete schema into the GPUSims schema editor.
- Click Copy WGSL Skeleton and paste the skeleton into the same AI chat.
- Paste the AI's complete WGSL code into the WGSL editor.
- Click Run Simulation.
Example:
Create a schema for an N-body simulation.
What you paste into each editor
You do not need to understand every line before starting. The important point is to keep the two kinds of code separate and paste each one into the correct editor.
Schema: the list of parts
The schema tells GPUSims which values, data buffers, controls, and shader steps the simulation needs.
const schema: SimulationSchema = {
name: "N-body simulation",
resources: { /* data used by the simulation */ },
shaders: [ /* GPU calculation steps */ ],
uis: [ /* sliders and menus */ ]
};
WGSL: the calculation
GPUSims generates the declarations. The AI fills in the mathematical instructions inside the generated shader.
@compute @workgroup_size(64, 1, 1)
fn main(@builtin(global_invocation_id) id: vec3<u32>) {
// The AI writes the simulation calculation here.
}
Keep them separate
Paste the TypeScript schema into the schema editor. Paste WGSL into the WGSL editor. When asking for a correction, request the complete schema or the complete shader, not both together.
Use the simulation page
After the code compiles, the simulation page shows the main canvas. It may also show sliders, menus, calculated values, and an explanatory article.
- Change one slider or menu at a time and watch what changes.
- Use Restart to start the simulation again.
- Use Edit Code to return to the schema and WGSL editors.
- Use Capture Image to record the current canvas.
- Use Thumbnail to choose the Gallery image.
When the simulation does not run
GPUSims may show a parsing, compilation, validation, or execution error. Copy the complete message instead of rewriting it in your own words.
- Click Copy Error Message.
- Paste the message into the AI chat.
- Ask for the complete corrected schema or complete corrected shader.
- Paste the correction into the proper editor and run it again.
Fix this error.
Expected ':' but found '.' at index 319
Look for numbers that do not make sense
A simulation can run without showing an error and still be mathematically wrong. Some simulations display values such as energy, error size, particle count, or a calculated result.
- Copy the current control values and calculated values.
- Paste them into the AI chat.
- Ask which values are expected and which look suspicious.
- Compare the answer with a textbook, trusted reference, calculation, or teacher.
Do these parameter values and calculation results look mathematically and physically reasonable? Explain any suspicious values.
A realistic-looking picture can still be wrong
Use Capture Image, upload the image to the AI chat, and include the original request and the current control values. The image is one piece of evidence, not proof that the simulation is correct.
Is this image consistent with the intended physical model? Identify visual evidence of numerical or implementation errors.
State what should happen
Tell the AI which physical or mathematical behavior the simulation is supposed to show.
Include the settings
Provide the slider and menu values used when the image was captured.
Check another source
Compare the result with equations, known special cases, conservation rules, trusted references, or a teacher's review.
Ask what the simulation shows
After the simulation works, you can ask the AI to explain the visible behavior, the mathematics, the calculation method, and the WGSL code. Read the explanation and ask about anything you do not understand.
Please write an article explaining the phenomena observable in this simulation, the underlying mathematics, the numerical method, and the WGSL implementation.
- Use Edit Article to write or revise the Markdown article.
- Give the simulation a title and record the AI model used.
- Choose a thumbnail before publishing.
- Sign in with Google and click Publish to publish it.
Check AI-generated results
AI can generate code and explanations that look reasonable but contain mistakes. GPUSims is intended for learning, experimentation, visualization, and prototyping. It is not a substitute for independently checked scientific software.