Palloncini

Nota

Questa guida alla progettazione è stata creata per Windows 7 e non è stata aggiornata per le versioni più recenti di Windows. Gran parte delle linee guida si applica ancora in linea di principio, ma la presentazione e gli esempi non riflettono le linee guida correnti sulla progettazione.

Un palloncino è una piccola finestra popup che informa gli utenti di un problema non critico o di una condizione speciale in un controllo.

Screenshot che mostra un palloncino che indica che il blocco di maiuscole è attivo.

Un palloncino tipico.

I palloncini hanno un'icona, un titolo e un testo del corpo, tutti facoltativi. A differenza delle descrizioni comandi e delle infotipi, anche i palloncini hanno una coda che identifica la propria origine. In genere l'origine è un controllo, in tal caso, denominato controllo proprietario.

Mentre i palloncini informano gli utenti di problemi non critici, non impediscono problemi anche se il controllo proprietario potrebbe. Qualsiasi problema non gestito deve essere gestito dall'interfaccia utente del proprietario quando gli utenti tentano di eseguire il commit all'azione.

I palloncini vengono in genere usati con caselle di testo o controlli che usano caselle di testo per modificare i valori, ad esempio caselle combinate, visualizzazioni elenco e visualizzazioni albero. Altri tipi di controlli sono sufficientemente vincolati e non hanno bisogno dei palloncini di feedback aggiuntivi. Inoltre, se si verifica un problema con altri tipi di controlli, spesso comporta incoerenze tra più controlli una situazione per cui i palloncini non sono adatti. Solo i controlli di immissione di testo sono entrambi non vincolati e un'origine comune di errori a singolo punto.

Una notifica è un tipo specifico di palloncino visualizzato da un'icona dell'area di notifica .

Nota: Le linee guida relative alle notifiche, alle descrizioni comandi e alle descrizioni comandi e ai messaggi di errore vengono presentati in articoli separati.

È il controllo giusto?

Per decidere, prendi in considerazione queste domande:

  • Le informazioni descrivono un problema o una condizione speciale? Se non è così, usa un altro controllo. Non usare palloncini per visualizzare informazioni supplementari per un controllo; prendere in considerazione l'uso di testo statico, infotipi, divulgazione progressiva o richieste.
  • Il problema o la condizione speciale possono essere rilevate immediatamente sull'input o quando il controllo proprietario perde lo stato attivo dell'input? In caso contrario, usare un messaggio di errore visualizzato in una finestra di dialogo di attività o in una finestra di messaggio.
  • Per i problemi, il problema è critico? In tal caso, usare un messaggio di errore visualizzato in una finestra di dialogo o in una finestra di messaggio. Tali messaggi di errore richiedono l'interazione (che è adatta per gli errori critici), mentre i palloncini non sono.
  • Per condizioni speciali, la condizione è ancora valida? In tal caso, i palloncini sono appropriati. Per le condizioni non valide, è meglio prevenirle al primo posto. Per le condizioni probabilmente previste, non è necessario eseguire alcuna operazione.
  • Il problema o la condizione speciale può essere espressa in modo conciso? Se non è così, usa un altro controllo. I palloncini non possono avere spiegazioni dettagliate o fornire informazioni supplementari.
  • Le informazioni descrivono il controllo attualmente in corso? In tal caso, usare invece un suggerimento, a meno che gli utenti non debbano interagire con il messaggio.
  • Le informazioni sono correlate all'attività corrente dell'utente? In caso contrario, è consigliabile usare una notifica o una finestra di dialogo . Gli utenti potrebbero ignorare i palloncini all'esterno dell'attività corrente e, per impostazione predefinita, i palloncini si timeout dopo 10 secondi.
  • Le informazioni provengono da una singola origine specifica? Se un problema o una condizione ha più origini o nessuna origine specifica, usare invece un messaggio sul posto o una finestra di dialogo.

Errore:schermata di un palloncino: accesso non riuscito

In questo esempio, il problema potrebbe essere con il nome utente o la password, ma segnalando il problema con un palloncino visivamente suggerisce che solo la password è il problema. Di conseguenza, il feedback dall'immissione di un nome utente non corretto è fuorviante.

I palloncini sono un'alternativa alle infotipi, alle finestre di dialogo e ai messaggi sul posto. Al contrario delle descrizioni comandi e delle infotipi:

  • I palloncini possono essere visualizzati indipendentemente dalla posizione corrente del puntatore, quindi hanno una coda che indica la loro origine.
  • I palloncini hanno un titolo, un testo del corpo e un'icona.
  • I palloncini possono essere interattivi, mentre è impossibile fare clic su una punta.

Al contrario delle finestre di dialogo modali:

  • I palloncini non rubano lo stato attivo dell'input o richiedono l'interazione.
  • I palloncini identificano una singola origine specifica. I dialoghi modali possono avere più origini o nessuna origine specifica.

