No handoff
Esploriamo il concetto di "no handoff" e l'importanza della collaborazione nel processo di design di prodotto
Ciao,
questa è l’edizione #42 di Designabile, l’appuntamento con la newsletter sul product design digitale che questo mese compie 2 anni! 🎉🎂
In questo nuovo numero parliamo di handoff, ovvero QUEL momento fatidico in cui il design passa in mano ai developers.
Quali sono poi le buone pratiche da applicare quando progettiamo una search? Indicazioni e consigli pratici da tenere sempre a mente.
I Design Systems si sono affermati come strumento per migliorare (e semplificare) la progettazione di prodotti digitali. Ma se ogni azienda/organizzazione crea il suo, che è spesso simile a tanti altri, stiamo forse perdendo tempo?
Buona lettura 📖
👨💻 APPROFONDIMENTO
Oggi vorrei parlare dei momenti di passaggio in un progetto, basandomi su un interessante risorsa che ho trovato.
L'autore Shamsi Brinn presenta un nuovo modo di vedere il passaggio nel design, chiamandolo metodo "No Handoff".
In questo modello, il lavoro tra i team di prodotto e di sviluppo avviene in modo iterativo, con i prototipi funzionali al centro della collaborazione.
Il prototipo diventa la “specifica vivente” del progetto, un linguaggio condiviso per l'intero team. Questo elimina la necessità di creare documentazioni molto dettagliate, poiché tutti lavorano sullo stesso prototipo, esplorando insieme lo spazio dei problemi e delle soluzioni.
Riflettendo su questo approccio, mi sono immediatamente ricordato del "Hot Potato process” proposto da Dan Mall e Brad Frost.
In questo metodo, le idee vengono passate rapidamente avanti e indietro tra designer e sviluppatori durante l'intero ciclo di creazione di un prodotto. Questo processo fluido, simile all’omonimo gioco, favorisce quindi una collaborazione continua senza passaggi formali tra i team.
La mia esperienza mostra che la collaborazione funziona meglio quando i team non hanno scadenze "ufficiali". La transizione dal design allo sviluppo e viceversa avviene senza soluzione di continuità, con entrambi i team che lavorano simultaneamente e affrontano le problematiche man mano che emergono durante l'intero ciclo di vita del prodotto.
Nel contesto di team piccoli, questo approccio può essere altamente efficace. Tuttavia, cosa succede quando una parte del design o sviluppo viene affidata a un'agenzia esterna?
Molti preferiscono una documentazione dettagliata che spiega ogni parte del design e la strategia dietro di essa. Ma, ciò potrebbe non bastare. Le scelte di design devono considerare le tecniche di realizzazione e i loro limiti. Non c'è un linguaggio comune per i modelli di design e come interagiscono. Questo è il motivo per cui bellissimi progetti possono diventare lenti e difficili da implementare.
La sfida è creare sovrapposizioni significative durante il processo collaborativo e assicurarsi che le decisioni di design siano informate dalla realtà tecnica. Solo così possiamo prevenire che i nostri progetti si trasformino in creature lente e inaccessibili.
Riferimenti
→ nohandoff.org
→ hot potato process
🍪 UX BITES
Progettare la search
La ricerca è presente in qualsiasi tipo di prodotto digitale, dal blog personale all’e-commerce più strutturato, e l’esperienza d’uso di questo strumento è da sempre oggetto di studio. Vediamo quali sono le indicazioni e i consigli pratici più comuni:
Indicazioni
🚫 Gli utenti non esplorano sempre i risultati in modo sequenziale ma secondo lo schema a flipper
✅ I primi 3 risultati di ricerca ottengono circa il 60% di tutti i clic;
✅ Larghezza del box di ricerca: >60 caratteri (desktop), 45 caratteri su mobile;
✅ Una buona lunghezza del titolo è <60 caratteri, descrizione <160 caratteri;
✅ Mostra almeno 3 risultati di ricerca senza scrollare la pagina;
🚫 Evita qualsiasi barra di scorrimento nelle suggerimenti di ricerca;
✅ Limita il numero dei suggerimenti: <10 su desktop, <8 su mobile.
Consigli pratici
Sostituisci la semplice icona della lente con un campo di testo visibile per incentivare le ricerche;
Evidenzia i risultati di ricerca già visitati per evitare confusione all'utente;
Includi funzionalità avanzate come la navigazione da tastiera nell'autocompletamento e nei risultati;
Monitora e migliora costantemente la qualità delle prime 100 query di ricerca;
Consenti agli utenti di personalizzare i dettagli visualizzati nei risultati di ricerca;
Investi nella pulizia dei metadati per migliorare la qualità dei risultati di ricerca.
Riferimenti:
→ Search UX Best Practices
→ Replace Search Icon With Search Box
→ The Pinball Pattern
⭐️ NOVITÀ
Un design system globale
Progettare, costruire e mantenere un'interfaccia utente su misura per ogni singolo prodotto digitale è costoso, inefficiente e pieno di insidie. Ogni organizzazione finisce per costruire soluzioni che si sovrappongono sostanzialmente a ciò che ogni altra organizzazione sta costruendo. Brad Frost, in questa interessante riflessione, suggerisce la soluzione di un design system globale, comuni a tutti i prodotti digitali.
A Global Design System would centralize common UI components, reduce so much of this unnecessary duplication, integrate with any web-based tech stack, and create a connected vehicle for delivering front-end best practices to the world’s web experiences
🧰 RISORSE
Magic patterns
Realizza un'interfaccia utente velocemente con questo strumento di intelligenza artificiale. Basta digitare un comando come "crea una form di login" per generare il codice necessario. Molto interessante la possibilità (ancora non online) di collegare una libreria di componenti preesistente.
🎪 EVENTI
UXDay 2024
Ultimi biglietti in EARLY BIRD per l’evento del 7 Giugno a Faenza!
Al prossimo numero 👋
Ciao, Francesco