Droppath 6.0: Il Nostro Percorso verso Liquid-Glass

Con il rilascio di iOS 26, Apple ha introdotto Liquid Glass, una grande evoluzione nell’estetica dell’interfaccia utente della piattaforma e nel linguaggio di design. Questo progresso va oltre i rinnovamenti visivi dei componenti UI principali come pulsanti e barre degli strumenti; ridefinisce i paradigmi fondamentali dell’interfaccia, richiedendo agli sviluppatori di adattare criticamente le loro applicazioni. Qui, delineiamo il nostro approccio e le considerazioni ingegneristiche intraprese nella migrazione di Droppath Route Planner allo standard dell’interfaccia Liquid Glass.

La nostra risposta iniziale a Liquid Glass è stata modellata da esperienze precedenti con transizioni di design Apple radicali, in particolare il rinnovamento di iOS 7. A quel tempo, cambiamenti fondamentali alle impostazioni predefinite dell’interfaccia utente del sistema hanno introdotto regressioni e instabilità significative, richiedendo un intervento estensivo per ripristinare i comportamenti precedenti. Al contrario, l’implementazione di Apple per Liquid Glass offre un percorso di migrazione opt-in controllato (vedi la documentazione per UIDesignRequiresCompatibility), riducendo notevolmente il rischio. Le nostre integrazioni preliminari con Xcode 26 hanno portato alla luce solo inconsistenze di allineamento minori: specificamente, il posizionamento errato del titolo di un dialogo. Per fortuna, non abbiamo dovuto fare un rilascio urgente con Xcode 26, ma è stato rassicurante avere questa opzione pronta se necessario.

Cercando Esempi #

Un aspetto fondamentale di qualsiasi migrazione di design è la disponibilità di punti di riferimento nell’ecosistema Apple stesso. Le applicazioni di prima parte hanno fornito una guida essenziale sulle best practice e i modelli di interazione. Ad esempio, quando valutavamo strategie di presentazione per profili utente e impostazioni, siamo stati ispirati dall’app Musica. Allo stesso modo, per i miglioramenti dell’interfaccia di ricerca, abbiamo confrontato approcci in Musica, Mail e File; in definitiva, il linguaggio di design di File si allineava meglio con i nostri obiettivi UX, in particolare riguardo al posizionamento dei risultati di ricerca rispetto al campo di ricerca. Avere risultati sopra la barra di ricerca non è abbastanza naturale per noi.

La Fine delle Barre di Navigazione Colorate #

La barra di navigazione colorata legacy, un segno distintivo dei paradigmi UI precedenti, si è rivelata incompatibile con il nuovo look Liquid Glass. Gli sfondi vivaci hanno causato contrasto eccessivo e disarmonia visiva contro i pulsanti traslucidi di Liquid Glass. La nostra soluzione è stata passare a una barra di navigazione bianca, che ha fornito coerenza con il gradiente della nuova barra delle schede, unificando l’aspetto visivo complessivo dell’app.

Ripensare il Posizionamento delle Azioni #

Liquid Glass reimmagina le barre delle schede, riducendo la loro impronta al bordo inferiore dello schermo e permettendo più contenuto visibile. Questo cambiamento ci ha spinto a rivisitare gli elementi Material Design, specificamente i Floating Action Buttons (FAB), che avevamo adottato. Precedentemente posizionati per prominenza, i FAB apparivano incongruenti accanto alla barra delle schede rivista e più sottile. Le nuove linee guida di design, tuttavia, permettono pulsanti di azione prominenti all’interno della barra di navigazione stessa. Droppath ora centralizza le azioni chiave in quest’area, raggruppando le azioni per mantenere senso e accessibilità.

Nella vista mappa, riposizionare i pulsanti in alto a destra ci ha permesso di organizzarli ordinatamente insieme alle azioni della mappa. Il loro aspetto più prominente rende ovvio quale dovrebbe essere il tuo prossimo passo.

Pattern UI Mancante: Commutazione Modalità Vista #

Un aspetto complesso dell’interfaccia di Droppath è stato l’uso duale delle schede: sia come commutatori di modalità (viste elenco versus mappa) che come navigazione per cartelle bloccate (percorsi locali versus sincronizzati cloud). Mentre la navigazione delle cartelle si adatta giustamente al modello delle schede, l’uso delle schede per la selezione della modalità vista si discosta dalle convenzioni iOS stabilite. Su Android, questo toggle è gestito con un pulsante navbar, ma questo limita la scopribilità. Al contrario, le barre delle schede iOS nella parte inferiore dello schermo funzionano come selettori segmentati efficaci e accessibili per il nostro contesto.

Analizzando le app Foto e File di Apple, abbiamo osservato metodologie variabili. Foto impiega un toggle posizionato centralmente, mentre File relega la commutazione vista a un menu sotto i puntini di sospensione, scambiando scopribilità per semplicità del menu. I nostri dati utente richiedono fortemente il toggle frequente tra modalità mappa ed elenco, portandoci a mantenere l’approccio scheda segmentata nonostante il suo uso atipico, poiché minimizzare l’interruzione durante le principali transizioni UI rimane una priorità assoluta.

