Interactive 3D Articulated Skeleton


You can observe & learn most of the basic KineMan functions by executing just a few simple operations. Here’s a tutorial, which emphasizes the capabilities of KineMan Basic, our free edition:

To identify a bone, move the cursor into the KineMan viewing area (where the bones are, with the black background). When you pass the cursor over any bone, the name of that bone will show in the text box labeled ‘Pointing at:’, in the bar above the viewing area. At the same time, the bone color changes (to orange), to confirm which bone is located precisely under the cursor center. Note that the bone name & color change immediately, whenever the cursor (centerpoint) moves to a different bone.

For most bones, two names are shown in the 'Pointing at' box: 1st the scientific name, followed by the common name (or a description).

To move the entire skeleton, drag the cursor anywhere in the viewing area, starting from a point in the black background. Dragging vertically causes the skeleton to 'tilt' about the green axis; dragging horizontally causes it to 'spin' about the blue axis. Moving the cursor in any other direction causes a combination of spin and tilt. This demonstrates the 'joystick’ mode of KineMan operation, which permits you to adjust 2 degrees of freedom (DOF) simultaneously. (Note that KineMan doesn't provide an icon or widget for 'joystick' operation, as is often the case for other 3D applications. Typically, those widgets are small & 'futzy' to operate. In KineMan, the entire viewing area functions as a joystick, to make moving bones quicker & simpler. (We call this feature a 'view-integrated' joystick, to contrast it with conventional ones).

(If you don’t see the full skeleton moving when you drag, and instead you only see one joint moving, it’s because you inadvertently selected that joint and its distal bone, highlighted in blue. Click anywhere in the background to undo this selection, or press the Undo button until no bones are highlighted; at this point, you’ll be able to move the entire skeleton).

As you drag in the viewing area, you’ll note that the slider bars to the right and bottom of the viewing area (labeled Spin and Tilt) are moving as well, and the values in the numeric text boxes change, showing you the precise angular position of the skeleton in space.

