it-swarm-eu.dev

Quando si crea una procedura guidata GUI, tutte le pagine / schede devono avere le stesse dimensioni?

Capisco che alcune biblioteche mi costringerebbero a farlo, ma la mia domanda è generale.

Se ho una serie di pulsanti in basso: Indietro, Avanti, Annulla? (Altro?), Allora la loro posizione dovrebbe mai cambiare? Se la risposta è no, cosa devo fare per le pagine con pochi contenuti? Allungo le cose? Metterli nell'angolo in alto a sinistra solitario? Secondo Steve Krug, non ha senso aggiungere nulla alla GUI che non ha bisogno di essere lì.

Capisco che ci sono diversi approcci ai maghi: alcuni hanno schede, altri no. Alcune schede sono allineate orizzontalmente nella parte superiore; altri - in verticale a sinistra. Alcuni non mostrano pagine/schede e sono semplicemente sequenze di finestre di dialogo. Questo è probabilmente un must quando la procedura guidata è "non lineare", ad es. alcune scelte precedenti possono provocare ramificazioni.

In entrambi i casi il problema è lo stesso: sacrificio sulla coerenza della "foto grande" (contorno della pagina/scheda + posizione dei pulsanti) o sulla coerenza dei dettagli (alcune schede potrebbero essere un po 'piene; altre con pochissimo contenuto) . Una terza scelta, suppongo, sta facendo uno sforzo supplementare nel contenuto al fine di assicurarsi che l'organizzazione del contenuto sia distribuita più o meno uniformemente da una pagina all'altra. Tuttavia, questo può essere difficile da fare (diciamo, quando la prima scheda contiene solo una scelta di tre cose, e poi si ramifica da lì; ci sono probabilmente altri esempi), e difficile mantenere questo equilibrio se uno qualsiasi dei contenuti cambia dopo.

Puoi consigliare un buon approccio? È gradito anche un collegamento a un post di blog pertinente o a un capitolo di un libro.

Fammi sapere se hai domande.

11
Job

La posizione dei pulsanti non dovrebbe mai cambiare. L'utente si aspetta che la posizione del pulsante "Avanti"/"Fine" rimanga costante in modo da poter mantenere il mouse fermo e fare clic accettando le opzioni predefinite.

Se hai alcune pagine con molti meno contenuti rispetto ad altre, è possibile che ci siano troppi contenuti nelle altre pagine. Spostalo tra le pagine esistenti o aggiungi nuove pagine, ma non troppe. Tuttavia, come altri hanno anche sottolineato, non dividere una pagina in modo arbitrario per soddisfare alcuni requisiti di dimensione artificiale. Se le opzioni vanno logicamente insieme, tienile insieme.

19
ChrisF

Wizard vs. Tabs
Utilizzare una procedura guidata quando si desidera guidare l'utente attraverso più passaggi necessari.
Utilizza le schede quando l'utente può selezionare una scheda arbitraria, apportare modifiche e quindi impegnarle senza guardare le altre schede.

Trovo sempre imbarazzante "Schede con Indietro/Avanti". Comprendo l'idea di fornire una piccola "rampa" tra utenti inesperti e avanzati, ma nella maggior parte dei casi che ho visto, il design delle singole pagine non è adatto agli utenti inesperti.

Size

Per un mago, non è solo una dimensione: l'utente dovrebbe avere l'impressione di interagire sempre con la stessa finestra. Questo è comunemente ottenuto attraverso un'intestazione e altri elementi di controllo nella stessa posizione in tutte le pagine e stesse dimensioni.

Esempio: InstallShield viola la metafora della "stessa finestra" piuttosto male (anche se non è ovvio): ogni pagina è una nuova finestra di dialogo modale, centrata sul monitor principale. Quindi sposta la finestra in un'altra posizione, fai clic su Avanti e bam, la tua finestra è tornata dove era. Aaaargh!

In una procedura guidata, la modifica delle dimensioni del modulo è piuttosto imbarazzante per gli utenti. È come tenergli la mano, ma tu balli costantemente attorno a lui. In termini più gravi: l'azione dell'utente (facendo clic su "Avanti") ha un effetto collaterale imprevisto ("Cambia dimensioni finestra"). Ciò riduce il controllo percepito dagli utenti sul software.

Direi che anche per le schede, cambiare le dimensioni è imbarazzante. In primo luogo, sembra di merda - quale soggettivo. In secondo luogo, se posizioni la finestra che contiene le schede in modo che siano nell'angolo di una schermata per rivelare un altro documento sul desktop, passa a un'altra pagina, o parte della finestra di dialogo svanisce o salta ulteriormente nel desktop, potenzialmente coprendo altre cose.


(Informativa completa: sto lavorando su un'app che lo fa, ed è colpa mia. Guardare gli utenti trascinarsi dietro quei poveri dialoghi mi fa rabbrividire. È uno di quei piccoli acceleratori che danno fastidio).


Se la scelta è tra "un po 'affollato" e "quasi vuoto", di solito va bene. Lo spazio vuoto sembra buono. Il solo fatto di avere una grande finestra prominente con un singolo campo di input rende una chiara affermazione: questo è il tuo prossimo passo ed è dannatamente facile. Questo è esattamente il messaggio che vuoi inviare con una procedura guidata.

11
peterchen

Supponendo che tu stia parlando di un'app desktop con finestre di dialogo di dimensioni fisse senza scorrimento, non credo che dovrai preoccuparti di riempire ogni pagina per lo stesso importo. È più importante dividere l'attività in piccoli passaggi coerenti coerenti con la capacità dell'utente di comprendere l'attività.

Se lo fai, non mi aspetto che gli utenti siano confusi da uno spazio vuoto tra i controlli di input e i pulsanti di comando nella parte inferiore, quindi non vorrei distribuire le cose. Spazio i controlli per indicare meglio come sono collegati input e istruzioni. Finché il passaggio sembra completo per gli utenti, non andranno a pensare che manchi qualcosa. Le procedure guidate di solito hanno uno spazio vuoto sopra i pulsanti e gli utenti comprendono che alcuni passaggi occupano più spazio di altri.

Penso che spostare i pulsanti verso l'alto per essere direttamente sotto i controlli di input su pagine sparse sia probabilmente più confuso. Gli utenti si aspettano che i pulsanti di "azione finale" si trovino nel margine inferiore. Spostali verso il centro e gli utenti potrebbero non vederli immediatamente come pulsanti di "azione finale". Ancora più importante è il punto nella risposta di ChrisF per consentire agli utenti che hanno familiarità con la procedura guidata di fare clic rapidamente.

4
Michael Zuschlag

Personalmente, vorrei:

  • rendere azione predefinita più grande (grassetto pari, a seconda del resto dell'interfaccia utente)

  • rendere opzione distruttiva rossa e forse anche non sembrare un pulsante (ad es. moduli "Login" in cui "annulla" sembra un collegamento mentre il pulsante di invio sembra un pulsante reale)

Oltre a ciò, non penso che debbano avere le stesse dimensioni purché lo spazio bianco attorno al testo della scheda sia lo stesso. Tuttavia per coerenza, la posizione del pulsante dovrebbe rimanere la stessa, in questo modo si allena gli utenti ad aspettarsi che l'interfaccia utente si comporti in un modo specifico.

1
wildpeaks

Dipende da dove si trovano i pulsanti Successivo/Precedente. La cosa più importante è che non cambiano mai posizione. Se si trovano in basso a destra, come è abbastanza comune, ciò indicherebbe anche che tutte le pagine devono avere le stesse dimensioni.
Se i pulsanti si trovano in alto a sinistra, la dimensione costante non è importante, ma potrebbe sembrare un po 'fuori ordine avere i pulsanti prima del contenuto.

1
awe