Interface design, letteralmente progettazione delle interfacce, è comunemente intesa come l'attività di progettazione dell'interfaccia utente (in inglese UI, User Interface) di un qualsiasi sistema informatico e software che dialoga con l'utente attraverso uno schermo.

In realtà l'interfaccia uomo/macchina (nell'accezione più comune la "macchina" è il computer) non è composta solo dall'interfaccia grafica che si visualizza virtualmente su uno schermo, ma comprende anche il sistema delle interfacce fisiche con cui l'utente interagisce, come tastiere, mouse, pulsanti, joystick, manopole, pannelli di controllo, segnalatori, indicatori e altri controlli fisici.

Per cui la progettazione delle interfacce intesa in modo più completo è la progettazione del sistema di interfacce hardware e software con cui l'utente interagisce durante l'uso di un sistema informatico, di un macchinario o di un dispositivo elettronico. È importante notare che ogni interfaccia è un sistema complesso che a sua volta può contenere altre interfacce e sistemi di interazione, ciascuno dotato di una propria logica di funzionamento e di interazione[1].

Le interfacce utente sono punti di interazione tra utenti e progetti[2][3][4]. Ne esistono tre tipi:

  • Interfacce grafiche utente (GUI): gli utenti interagiscono con rappresentazioni visive sullo schermo del computer[5]. Il desktop è un esempio di interfaccia grafica.
  • Interfacce guidate dalla voce: gli utenti interagiscono con esse utilizzando la propria voce[6]. La maggior parte degli assistenti intelligenti, come Siri sugli smartphone o Alexa sui dispositivi Amazon, utilizza il controllo vocale.
  • Interfacce interattive basate sui gesti: gli utenti interagiscono con gli ambienti di progettazione 3D attraverso il proprio corpo, come nei giochi di realtà virtuale (VR)[7].

Web design modifica

 
Esempio di web design responsivo

Nel caso del Web design si studia l'aspetto grafico finale del prodotto in questione, affinché lo stesso possa ben apparire e catturare l'attenzione dell'utente che lo visita. Ciò dipende fortemente dal target del sito web, la tematica trattata e l'individuo, l'azienda, l'associazione, o la società che pubblicizza.

Processi modifica

La progettazione dell'interfaccia utente richiede una buona comprensione delle esigenze dell'utente. Si concentra principalmente sulle esigenze della piattaforma e sulle aspettative degli utenti. Ci sono diverse fasi e processi nella progettazione dell'interfaccia utente, alcuni dei quali sono più richiesti di altri, a seconda del progetto[8].

  • Raccolta dei requisiti di funzionalità: raccolta di un elenco delle funzionalità richieste dal sistema per raggiungere gli obiettivi del progetto e le potenziali esigenze degli utenti.
  • Analisi degli utenti e dei compiti: una forma di ricerca sul campo è l'analisi dei potenziali utenti del sistema studiando come eseguono i compiti che il progetto deve supportare e conducendo interviste per elaborare i loro obiettivi. Le domande tipiche riguardano:
    • Cosa il sistema vorrebbe che l'utente faccia?
    • Come si adatterebbe il sistema al normale flusso di lavoro o alle attività quotidiane dell'utente?
    • Quanto è tecnicamente esperto l'utente e quali sistemi simili utilizza già l'utente?
    • Quali stili di aspetto dell'interfaccia attraggono l'utente?
  • Architettura dell'informazione - sviluppo del processo e / o del flusso di informazioni del sistema (cioè per i sistemi ad albero del telefono, questo sarebbe un diagramma di flusso ad albero delle opzioni e per i siti web sarebbe un flusso del sito che mostra la gerarchia delle pagine).
 
Esempio di wireframe
  • Prototipazione: sviluppo di wireframe, sotto forma di prototipi cartacei o semplici schermi interattivi. Questi prototipi sono privati di tutti gli elementi di look & feel e della maggior parte dei contenuti per concentrarsi sull'interfaccia.
  • Ispezione dell'usabilità: consente a un valutatore di ispezionare un'interfaccia utente. Questo è generalmente considerato più economico da implementare rispetto ai test di usabilità (vedere il passaggio di seguito) e può essere utilizzato nelle prime fasi del processo di sviluppo poiché può essere utilizzato per valutare prototipi o specifiche per il sistema, che di solito non possono essere testati sugli utenti. Alcuni metodi comuni di ispezione dell'usabilità includono il walkthrough cognitivo, che si concentra sulla semplicità di eseguire attività con il sistema per i nuovi utenti, la valutazione euristica, in cui una serie di euristiche viene utilizzata per identificare i problemi di usabilità nella progettazione dell'interfaccia utente e la procedura dettagliata pluralistica, in cui un gruppo selezionato di persone attraversa uno scenario di attività e discute i problemi di usabilità.
  • Test di usabilità (test dei prototipi su un utente reale) spesso utilizzando una tecnica chiamata protocollo think ad alta voce in cui si chiede all'utente di parlare dei propri pensieri durante l'esperienza. Il test di progettazione dell'interfaccia utente consente al progettista di comprendere la ricezione del progetto dal punto di vista dello spettatore e quindi facilita la creazione di applicazioni di successo.
  • Progettazione grafica dell'interfaccia utente. Questi sono i pannelli di controllo e le facce del design; Le interfacce a comando vocale implicano l'interazione orale-uditiva, mentre le interfacce basate sui gesti testimoniano che gli utenti interagiscono con gli spazi di progettazione 3D tramite movimenti corporei. Può essere basato sui risultati sviluppati durante la ricerca dell'utente e perfezionati per risolvere eventuali problemi di usabilità riscontrati attraverso i risultati dei test. A seconda del tipo di interfaccia che si sta creando, questo processo richiede in genere un pezzo di programmazione per computer per convalidare moduli, stabilire collegamenti o eseguire un'azione desiderata[9][10].
  • Manutenzione del software: dopo l'implementazione di una nuova interfaccia, potrebbe essere necessaria una manutenzione occasionale per correggere bug del software, modificare le funzionalità o aggiornare completamente il sistema. Una volta presa la decisione di aggiornare l'interfaccia, il sistema legacy subirà un'altra versione del processo di progettazione e inizierà a ripetere le fasi del ciclo di vita dell'interfaccia[11].