You can also move the entire skeleton by using the slider bars: When you move the cursor over one of the sliders, it will change color (to orange). By dragging along the highlighted slider, you’ll see KineMan move in the direction labeled on the slider (Spin, Tilt, Horiz(ontal), Vert(ical), or Dist(ance). Note that you can start dragging anywhere in the orange box - it's not necessary to grab the slider 'handle' (i.e., the moving rectangle).

Note that the Distance slider replaces the conventional Zoom control. It’s called ‘distance’ because it’s calibrated to show the actual distance to the center of the skeleton (near the heart), as it would appear if you viewed the skeleton thru a glass window the size of your screen. For additional info, please see Distance vs. Zoom.

Although the joystick technique will normally rotate the body in tilt &/or spin, it can also be used to move the body other ways:

To move a single joint, you have to Select the joint first. The easiest way to do this is by clicking on the bone you want to move - the one ‘distal’ to the joint. For example, if you want to move the hip (a.k.a., ilio-femoral) joint, click on the corresponding femur. Or, to move the knee (tibio-femoral joint), click on the tibia. (In KineMan, the terms ‘distal’ and ‘proximal’ are defined relative to the ribcage (thorax). Thus, the C6 vertebra is distal to C7 vertebra, and hence to the C6-C7 joint. For more information, please see Bone & Joint Hierarchy ).

This technique doesn’t work for bones in the ribcage (a.k.a. thorax, comprising ribs1-12 (L & R), vertebrae T1-T12, & sternum), because joints within the thorax cannot be moved in the current edition of KineMan.

The bone you select will change color to blue, after you click on it, and its associated proximal joint (i.e., the one closest to the ribcage) will be considered to be the Moving joint. The joint name simultaneously appears in the text box labeled ‘Moving joint’ in the upper right of the KineMan window. At the same time, additional sliders appear, with a ‘tinted’ background, to the right of the Distance slider. These are customized for each joint, in terms of which directions of motion are available, using standard ‘osteokinematic’ terminology (definition, lecture notes).

Sometimes when you click a bone, an entire group of bones changes to blue (e.g., the hand, foot, or skull). This happens because KineMan doesn’t permit motion for the individual bones in that area. There’s an upside to this limitation: if you want to move the joint connecting proximally to one of these same bone groups, you can click on any of the bones in that group. For example, to move the wrist (in KineMan Basic), you can click on any bone in the hand (which is much simpler than pinpointing the scaphoid bone). Note that when you select a group, it's name also appears in the 'Pointing at' box, as a prefix to the regular bone name.

The ribcage (thorax) is a special group. As mentioned above, KineMan doesn't have any joints in the ribcage. Thus, when you click on a ribcage bone, nothing happens: the ribcage group doesn’t turn blue, and the Moving joint (as shown in the dropdown menu) doesn’t change. To move the ribcage, you simply use the controls to move the entire skeleton, i.e., the white sliders, or, by dragging in the viewing area (after deselecting any selected bones or joints).

Another way to select a joint is by using the ‘Moving joint’ pull down menu, in the panel to the right of the viewing area; this menu lists all of the joints available for movement. When you select a joint from the menu, its associated distal bone (or bone group) will change color to blue.

Although it's usually easier to select a joint by clicking on its distal bone, the Moving joint menu may be useful when you can't see the bone you want - e.g., if it's too small to click on, or obscured by some other bone. If you're not sure which is the correct joint name, KineMan provides some help: if you hold the [Ctrl] & [Alt] keys down while hovering over any bone, the corresponding KineMan joint name will appear in the 'Pointing at' box, above the viewing area. (The joint name is prefixed by 'Joint:', to clarify that this isn't a bone name). [Note: for this feature, the joint name shown is that of the nearest proximal movable joint, which isn't necessarily the nearest proximal anatomical joint, because not all joints are movable.

To move a joint you’ve selected (& whose associated distal bone is highlighted in blue), you can use the tinted joint sliders, to move the joint along a single motion axis (i.e., 1 degree of freedom).

Alternatively, many joints can be moved in two directions simultaneously (2 DOF), by dragging in the viewing area, using KineMan's view-integrated joystick. For example, if you select the hip (ilio-femoral) joint, and the skeleton is facing you (in its ‘anatomical’ position’), dragging vertically along the leg causes flexion or extension. Dragging horizontally (near the knee) causes adduction or abduction. Dragging at any other angle results in a combination of flexion/extension and ab/adduction.

Now if you spin the skeleton 90°, so as to view it from a lateral perspective, and drag along the leg, you’ll observe adduction or abduction, instead of flexion or extension. This change demonstrates an important KineMan feature: for joints, the effect of dragging in a given direction depends on the view . This ‘adaptive joystick’ feature makes it possible to move the joints in a natural and intuitive manner, regardless of how you view the joint.

To get a feel for this technique, you may find it best to simply experiment for awhile, dragging in the viewing area for some selected joint(s), and changing the view (using the spin & tilt sliders). If you find yourself confused, don’t give up – additonal explanations are provided below. [Confusion in this case is not surprising, since 3D spatial rotations aren't necessarily intuitive, plus, you’re attempting to control them using a 2D mouse – something’s gotta give!]. So, here are a few clarifications:

The bone’s long axis: The adaptive joystick method can only control two motions (degrees of freedom) at a time. For any 3 DOF joint (for example, the ball & socket gleno-humeral (shoulder)), motions around one axis have to be excluded. As a rule, the adaptive joystick method excludes rotations about the long axis of the bone, e.g., for the gleno-humeral joint, internal/external rotations are excluded.

You can activate the third degree of freedom using the associated joint slider, but there’s another way: You can hold down the [Alt] key while dragging in the viewing area. Generally, if you do this while dragging perpendicular to the bone’s long axis, axial rotation will occur.

1 or 2 DOF joints: Joints having 1 or 2 degrees of freedom could conceivably be controlled completely with 2D cursor (drag) motions. However, for some of these joints, one of the degrees of freedom is the rotation around the bone’s long axis. This is the case, for example, in the tibio-femoral joint of the knee, where one degree of freedom is internal/external rotation (& the other is flexion/extension). To maintain consistency with the ‘long axis’ considerations described above, you have to hold down the [Alt] key to drag-activate the internal/external rotation motion. [To do otherwise would require that you remember a different method’’ for each different joint type]. An important consequence of this design is that, for a joint such as the knee, dragging (without using the [Alt] key) is only effective in one direction.

Conversely, for joints where axial rotation is the only degree of freedom, such as the radial-ulnar joint, the [Alt] key isn't necessary - just drag perpendicular to the long axis to move the joint.

Inverted movements: Sometimes it may appear that the joint motion occurs in the opposite direction to the cursor motion: you move the cursor downward, and the distal bone moves upward. This will happen when the long axis of the bone changes direction, from pointing toward you to poining ‘backwards’ from the joint. For example: if you flex one of the gleno-humeral joints, by dragging upward when the skeleton is facing you, the motion is as you might expect: the arm moves upward; however, if you spin the skeleton 180° (posterior view), you have to drag downward to obtain flexion. This approach makes sense if you imagine that the cursor is moving a ‘track ball’ centered at the joint, and the bone is attached to the track ball. By doing it this way, you’ll never encounter any ‘deadspots’, where the joint motion is ambiguous relative to the cursor motion.

Dragging the joint vs. the body: As we've shown, when a joint is selected, the joystick technique moves the joint, instead of the body. Nevertheless, you can still move the body, when a joint is selected, by using any of the white sliders (Horiz / Vert / Spin / Tilt / Dist). Plus, you can still translate the body and change its distance, while a joint is selected, by using the modifier keys ([Shift]+drag to translate, [Alt][Shift]+drag for distance). But to resume using the joystick for body rotations (spin &/or tilt), you have to deselect any selected joints.

To de-select the current moving joint, click on the black backgound. The selected bone will change from blue to its normal color, and the joint sliders (tinted) will be removed. You can accomplish the same by using the Moving joint menu: simply select ‘None’ at the top of the list.

This concludes our tutorial. A summary of these operations is provided in the Hints panel (located at the center right of the main KineMan webapp page), and on the Basic Operations help page.

To learn more, we encourage you to experiment with the different buttons, checkboxes, etc. You don’t have to worry about making mistakes with KineMan – you can Undo whatever operation you just completed, using the Undo button in the upper left of the KineMan window.