Manipolazione diretta con le maniDirect manipulation with hands

Pulsante

La manipolazione diretta è un modello di input che consiste nel toccare gli ologrammi direttamente con le mani.Direct manipulation is an input model that involves touching holograms directly with your hands. L'idea alla base di questo concetto è che il comportamento degli oggetti deve essere uguale a quello che avrebbero nella realtà.The idea behind this concept is that objects behave just as they would in the real world. I pulsanti possono essere attivati semplicemente premendoli, gli oggetti possono essere selezionati afferrandoli e il contenuto 2D si comporta come un touchscreen virtuale.Buttons can be activated simply by pressing them, objects can be picked up by grabbing them, and 2D content behaves like a virtual touchscreen. La manipolazione diretta è basata sull'invito, ovvero è facile da usare.Direct manipulation is affordance-based, meaning it's user-friendly. Non esistono movimenti simbolici da insegnare agli utenti.There are no symbolic gestures to teach users. Tutte le interazioni avvengono intorno a un elemento visivo che è possibile toccare o afferrare.All interactions are built around a visual element that you can touch or grab. È considerata un modello di input "da vicino", in quanto è ideale per interagire con contenuto raggiungibile stendendo le braccia.It's considered a "near" input model in that it's best used for interacting with content within arms reach.

Supporto di dispositiviDevice support

Modello di inputInput model HoloLens (prima generazione)HoloLens (1st gen) HoloLens 2HoloLens 2 Visori VR immersiveImmersive headsets
Manipolazione diretta con le maniDirect manipulation with hands ❌ Non supportata❌ Not supported ✔️ Consigliata✔️ Recommended ➕ Supportata.➕ Supported. Per l'interfaccia utente, consigliamo invece Puntamento e commit con le mani.For UI, we recommend point and commit with hands instead.

La manipolazione diretta è un modello di input principale in HoloLens 2 che usa il nuovo sistema di tracciamento delle mani articolato.Direct manipulation is a primary input model on HoloLens 2, which uses the new articulated hand-tracking system. Il modello di input è disponibile anche su visori VR immersive tramite l'uso di controller del movimento, ma non è consigliato come mezzo principale di interazione al di fuori della manipolazione di oggetti.The input model is also available on immersive headsets by using motion controllers, but isn't recommended as a primary means of interaction outside of object manipulation. La manipolazione diretta non è disponibile in HoloLens (prima generazione).Direct manipulation isn't available on HoloLens (1st gen).



Punta del dito di collisioneCollidable fingertip

In HoloLens 2 le mani dell'utente vengono riconosciute e interpretate come modelli scheletrici delle mani sinistra e destra.On HoloLens 2, the user's hands are recognized and interpreted as left and right-hand skeletal models. Per implementare l'idea di toccare gli ologrammi direttamente con le mani, in teoria si potrebbero applicare cinque collisori alle cinque punte delle dita del modello scheletrico di ogni mano.To implement the idea of touching holograms directly with hands, ideally, five colliders could be attached to the five fingertips of each hand skeletal model. Tuttavia, a causa della mancanza di feedback tattili, 10 punte di dita di collisione possono causare collisioni inaspettate e imprevedibili con gli ologrammi.However, because of the lack of tactile feedback, 10 collidable fingertips can cause unexpected and unpredictable collisions with holograms.

È consigliabile applicare solo un collisore a ogni dito indice.We suggest only putting a collider on each index finger. Le punte degli indici di collisione possono comunque fungere da punti tocco attivi per vari movimenti di tocco che coinvolgono altre dita.The collidable index fingertips can still serve as active touch points for diverse touch gestures involving other fingers. I movimenti di tocco includono la pressione con un dito, il tocco con un dito, la pressione con due dita e la pressione con cinque dita, come mostrato di seguito:Touch gestures include One-finger press, One-finger tap, Two-finger press, and Five-finger press, as shown below:

Punta del dito di collisionecollidable fingertip
Punta del dito di collisioneCollidable fingertip

Pressione con un ditoOne-finger press
Pressione con un ditoOne-finger press