Al contrario dei messaggi sul posto:

  • I palloncini sono più evidenti.
  • I palloncini non richiedono lo spazio dello schermo disponibile o il layout dinamico necessario per visualizzare i messaggi sul posto.
  • I palloncini si rimuoveno automaticamente dopo un timeout.

Modelli di utilizzo

I palloncini hanno questi modelli di utilizzo:

Utilizzo Esempio
Problema di input Problema di input utente non critico proveniente da un singolo controllo proprietario, in genere una casella di testo.
l'uso di palloncini per i messaggi di errore non ruba lo stato attivo dell'input, ma è ancora molto evidente se il controllo proprietario ha lo stato attivo di input. per correggere il problema, l'utente potrebbe dover modificare o immettere nuovamente l'input; ma se il controllo proprietario ignora l'input non corretto, l'utente potrebbe non dover apportare modifiche. poiché il problema non è critico, non è necessaria alcuna icona di errore .
Screenshot che mostra un palloncino che indica un carattere non corretto.
Un palloncino usato per segnalare un problema di input utente non critico.
Condizione speciale Il controllo proprietario è in uno stato che influisce sull'input. Questo stato è probabilmente imprevisto e l'utente potrebbe non capire che l'input è interessato.
usare i palloncini per evitare la frustrazione avvisando gli utenti di condizioni speciali non appena si verificano (ad esempio, superando le dimensioni massime di input o impostando i limiti di blocco per errore). è importante fornire tali commenti senza rubare lo stato attivo dell'input o forzare l'interazione perché queste condizioni potrebbero essere intenzionali. questi palloncini sono particolarmente importanti per le caselle password e pin, dove gli utenti stanno altrimenti lavorando con commenti minimi. questi palloncini hanno un'icona di avviso.
Screenshot che mostra i palloncini che indicano blocco maiuscole è attivo e viene immesso un carattere non corretto.
Un palloncino usato per segnalare una condizione speciale.

Linee guida

Quando visualizzare

  • Visualizzare il palloncino non appena viene rilevato il problema o la condizione speciale, anche se ripetutamente, senza alcun ritardo evidente.
    • Per problemi relativi a singoli caratteri o alla dimensione massima di input, visualizzare immediatamente il palloncino sull'input.
    • Per i problemi relativi al valore di input ,inclusa la necessità di un valore non vuoto, visualizzare il palloncino quando il controllo proprietario perde lo stato attivo dell'input. In caso contrario, la visualizzazione di palloncini mentre gli utenti stanno immettendo un input potenzialmente valido possono essere distratti e fastidiosi.
  • Visualizzare un solo palloncino alla volta. La visualizzazione di più palloncini può essere travolgente. Se un singolo evento genera più problemi, presenta tutti i problemi contemporaneamente o segnala solo il problema più importante.

Non corretto:screenshot di due palloncini che puntano a una casella

In questo esempio due problemi vengono presentati in modo errato contemporaneamente.

Tempo da visualizzare

  • Rimuovere un palloncino quando:
    • Il problema viene risolto o viene rimossa una condizione speciale.
    • L'utente immette dati validi (per problemi di input).
    • Il palloncino si timeout. Per impostazione predefinita, i palloncini si rimuoveno dopo 10 secondi, anche se gli utenti possono modificarli modificando il parametro di sistema SPI_MESSAGEDURATION.
  • Rimuovere il timeout se gli utenti non possono continuare finché il problema non viene risolto. Sviluppatori: in Win32 è possibile impostare l'ora di visualizzazione con il messaggio di TTM_SETDELAYTIME.

Come visualizzare

  • Visualizzare i palloncini sotto il controllo proprietario. In questo modo, gli utenti possono visualizzare il contesto, incluso il controllo proprietario e la relativa etichetta. Microsoft Windows regola automaticamente le posizioni dei palloncini in modo che siano completamente sullo schermo. Il comportamento predefinito consiste nel visualizzare un palloncino sopra il controllo proprietario, come fatto con le notifiche.

Corretto:screenshot di un palloncino visualizzato sotto il controllo

Errore:schermata di un palloncino visualizzato sopra il controllo

Nell'esempio errato, il palloncino viene visualizzato in modo imbarazzante sopra il controllo proprietario.

Caselle di testo Password e PIN

  • Usare un palloncino per indicare che blocco maiuscole è attivo, usando il testo nell'esempio seguente:

screenshot di un palloncino che indica che il blocco di maiuscole è attivo

In questo esempio, un palloncino indica che Il blocco maiuscole è attivo in una casella di testo PIN.

  • Usare un palloncino per indicare quando gli utenti tentano di superare le dimensioni massime di input. Raggiungere le dimensioni massime di input è molto meno ovvio nelle caselle di testo password e PIN rispetto alle caselle di testo normali.

