![\"\"](\"https:\/\/people.utm.my\/ajune\/wp-content\/uploads\/sites\/987\/2018\/11\/standard-clipping.gif\")
<\/a><\/p>\nIn a virtual world, this type of visual cropping occurs whether you touch a stationary surface (such as a wall) or touch an interactive object.\u00a0The two core functions of the\u00a0Leap Motion libraries\u2014flip and grab\u2014have almost always the case where the user’s hand penetrates the interactive object.<\/p>\n
Similarly, when interacting with a physics-based user interface (such as the InteractionButtons<\/em> of the Leap Motion interaction engine, which is reduced in Z space), because the elements of the UI reach the end of their travel distance, the fingertips still have a little bit through Interactive object.<\/p>\n In our first experiment, we proposed that when the hand intersects with other meshes, the boundary should be visible.\u00a0The shallow part of the hand is still visible, but the color or transparency of the hand changes.<\/p>\n To achieve this, we applied a shader to our hand grid.\u00a0We measure the distance of each pixel on the hand from the camera and compare it to the depth of the scene (from the depth texture to the camera reading).\u00a0If the two values \u200b\u200bare relatively close, we cause the pixels to illuminate and increase the illuminance as we get closer.<\/p>\n When the intensity and depth of illumination are reduced to a minimum, it seems to be an effect that can be applied universally in an application without appearing particularly eye-catching.<\/p>\n In the second experiment, we decided to change the color of the fingertips to match the surface color of the object we want to interact with.\u00a0The closer the hand is to the touch object, the closer the colors are.\u00a0This will help the user to more easily determine the distance between the fingertip and the surface of the object while reducing the likelihood that the fingertip will penetrate the surface.\u00a0In addition, even if the fingertip does penetrate the mesh, the resulting visual cropping will not be as awkward \u2013 because the fingertip and the object surface will be the same color.<\/p>\n Whenever we hover over an InteractionObject, we check the distance from each fingertip to the surface of the object.\u00a0Then, we use this data to drive a gradient change that affects the color of each fingertip independently.<\/p>\n This experiment really helps us to more accurately determine the distance between our fingertips and the surface of the object.\u00a0In addition, it makes it easier for us to know the closest contact we have.\u00a0Combine it with the effect of Experiment #1 to make the various phases of the interaction (close, contact, intersect, grip) clearer.<\/p>\n How to capture virtual objects in VR?\u00a0You may catch a fist, or pinch it, or fasten the object.\u00a0Previously, we have tried to design some tips\u2014for example, the handles\u2014and hopefully these instructions will guide the user how to grab objects.<\/p>\n By creating a Raycast on each finger joint and checking its projection position on the InteractionObject, we create a shallow socket grid at the hit point of the ray projection.\u00a0We align the shallow fossa with the hit point normal and use Raycast’s hit distance \u2013 mainly the depth of the finger inside the object \u2013 to drive the Blendshape to extend the dimple.<\/p>\n From this concept, we further divergence. Do you want to predict the proximity of your hand before your hand touches the surface of the object, and reflect it?\u00a0To do this, we increase the length of the fingertip ray projection so that the hit is registered before your finger touches the surface.\u00a0Then, we create a two-part prefab consisting of a (1) circular mesh and (2) a cylindrical mesh with a depth mask that stops rendering any pixels behind it.<\/p>\n We also tried adding a fingertip color gradient.\u00a0But this time, the gradient is not driven by the proximity of the object, but by the depth of the finger into the object.<\/p>\n<\/a><\/p>\n<\/a><\/p>\nExperiment #1: Highlighting the boundary and depth while crossing the grid<\/h4>\n
<\/a><\/p>\nLab #2: Add a color gradient to your fingertips when approaching interactive objects and UI elements<\/h4>\n
<\/a><\/p>\n<\/a><\/p>\nLab #3: Responsive prompting for unpredictable crawls<\/h4>\n
<\/a><\/p>\n<\/a><\/p>\n