Tocco con un ditoOne-finger tap
Tocco con un ditoOne-finger tap

Pressione con cinque ditaFive-finger press
Pressione con cinque ditaFive-finger press



Collisore sferaSphere collider

Invece di usare una forma generica casuale, è consigliabile usare un collisore sferico.Instead of using a random generic shape, we suggest you use a sphere collider. È possibile quindi eseguirne il rendering visivo per fornire segnali migliori per la destinazione più vicina.Then you can visually render it to provide better cues for near targeting. Il diametro della sfera deve corrispondere allo spessore del dito indice per aumentare l'accuratezza del tocco.The sphere's diameter should match the thickness of the index finger to increase touch accuracy. È più facile recuperare la variabile dello spessore di un dito chiamando l'API relativa alla mano.It's easier to retrieve the variable of finger thickness by calling the hand API.

Cursore punta del ditoFingertip cursor

Oltre al rendering di una sfera di collisione sulla punta dell'indice, è stato creato un cursore avanzato per la punta del dito per migliorare l'esperienza di selezione della destinazione da vicino.In addition to rendering a collidable sphere on the index fingertip, we've created an advanced fingertip cursor to achieve a better near-targeting experience. Si tratta di un cursore a forma di anello associato alla punta dell'indice.It's a donut-shaped cursor attached to the index fingertip. In base alla prossimità, reagisce in modo dinamico a una destinazione per l'orientamento e le dimensioni come indicato di seguito:According to proximity, it dynamically reacts to a target for orientation and size as detailed below:

  • Quando un indice si sposta verso un ologramma, il cursore è sempre parallelo alla superficie dell'ologramma e si restringe gradualmente.When an index finger moves toward a hologram, the cursor is always parallel to the hologram's surface and gradually shrinks its size.
  • Non appena il dito tocca la superficie, il cursore si riduce a un punto ed emette un evento tocco.As soon as the finger touches the surface, the cursor shrinks into a dot and emits a touch event.

Con il feedback interattivo, gli utenti possono eseguire attività di selezione della destinazione da vicino ad alta precisione, ad esempio l'attivazione di un collegamento ipertestuale o la pressione di un pulsante, come illustrato di seguito.With interactive feedback, users can achieve high precision near-targeting tasks, such as triggering a hyperlink or pressing a button as shown below.

Cursore punta del dito da lontanoFingertip cursor far
Cursore punta del dito da lontanoFingertip cursor far

Cursore punta del dito da vicinoFingertip cursor near
Cursore punta del dito da vicinoFingertip cursor near

Cursore punta del dito con contattoFingertip cursor contact
Cursore punta del dito con contattoFingertip cursor contact


Cubo di delimitazione con shader prossimitàBounding box with proximity shader

L'ologramma stesso richiede anche la possibilità di fornire feedback audio e video per compensare la mancanza di feedback tattili.The hologram itself also requires the ability to provide both visual and audio feedback to compensate the lack of tactile feedback. Su questa esigenza si basa il concetto di cubo di delimitazione con shader prossimità.For that, we generate the concept of a bounding box with a proximity shader. Un cubo di delimitazione è un'area volumetrica minima che racchiude un oggetto 3D.A bounding box is a minimum volumetric area that encloses a 3D object. Il cubo di delimitazione è dotato di un meccanismo di rendering interattivo denominato shader prossimità.The bounding box has an interactive rendering mechanism called a proximity shader. Comportamento dello shader prossimità:The proximity shader behaves:

Posizionamento del dito (da lontano) con feedback visivoHover (far) with visual feedback
Posizionamento del dito (da lontano)Hover (far)
Quando l'indice è all'interno della portata, sulla superficie del cubo di delimitazione viene messo in evidenza un punto luminoso per la punta del dito.When the index finger is within a range, a fingertip spotlight is cast on the surface of the bounding box.

Avvicinamento del dito con feedback visivoHover (near) with visual feedback
Avvicinamento del ditoHover (near)
Man mano che la punta del dito si avvicina alla superficie, il punto luminoso si restringe.When the fingertip gets closer to the surface, the spotlight shrinks.

