Top Related Projects
Central repository for tools, tutorials, resources, and documentation for robotics simulation in Unity.
Reinforcement Learning Environments for Omniverse Isaac Gym
A toolkit for developing and comparing reinforcement learning algorithms.
A modular high-level library to train embodied AI agents across a variety of tasks and environments.
Bullet Physics SDK: real-time collision detection and multi-physics simulation for VR, games, visual effects, robotics, machine learning etc.
Quick Overview
Midscene is an open-source 3D scene editor designed for web applications. It provides a user-friendly interface for creating and manipulating 3D scenes directly in the browser, making it easier for developers and designers to work with 3D content without the need for complex desktop software.
Pros
- Browser-based, making it accessible across different platforms
- User-friendly interface for easy 3D scene creation and editing
- Integrates well with web technologies and frameworks
- Open-source, allowing for community contributions and customization
Cons
- May have performance limitations compared to desktop 3D editing software
- Potentially limited feature set compared to more established 3D editors
- Dependency on browser capabilities and WebGL support
- Learning curve for users new to 3D scene editing
Code Examples
// Initialize Midscene
const scene = new Midscene.Scene();
const renderer = new Midscene.Renderer(document.getElementById('canvas'));
// Add a 3D object to the scene
const cube = new Midscene.Cube();
scene.add(cube);
// Render the scene
renderer.render(scene);
// Add lighting to the scene
const light = new Midscene.PointLight();
light.position.set(0, 5, 10);
scene.add(light);
// Apply material to an object
const material = new Midscene.StandardMaterial({
color: '#ff0000',
metalness: 0.5,
roughness: 0.5
});
cube.material = material;
// Add user interaction
const controls = new Midscene.OrbitControls(renderer.camera, renderer.domElement);
// Animate the scene
function animate() {
requestAnimationFrame(animate);
cube.rotation.y += 0.01;
renderer.render(scene);
}
animate();
Getting Started
-
Include Midscene in your project:
<script src="https://cdn.jsdelivr.net/npm/midscene@latest/dist/midscene.min.js"></script> -
Create a canvas element in your HTML:
<canvas id="scene-canvas"></canvas> -
Initialize Midscene and create a basic scene:
const scene = new Midscene.Scene(); const renderer = new Midscene.Renderer(document.getElementById('scene-canvas')); const cube = new Midscene.Cube(); scene.add(cube); renderer.render(scene); -
Run your web application and see the 3D scene in action!
Competitor Comparisons
Central repository for tools, tutorials, resources, and documentation for robotics simulation in Unity.
Pros of Unity-Robotics-Hub
- Comprehensive robotics simulation environment with ROS integration
- Extensive documentation and tutorials for robotics development
- Active community support and regular updates
Cons of Unity-Robotics-Hub
- Steeper learning curve for non-Unity developers
- Limited to Unity engine, which may not be suitable for all robotics projects
- Requires more computational resources for complex simulations
Code Comparison
Unity-Robotics-Hub:
using Unity.Robotics.ROSTCPConnector;
using RosMessageTypes.Geometry;
public class RobotController : MonoBehaviour
{
ROSConnection ros;
public string topicName = "cmd_vel";
Midscene:
import { Scene, PerspectiveCamera, WebGLRenderer } from 'three';
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';
const scene = new Scene();
const camera = new PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
The Unity-Robotics-Hub code snippet demonstrates ROS integration and robot control, while the Midscene code focuses on 3D scene setup using Three.js. Unity-Robotics-Hub is more specialized for robotics, whereas Midscene is a general-purpose 3D visualization tool.
Reinforcement Learning Environments for Omniverse Isaac Gym
Pros of OmniIsaacGymEnvs
- Provides a comprehensive suite of reinforcement learning environments for robotics simulation
- Leverages NVIDIA's Isaac Sim for high-fidelity physics and rendering
- Offers seamless integration with popular RL frameworks like OpenAI Gym
Cons of OmniIsaacGymEnvs
- Requires more computational resources due to its advanced physics simulation
- Has a steeper learning curve for users unfamiliar with Isaac Sim or robotics simulation
- Limited to robotics and physics-based simulations, unlike Midscene's focus on 3D scene understanding
Code Comparison
OmniIsaacGymEnvs:
from omniisaacgymenvs.utils.task_util import initialize_task
from omniisaacgymenvs.tasks.ant import AntTask
task = initialize_task(task_cfg, AntTask)
env = task.get_env()
Midscene:
import { Scene } from 'midscene';
const scene = new Scene();
scene.load('path/to/3d/model.glb');
The code snippets highlight the different focus areas: OmniIsaacGymEnvs initializes robotic simulation tasks, while Midscene loads and manipulates 3D scenes.
A toolkit for developing and comparing reinforcement learning algorithms.
Pros of gym
- Well-established and widely used in the reinforcement learning community
- Extensive documentation and tutorials available
- Supports a wide range of environments for various RL tasks
Cons of gym
- Primarily focused on reinforcement learning, limiting its use in other domains
- Can be complex for beginners to set up and use effectively
- Some environments may require additional dependencies
Code Comparison
gym:
import gym
env = gym.make('CartPole-v1')
observation = env.reset()
for _ in range(1000):
action = env.action_space.sample()
observation, reward, done, info = env.step(action)
midscene:
import { Scene } from 'midscene';
const scene = new Scene();
scene.add(new Cube());
scene.render();
scene.export('scene.gltf');
Key Differences
- gym is Python-based and focused on reinforcement learning environments
- midscene is JavaScript-based and designed for 3D scene creation and manipulation
- gym provides a standardized interface for RL algorithms
- midscene offers tools for creating and exporting 3D scenes
Use Cases
- gym: Ideal for researchers and developers working on reinforcement learning projects
- midscene: Suitable for web developers creating 3D scenes for visualization or game development
A modular high-level library to train embodied AI agents across a variety of tasks and environments.
Pros of Habitat-lab
- Comprehensive 3D simulation platform for embodied AI research
- Extensive documentation and tutorials for easy onboarding
- Large community support and active development
Cons of Habitat-lab
- Steeper learning curve due to complex architecture
- Higher computational requirements for running simulations
- Limited flexibility for custom environments outside its predefined scenarios
Code Comparison
Habitat-lab example:
import habitat
env = habitat.Env(
config=habitat.get_config("benchmark/nav/pointnav/pointnav_gibson.yaml")
)
observations = env.reset()
Midscene example:
from midscene import MidScene
scene = MidScene()
scene.load("path/to/scene.json")
Summary
Habitat-lab is a robust platform for embodied AI research with extensive features and community support, while Midscene appears to be a simpler tool for scene manipulation. Habitat-lab offers more comprehensive simulation capabilities but may require more resources and learning time. Midscene seems more lightweight and potentially easier to integrate for specific scene-related tasks.
Bullet Physics SDK: real-time collision detection and multi-physics simulation for VR, games, visual effects, robotics, machine learning etc.
Pros of bullet3
- More mature and widely adopted physics engine with extensive documentation
- Supports a broader range of physics simulations, including soft body dynamics
- Offers better performance for large-scale simulations
Cons of bullet3
- Steeper learning curve due to its complexity and extensive feature set
- Larger codebase and potentially higher resource requirements
Code Comparison
bullet3:
btDefaultCollisionConfiguration* collisionConfiguration = new btDefaultCollisionConfiguration();
btCollisionDispatcher* dispatcher = new btCollisionDispatcher(collisionConfiguration);
btBroadphaseInterface* overlappingPairCache = new btDbvtBroadphase();
btSequentialImpulseConstraintSolver* solver = new btSequentialImpulseConstraintSolver;
btDiscreteDynamicsWorld* dynamicsWorld = new btDiscreteDynamicsWorld(dispatcher, overlappingPairCache, solver, collisionConfiguration);
midscene:
import { Scene } from 'midscene';
const scene = new Scene();
scene.addObject(new Cube({ position: [0, 0, 0], size: [1, 1, 1] }));
scene.render();
Note: The code comparison highlights the difference in complexity and setup between the two libraries. bullet3 requires more detailed configuration for its physics simulation, while midscene offers a simpler, higher-level API for scene creation and rendering.
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual CopilotREADME
Midscene.js
Open-source, vision-driven UI testing â write tests in natural language, automate any platform.
ð£ Midscene Skills is here!
Use Midscene Skills to control any platform with OpenClaw
Showcases
- Web Automation - Automatically register the GitHub form in a web browser and pass all field validations
- iOS Automation - Meituan coffee order
- iOS Automation - Auto-like the first @midscene_ai tweet
- Android Automation - DCar: Xiaomi SU7 specs
- Android Automation - Booking a hotel for Christmas
- robotic arm + vision + voice for in-vehicle testing
ð¡ Why Midscene
Most UI automation â including AI tools that read the DOM or the accessibility tree â depends on page structure. That structure is fragile and incomplete: selectors break on every refactor, elements without semantic markup (icon-only buttons, custom controls, <canvas>) are invisible to it, native apps and cross-origin iframes are out of reach, and it cannot tell whether something actually looks right. Midscene works from the screenshot alone, and you describe each step in natural language:
- Less maintenance â no selectors to chase when the UI changes.
- Reach every element and surface â if a human can see it, Midscene can target it, even with no semantic annotations, on
<canvas>, native apps, and cross-origin iframes. - Assert what users actually see â verify colors, highlights, layout, and rendered state, not just whether a DOM node exists.
- Two ways to test â add Midscene to your Playwright / Vitest suite, or let an AI agent test autonomously via Skills.
Midscene is built for UI testing first, but the same vision-driven engine handles any UI automation task.
ð¡ What you can automate
Midscene works anywhere you can take a screenshot â web browsers, Android, iOS, HarmonyOS, desktop apps, and any custom interface â all through one API. Write automation with the JavaScript SDK or in YAML, hand it to AI agents via Skills, and look up every method (aiAct, aiQuery, aiAssert, and more) in the API reference.
ð Get started
- Write your first script in a few minutes â Quick start.
- No code? Try Midscene on any web page with the Chrome extension.
- Other platforms â getting-started guides for Android, iOS, HarmonyOS, and desktop.
⨠Driven by Multimodal Models
Midscene is all-in on pure vision for UI actions: element localization is based on screenshots only. It runs on multimodal models with strong UI localization, such as Qwen3.x, Doubao-Seed-2.1, GLM-4.6V, gemini-3.5-flash, and UI-TARS, including open-source options you can self-host. For data extraction and page understanding, you can still opt in to include DOM when needed.
Read more about Model Strategy.
ð Resources
- Documentation: https://midscenejs.com
- Sample projects: midscene-example
- API reference: https://midscenejs.com/api
ð¤ Community
ð Awesome Midscene
Community projects that extend Midscene.js capabilities:
- midscene-ios - iOS Mirror automation support for Midscene
- midscene-pc - PC operation device for Windows, macOS, and Linux
- midscene-pc-docker - Docker image with Midscene-PC server pre-installed
- Midscene-Python - Python SDK for Midscene automation
- midscene-java by @Master-Frank - Java SDK for Midscene automation
- midscene-java by @alstafeev - Java SDK for Midscene automation
ð Credits
We would like to thank the following projects:
- Rsbuild and Rslib for the build tool.
- UI-TARS for the open-source agent model UI-TARS.
- Qwen-VL for the open-source multimodal model Qwen-VL.
- scrcpy and yume-chan allow us to control Android devices with browser.
- appium-adb for the javascript bridge of adb.
- appium-webdriveragent for the javascript operate XCTestã
- YADB for the yadb tool which improves the performance of text input.
- libnut-core for the cross-platform native keyboard and mouse control.
- Puppeteer for browser automation and control.
- Playwright for browser automation and control and testing.
ð Citation
If you use Midscene.js in your research or project, please cite:
@software{Midscene.js,
author = {Xiao Zhou, Tao Yu, YiBing Lin},
title = {Midscene.js: Your AI Operator for Web, Android, iOS, Automation & Testing.},
year = {2025},
publisher = {GitHub},
url = {https://github.com/web-infra-dev/midscene}
}
⨠Star History
ð License
Midscene.js is MIT licensed.
Top Related Projects
Central repository for tools, tutorials, resources, and documentation for robotics simulation in Unity.
Reinforcement Learning Environments for Omniverse Isaac Gym
A toolkit for developing and comparing reinforcement learning algorithms.
A modular high-level library to train embodied AI agents across a variety of tasks and environments.
Bullet Physics SDK: real-time collision detection and multi-physics simulation for VR, games, visual effects, robotics, machine learning etc.
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual Copilot