Лучше aproach для трогательных жестов при прыжковом движении

Question

Я пытаюсь разработать меню, в котором я могу навести курсор на значки, используя мою руку, а затем нажимаю на них, используя движение вперед. Для этого я использую скорость своей рукой по оси z, а также сенсорную зону и расстояние касания, как вы можете видеть в этом фрагменте кода.

var controller = new Leap.Controller({ enableGestures: flag }); 

controller.on('frame', function(frame) { 
    if (frame.pointables.length > 0) { 
    var pointable = frame.pointables[0]; 

    // Params used to navigation and touching on menu interfaces 
    var touchZone = pointable.touchZone, // None, hovering, or touching 
     touchDistance = pointable.touchDistance, // [+1, 0, -1] 
     zNotFinger= pointable.tipVelocity[0], // For the case pointable isnn't a hand 
     zIndex = pointable.tipVelocity[1], // Index finger velocity on z-axis 
     zMiddle = pointable.tipVelocity[2], // Middle finger velocity on z-axis 
     x = pointable.tipPosition[0], 
     y = pointable.tipPosition[1], 

     // Getting highest tipVelocity 
     tempVelocity = zIndex >= zNotFinger ? zIndex : zNotFinger, 
     velocity = zMiddle > tempVelocity ? zMiddle : tempVelocity; 

    // The circle is defined as a gesture to go back to homepage 
    if (frame.hands.length === 1 && origin !== 'home' && frame.gestures.length > 0) { 
     var gesture = frame.gestures[0], 
      hand = frame.hands[0], 
      oneExtended = hand.fingers[1].extended && !hand.fingers[3].extended; 

     if (gesture.type === 'circle' && oneExtended && gesture.pointableIds.length >= 1) { 
     window.open('../html/home.html','_self'); 
     } 
    } 

    // Sending data... 
    if (origin === 'home') { 
     homeHover(x, y, touchZone, touchDistance, velocity); 
    } else if (origin === 'bio') { 
     bioHover(x, y, touchZone, touchDistance, velocity); 
    } else if (origin === 'nature') { 
     natureHover(x, y, touchZone, touchDistance, velocity); 
    } 

    } 
}); 
controller.connect(); 

}

, а затем ...

if (velocity > 150) { 
if ($(".hovered").attr("href") && touchZone === 'touching' && touchDistance <= -0.4) { 
    window.location.replace($(".hovered").attr("href")); 
} 

}

Основная проблема заключается в случайно "нажать" на ссылки при наведении на значки или настроить требует слишком большого затруднения при нажатии.

Может ли кто-нибудь дать мне руку на это? Возможно, новые методы, которые я должен использовать или даже совершенно другой подход.

OBS: Я уже пробовал screenTap и keyTap.

Большое спасибо!

Answer 1

Слишком сложный или слишком простой щелчок является общей проблемой. Аналогичные проблемы имеют встроенные краны.

Вы можете исследовать стабилизированноеTipPosition вместо скорости (или в дополнение к скорости) и заставить пользователя перемещаться вперед на заданную величину после зависания. Использование положения стабилизированного поворота должно облегчить пользователю движение вперед, не случайно отбросив цель. Только щелчок, когда движение в основном вдоль оси z, должно значительно уменьшить случайные клики, как те, которые происходят, когда пользователь переходит к целевому пункту меню, так и те, которые возникают, когда пользователь просто двигает руками (не связан с меню).

Другие общие подходы к меню включают в себя:

1. Hover активировать - курсор показывает индикатор обратного отсчета времени, и пользователь просто должен удерживать курсор на пункт меню или кнопку на необходимое количество времени. Он работает, но немного неэффективен и заставляет пользователя немного подождать для каждого пункта меню, когда они уже решили, что делать. Это один из самых распространенных методов, который можно увидеть во многих приложениях в магазине приложений Leap Motion.
2. Вытягивание для активации - пользователь наводит курсор на элемент меню и перемещает палец, чтобы «перетащить» элемент в сторону, чтобы активировать его. Вы можете увидеть пример этого типа меню в приложении Sculpting.
3. Физическое - меню и кнопки активируются прикосновением (касанием) в трехмерном пространстве. Этот метод хорошо работает в приложениях в стиле VR, потому что у пользователя есть лучшее чувство восприятия глубины. Он также может работать для 3D-приложений, отличных от VR (с осторожным дизайном). Вы можете сделать гибридное 2D-3D веб-приложение, где контент по существу 2D, но руки 3D и показаны над содержимым.

Есть некоторые принципы дизайна меню (старше) здесь: https://developer.leapmotion.com/documentation/javascript/practices/Leap_Menu_Design_Guidelines.html

И несколько примеров (не все меню, хотя): https://developer.leapmotion.com/gallery/category/javascript