Inizio contattoContact begins
Inizio contattoContact begins
Non appena la punta del dito tocca la superficie, l'intero cubo di delimitazione cambia colore o genera un effetto visivo per riflettere lo stato di tocco.As soon as the fingertip touches the surface, the entire bounding box changes color or generates visual effects to reflect the touch state.

Fine contattoContact ends
Fine contattoContact ends
È anche possibile attivare un effetto sonoro per migliorare il feedback del tocco visivo.A sound effect can also be activated to enhance the visual touch feedback.



Pulsante a pressionePressable button

Dotati di punta del dito di collisione, gli utenti sono ora pronti per interagire con un componente dell'interfaccia utente olografica di base, ovvero il pulsante a pressione.With a collidable fingertip, users are now ready to interact with a fundamental holographic UI component, such as a pressable button. Un pulsante a pressione è un pulsante olografico personalizzato per la pressione diretta con un dito.A pressable button is a holographic button tailored for a direct finger press. Anche in questo caso, a causa della mancanza di feedback tattili, un pulsante a pressione è dotato di un paio di meccanismi per ovviare ai problemi correlati al feedback tattile.Again, because of the lack of tactile feedback, a pressable button equips a couple mechanisms to tackle tactile feedback-related issues.

  • Il primo meccanismo è un cubo di delimitazione con shader prossimità, descritto in dettaglio nella sezione precedente.The first mechanism is a bounding box with a proximity shader, which is detailed in the previous section. Serve per fornire un'idea più accurata di prossimità quando gli utenti si avvicinano ed entrano in contatto con un pulsante.It gives users a better sense of proximity when they approach and make contact with a button.
  • Il secondo meccanismo è la depressione.The second mechanism is depression. La depressione crea un senso di pressione dopo che la punta di un dito entra in contatto con un pulsante.Depression creates a sense of pressing down after a fingertip contacts a button. Il meccanismo funziona in modo che il pulsante si muova in stretta relazione con la pressione del dito lungo l'asse di profondità.The mechanism ensures that the button tightly moves with the fingertip along the depth axis. Il pulsante può essere attivato quando raggiunge una profondità scelta (alla pressione) o quando lascia la profondità (al rilascio) dopo averla attraversata.The button can be triggered when it reaches a chosen depth (on press) or leaves the depth (on release) after passing through it.
  • È consigliabile aggiungere l'effetto audio di attivazione del pulsante per migliorare il feedback.The sound effect should be added to enhance feedback when the button is triggered.

Pulsante a pressione (lontano)pressable button far
Il dito è lontanoFinger is far away

Pulsante a pressione (vicino)pressable button near
Il dito si avvicinaFinger approaches

Inizio del contatto con il pulsante a pressionepressable button contact begins
Inizio contattoContact begins

Pressione del pulsante a pressionepressable button press
Pressione in profonditàPress down



Interazione con uno slate 2D2D slate interaction

Uno slate 2D è un contenitore olografico usato per ospitare contenuti di app 2D, ad esempio un Web browser.A 2D slate is a holographic container used to host 2D app content, such as a web browser. Il concetto di progettazione per l'interazione con uno slate 2D tramite manipolazione diretta corrisponde all'interazione con un touchscreen fisico.The design concept for interacting with a 2D slate via direct manipulation is the same as interacting with a physical touch screen.

Per interagire con il contatto tramite slateTo interact with the slate contact

ToccoTouch
ToccoTouch
Usa un indice per premere un pulsante o un collegamento ipertestuale.Use an index finger to press a hyperlink or a button.

ScorrimentoScroll
ScorrimentoScroll
Usa un indice per scorrere il contenuto dello slate verso l'alto o verso il basso.Use an index finger to scroll a slate content up and down.

ZoomZoom
ZoomZoom
L'utente usa i due indici per eseguire lo zoom avanti e indietro del contenuto dello slate in base al movimento relativo delle dita.The user's two index fingers are used to zoom in and out of the slate content, according to the relative motion of the fingers.

