Installazione UI più completa disponibile per computer

Adriana Jara
Adriana Jara

In genere gli utenti ricevono le app, in particolare quelle della piattaforma, tramite store o tramite il download e l'installazione di un pacchetto. Oggi anche l'esperienza desktop si sta spostando verso l'offerta di app in negozi centralizzati.

Per le app web il modello è diverso: gli utenti non devono visitare un archivio centralizzato per ricevere un'app web. Non tutte le esperienze web sono installabili, l'installazione di un'app può variare da una piattaforma all'altra e da un browser all'altro; inoltre, i browser hanno menu e piattaforme diversi per installarla. Dopo che l'utente fa clic sull'opzione di installazione, la finestra di dialogo predefinita non include informazioni aggiuntive, come mostrato di seguito:

La finestra di dialogo di installazione predefinita del browser per computer.
Finestra di dialogo di installazione predefinita su computer.
La finestra di dialogo di installazione predefinita del browser per dispositivi mobili.
Finestra di dialogo di installazione predefinita sui dispositivi mobili.

La creazione di app web che possono essere installate e che offrono le stesse interazioni delle app della piattaforma richiede un lavoro tecnico per abilitare queste esperienze, oltre a una buona guida per gli utenti per sfruttare questo diverso flusso di installazione.

Con l'interfaccia utente di installazione avanzata, gli sviluppatori web hanno la nuova opportunità di fornire agli utenti un contesto specifico sulla loro app al momento dell'installazione. Questa UI è disponibile per i dispositivi mobili a partire da Chrome 94 e per i computer a partire da Chrome 108. Chrome continuerà a offrire finestre di dialogo di installazione semplici per le app installabili, ma questa interfaccia utente più grande offre agli sviluppatori lo spazio per mettere in evidenza la loro app web. Inoltre, rende più familiare il processo di installazione perché è simile alle finestre di dialogo degli store.

Screenshot dell'interfaccia utente di installazione avanzata su computer e dispositivi mobili.
UI di installazione più completa su computer e dispositivi mobili.

Abilitazione dell'interfaccia utente di installazione più completa

Per visualizzare la finestra di dialogo dell'interfaccia utente di installazione più completa, gli sviluppatori devono aggiungere almeno uno screenshot per il fattore di forma corrispondente nell'array screenshots. Il campo description non è obbligatorio, ma è consigliato. La finestra di dialogo dei contenuti si basa sui contenuti di questi due campi, rendendo l'esperienza più simile a quella dell'installazione nello store. In questo modo gli utenti possono capire che stanno aggiungendo un'app al proprio dispositivo e, con più spazio disponibile, gli sviluppatori possono fornire un contesto specifico agli utenti al momento dell'installazione.

Ad esempio, gli sviluppatori possono utilizzare il campo description per mettere in evidenza le funzionalità dell'app che incentivano l'utente a tenerla nei propri dispositivi. Con screenshots possono presentare l'aspetto e il design dell'app web come indipendente, con tutto il facile accesso delle app della piattaforma.

Per una specifica dettagliata e una guida per aggiungerli alla tua app, visita la pagina Pattern UI di installazione avanzata.

Il vecchio stile di prompt di installazione forniva poche informazioni e poco contesto. Ciò non corrispondeva alle aspettative degli utenti sul significato dell'installazione e potrebbe lasciarli confusi su ciò che è successo. Molti hanno rifiutato del tutto la richiesta di installazione, il che era negativo anche per le attività che le hanno create.

Installazioni più complete ti consentono di creare esperienze più simili a quelle sui sistemi operativi.

Puoi crearla seguendo l'esempio dal file manifest dell'app Squoosh e provare la finestra di dialogo dal vivo all'indirizzo: https://squoosh.app/.

Feedback Stiamo valutando altre opzioni per le installazioni più complete, tra cui le categorie e le valutazioni delle app. Per prendere questa decisione, abbiamo bisogno del tuo feedback. Parlaci del design C'è qualcosa nell'UI delle installazioni avanzate che non funziona come previsto? Oppure hai bisogno di dati specifici per implementare la tua idea? Hai una domanda o un commento? Compila questo modulo.

Foto di Kaboompics .com su Pexels