Come creare una Membership PWA Whitelabel in Legacy Memberships
Creare una Progressive Web App (PWA) per la membership whitelabel permette alle aziende di offrire un'esperienza fluida e brandizzata senza bisogno di una tradizionale app mobile. Questa guida ti accompagna nella configurazione, personalizzazione e pubblicazione della tua PWA usando HITLEAD. Troverai anche le istruzioni di installazione e un confronto con le app native.
Importante: La Membership PWA è disponibile solo nell'esperienza Legacy Memberships. Non è supportata nell'esperienza Client Portal. Se la tua location usa Client Portal, passa a Legacy Memberships prima di configurare la PWA.
INDICE DEI CONTENUTI
- Che cos'è una Membership PWA Whitelabel?
- Vantaggi principali dell'uso di una Membership PWA Whitelabel
- Perché considerare la creazione di una PWA: differenze chiave
- Prerequisiti: prepara la tua Membership e il branding
- Come configurare la tua Membership PWA Whitelabel
- Come installare la PWA
- Risoluzione dei problemi della Membership PWA
- Domande frequenti
- Articoli correlati
Che cos'è una Membership PWA Whitelabel?
Una Progressive Web App (PWA) è un'applicazione web che offre un'esperienza simile a quella di un'app mobile senza richiedere il download da uno store. La Membership PWA Whitelabel di HITLEAD permette alle aziende di personalizzare l'aspetto, il branding e le funzionalità del proprio sito di membership, mantenendo il pieno controllo sui contenuti e sull'esperienza utente.
A differenza delle app native, le PWA vengono accedute tramite browser web e possono essere installate direttamente sul dispositivo dell'utente senza passare per l'App Store di Apple o Google Play. Questo le rende un'alternativa flessibile e conveniente per le aziende che vogliono offrire un'esperienza simile a un'app senza la complessità dello sviluppo nativo.
In HITLEAD, la Membership PWA fa parte dell'esperienza Legacy Memberships. È separata dal Client Portal e dall'app mobile del Client Portal.
Vantaggi principali dell'uso di una Membership PWA Whitelabel
-
Funziona su tutti i dispositivi: Accessibile da mobile, tablet e desktop senza sviluppo separato.
-
Esperienza simile a un'app: Gli utenti possono aprire il portale di membership dalla schermata Home, dal desktop o dal launcher delle applicazioni.
Perché considerare la creazione di una PWA: differenze chiave
| Caratteristica | PWA | App Mobile Nativa |
|---|---|---|
| Installazione | Installata via browser, senza app store | Scaricata da App Store/Google Play |
| Aggiornamenti | Aggiornata automaticamente all'aggiornamento | Richiede aggiornamenti manuali dagli store |
| Funzionamento offline | Generalmente richiede connessione internet; la disponibilità dei contenuti caricati in precedenza può variare. | Piena funzionalità offline |
| Notifiche push | La disponibilità dipende da dispositivo, browser, sistema operativo e supporto della funzionalità in HITLEAD. | Completamente supportate |
| Prestazioni | Veloce e leggera | Generalmente più veloce per app complesse |
| Processo di approvazione | Non richiede approvazione dagli store | Soggetta alle linee guida di App Store/Google Play |
Prerequisiti: prepara la tua Membership e il branding
Prima di configurare la tua Membership PWA, è importante assicurarti che il branding e la struttura della membership siano impostati correttamente. Questa base migliora l'esperienza degli utenti e rende la tua PWA curata e professionale.
-
Personalizza il tuo branding: Passa a Legacy Memberships, poi vai su Memberships > Courses > Settings > Branding e configura le impostazioni di branding e app disponibili. Carica il logo della tua azienda e aggiungi un favicon per il branding nella scheda del browser. Questi elementi visivi compaiono in tutta l'app e rafforzano l'identità del tuo brand.
-
Configura la struttura della tua Membership: In Legacy Memberships, vai su Memberships > Courses > Products per creare o revisionare i tuoi corsi, offerte, livelli di accesso e contenuti correlati. Crea livelli di prodotto, aggiungi corsi e configura prezzi e livelli di accesso. Organizzare i contenuti ora garantisce un percorso di apprendimento fluido all'interno della PWA.
-
Collega un dominio personalizzato (facoltativo): Connetti un dominio personalizzato (es. app.tuobrand.com) tramite Settings > Domains. Aggiungere un dominio brandizzato aumenta la fiducia e dà alla tua PWA un aspetto più curato e simile a un'app.
Una volta completati questi passaggi, sei pronto per iniziare a configurare la tua Membership PWA.
Come configurare la tua Membership PWA Whitelabel
Passo 1: Accedi a Memberships
Per iniziare a configurare la tua Membership PWA, nel sub-account vai su Memberships. Se si apre Client Portal, usa il selettore Memberships per passare a Legacy Memberships. Poi seleziona Courses > Settings dal menu di navigazione in alto. Si aprirà l'area Membership Settings, dove troverai le principali opzioni di configurazione.
Importante: La Membership PWA è disponibile solo nell'esperienza Legacy Memberships. Non è supportata nell'esperienza Client Portal.
Passo 2: Seleziona App Settings
Dopo aver navigato su Courses > Settings, cerca il riquadro App Settings (App Details). Qui personalizzerai come appare e si comporta la tua Progressive Web App (PWA) su desktop e dispositivi mobili.
Se il riquadro App Settings non è visibile, conferma che la location stia usando Legacy Memberships e non Client Portal.
Passo 3: Abilita l'installazione della PWA
Abilitare l'installazione della PWA permette agli utenti di "installare" la tua app sui loro dispositivi come un'app nativa, migliorando accessibilità e coinvolgimento. Una volta abilitata, gli utenti possono installarla dai browser supportati. L'opzione di installazione disponibile e la dicitura variano in base al browser, al sistema operativo e al dispositivo.
Passo 4: Personalizza le impostazioni della tua PWA
Dopo aver attivato Enable PWA su "on" nell'area App Settings, puoi definire come appare e si comporta la tua PWA. Qui inizia la vera personalizzazione: dai alla tua app un nome, un'identità e un aspetto.
Nome app, Nome breve e Descrizione
Questi campi definiscono come la tua app viene presentata agli utenti sui vari dispositivi:
Name: Il nome completo dell'app, mostrato durante le richieste di installazione e nella barra del titolo dell'app.
Short Name: Una versione abbreviata del nome dell'app che appare nelle schermate Home o in spazi più ridotti (es. cartelle di app).
Description: Una breve frase che spiega agli utenti di cosa si occupa la tua app. È un contesto utile, specialmente quando gli utenti installano la tua PWA dal prompt del browser.
Icona dell'app
Devi caricare due icone: una più grande (512x512) e una più piccola (192x192). Vengono usate su diversi dispositivi e piattaforme, come schermate di avvio, drawer delle app e schermate Home. Il sistema sceglierà automaticamente quale icona usare in base alle dimensioni dello schermo, ma ti consigliamo di caricare versioni che corrispondano esattamente a ciascuna dimensione. Le icone devono essere in formato .jpg o .png e devono essere visivamente identiche per mantenere la coerenza del brand.
Colori dell'app
HITLEAD offre una selezione di palette di colori predefinite per il tema della tua app. Questi colori influenzano lo stile degli elementi UI come pulsanti e intestazioni. Al momento non è possibile inserire codici hex personalizzati, ma le palette disponibili sono progettate per un forte contrasto e chiarezza visiva su tutti i dispositivi. Clicca semplicemente per selezionare quella che si adatta meglio al tuo brand.
Passo 5: Salva le impostazioni
Dopo aver inserito i dettagli dell'app, caricato le icone e scelto il colore del tema, assicurati di cliccare Save nell'angolo in alto a destra. Se non salvi, nessuna delle modifiche verrà applicata quando gli utenti tenteranno di installare la tua PWA.
Come installare la PWA
Installazione della PWA su computer Windows
Dopo aver completato la personalizzazione e abilitato la tua Membership PWA, il tuo cliente dovrà semplicemente cliccare su questa icona nella barra degli indirizzi del browser in Chrome, al momento dell'accesso al portale di login della tua Membership:
Questo gli permetterà di accedere alla tua PWA sul desktop come collegamento:
Installazione della PWA su computer Mac
Chrome o Microsoft Edge
-
Apri il portale di login della Membership.
-
Accedi all'account della membership.
-
Seleziona l'icona di installazione nella barra degli indirizzi del browser.
-
Conferma l'installazione.
Safari su versioni macOS supportate
-
Apri il portale della Membership in Safari.
-
Seleziona File > Add to Dock.
-
Inserisci il nome dell'app.
-
Seleziona Add.
Installazione della PWA su dispositivo Android:
Per un'esperienza di installazione più coerente, apri il portale di login della Membership in Google Chrome. Puoi installarla aggiungendo la PWA alla tua schermata Home dal browser Chrome come mostrato nel video qui sotto.
-
Accedi all'account della membership.
-
Apri il menu di Chrome.
-
Seleziona Install app o Add to Home screen.
-
Segui le istruzioni sullo schermo.
Installazione della PWA su Android (solo Chrome)
Installazione della PWA su dispositivo iOS:
-
Apri il portale di login della Membership in Safari.
-
Accedi all'account della membership.
-
Tocca l'icona Share.
-
Seleziona Add to Home Screen.
-
Verifica il nome dell'app e tocca Add.
Installazione della PWA su Safari (iOS)
Risoluzione dei problemi della Membership PWA
App Settings non è visibile
Conferma che la location stia usando Legacy Memberships. La Membership PWA non può essere configurata dall'esperienza Client Portal.
L'opzione di installazione non appare
Conferma che l'installazione della PWA sia abilitata e le impostazioni siano state salvate. Apri il portale Membership pubblicato usando HTTPS, accedi tramite un browser supportato e controlla nel menu del browser la voce Install app o Add to Home Screen.
Il branding aggiornato non appare
Rimuovi la PWA precedentemente installata, cancella la cache del browser pertinente, riapri il portale Membership e installa nuovamente la PWA.
Gli utenti aprono Client Portal invece di Memberships
Conferma quale esperienza di membership è attiva e passa a Legacy Memberships prima di usare la Membership PWA.
Domande frequenti
D: Posso ancora inviare la mia PWA all'App Store?
La Membership PWA è progettata per essere installata direttamente da un browser supportato. Integrarla con un wrapper nativo di terze parti va oltre la configurazione standard della Membership PWA di HITLEAD e potrebbe richiedere supporto da sviluppatori e conformità separata con i requisiti di Apple o Google.
Per un'esperienza di app nativa brandizzata supportata, consulta le opzioni Client Portal Branded Mobile App di HITLEAD.
D: La mia PWA funziona offline?
Per accedere, caricare i corsi e visualizzare i contenuti attuali della membership è generalmente necessaria una connessione internet. I contenuti caricati in precedenza potrebbero rimanere temporaneamente disponibili a seconda del dispositivo e del browser, ma l'accesso offline completo non è garantito.
D: Posso inviare notifiche push con una PWA?
La disponibilità delle notifiche push dipende dal dispositivo, dal browser, dal sistema operativo e dalla funzionalità di notifica supportata da HITLEAD. L'installazione della Membership PWA non abilita automaticamente le notifiche push.
D: Ho bisogno di uno sviluppatore per configurare una PWA whitelabel?
No, l'interfaccia di HITLEAD rende la configurazione semplice senza competenze di programmazione.
Articoli correlati
-
Come configurare il Client Portal
-
App Client Portal – Notifiche App Mobile Personalizzate
-
Migrazione da Legacy Membership a Client Portal
Questo articolo è stato utile?