Per manipolare lo slate 2DFor manipulating the 2D slate itself

Immagine che mostra la funzionalità di cattura e trascinamentoGraphic showing grab and drag feature
SpostamentoMove
Sposta le mani verso angoli e i bordi per rivelare gli inviti di manipolazione più vicini.Move your hands toward corners and edges to reveal the closest manipulation affordances. Afferra la barra dell'ologramma nella parte superiore dello slate 2D per spostare l'intero slate.Grab the Holobar at the top of the 2D slate, which lets you move the whole slate.

Immagine che mostra la funzionalità di ridimensionamentoGraphic showing scale feature
RidimensionamentoScale
Afferrare gli inviti di manipolazione ed eseguire un ridimensionamento uniforme tramite gli inviti degli angoli.Grab the manipulation affordances and do uniform scaling through the corner affordances.

Adatta il contenuto in modo dinamicoReflow
Adatta il contenuto in modo dinamicoReflow
Afferrare gli inviti di manipolazione e adattare il contenuto dinamicamente tramite gli inviti dei bordi.Grab the manipulation affordances and do reflow via the edge affordances.



Manipolazione di oggetti 3D3D object manipulation

HoloLens 2 consente agli utenti di usare le mani per indirizzare e manipolare gli oggetti olografici 3D applicando un cubo di delimitazione a ogni oggetto 3D.HoloLens 2 lets users enable their hands to direct and manipulate 3D holographic objects by applying a bounding box to each 3D object. Il cubo di delimitazione fornisce una migliore percezione della profondità tramite lo shader prossimità.The bounding box provides better depth perception through its proximity shader. Con il cubo di delimitazione sono disponibili due approcci di progettazione per la manipolazione di oggetti 3D.With the bounding box, there are two design approaches for 3D object manipulation.

Manipolazione basata sugli invitiAffordance-based manipulation

Permette di manipolare l'oggetto 3D tramite un cubo di delimitazione e gli inviti di manipolazione intorno a esso.Affordance-base manipulation lets you manipulate the 3D object through a bounding box along with the manipulation affordances around it.

Immagine che mostra il cubo di delimitazione di un oggetto e la funzionalità di spostamentoGraphic showing an objects bounding box and move feature
SpostamentoMove
Nel momento in cui la mano di un utente è vicina a un oggetto 3D, diventano visibili il cubo di delimitazione e l'invito più vicino.As soon as a user's hand is close to a 3D object, the bounding box, and the nearest affordance are revealed. Gli utenti possono afferrare il cubo di delimitazione per spostare l'intero oggetto.Users can grab the bounding box to move the whole object.

Immagine che mostra l'utente che afferra un bordo di un oggetto per eseguire la rotazioneGraphic showing user grabbing an objects edge to rotate
RotazioneRotate
Gli utenti possono afferrare gli inviti dei bordi per eseguire la rotazione.Users can grab the edge affordances to rotate.

Immagine che mostra l'utente che afferra un angolo di un oggetto per eseguire il ridimensionamentoGraphic showing user grabbing an objects corner to scale
RidimensionamentoScale
Gli utenti possono afferrare gli inviti degli angoli per eseguire un ridimensionamento uniforme.Users can grab the corner affordances to scale uniformly.


Manipolazione non basata sugli invitiNon-affordance-based manipulation

Con questo tipo di manipolazione, non è associato alcun invito al cubo di delimitazione.Non-affordance-based manipulation doesn't attach affordance to the bounding box. Gli utenti possono solo visualizzare il cubo di delimitazione e quindi interagire direttamente con esso.Users can only reveal the bounding box, then directly interact with it. Se il cubo di delimitazione viene afferrato con una mano, lo spostamento e la rotazione dell'oggetto sono associati al movimento e all'orientamento della mano.If the bounding box is grabbed with one hand, the translation and rotation of the object are associated to motion and orientation of the hand. Quando l'oggetto viene afferrato con due mani, gli utenti possono spostarlo, ridimensionarlo e ruotarlo in base al relativi movimenti delle mani.When the object is grabbed with two hands, users can translate, scale, and rotate it according to relative motions of two hands.

