risposta-alla-domanda-sullo-sviluppo-web-bd.com

Modali in cima ai modali

Usando bootstrap modali, continuo a correre il problema di avere una modale informativa con contenuto al suo interno, ma è necessario avere un modale/popup "conferma la tua decisione" in cima all'iniziale modale.

Per esempio. Ho una pagina con un elenco di utenti. Puoi fare clic su un utente per aprire un modale con le informazioni dell'utente al suo interno. Quindi ci sarà forse un pulsante "rimuovi utente" nel modale che richiede un "conferma rimuovere utente" modale.

È mai una buona idea avere un modale sopra un altro modale o sto usando modali sbagliati? Dovrei usare invece le pagine reali?

32
Corey Rothwell

Quando dici modale su modale, suppongo che ti riferisci di più a una conferma della casella di avviso sul modale. Come per il mio commento, sto usando il modale di Twitter per visualizzare i profili utente come esempio perché senza altre informazioni dal tuo lavoro, questo è il caso più rilevante che mi viene in mente.

Per rispondere alla tua domanda, il modale sembra un'applicazione ragionevole e ha dei vantaggi nel portare l'utente in una nuova pagina - il più essenziale mantenendo il contesto dell'utente. Le modali sono ideali per creare un'area per attività autonome che focalizzano l'attenzione dell'utente. Quindi, se questi sono i tuoi obiettivi, una nuova pagina non ha senso. Pertanto, l'utilizzo di un modale sostitutivo per la conferma/avviso è un percorso praticabile.

Con Twitter, ad esempio, gli utenti nel feed potrebbero spark il tuo interesse e ti piacerebbe sapere informazioni un po 'più pertinenti senza perdere il contesto di dove ti trovi/cosa stai facendo. Inoltre non richiede che l'utente si impegni completamente, il che si tradurrebbe in una pagina completamente nuova.

enter image description hereenter image description here

n altro suggerimento è quello di utilizzare il modello di annullamento invece di un avviso/conferma. Un esempio è il prompt di annullamento di Gmail che appare dopo aver eliminato la posta. Ciò consente di salvare un passaggio dell'utente che agisce intenzionalmente e salva gli altri utenti da clic abituali senza lettura o incidenti. Questo sarebbe fatto all'interno del modale originale.

enter image description here

11
glilley

Non c'è nulla di sbagliato nel concetto di finestra modale sopra un'altra finestra modale. Devi solo farlo in modo elegante, in modo che l'utente non perda la logica della catena di azioni e non sia inquietante.

Alcuni consigli:

  • Non andare troppo lontano con la quantità di livelli modali (prova a rimanere al massimo: 2)
  • Utilizzare la proprietà modale SOLO quando realmente necessario: quando non è consentita alcuna altra azione prima che l'azione sia completata. Quando si conferma qualcosa, nella maggior parte dei casi l'utente è può eseguire altre azioni. Nel tuo esempio potrebbe esserci un elenco di utenti, ognuno con il proprio pulsante Rimuovi. Quando l'utente fa clic su Rimuovi, non deve essere tenuto a confermare. Potrebbe decidere "Ehi, è un record sbagliato, in realtà voglio rimuovere l'altro." Quindi può fare clic sull'altro pulsante Rimuovi, invece di dover prima chiudere la finestra di dialogo di conferma.

Per quanto riguarda l'esempio fornito: la seconda finestra di dialogo (conferma rimozione utente) non deve essere modale. Basta un piccolo popup con i pulsanti di conferma/annullamento. Non è necessario bloccare l'accesso a tutte le altre funzionalità. Qualcosa come questo:

enter image description here

17
Alph.Dev

Vorrei anche suggerire di utilizzare un menu a discesa per mostrare le informazioni di contatto iniziali e l'opzione "rimuovi contatto". Quindi quando l'utente seleziona quell'opzione ora mostri il modale per confermare quell'azione.

Ogni volta che mi imbatto in situazioni simili provo ad usare il menu a discesa o altri tipi di menu per mostrare informazioni piuttosto che usare un modale sopra un modale.

0
UX Research