Nozioni di base sulla gestione dei comandi

In un'app di Windows gli elementi di comando sono elementi interattivi dell'interfaccia utente che consentono agli utenti di eseguire azioni come l'invio di un messaggio di posta elettronica, l'eliminazione di un elemento o l'invio di un modulo. Le interfacce di comando sono costituite da elementi di comando condivisi, dalle superfici dei comandi che li ospitano, dalle interazioni supportate e dalle esperienze offerte.

Offrire la migliore esperienza di comando

L'aspetto più importante di un'interfaccia di comando è quello che si sta tentando di consentire a un utente di eseguire. Durante la pianificazione della funzionalità dell'app, prendere in considerazione i passaggi necessari per eseguire tali attività e le esperienze utente da abilitare. Dopo aver completato una bozza iniziale di queste esperienze, è possibile prendere decisioni sugli strumenti e le interazioni per implementarli.

Ecco alcune esperienze comuni relative ai comandi:

• Invio o presentazione di informazioni
• Selezione di impostazioni e scelte
• Ricerca e filtro del contenuto
• Apertura, salvataggio ed eliminazione di file
• Modifica o creazione di contenuto

Essere creativi con la progettazione delle esperienze di comando. Scegliere i dispositivi di input supportati dall'app e il modo in cui l'app risponde a ogni dispositivo. Supportando la gamma più ampia di funzionalità e preferenze, puoi rendere la tua app il più utilizzabile, portatile e accessibile possibile (vedi Progettazione dei comandi per le app di Windows per altri dettagli).

Scegliere gli elementi di comando corretti

L'uso degli elementi giusti in un'interfaccia di comando può fare la differenza tra un'app intuitiva e facile da usare e un'app difficile e confusa. Un set completo di elementi di comando è disponibile nell'app di Windows. Ecco un elenco di alcuni degli elementi di comando UWP più comuni.

pulsanti

Pulsanti attivano azione immediata. Gli esempi includono l'invio di un messaggio di posta elettronica, l'invio di dati del modulo o la conferma di un'azione in una finestra di dialogo.

Liste

Elenchi presentano elementi in un elenco interattivo o in una griglia. In genere usato per molte opzioni o elementi di visualizzazione. Gli esempi includono elenco a discesa, casella di riepilogo, visualizzazione elenco e visualizzazione griglia.

Controlli di selezione

Consente agli utenti di scegliere tra alcune opzioni, ad esempio quando si completa un sondaggio o si configurano le impostazioni dell'app. Gli esempi includono CheckBox, RadioButtone Toggle switch.

Selettori di calendario, data e ora

Selettori di calendario, data e ora consentono agli utenti di visualizzare e modificare le informazioni di data e ora, ad esempio quando si crea un evento o si imposta un allarme. Gli esempi includono selezione data calendario, visualizzazione calendario, selezione data, selezione ora.

inserimento di testo predittivo

Fornisce suggerimenti mentre gli utenti digitano, ad esempio quando si inseriscono dati o si eseguono query. Gli esempi includono AutoSuggestBox.

Per un elenco completo, vedi Controlli ed elementi dell'interfaccia utente

Posizionare i comandi sulla superficie destra.

È possibile inserire elementi di comando in diverse superfici dell'app, tra cui il canvas dell'app o i contenitori di comandi speciali, ad esempio una barra dei comandi, un riquadro a comparsa della barra dei comandi, una barra dei menu o una finestra di dialogo.

Provare sempre a consentire agli utenti di modificare il contenuto direttamente anziché tramite comandi che agiscono sul contenuto, ad esempio trascinando e rilasciando per riorganizzare gli elementi di elenco anziché i pulsanti di comando su e giù.

Tuttavia, questo potrebbe non essere possibile con determinati dispositivi di input o quando si accomoda a specifiche capacità e preferenze dell'utente. In questi casi, fornire il maggior numero possibile di opzioni di comando e posizionare questi elementi di comando in un'area di comando nell'app.

Ecco un elenco di alcune delle aree di comando più comuni.

tela dell'app (area contenuto)

Se un comando è costantemente necessario per consentire agli utenti di completare gli scenari di base, inserirlo nell'area di disegno. Poiché è possibile inserire comandi vicino (o su) gli oggetti che influiscono, l'inserimento dei comandi nell'area di disegno li rende facili e ovvi da usare. Tuttavia, scegli attentamente i comandi da inserire nell'area di disegno. Troppi comandi nell'area di disegno dell'app occupano spazio prezioso sullo schermo e possono sovraccaricare l'utente. Se il comando non verrà usato di frequente, è consigliabile inserirlo in un'altra superficie di comando.