Una manipolazione specifica richiede precisione.Specific manipulation requires precision. È consigliabile usare la manipolazione basata sugli inviti, poiché offre un elevato livello di granularità.We recommend that you use affordance-based manipulation because it provides a high level of granularity. Per una manipolazione flessibile, è consigliabile usare la manipolazione non basata sugli inviti, perché trasmette esperienze immediate e divertenti.For flexible manipulation, we recommend you use non-affordance manipulation as it allows for instant and playful experiences.



Movimenti istintiviInstinctual gestures

Con HoloLens (prima generazione) sono stati insegnati agli utenti un paio di movimenti predefiniti, ad esempio l'apertura della mano a fiore e la simulazione del tocco.With HoloLens (1st gen), we taught users a couple of predefined gestures, such as bloom and air tap. Per HoloLens 2 non viene richiesto agli utenti di memorizzare movimenti simbolici.For HoloLens 2, we don't ask users to memorize any symbolic gestures. Tutti i movimenti richiesti agli utenti per interagire con ologrammi e contenuti sono istintivi.All required user gestures, where users need to interact with holograms and content, are instinctual. Per ottenere il movimento istintivo è sufficiente guidare gli utenti a eseguire gesti in base a come sono progettati gli inviti dell'interfaccia utente.The way to achieve instinctual gestures is to help users perform gestures through the design of UI affordances.

Se ad esempio un oggetto o un punto di controllo deve essere afferrato avvicinando due dita, l'oggetto o il punto di controllo deve essere piccolo.For example, if we encourage the user to grab an object or a control point with a two finger pinch, the object or the control point should be small. Se si vuole che l'utente afferri con cinque dita, l'oggetto o il punto di controllo deve essere relativamente grande.If we want the user to do a five finger grab, the object or the control point should be relatively large. Come avviene per i pulsanti, un pulsante piccolo consentirebbe agli utenti di eseguire la pressione con un solo dito.Similar to buttons, a tiny button would limit users to press it with a single finger. Un pulsante grande inviterebbe gli utenti a fare pressione con i palmi.A large button would encourage users to press it with their palms.

Figura che mostra l'utente che afferra un oggetto piccolo per eseguire lo spostamentoGraphic showing user grabbing small object to move
Oggetto piccoloSmall object

Figura che mostra l'utente che afferra un oggetto medio per eseguire lo spostamentoGraphic showing user grabbing medium object to move
Oggetto medioMedium object

Figura che mostra l'utente che afferra un oggetto grande per eseguire lo spostamentoGraphic showing user grabbing large object to move
Oggetto grandeLarge object




Progettazione simmetrica tra mani e controller 6DoFSymmetric design between hands and 6 DoF controllers

Avrai notato che sono presenti simmetrie di interazione che è possibile tracciare tra le mani nella realtà aumentata (AR) e i controller del movimento nella realtà virtuale (VR).You may have noticed that there are interaction parallels we can draw between hands in AR and motion controllers in VR. Entrambi gli input possono essere usati per avviare manipolazioni dirette nei rispettivi ambienti.Both inputs can be used to trigger direct manipulations in their respective environments. In HoloLens 2 afferrare e trascinare con le mani a una distanza ravvicinata funziona praticamente come il pulsante usato per afferrare nei controller del movimento in WMR.In HoloLens 2, grabbing and dragging with hands at a close distance works much the same way as the grab button does on WMR motion controllers. In questo modo si offre una familiarità di interazione tra le due piattaforme che può rivelarsi utile se in futuro si decidesse di convertire l'applicazione da una piattaforma all'altra.This provides users with interaction familiarity between the two platforms, which might prove useful if you ever decide to port your application between platforms.



Ottimizzare con il tracciamento oculareOptimize with eye tracking

