usabilità Web: avviso / notifica - come attirare l'attenzione?

Question

Sto costruendo un'applicazione web in cui una delle caratteristiche provoca agli utenti di essere informati in tempo reale quando si verifica un avviso di loro pertinenza, simile al grande barra arancione in overflow dello stack.

Ho un paio di opzioni, e mi chiedevo se ci fosse una linea guida usabilità sul modo migliore per andare su questo. Una possibilità è quella di avere una piccola scatola notifiche sullo schermo che lampeggia colori quando viene visualizzato un avviso, ma sono preoccupato che un semplice, ripetuto cambiamento di colore non sarà sufficiente per attirare l'attenzione dell'utente.

Un'altra opzione è quella di avere una finestra fluttuante venire attraverso lo schermo, chiedendo l'attenzione dell'utente, ma ho sempre trovato quelle da invadente. Forse un'altra forma di animazione potrebbe essere meno fastidioso ma ugualmente in grado di attirare l'attenzione dell'utente?

Non sto veramente alla ricerca di un parere, per quanto sto cercando una discussione usabilità / risorsa che potrebbe coprire questo tipo di decisione.

Answer 1

La risposta un po 'dipende da quanto sia importante che l'attenzione di paga utente e quanto sia importante che prendono qualche azione? Per esempio. è l'avviso del "server appena andato in crash" tipo o "si dispone di nuovi e-mail da zia Zelda" tipo?

Per il primo tipo, qualcosa invadente è la migliore - sia la vostra opzione di galleggiare una finestra, o può essere cambiare lo sfondo della pagina di colore appariscente (e lampeggia ??? Non mi ha colpito per favore!). Un altro bel modo di afferrare l'attenzione che ho visto è stato quello di cambiare la pagina (e quindi una finestra del browser) titolo per una serie lampeggiante di "* * * * * *" -. Che è ONU-usuale abbastanza per attirare l'attenzione a volte

Per qualcosa di meno invadente per meno critica troppo preavviso in modo rapido, barra superiore di notifica del SO è una delle migliori soluzioni dal punto di vista dell'usabilità (se non il migliore), passando per le principali metriche (quanto lavoro fa l'utente bisogno di fare per affrontare questo e di vedere le cose, e in che modo intuitivo il suo comportamento è):

• Gli occhi dell'utente viaggiano alla parte superiore dello schermo più spesso e più probabile che altrove

• E 'molto facile per sbarazzarsi di una volta si nota - il bar è ampio (facile da colpire con il mouse, senza aggiustamenti horisontal necessario) e al primo posto (non troppo bene il lavoro del mouse per ottenere il puntatore lì).

Answer 2

IMHO, il livello di fastidio dovrebbe riflettere il livello di errore ... Per un errore, uno strato con il messaggio di errore, impedendo all'utente di fare qualsiasi altra cosa dovrebbe essere migliore. Per una notifica, una scatola che appare sulla parte superiore della pagina (come un browser che ti chiede di salvare una password) è bello.

Quindi non credo che ci sia una soluzione migliore ... E 'appena dipende dal tipo di avviso ...:)

Answer 3

JGrowl , è un bel quadro per le notifiche discreto, si possono trovare alcuni screenshot di esempio qui .

Answer 4

Se siete alla ricerca di risorse, vi suggerisco di Non farmi pensare da Steve Krug. Il suo sito, avanzata Common Sense , è anche una grande fonte.

Un altro ottimo sito per suggerimenti usabilità e linee guida è di Jakob Nielsen useit.com

Io ero in un sito, l'altro giorno che aveva un pulsante di download del prodotto. Ho cliccato su di esso, sembrava non fosse successo niente. Ho cliccato di nuovo, e il link di download che il primo pulsante creato ha fatto una piccola scossa di me. Molto efficace e ha ottenuto una risata:

http://haanstra.eu/putty/

Answer 5

Il mio sistema ha tre tipi di notifiche. Ogni tipo di comunicazione è in stile con un colore del bordo e lo sfondo:

• Successo: verde
• Attenzione: giallo
• Errore: rosso

Avvisi, come "Tu non riempire quel campo in modo corretto!" sono gestite in linea, in modo che nessun popup per irritare l'utente.

Ho progettato il mio sistema per le notifiche fade out di pochi secondi - questo significa che gli utenti sono abituati a vedere la scatola verde che svanisce dopo pochi secondi. Tuttavia, quando un errore o un avviso si verifica la casella rimane sullo schermo proprio di fronte l'utente, chiedendo attenzione.

Credo avvisi e gli errori dovrebbero essere utilizzati solo quando è assolutamente necessario - in questo modo quando vengono utilizzati, mantengono un livello significativo di impatto. Nel mio sistema, gli avvisi e gli errori non sbiadiscono fuori - rimangono lì per ricordarvi qualcosa non è giusto.

Nella mia esperienza, se hai intenzione di interagire con un utente, renderlo grande e in faccia, ma non ce la fanno tanto è vero che si ostacola il resto della pagina. Quindi non richieste, o sovrapposizioni di stile Lightbox (a mio parere).

Answer 6

trovo la funzione di effetto jQuery UI highlight () è un bene per avvisare gli utenti con discrezione che qualcosa è cambiato; tuttavia, come altri hanno detto, dipende dalla importanza del messaggio - a volte basta essere invadente