Barre dei comandi e barre dei menu

Le barre dei comandi aiutano a organizzare i comandi e a semplificarne l'accesso. Le barre dei comandi possono essere posizionate nella parte superiore dello schermo, nella parte inferiore dello schermo o sia nella parte superiore che nella parte inferiore dello schermo (è anche possibile usare un MenuBar quando la funzionalità nell'app è troppo complessa per una barra dei comandi).

Menu e menu di scelta rapida

I menu e i menu di scelta rapida consentono di risparmiare spazio organizzando i comandi e nascondendoli fino a quando l'utente non ne ha bisogno. Gli utenti accedono in genere a un menu o a un menu di scelta rapida facendo clic su un pulsante o facendo clic con il pulsante destro del mouse su un controllo.

CommandBarFlyout è un tipo di menu contestuale che combina i vantaggi di una barra dei comandi e di un menu di scelta rapida in un singolo controllo. Può fornire collegamenti ad azioni comunemente usate e consentire l'accesso a comandi secondari che sono rilevanti solo in determinati contesti, come la gestione degli appunti o i comandi personalizzati.

UWP offre anche un set di menu tradizionali e menu di scelta rapida; per ulteriori informazioni, vedi Menù eMenu di scelta rapida.

Fornire commenti e suggerimenti per i comandi

Il feedback dei comandi comunica agli utenti che è stata rilevata un'interazione o un comando, il modo in cui il comando è stato interpretato e gestito e se il comando ha avuto esito positivo o negativo. In questo modo gli utenti possono capire cosa hanno fatto e cosa possono fare in seguito. Idealmente, il feedback deve essere integrato naturalmente nell'interfaccia utente, quindi gli utenti non devono essere interrotti o intraprendere altre azioni, a meno che non sia assolutamente necessario.

Annotazioni

Fornire commenti e suggerimenti solo quando necessario e solo se non è disponibile altrove. Mantenere pulita e non ingombrante l'interfaccia utente dell'applicazione, a meno che non aggiunga valore.

Ecco alcuni modi per fornire commenti e suggerimenti nella tua app.

Barra dei comandi

L'area di contenuto di CommandBar è un luogo intuitivo per comunicare lo stato agli utenti se vogliono visualizzare commenti e suggerimenti.

immagine riquadro a comparsa

riquadri a comparsa

riquadri a comparsa sono popup contestuali leggeri che possono essere ignorati toccando o facendo clic all'esterno del riquadro a comparsa.

controlli di dialogo di

I controlli della finestra di dialogo sono sovrapposizioni modali dell'interfaccia utente che forniscono informazioni contestuali sull'applicazione. Nella maggior parte dei casi, le finestre di dialogo bloccano le interazioni con la finestra dell'app fino a quando non vengono ignorate in modo esplicito e spesso richiedono un tipo di azione da parte dell'utente. I dialoghi possono essere problematici e devono essere usati solo in determinate situazioni. Per altre info, vedi la sezione Quando confermare o annullare le azioni .

Suggerimento

Prestare attenzione a quanto l'app usa le finestre di dialogo di conferma; possono essere molto utili quando l'utente commette un errore, ma sono un ostacolo ogni volta che l'utente sta tentando di eseguire un'azione intenzionalmente.

Quando confermare o annullare le azioni

Indipendentemente dal modo in cui l'interfaccia utente dell'applicazione è ben progettata, tutti gli utenti eseguono un'azione che desiderano non avere. L'app può essere utile in queste situazioni richiedendo la conferma di un'azione o fornendo un modo per annullare le azioni recenti.

Per le azioni che non possono essere annullate e avere conseguenze importanti, è consigliabile usare una finestra di dialogo di conferma. Esempi di tali azioni includono:

• Sovrascrittura di un file
• Non salvare un file prima della chiusura
• Conferma dell'eliminazione permanente di un file o di dati
• Effettuare un acquisto (a meno che l'utente non scelga di rinunciare alla richiesta di conferma)
• Invio di un modulo, ad esempio l'iscrizione a qualcosa

Per le azioni che possono essere annullate, l'offerta di un semplice comando di annullamento è in genere sufficiente. Esempi di tali azioni includono:

• Eliminazione di un file
• Eliminazione di un messaggio di posta elettronica (non permanente)
• Modifica del contenuto o modifica del testo
• Ridenominazione di un file

Ottimizzare per tipi di input specifici

Per altre informazioni sull'ottimizzazione delle esperienze utente su un tipo di input o un dispositivo specifico, vedere la di introduzione all'interazione .