Requisiti modifica

 
Esempio di form web con un buon interface design

Le caratteristiche dinamiche di un sistema sono descritte in termini di requisiti di dialogo contenuti in sette principi della parte 10 della norma sull'ergonomia, la ISO 9241[12]. Questo standard stabilisce un quadro di "principi" ergonomici per le tecniche di dialogo con definizioni di alto livello e applicazioni illustrative ed esempi dei principi. I principi del dialogo rappresentano gli aspetti dinamici dell'interfaccia e possono essere per lo più considerati come la "sensazione" dell'interfaccia. I sette principi del dialogo sono[13]:

  • Idoneità per l'attività: il dialogo è adatto per un'attività quando supporta l'utente nel completamento efficace ed efficiente dell'attività.
  • Auto-descrittività: il dialogo è auto-descrittivo quando ogni fase del dialogo è immediatamente comprensibile tramite feedback dal sistema o viene spiegato all'utente su richiesta.
  • Controllabilità: il dialogo è controllabile quando l'utente è in grado di avviare e controllare la direzione e il ritmo dell'interazione fino al punto in cui l'obiettivo è stato raggiunto.
  • Conformità con le aspettative dell'utente: il dialogo è conforme alle aspettative dell'utente quando è coerente e corrisponde alle caratteristiche dell'utente, come la conoscenza del compito, l'istruzione, l'esperienza e le convenzioni comunemente accettate.
  • Tolleranza agli errori: il dialogo è tollerante agli errori se, nonostante evidenti errori di input, il risultato desiderato può essere raggiunto con nessuna o minima azione da parte dell'utente.
  • Idoneità all'individualizzazione: il dialogo è capace di individualizzazione quando il software dell'interfaccia può essere modificato in base alle esigenze del compito, alle preferenze individuali e alle abilità dell'utente.
  • Idoneità all'apprendimento: il dialogo è adatto all'apprendimento quando supporta e guida l'utente nell'apprendimento dell'uso del sistema.

Il concetto di usabilità è definito dallo standard ISO 9241 in base a efficacia, efficienza e soddisfazione dell'utente. La parte 11 fornisce la seguente definizione di usabilità:

  • L'usabilità è misurata dalla misura in cui vengono raggiunti gli obiettivi di utilizzo previsti del sistema complessivo (efficacia).
  • Le risorse che devono essere spese per raggiungere gli obiettivi prefissati (efficienza).
  • La misura in cui l'utente trova accettabile il sistema complessivo (soddisfazione).

Efficacia, efficienza e soddisfazione possono essere viste come fattori di qualità dell'usabilità. Per valutare questi fattori, è necessario scomporli in sotto-fattori e, infine, in misure di usabilità.

Ricerca modifica

 
Esempio di checkbox formattati per dare loro un aspetto estetico gradevole

