Vai al contenuto

Progetto personaleDesign challenge2025

Design Flows

Progettare il centro di controllo per la vita sulla Luna.

Un'esperienza mobile per trovare, assegnare e seguire robot autonomi in un'immaginaria colonia lunare.

Contesto
Design challenge di Bending Spoons
Ruolo
UX/UI Designer
Durata
2 settimane
Tipo
Progetto concept
Consegne
User flow · Interaction design · UI ad alta fedeltà
02La sfida

Una missione complessa. Un'interazione semplice.

Il brief immaginava un 2025 parallelo, con l'umanità che vive in colonie lunari da oltre dieci anni. La vita quotidiana dipende dagli Hexabot: robot multifunzione che raccolgono risorse, coltivano piante ed esplorano crateri.

Il compito era un'app per gestirli in modo semplice ed efficiente: trovare gli Hexabot disponibili, controllare dove sono e cosa stanno facendo, assegnare missioni, seguire i progressi e ricevere aggiornamenti, con pochi tocchi.

Personas · fornite nel brief

  • Esploratori e RicercatoriConcentrati su attività critiche per la missione, spesso in multitasking, devono condurre esperimenti in modo efficiente.
  • FamiglieNon esperte di tecnologia. Si affidano agli Hexabot per le attività quotidiane e hanno bisogno di un'app semplice e intuitiva.

Bisogni e comportamenti · dal brief

  • 01Accesso rapidoGli utenti controllano lo stato degli Hexabot dalle 7 alle 10 volte al giorno.
  • 02Stato chiaroGli aggiornamenti in tempo reale devono essere chiari e facili da leggere.
  • 03Compiti urgentiCirca il 65% degli utenti assegna compiti per necessità improvvise, senza tempo per pianificare.
  • 04Monitoraggio delle missioniQuando più Hexabot lavorano nella stessa area, ogni compito deve essere facile da distinguere.
  • 05Comandi vocaliMolti utenti vogliono un controllo senza mani, in tuta spaziale o durante lavori manuali.
  • 06Condizioni difficiliGuanti e caschi appannati: l'app deve funzionare con poca destrezza e poco tempo.

Vincoli

Dal brief alle schermate finali
2 settimane
Massimo per il wireflow
12 schermate
In alta fedeltà
3 schermate
Brief, personas e dati di supporto
Forniti
03Obiettivi di design

Progettare per velocità, chiarezza e controllo.

  1. 01Accesso rapidoTrovare un robot, e le informazioni che servono, nel minor numero di passaggi.
  2. 02Stato della missione chiaroCapire a colpo d'occhio cosa sta facendo ogni Hexabot e a che punto è.
  3. 03Interazione flessibileSupportare tocco e voce, a seconda del contesto e delle mani libere.
04Flusso utente

Mappare l'esperienza prima di disegnare le schermate.

Lo scenario del brief: un team di ricerca in uno dei domi scientifici della colonia sta realizzando il prototipo di una turbina con una stampante 3D al silicio, ma gli manca il materiale per completarlo. Dalla Home controlla i propri Hexabot, ne assegna rapidamente uno alla raccolta delle risorse, poi lo segue fino al rientro nel dome.

  1. Trovare l'HexabotDalla Home alla mappa dei robot vicini
  2. Assegnare il compitoScegliere un robot disponibile, descrivere il compito con il tocco o con la voce
  3. Seguire la missionePosizione, avanzamento e aggiornamenti in un solo posto
  4. CompletareIl robot raccoglie i materiali e rientra nel dome
Helmet ID (Dynamic Island)UserPasswordLoginGlove mark (ID)Notifications (Dynamic Island)TitleModeFindHexabot 1Hexabot 2Notifications (Dynamic Island)<AssignAssignAssignHexabot 1, working…Hexabot 2, working…Coordinates (Dynamic Island)<Status + LocationName + iconsProgress trackerAssign a new taskSuggestionsTask 1Vocal command<Assign new taskSuggestionsCancelSaveHexabot real-time reportReport about missionReport about missionReport about missionReport about missionReport about missionReport about missionLoginHomeTrova HexabotTracker missioneAssegna compitoReport Hexabot

Accesso con Helmet ID o glove mark: niente da digitare con i guanti.

Wireflow ridisegnato dall'originale · stesse sei schermate e stessi collegamentiScorri per esplorare il wireflow →
  • NavigazioneUna barra in basso con il pulsante voce al centro, così la voce è a un tocco da ogni schermata principale.
  • Percorso principaleLogin → Home → Trova Hexabot → Tracker missione → Assegna compito, con il report in tempo reale raggiungibile dalla barra.
  • Login senza digitareHelmet ID e glove mark come alternative a nome utente e password, per chi indossa la tuta spaziale.
  • Stato sempre visibileLa Dynamic Island mostra notifiche e coordinate, così la missione resta visibile in ogni schermata.
  • Entro le 12 schermateSei schermate chiave invece di dodici, per tenere il flusso concentrato sullo scenario.
05Interfaccia finale

Tre schermate. Un'unica esperienza.