Rilocazione Contenuto Secondario #

Per mantenere chiarezza semantica nella nostra struttura delle schede, abbiamo spostato le schermate Account e Aiuto nell’angolo in alto a destra, rispecchiando l’organizzazione trovata nell’app Musica di Apple. Dopotutto, gli utenti raramente devono accedere alle impostazioni del loro account, quindi perché fornire accesso immediato attraverso la barra delle schede? Mentre Droppath attualmente manca di immagini profilo caricate dall’utente, il Simbolo SF è un’icona segnaposto riconoscibile—che stavamo già usando altrove—dovrà bastare.

L’UI Sembra Viva e Reattiva #

L’introduzione di Liquid Glass ha portato un nuovo livello di reattività e vivacità ai controlli dell’interfaccia. I pulsanti che non erano stati aggiornati per Liquid Glass si sono immediatamente distinti—apparivano statici e poco coinvolgenti rispetto alle loro controparti rivitalizzate.

Anche i pulsanti della barra delle schede ora si espandono e si fondono delicatamente quando gli utenti li toccano, migliorando ulteriormente il senso di interazione fluida caratteristico di Liquid Glass.

Sfide del Codice #

Integrazione SwiftUI #

Implementare il supporto per Liquid Glass nei nostri componenti SwiftUI ha portato una serie unica di sfide. Per prevenire la duplicazione della logica attraverso più percorsi di codice #available(iOS 26.0, *), abbiamo consolidato i controlli di versione e incapsulato i cambiamenti di stile in metodi helper come glassProminentStyleIfPossible(). Anche così, abbiamo ancora contato circa 20 condizioni di disponibilità separate in tutto il codebase—uno strato necessario per mantenere la compatibilità all’indietro mentre aderiamo ai nuovi requisiti visivi. Con un po’ di fortuna, non affronteremo un’altra transizione UI radicale di questa scala per molti anni.

Presentazione Sheet #

La nostra schermata Guida si affida a sheet di sistema, ma il loro aspetto era terribile sotto Liquid Glass. I gesti di swipe personalizzati che supportiamo—abilitando transizioni sinistra/destra tra fermate all’interno di uno sheet—non sono comportamenti supportati nativamente dagli sheet iOS. Di conseguenza, adattare i nostri sheet di guida per il nuovo design ha richiesto uno sforzo ingegneristico extra per ripristinare il flusso di navigazione previsto. Assicurati di provare tutta la funzionalità della tua app prima della spedizione.

Toolbar Controller di Navigazione #

Far allineare visivamente la toolbar del nostro controller di navigazione con Liquid Glass si è rivelato più complicato del previsto. Il posizionamento predefinito della toolbar era sotto la barra delle schede, quindi abbiamo introdotto una toolbar personalizzata, posizionandola e stilizzandola per assicurare il posizionamento corretto.

Accessorio Input Migliorato #

Molti utenti Droppath inseriscono regolarmente sia numeri che lettere, quindi includiamo un accessorio input numerico sopra la tastiera per comodità. Questa riga personalizzata è costruita da una copia mantenuta localmente di YZKeyboardAccessoryInput—una libreria di nicchia scritta per la prima volta nel 2015 e ora quasi impossibile da trovare online. Come parte di questo rilascio, abbiamo rinnovato il suo aspetto: arrotondamento sottile e segnali visivi aggiornati lo aiutano ad armonizzarsi con la nuova interfaccia.

Una Nuova Icona Più Versatile #

Durante l’anno passato, abbiamo esplorato più concetti di icone, cercando chiarezza e flessibilità oltre l’immaginario tradizionale delle scatole comune alle app di consegna. La nostra nuova icona—astraendo un percorso nella forma di una “D” maiuscola—offre riconoscimento immediato del brand mentre si adatta ai casi d’uso più ampi di Droppath oltre la consegna. Lo schema monocromatico assicura riproducibilità migliorata attraverso piattaforme digitali e merchandise futuro.

Sfruttando lo strumento Icon Composer, abbiamo adattato la nuova identità visiva per abbracciare l’estetica Liquid Glass. Sebbene l’icona non sfrutti la piena complessità degli effetti vetro stratificati, si armonizza con il nuovo ecosistema di design e si adatta tra applicazioni peer che abbracciano Liquid Glass.

In sintesi, la migrazione a Liquid Glass in Droppath Route Planner 6.0 rappresenta una modernizzazione completa per allinearsi agli standard di design di iOS 26. Siamo fiduciosi che questo aggiornamento non solo elevi l’esperienza utente ma evidenzi anche la cura di Droppath per i suoi utenti. Adottare Droppath dovrebbe essere naturale per qualsiasi utente iOS 26.

Droppath Route Planner 6.0 sarà disponibile presto per iOS 26.