Il design dell'interfaccia utente è stato un argomento di considerevole ricerca, anche sulla sua estetica[14]. Gli standard sono stati sviluppati già negli anni '80 per definire l'usabilità dei prodotti software. Una delle basi strutturali è diventata il modello di riferimento dell'interfaccia utente IFIP. Il modello propone quattro dimensioni per strutturare l'interfaccia utente:

  • La dimensione di input/output (l'aspetto)
  • La dimensione del dialogo (la sensazione)
  • La dimensione tecnica o funzionale (l'accesso a strumenti e servizi)
  • La dimensione organizzativa (il supporto alla comunicazione e alla cooperazione)

Questo modello ha notevolmente influenzato lo sviluppo dello standard internazionale ISO 9241 che descrive i requisiti di progettazione dell'interfaccia per l'usabilità. Il desiderio di comprendere i problemi dell'interfaccia utente specifici dell'applicazione nelle prime fasi dello sviluppo del software, anche se un'applicazione veniva sviluppata, ha portato alla ricerca sugli strumenti di prototipazione rapida della GUI che potrebbero offrire simulazioni convincenti di come un'applicazione reale potrebbe comportarsi nell'uso di produzione. Alcune di queste ricerche hanno dimostrato che un'ampia varietà di attività di programmazione per software basato su GUI può, infatti, essere specificata attraverso mezzi diversi dalla scrittura di codice di programma[15][16].

La ricerca è fortemente motivata dalla crescente varietà di dispositivi che possono, in virtù della legge di Moore, ospitare interfacce molto complesse[17].

Rispetto alla progettazione UX modifica

Rispetto all'UX design, l'UI design è più legato alla superficie e all'aspetto generale del progetto[18]. Il design dell'interfaccia utente è un mestiere in cui i designer svolgono una funzione importante nella creazione dell'esperienza dell'utente[19]. Il design dell'interfaccia utente deve informare gli utenti di ciò che sta accadendo, fornendo un feedback appropriato in modo tempestivo. L'aspetto visivo del design dell'interfaccia utente definisce il tono dell'interazione con l'utente[20]. D'altra parte, il termine UX design si riferisce all'intero processo di creazione di un'interfaccia utente[21].

Don Norman e Jakob Nielsen hanno detto: È importante distinguere l'esperienza complessiva dell'utente dall'interfaccia utente (UI), sebbene l'UI sia ovviamente una parte estremamente importante del design. A titolo di esempio, consideriamo un sito web di recensioni di film. Anche se l'interfaccia utente per la ricerca di un film è perfetta, l'interfaccia utente sarà scadente per un utente che ha bisogno di informazioni su una piccola uscita indipendente se il database sottostante contiene solo film di grandi case di produzione[22].

Note modifica

  1. ^ Norman, D. A., Emotion & Design: Attractive things work better, in Interactions Magazine, ix (4), 2002, pp. 36–42. URL consultato il 20 aprile 2014 (archiviato dall'url originale il 7 marzo 2021).
  2. ^ The difference between UX and UI, according to designer and Maze CEO, Jonathan Widawski, su maze.co. URL consultato il 7 aprile 2024.
  3. ^ What is a User Interface?, su www.easytechjunkie.com. URL consultato il 7 aprile 2024.
  4. ^ User Interface, su www.getcompass.ai. URL consultato il 7 aprile 2024.
  5. ^ The Complete Guide to Graphical User Interface, su history-computer.com. URL consultato il 7 aprile 2024.
  6. ^ What is Voice User Interface (VUI)? Definition & Examples, su www.designstudiouiux.com. URL consultato il 7 aprile 2024.
  7. ^ 3D Gestural Interaction: The State of the Field, su www.hindawi.com. URL consultato il 7 aprile 2024.
  8. ^ Lauren Wolf, 6 Tips for Designing an Optimal User Interface for Your Digital Event, su web.inxpo.com, INXPO, 23 maggio 2012. URL consultato il 22 maggio 2013 (archiviato dall'url originale il 16 giugno 2013).
  9. ^ Karen Holtzblatt and Hugh R. Beyer, Contextual design, in The Encyclopedia of Human-Computer Interaction, 2nd Ed., Interaction Design Foundation. URL consultato il 20 aprile 2014.
  10. ^ Martin Fowler, Forms and control, in GUI architecture, thoughtworks publication. URL consultato il 20 febbraio 2017.
  11. ^ (EN) 8 Stages in an HL7 Interface Lifecycle - Caristix, in Caristix, 5 ottobre 2010. URL consultato il 1º marzo 2017.
  12. ^ Definizione di usabilità: dalla normativa ISO 9241-11 ai parametri dei test di web usability, su Site Inside, 31 marzo 2015. URL consultato il 25 febbraio 2021.
  13. ^ iso.org, https://www.iso.org/obp/ui/#iso:std:iso:9241:-11:ed-2:v1:en. URL consultato il 25 febbraio 2021.
  14. ^ The role of context in perceptions of the aesthetics of web pages over time, International Journal of Human–Computer Studies, 5 gennaio 2009. URL consultato il 2 aprile 2009.
  15. ^ The HUMANOID model of interface design, Proceedings CHI'92, 1992.
  16. ^ Creating user interfaces using programming by example, visual programming, and constraints, ACM, 11 aprile 1990. URL consultato il 2 aprile 2009.
  17. ^ Past, present, and future of user interface software tools, ACM, 1º marzo 2000. URL consultato il 2 aprile 2009.
  18. ^ UI vs UX Design: What’s the Difference?, su www.knowledgehut.com. URL consultato il 7 aprile 2024.
  19. ^ Understanding UX vs UI: Exploring the Design Differences 2024, su www.victorflow.com. URL consultato il 7 aprile 2024.
  20. ^ User Interface and User Experience (UI/UX) Design, su gistbok-topics.ucgis.org. URL consultato il 7 aprile 2024.
  21. ^ Web-Design-Agentur, su dartera.ch. URL consultato il 7 aprile 2024.
  22. ^ The Definition of User Experience (UX), su www.nngroup.com. URL consultato il 7 aprile 2024.

Voci correlate modifica