Ogni schermata risponde a un momento dello scenario: controllare, trovare, seguire.

Schermata Home: lo stato della missione in corso in alto, il pulsante Find Hexabots con l'indicazione per la voce e l'attività recente filtrata per Esploratori e Famiglie.
01

Home

Il problema

Gli utenti controllano i propri Hexabot molte volte al giorno, e spesso ne serve uno con urgenza.

Decisioni di design

  1. 1Lo stato della missione in corso sempre in alto, nella Dynamic Island.
  2. 2Un interruttore Foggy mode, per la condizione dei caschi appannati citata nel brief.
  3. 3Una sola azione principale, Find Hexabots, disponibile anche a voce: “Just say ‘Find’”.
  4. 4Attività recente divisa per Esploratori e Famiglie, le due personas del brief.
  5. 5Ogni card mostra nome dell'Hexabot, coordinate, compito, chi l'ha assegnato e avanzamento.
Stato della missione, sempre in alto — Home
Stato della missione, sempre in alto
Lo stato a colpo d'occhio — Home
Lo stato a colpo d'occhio
02

Trova Hexabot

Il problema

Con più robot nella stessa area, bisogna vedere subito quali sono liberi e quali occupati.

Decisioni di design

  1. 1Gli Hexabot vicini e quanti sono, intorno alla posizione dell'utente.
  2. 2Un raggio di ricerca regolabile.
  3. 3I robot disponibili si assegnano direttamente; quelli occupati mostrano compito e avanzamento.
  4. 4Scorciatoie vocali per i comandi più probabili: “Assign”, “Prometheus” Report.
Scorciatoie vocali — Trova Hexabot
Scorciatoie vocali
Schermata Trova Hexabot: un radar intorno alla posizione dell'utente sulla Luna, gli Hexabot disponibili da assegnare e quelli occupati con il compito in corso.
03

Tracker missione

Il problema

Una volta assegnato il compito, bisogna seguirlo e reagire in fretta quando qualcosa cambia.

  1. 1La posizione dell'Hexabot sulla mappa, con le coordinate in tempo reale.
  2. 2Il controllo vocale disponibile sulla mappa, per i comandi urgenti.
Schermata Tracker missione: la posizione dell'Hexabot sulla mappa, l'avanzamento della missione, il pulsante per assegnare un nuovo compito e i comandi rapidi.
  1. 3Gli Hexabot si possono rinominare e personalizzare dal pulsante di modifica.
  2. 4L'avanzamento della missione con i suoi passaggi, e il registro degli aggiornamenti con gli orari.
  3. 5Assegnare un nuovo compito come azione principale, con comandi rapidi per le urgenze.
06Dettagli di design

Piccoli dettagli, coerenti ovunque.

Pochi elementi reggono tutta l'esperienza. Tornano in ogni schermata, così ciò che l'utente impara una volta continua a funzionare.

  • Icone degli HexabotDisegnate da me. Gli Hexabot con un nome hanno il proprio colore, così i robot che lavorano nella stessa area si distinguono subito.

  • Stati dei robotI robot disponibili mostrano l'azione Assign. Quelli occupati mostrano compito, posizione e avanzamento.

  • Un solo modo di mostrare l'avanzamentoLo stesso anello indica l'avanzamento nella Home, sulla mappa e nel tracker.

  • La voce, a un toccoUn pulsante voce al centro della barra, suggerimenti vocali accanto alle azioni e comandi pronunciabili.

07Cosa ho imparato

Una sfida breve. Un'esperienza preziosa.

Progettare il flusso e tre schermate da zero in due settimane è stata una vera sfida. Il progetto non ha vinto e, con più tempo, avrei curato con più attenzione i dettagli di tutta l'app. Resta un progetto da cui ho imparato molto.

  1. 01Leggere il briefTrasformare personas, dati e uno scenario immaginario in requisiti concreti.
  2. 02Prima i flussiMappare il percorso prima della UI ha tenuto collegate le tre schermate.
  3. 03Lavorare con i vincoliDue settimane e dodici schermate hanno significato scegliere cosa contava davvero.
  4. 04Interaction designProgettare tocco e voce come due modi di fare le stesse cose.
  5. 05UI ad alta fedeltàPortare un concept a un linguaggio visivo curato e coerente.
  6. 06Definire le prioritàLa prossima volta: più attenzione ai dettagli e ai casi limite oltre il percorso principale.

Un progetto concept per una design challenge. Non sviluppato come prodotto commerciale.

08Crediti e prossimo progetto

Dal brief all'interfaccia, in due settimane.

Crediti

Brief
Bending Spoons · Design Flows 2025
Icone degli Hexabot
Luca Alfano
Altre icone
Hugeicons
Immagini
Unsplash / Envato Elements
Autori delle immagini
StrokeVorkz, Nick Brunner, Levi Stute
Progetto successivoELAI Agent
→Contatti

Creiamo qualcosa di significativo.

Hai un prodotto AI, una sfida UX complessa o un'opportunità di design? Parliamone.

Scrivimi
Progettato da me in Figma. Costruito con Next.js e l'AI.