La manipolazione diretta può essere fantastica se funziona come previsto.Direct manipulation can feel magical if it works as intended. Ma può anche diventare frustrante se non riesci a spostare la mano in una direzione qualunque senza attivare involontariamente un ologramma.But it can also become frustrating if you can’t move your hand anywhere without unintentionally triggering a hologram. Il tracciamento oculare aiuta a identificare meglio l'intenzione dell'utente.Eye tracking potentially helps to better identify what the user’s intent is.

  • Quando: per ridurre l'attivazione involontaria di una risposta di manipolazione.When: Reduce unintentionally triggering a manipulation response. Il tracciamento oculare consente di comprendere meglio l'attività in cui è attualmente impegnato un utente.Eye tracking allows for better understanding what a user is currently engaged with. Si supponga ad esempio di essere impegnati nella lettura di un testo olografico (istruzioni) e di sporgersi per afferrare uno strumento di lavoro del mondo reale.For example, imagine you're reading through a holographic (instructional) text when reaching over to grab you real-world work tool.

In questo modo si sposta accidentalmente la mano su alcuni pulsanti olografici interattivi non notati primaBy doing so, you accidentally move your hand across some interactive holographic buttons that you hadn't even noticed before. (forse perché erano fuori del campo visivo).For example, it may be outside the user's field-of-view (FoV).

Se l'utente non ha guardato un ologramma per un periodo di tempo ma è stato rilevato un evento di tocco o cattura, è probabile che l'interazione non sia intenzionale.If the user hasn't looked at a hologram for a while, yet a touch or grasp event has been detected for it, the interaction is likely unintentional.

  • Quale: oltre alla gestione delle attivazioni false positive, un altro esempio include una migliore identificazione degli ologrammi da afferrare o toccare dal momento che il punto di intersezione preciso potrebbe non essere chiaro dalla tua prospettiva, soprattutto in presenza di più ologrammi ravvicinati.Which one: Aside from addressing false positive activations, another example includes better identifying which holograms to grab or poke as the precise intersection point may not be clear from your perspective, especially if several holograms are positioned close to each other.

    Anche se il tracciamento oculare in HoloLens 2 presenta limiti relativamente all'accuratezza di determinazione dello sguardo, questa funzionalità può comunque essere utile per le interazioni da vicino a causa della disparità di profondità durante l'interazione con l'input mano.While eye tracking on HoloLens 2 has limitations based on how accurately it can determine your eye gaze, this can still be helpful for near interactions because of depth disparity when interacting with hand input. Ciò significa che talvolta è difficile determinare se la mano si trova dietro o davanti a un ologramma, ad esempio per afferrare con precisione un widget di manipolazione.This means it's sometimes difficult to determine whether your hand is behind or in front of a hologram to precisely grab a manipulation widget, for example.

  • Dove: usa le informazioni su ciò che l'utente sta guardando con movimenti di lancio rapido.Where to: Use information about what a user is looking at with quick-throwing gestures. Afferra un ologramma e scaglialo verso la destinazione prevista.Grab a hologram and roughly toss it toward your intended destination.

    Anche se questa soluzione a volte funziona correttamente, l'esecuzione rapida di movimenti della mano può avere come risultato destinazioni estremamente imprecise.While this sometimes works, quickly doing hand gestures may result in highly inaccurate destinations. Il tracciamento oculare tuttavia può migliorare l'accuratezza del movimento.However, eye tracking could improve the accuracy of the gesture.



Manipolazione in MRTK (Mixed Reality Toolkit) per UnityManipulation in MRTK (Mixed Reality Toolkit) for Unity

Con MRTK è possibile ottenere facilmente un comportamento di manipolazione comune usando lo script ObjectManipulator.With MRTK, you can easily achieve common manipulation behavior using the script ObjectManipulator. ObjectManipulator consente di afferrare e spostare gli oggetti direttamente con le mani o con il raggio della mano.With ObjectManipulator, you can grab and move objects directly with hands or with hand ray. Supporta anche la manipolazione a due mani per il ridimensionamento e la rotazione di un oggetto.It also supports two-handed manipulation for scaling and rotating an object.


Vedere ancheSee also