How to use DollRoom MMD Studio

model: YYB Hatsune Miku_10th

What is DollRoom MMD Studio?

MMD Studio is a dedicated viewer for displaying MikuMikuDance (MMD) 3D model files, known as PMX files, on the web.

Since it's a web application, it can be used on PCs with various operating systems, including Mac, not just Windows.

DollRoom was originally created as a service for viewing and enjoying PMX models on smartphones, so it has been developed to be intuitively operable from smartphones as well.

Even without specialized MMD knowledge, you can easily display your PMX files to view them like a figure, or upload VMD and VPD files to make them perform dance motions.

Successor to Studio Babylon

MMD Studio is the successor to "Studio Babylon," which was previously developed for DollRoom. It inherits its mechanism and has been updated, stabilized, and expanded with new features.

It utilizes the excellent technology of Babylon.js, a rendering engine for 3D on the web, and Babylon-MMD, which allows MMD to be rendered using Babylon.js.

For more details on Studio Babylon, please refer to this blog post.

Request for Migration following the Closure of Studio Babylon

From now on, we will focus on maintaining MMD Studio.

Accordingly, "Studio Babylon" is scheduled to be closed at some point.

If you have been using it, please download your BPMX data from "Studio Babylon" and upload the BPMX file to MMD Studio.

When you upload a BPMX file, it will be automatically recreated internally into the latest version of the BPMX file.

Steps to Display a PMX Model in the Viewer

Uploading a Model (PC)

If you are using a PC, simply upload the folder that contains both the PMX file and the texture files.

Once uploaded, it will be automatically converted into a special file format (BPMX) optimized for the studio and added to your model list.

After uploading it once, the data will be saved in your browser, and you won't need to upload it again on subsequent visits.

You can display the model in the studio by selecting the uploaded model from the model list and pressing the "Load" button.

You can think of a BPMX file as a special PMX file, Babylon PMX, that is optimized for operations with Babylon.js (a web technology for handling 3D).

An official converter, PMX to BPMX Converter, is also available, so you can create a BPMX file with it as well.

BPMX files created with the official converter can be uploaded from the BPMX file upload area.

Uploading a Model (Smartphone)

Unlike the PC procedure, this is a bit more work, but you need to create a BPMX file using one of the two methods below.

⚫︎1. Create a BPMX file by opening DollRoom on a PC

Follow the model upload procedure for PC.

After uploading, there will be a button to download the BPMX file; click it to download.

⚫︎2. Use the official PMX to BPMX Converter to create a BPMX file

As mentioned in the PC section, an official converter, PMX to BPMX Converter, is available, and you can use this site to create a BPMX file.

Uploading a BPMX file from a smartphone

Transfer the created BPMX file to your smartphone (using Google Drive, etc., is easy).

Open DollRoom on your smartphone and upload the BPMX file.

Displaying Multiple Models

It is also possible to display multiple models.

However, displaying multiple models is resource-intensive, so it is not recommended for smartphones.

Applying Motion and Pose to a Model

How to Apply

You can upload motion files in VMD format and pose files in VPD format.

Similar to model files, these are also saved in your browser, so you won't need to re-upload them on subsequent visits.

The uploaded motion and pose files will be available for selection from a list.

Select either the model or the camera and then choose the motion you want to apply.

You can apply poses and audio in a similar manner.

Playing Motion

When motion is applied, a controller will appear at the bottom of the screen.

You can play the motion by pressing the play button.

You can also move the slider to go to the scene you want to see.

The controller can be shown or hidden by double-clicking (double-tapping on a smartphone).

Model Operations

Camera Angle, Position, and Rotation

When you load a model, the following icons will be added below the menu button.

The buttons can be shown or hidden by double-clicking.

This mode is for operating the camera angle only.

You can hide the controller for model operations.

The method for operating the angle is as follows for PC and smartphone respectively.

For PC: Use the left mouse button to drag and operate the angle. Use the right mouse button to drag and operate the camera position. Use the mouse wheel to scroll for zooming in and out.

For smartphone: Use a one-finger swipe to operate the angle. Use a two-finger swipe to operate the camera position. Use pinch-in and pinch-out gestures to zoom in and out.

This allows you to switch between the VMD motion-attached camera and a regular camera.

It appears when a motion is applied to the camera.

This operates the model's position. A controller for operation will appear below the model.

This operates the model's rotation. A controller for operation will appear below the model.

This allows you to move the model by touching or dragging with the cursor.

The camera angle will be fixed in this mode, so please switch back and forth between this and the camera angle operation mode.

Operating Model Morphs

When a model is loaded, its morphs will be displayed in a list.

You can operate the morphs by changing the respective sliders.

Operating Material Transparency

When a model is loaded, its materials will be displayed in a list.

By changing the slider, the transparency will change.

Moving the slider to the left changes the transparency, eventually making it completely invisible.

This feature is useful if you have parts you don't want to display.

Studio Settings

Setting a Background Image

You can set a background image in the studio.

Try uploading your favorite image to the studio.

Toggling the Studio Floor Display

The floor is displayed by default, but if you don't need it, you can hide it in the studio settings.

This can be done from the studio settings.

Saving and Restoring Studio State

You can save and restore the operations you've performed, such as loading a model or applying a motion.

You can save from the studio settings.

The next time you open the studio, you will be asked if you want to restore the saved state. If you choose to restore, the saved state will be applied.

Note: Camera angle operations are not saved.