Studio guide

From image to exploration.

Place landmarks, measure geometry, and move virtual fragments in a local browser workspace. Start with the synthetic demo to learn the tools.

Educational prototype

Get started

  1. Choose an image

    Use the labeled synthetic demo or import a PNG, JPEG, or WebP image. DICOM files are not supported. The demo starts with two axes and an illustrative scale of 2.5 pixels per millimetre.

  2. Set a scale

    For an imported image, enter the calibration distance in millimetres, choose Mark or Calibrate scale, then click the two ends of that reference. Lengths and translations stay in pixels until you calibrate.

  3. Place your measurements

    Click two points for a length or an axis. For an angle, click three points; the second point is the vertex. Draw the two axes yourself for a CORA comparison.

  4. Make and move a fragment

    Choose Prepare practice cut for a ready-made demo fragment, or trace a polygon around the fragment. Press Enter, double-click, or choose Finish outline to close it. For an osteotomy, draw a two-point cut across the selected fragment; with no fragments present, the cut applies to the whole image.

  5. Explore a change

    Select and drag a fragment, place its rotation pivot, then adjust rotation or translation. Undo and Redo let you revisit edits.

Read the geometry

Length and translation

The app uses image pixels until a calibration is set. Afterwards, the same image scale converts distances to millimetres.

Angles

The angle tool measures the interior angle between the two rays you place around the middle point. Accurate point placement matters.

CORA

CORA compares two manually drawn axes you choose in Axis comparison. It reports their smaller angle and intersection in image pixels; it does not identify anatomical axes automatically. Parallel axes have no finite intersection.

Calibration limits

One scale is applied across the image. A reference and anatomy at different depths may have different projection scales. Rotation and projection also change apparent lengths and angles; the app does not correct these effects.

Inspect, save, and return

See your landmarks clearly

Scroll to zoom, and drag empty space with Select & move to pan. Adjust brightness and contrast. Compare original switches to the starting image; Return to plan shows your scene again.

Keep your work

Export PNG for an image snapshot. Save plan downloads an editable JSON project containing your image; Open plan restores it. Save before replacing the image or closing the tab: the scene stays in memory and has no autosave. The image travels with the JSON file when you share it.

Landmarks follow fragments

Endpoints inside a newly traced fragment attach to it. To add attached measurements later, select the fragment before placing points. Use Select & move and drag endpoint handles to adjust them.

Choose a rotation centre

Select a fragment, choose Set rotation pivot, and click its new pivot. Moving the pivot preserves the fragment's position. You can also use the intersection of your selected axes as the pivot.

About this prototype

Bone Planning Studio is an independent, original app inspired by radiographic measurement and virtual osteotomy workflows. It is not associated with Bone Ninja.

For education and experimentation. This prototype has not been clinically validated and is not intended for patient-specific treatment planning.