schermata di un palloncino che indica limiti di codice pin

In questo esempio, un palloncino indica che l'utente sta tentando di superare le dimensioni massime di input.

  • Usare un palloncino per indicare quando gli utenti inseriscono caratteri non corretti. Tuttavia, è meglio non avere tali restrizioni perché riducono la sicurezza della password o del PIN. Per evitare la divulgazione delle informazioni, il palloncino deve indicare solo fatti documentati sulle password o sui PIN validi.

screenshot di un palloncino che indica un input non corretto

In questo esempio, un palloncino indica che il PIN richiede numeri.

Altre caselle di testo

  • Prendere in considerazione l'uso di un palloncino per indicare quando gli utenti tentano di superare le dimensioni massime di input per le caselle di testo critiche e brevi destinate agli utenti principianti. Alcuni esempi includono nomi utente e nomi di account. Le caselle di testo vengonoepte quando gli utenti tentano di superare l'input massimo, ma gli utenti principianti potrebbero non comprendere il significato del segnale acustico.

schermata di un palloncino che indica i limiti dei caratteri

In questo esempio, un palloncino indica che l'utente ha tentato di superare le dimensioni massime di input.

Interazione

  • Quando gli utenti fa clic su un palloncino, basta ignorare il palloncino senza visualizzare un'altra interfaccia utente o avere un altro effetto collaterale. A differenza delle notifiche, i palloncini non devono avere pulsanti di chiusura.

Icone

  • Scegliere l'icona in base al modello di utilizzo:

    Modello Icona
    Problema di input Nessuna icona. Non usare un'icona di errore qui è coerente con le linee guida per il tono di Windows .
    Condizione speciale Icona di avviso di 16x16 pixel standard.

Accessibilità

Se usato correttamente, i palloncini migliorano l'accessibilità. Per rendere accessibili i palloncini:

  • Visualizza solo i palloncini correlati all'attività corrente dell'utente.
  • Mantenere conciso il testo del palloncino. In questo modo il testo del palloncino risulta più semplice da leggere per gli utenti con bassa visione e riduce al minimo l'interruzione quando si legge da utilità di lettura dello schermo.
  • Ridisplay il palloncino ogni volta che si ripete il problema o la condizione.

Text

Testo titolo

  • Usare il testo del titolo che riepiloga brevemente il problema di input o una condizione speciale in linguaggio chiaro, semplice, conciso, specifico. Gli utenti devono essere in grado di comprendere lo scopo del palloncino rapidamente e con un minimo sforzo.
  • Usare frammenti di testo o frasi complete senza punteggiatura finale.
  • Usare le maiuscole/minuscole come nelle frasi comuni. Per altre informazioni, vedere il glossario.
  • Usare non più di 48 caratteri (in inglese) per supportare la localizzazione. Il titolo ha una lunghezza massima di 63 caratteri e deve essere in grado di espandere per almeno il 30% per supportare la localizzazione.

Testo corpo

  • Usare la prima frase del testo del corpo per stato del problema o condizione in modo che sia chiaramente rilevante per l'utente. Non ripetere le informazioni nel titolo. Omettere questo se non c'è altro da aggiungere.
  • Usare la seconda frase per specificare le operazioni che l'utente può eseguire per risolvere il problema o ripristinare lo stato. In conformità alle linee guida stile e tono, non è necessario usare la parola Per favore in questa istruzione. Inserire due interruzioni di riga tra le prime e le seconde frasi.

schermata di un palloncino con titolo e testo del corpo

In questo esempio viene illustrato il layout di testo del palloncino standard.

  • Spiegare come risolvere il problema o ripristinare lo stato anche se questa spiegazione è ovvia, ma omettere la ridondanza tra l'istruzione del problema e la relativa risoluzione. Eccezioni:
    • Omettere la risoluzione se non può essere espressa in modo conciso o senza ridondanza significativa.
    • Omettere la risoluzione se non c'è nulla da fare per l'utente, ad esempio quando i caratteri non corretti vengono ignorati.
  • Usare frasi complete con punteggiatura finale.
  • Usare le maiuscole/minuscole come nelle frasi comuni.
  • Usare non più di 200 caratteri (in inglese) per supportare la localizzazione. Il testo del corpo ha una lunghezza massima di 255 caratteri e deve essere in grado di espandere almeno il 30% per supportare la localizzazione.

Documentazione

Quando si fa riferimento a palloncini:

  • Usare il testo esatto del titolo, inclusa la maiuscola.
  • Fare riferimento al componente come palloncino, non come notifica o avviso.
  • Se possibile, formattare il testo del titolo usando il testo grassetto. In caso contrario, inserire il titolo tra virgolette solo se necessario per evitare confusione.