Interfaccia grafica

In questo capitolo vengono illustrati gli elementi principali dell'interfaccia grafica dell'applicazione tramite i quali potrete ineragire con il sistema.

Dispositivi

L'interfaccia grafica cambia a seconda del dispositivo hardware che si sta utilizzando.

Usando quindi l'applicazione su computer desktop, smartphone, tablet, etc. l'interfaccia verrà ottimizzata per le dimesioni e forma del display del dispositivo stesso.

Gli elementi interattivi sono comunque presenti in tutte la varianti dell'interfaccia.

Desktop e laptop

layout desktop

Smartphone

layout desktop

Componenti dell'interfaccia

Qui di seguito gli elementi interattivi principali che compongono l'interfaccia grafica.

Azione

Per azione si intende l’insieme delle funzioni interattive che permetto di effettuare uno dato compito.

Un esempio di azione è la gestione dei dati di un’associazione.

Un’azione può avere una o più sotto-azioni che costituiscono un compito circoscritto che contribuisce allo scopo dell’azione da cui dipende. Nell’interfaccia dell’applicazione è sempre attiva un’azione, tra quelle disponibili, con la quale interagire.

Titolo azione attiva

Nella barra degli strumenti dell’applicazione è sempre visualizzato il nome dell’azione attualmente attiva.

Barra strumenti dell’applicazione

Nella barra degli strumenti dell’applicazione è sempre visibili nella zona alta del display e contiene alcuni componenti base dell’interfaccia.

Guida in linea

E’ un’icona attiva, presente nella barra strumenti dell’applicazione, che permette di accedere direttamente a questa stessa guida.

Utenza autenticata

E’ un’icona attiva, presente nella barra strumenti dell’applicazione, che permette di mostrare la finestra modale dalla quale sono accessibili le funzioni di gestione del proprio account (quello con il quale ci si è autenticati).

dialogo utenza

La finestra modale include i seguenti sotto-elementi:

Avatar utenza

E’ un immagine che identifica l’utenza in uso.

E’ possibile personalizzare quale immagine deve essere visualizzata utilizzando il servizio gratuito gravatar associando un’immagine all’indirizzo email utilizzato per il proprio account utente.

Nel caso non sia stata impostata, l’immagine viene generata automaticamente.

Nome utenza

E’ il nome che viene mostrato per riferirsi all’utenza attualmente autenticata.

E’ possibile personalizzare il nome dalla gestione dell’utenza).

Identificativo utenza

E’ il nome univoco con il quale il sistema identifica l’utenza attualmente autenticata.

E’ anche il nome che deve essere usato durante la fase di accesso al sistema.

Gestione account

E’ un pulsante che permette di avviare l’azione tramite la quale è possibile ottenere informazioni sull’utenza autenticata e modificarne degli aspetti.

Impostazioni

Pulsante di accesso ad configurazioni di sistema e preferenze dell’utente.

Logout

Funzione di terminazione dell’attività interattiva autenticata.

Il sistema non può più differenziare i permessi di accesso ed interazione con i dati da esso gestiti in base all’utenza che sta interagendo con lo stesso. L’utente è cioè sconosciuto al sistema che negherà accesso alla maggior parte delle funzioni.

Versione

E’ un testo informativo, presente nella barra del menù contestuale, che mostra la versione dell’applicazione che si sta correntemente utilizzando.

Menù contestuale

E’ la barra laterale dentro la quale sono resi accessibili informazioni e collegamenti ad azioni e sotto-azioni dipendenti dall’azione o sotto-azione attiva.

Nella modalità di visualizzazione a schermo stretto (es. smartphone) la barra è normalmente nascosta ma può essere mostrata cliccando o toccando l’icona del menù presente nella barra strumenti dell’applicazione, oppure trascinando verso destro il lato sinistro del bordo dell’interfaccia dell’applicazione.

Riquadro azione

La zona centrale dell’interfaccia contiene il riquadro dell’azione attualmente attiva. E’ di norma costituito da un riquadro a scheda contente le informazioni e gli elementi interattivi messi a disposizione dall’azione o sotto-azione in uso.

Barra strumenti dell’azione

Di norma, il riquadro dell’azione, dispone di una barra strumenti, usualmente posizionata in alto, che consente di effettuare alcune operazioni di navigazione ed informa sullo stato dell’azione o sotto-azione attiva.

  • Può consentire di tornare alla azione dalla quale quella corrente dipende.
  • Se l’azione può essere terminata, ne consente la chiusura.
  • Può mostrare un titolo o altre informazioni sintetiche sui dati interessanti dall’azione o sotto-azione che con la quale si sta interagendo.
  • Può incorporare un menù di contesto che consente un rapido accesso alle più significative funzioni dipendenti dall’azione con la quale si sta interagendo.
  • Può agevolare l'esecuzione di operazioni particolarmente significative per l'azione o sotto-azione che con la quale si sta interagendo.

action toolbar

Notifica eventi

Nell’area bassa del display possono comparire, e rimanere visibili per un limitato periodo di tempo, riquadri di notifica tramite i quali il sistema informa l’utilizzatore su il risultato di un’operazione, lo stato del sistema stesso e tutto quanto possa essere utile portare all’attenzione dell’utente.

I riquadri di notifica sono caratterizzati da uno sfondo di uno dei colori possibili.

Il colore informa su quale sia la natura della notifica.

  • Azzurro: notifica puramente informativa
  • Verde: notifica di operazione completata con successo.
  • Rosso: notifica di un errore o di una situazione che impedisce il completamento di un’operazione o l’operatività del sistema.
  • Arancione: notifica di un avvertimento, per il verificarsi di una situazione che potenzialmente può essere problematica.