1.0 Introduzione
Questo è il manuale utente per la soluzione per app mobile Flutter all’avanguardia e pronta all’uso di WooCommerce Mobile App Builder. Questo plugin per siti Web di eCommerce è stato creato e realizzato in modo esperto per aiutarti a creare app per lo shopping Android e iOS impeccabili e ricche di funzionalità.
1.1 Introduzione a WooCommerce Mobile App Builder
Il modo più sofisticato e automatizzato per espandere il tuo business online su piattaforme mobili è con WooCommerce Mobile App Builder. Trasforma l’intero sito web in un’app mobile con funzionalità e ti consente di vendere prodotti su dispositivi mobili oltre al sito web tradizionale. Le funzionalità e il funzionamento dell’app rispecchiano perfettamente quelli del sito web e sono compatibili sia con dispositivi Android che iPhone. Il framework preconfigurato utilizzato dal nostro WooCommerce Mobile App Builder è stato creato da esperti e professionisti per creare due app di eCommerce Flutter (Android e iOS). Le app possono portare ogni articolo nel tuo negozio a portata di mano dell’utente e aumentare le vendite e i ricavi. Pertanto, questa è la tua migliore opportunità se sei un commerciante di negozi WooCommerce alla ricerca di una soluzione completa per app mobile. Per ottenere informazioni complete sullo sviluppo di app mobili WooCommerce, leggi l’articolo nella sua interezza. Inoltre, il plugin Multi-vendor Marketplace è completamente compatibile con la nostra estensione WooCommerce Mobile App Builder. Le stesse app mobili possono essere utilizzate per accedere all’intero elenco del marketplace. Ancora meglio, forniamo un bundle che include sia WooCommerce Advanced Marketplace With Mobile App che WooCommerce Multi-Vendor Marketplace. Inoltre, saresti convinto a scegliere questa soluzione per app Flutter se considerassi i seguenti vantaggi di WooCommerce Mobile App Maker:
- Una soluzione per app mobile senza bisogno di scrivere codice.
- Un pannello amministrativo accogliente con accesso completo.
- Assistenza gratuita per tre mesi
- Rimedi completamente Flutter (Android e iOS)
- Sincronizzazione delle tue app e del tuo sito web in ogni momento
- Estremamente flessibile in termini di progettazione e funzionamento.
- Utilizza strumenti di marketing pratici per aumentare il coinvolgimento degli utenti.
- Aumenta i ricavi e il traffico del tuo negozio.
Le migliori qualità del WooCommerce Mobile App Builder:
Di seguito è riportato un elenco di alcune delle principali funzionalità che le tue app con WooCommerce Mobile App Builder includeranno:
- Il layout della schermata iniziale può essere modificato (flessibilità completa)
- Identità del negozio
- (24/7) Supporto tramite chat WhatsApp
- Accesso tramite OTP e impronta digitale per tablet e smartphone con Google e Facebook
- Supporta iOS 9 e versioni successive di iOS, nonché Android 4.2 e versioni successive.
- aggiornamenti automatici dell’inventario.
- Numerose opzioni di font e colori
- bilingue e RTL (da destra a sinistra)
- Supporta tutti i tipi di prodotto
- Supporto multi-valuta
- Supporto Sito Web Metodo di spedizione supportato sulle app
- Supporto Sito Web Metodo di pagamento
- Notifiche push a tempo indeterminato
- Opzioni per la condivisione social del prodotto
- Numerose opzioni di ordinamento e filtraggio
- Funzionalità della lista dei desideri
- Buoni sconto online o voucher supportati da app.
- Schermata di pagamento con meno dettagli
- Monitoraggio degli ordini in tempo reale
- Menù a fisarmonica ininterrotto
- Schermata chiara di categoria e prodotto
Ultimi aggiornamenti di versione nelle app mobili WooCommerce:
Con un pulsante “Aggiungi al carrello” integrato per i prodotti nella schermata Home e Categoria, l’app mobile WooCommerce è stata resa più fruibile per gli acquirenti online. Semplicemente toccando il pulsante del carrello, gli utenti possono aggiungere rapidamente prodotti al carrello. La schermata della categoria delle app mobili presenta anche un pulsante Aggiungi al carrello. Gli utenti devono solo scorrere fino in fondo alla pagina per sfogliare i prodotti e continuare ad aggiungere articoli al carrello toccando il pulsante Aggiungi al carrello.
A) Recensioni di app per prodotti
La nostra app mobile WooCommerce è attualmente compatibile con il modulo Product Comments integrato di WooCommerce. L’utente può ora pubblicare recensioni di prodotti sul sito Web e tali recensioni verranno visualizzate anche sull’app. L’utente ha accesso sia alla lettura che alla scrittura di recensioni sull’app.
b) Prodotti correlati dell’App Store
Il modulo Automatic Related Products è ora compatibile con WooCommerce Mobile App Builder. Nella pagina prodotto del sito web e dell’app mobile, possono essere mostrati prodotti correlati. Questa compatibilità può essere uno strumento meraviglioso per la tua azienda per aumentare le vendite incrociate.
C) Collegamento profondo: Una funzionalità di deep linking è integrata nel Applicazione mobile WooCommerce. Ora, quando un link viene condiviso, l’utente verrà indirizzato all’applicazione anziché al sito web. L’unico requisito è installare l’app sul dispositivo mobile. L’utente verrà persino indirizzato alla schermata appropriata dell’app tramite il link condiviso.
D) Accessibilità in modalità offline: Con questa estensione, le app mobili di eCommerce funzioneranno anche quando non c’è connessione a Internet. Gli utenti possono navigare in qualsiasi momento sulle pagine caricate mentre Internet era attivo. Prodotti, categorie, schermata del carrello, ecc.
–> Esplora Modulo GDPR WooCommerce
E) Compatibilità Spin & Win (abbonamento e-mail gamificato):
L’estensione WooCommerce Spin & Win è compatibile anche con WooCommerce Mobile App Creator. Sul web store, un pop-up interattivo a forma di ruota girevole che può essere programmato per la visualizzazione in entrata o in uscita è fornito dal pop-up di iscrizione e-mail gamificato. Lo stesso pop-up verrà ora visualizzato automaticamente sulle app grazie a questa integrazione. L’estensione deve essere installata solo sul tuo sito web.
F) Elementi del banner video: Il WooCommerce Mobile App Builder di Knowband ora supporta i banner video sulla home page. Gli amministratori dello store possono caricare video direttamente o incorporare video di YouTube, rendendo la home page visivamente più accattivante e migliorando l’esperienza utente.
G) Visualizzazione elenco/griglia: WooCommerce 2 Native Mobile App Builder di Knowband per Android e iOS consente agli utenti dell’app di passare facilmente dalla visualizzazione elenco a quella griglia mentre navigano tra i prodotti. Questa funzionalità migliora l’esperienza di acquisto offrendo un modo flessibile e attraente per esplorare i prodotti. Gli utenti possono passare da una visualizzazione all’altra utilizzando il pulsante elenco/griglia nelle pagine di elenco prodotti.
H) Slider banner automatici: L’ultimo Knowband Magento 2 Mobile App Builder include una funzionalità di scorrimento banner automatizzata. Gli amministratori dello store possono facilmente impostare l’intervallo di scorrimento dal backend del modulo. Ciò è particolarmente utile per “Banner Horizontal Sliders” nella home page, consentendo agli amministratori di aggiungere banner video e immagini per una visualizzazione più dinamica e coinvolgente.
I) Sezione di revisione avanzata: L’app mobile Knowband presenta una sezione di recensioni migliorata. Le recensioni approvate vengono visualizzate con un’interfaccia utente migliore, offrendo un’esperienza visivamente più accattivante e fluida sia per gli utenti Android che iOS. –> Indaga su Modulo WooCommerce Spin Win
Questa non è la fine dell’elenco. Scopri di più sulle funzionalità in modo approfondito da questa pagina.
2.0 Demo dell’app mobile WooCommerce
KnowBand è consapevole della tua esitazione nell’utilizzare la soluzione e ha fornito a tutti i proprietari di negozi di eCommerce una demo gratuita per alleviare le tue preoccupazioni. I commercianti possono vedere il loro negozio in funzione sulle nostre app demo e il nostro negozio demo in funzione sui dispositivi mobili.
2.1 Dai un’occhiata al nostro Demo Store per le app
Vuoi vedere le funzionalità dell’app eCommerce? Per consentirti di esplorare l’app e vederne tutte le funzionalità, abbiamo integrato il nostro negozio demo con essa. Basta attenersi alle linee guida riportate di seguito: Passaggio 1: il tuo dispositivo mobile può essere utilizzato per scaricare e installare l’app mobile Nautica WooCommerce. Di seguito sono riportati i link per scaricare le versioni di prova delle seguenti app: Apple App Store – https://testflight.apple.com/join/mrvIRLfw
Google Play Store- https://play.google.com/store/apps/details?id=com.velsof.woocommercegenericapp
In secondo luogo, fai clic sul pulsante Visualizza demo dopo aver avviato l’app Nautica WooCommerce. Ho finito! Sull’app demo, vedrai il nostro negozio demo in funzione. Puoi esplorarlo, testare ogni funzionalità, effettuare ordini, ecc. Nota: CLICCA QUI per accedere al pannello di amministrazione di KnowBand Mobile App Builder sul nostro negozio demo.
2.2 Guarda il tuo negozio funzionare con le app demo
Non sei soddisfatto? Vuoi testare le app demo sul tuo store? Abbiamo tutto ciò che ti serve, però. Sulla nostra app demo, puoi anche provare il tuo store, e senza costi. Devi solo seguire questi 3 passaggi per ottenere gli stessi risultati:
- installare il Generatore di app mobili WooCommerce GRATUITO plug-in sul tuo negozio come primo passo.
- Installa le app demo sul tuo dispositivo mobile nel passaggio 2 (i link sono nella sezione precedente). Apri l’app e digita l’URL dello store.
- Fai clic su “Visualizza il tuo negozio” per iniziare a utilizzare le app demo per esplorare il tuo negozio.
- Digita l’URL del tuo negozio nella casella visualizzata.
Ad esempio, vedi https://www.example.com/ Nota: nessun file APK o IPA verrà fornito con questo modulo; questa versione gratuita di Mobile App Builder è solo a scopo dimostrativo. Devi acquistare la versione a pagamento di WooCommerce Mobile App Builder per ottenere i tuoi file APK/IPA.
3.0 Crea un’app mobile WooCommerce in 3 semplici passaggi
Ci auguriamo che la demo di WooCommerce Mobile Apps ti sia piaciuta e che tu abbia scoperto ciò che stavi cercando. Quindi ora è il momento perfetto per aggiungere un paio di app Flutter al tuo negozio. Un’app mobile di eCommerce può essere creata nel modo più semplice possibile. La tua app sarà pronta in soli 3 semplici passaggi e 1-2 giorni lavorativi.
Prima, aggiungi il modulo al tuo sito web. Installa WooCommerce Mobile App Builder sul tuo negozio dopo averlo scaricato.
Passo 2 : Condividi i dettagli della tua candidatura Utilizza il nostro modulo dei prerequisiti per condividere le specifiche della tua app.
Passo 3 : In 1-2 giorni, ricevi le tue app I nostri sviluppatori esperti e competenti creano le tue app esattamente in base ai dettagli condivisi. In 1-2 giorni, ti risponderemo con i file APK/IPA. Nota: questi file APK/IPA possono essere pubblicati sugli app store appropriati. Hai ancora problemi? Diccelo e ti aiuteremo a pubblicare le app. Inoltre, puoi contattarci all’indirizzo support@knowband.com se hai domande o suggerimenti.
4. Installazione del modulo
Riceverai i file elencati di seguito una volta acquistato il modulo WooCommerce Mobile App Builder: 1. File compresso in formato ZIP (contiene il codice sorgente del componente aggiuntivo) 2. Guida per l’utente
Ora puoi continuare il processo di installazione in uno dei due modi elencati di seguito:
Dettagli dell’installazione del modulo tramite FTP Installazione di un modulo utilizzando i dettagli di amministratore
5.0 Schermate per il pannello di amministrazione
È il momento di impostare il pannello di amministrazione di WooCommerce Mobile App Creator dopo averlo installato con successo sul tuo sito web. Vedrai la seguente scheda con interfacce user-friendly non appena selezioni l’opzione “Configure” su KnowBand Mobile App Builder. Eliminiamole una per una.
5.1 Impostazioni generali:
Le impostazioni necessarie affinché i dispositivi degli utenti eseguano la tua app mobile sono tutte coperte dalla scheda General Setting. Questa scheda contiene tutte le opzioni generalizzate necessarie per sincronizzare l’app.
A) Abilita plugin: Per rendere la tua app mobile funzionale sui dispositivi degli utenti, abilita il plugin WooCommerce Mobile App Creator. B) Abilita Gira e Vinci: Quando un utente apre l’app, abilita la visualizzazione di un pop-up con ruota girevole gamificata nella schermata iniziale. Può essere utilizzato per fornire sconti e offerte in cambio dei loro indirizzi e-mail, che vengono poi utilizzati per il marketing. Il modulo Spin and Win di Knowband deve essere installato sul tuo sito Web affinché questa funzionalità funzioni. Il modulo Spin and Win funzionerà solo se il plugin è stato installato nel tuo store. C) Reindirizzamento sulla pagina del carrello quando aggiungi al carrello: Questa funzionalità ti consente di gestire la navigazione del pulsante “Aggiungi al carrello”. Quando un utente tocca il pulsante Aggiungi al carrello, hai la possibilità di inviarlo al carrello o di mantenerlo sulla pagina del prodotto. Ciò aumenta la probabilità di effettuare ulteriori acquisti. D) Visualizza breve descrizione: Consentire che una breve descrizione del prodotto venga visualizzata nella schermata del prodotto insieme alla descrizione completa e ad altre informazioni.
E) Scegli layout: Seleziona il layout della home page che desideri per la tua app WooCommerce. In base alle diverse festività e ai temi, puoi creare una varietà di layout della schermata iniziale nel backend e utilizzarli come necessario per il tuo negozio. Scegli il colore del pulsante preferito per la tua app mobile WooCommerce sotto l’opzione F) Colore tema app: Scegli il colore del tema preferito per la tua app mobile WooCommerce. G) Immagine logo: Metti il logo del tuo negozio nell’intestazione superiore dell’app caricandolo. Ciò ha aiutato il tuo marchio a ottenere riconoscimento tra i clienti mobili globali. H) Metodi di spedizione disabilitati: Seleziona le opzioni di spedizione che desideri nascondere dall’app mobile WooCommerce. I) Pagine CMS abilitate: Seleziona le pagine CMS che desideri vengano visualizzate sulle app mobili. J) Abilita la segnalazione del registro delle richieste: Abilita la funzionalità di registro sulle app mobili per saperne di più su eventuali comportamenti insoliti manifestati dalla tua app. K) Abilita il supporto della chat di WhatsApp: Sulle tue app mobili WooCommerce, abilita l’opzione chat WhatsApp. Il tuo numero WhatsApp inserito nel backend può essere utilizzato dagli utenti per contattarti direttamente. L) Abilita/disabilita la registrazione del numero di telefono: Nella tua app mobile WooCommerce, abilita l’opzione di accesso tramite numero di telefono e abilita l’autenticazione OTP per i tuoi utenti. M) Abilita la codifica URL per i collegamenti alle immagini: Attiva questa funzione per consentire all’app di supportare caratteri diversi da ASCII.
N) Mostra il pulsante Aggiungi al carrello sul blocco prodotto: Con l’aiuto di questo pulsante, l’amministratore può mostrare/nascondere il pulsante “Aggiungi al carrello” per le pagine di elenco prodotti.
O) Abilita la funzionalità Elenco notifiche: Il pulsante consente all’amministratore di abilitare le funzionalità di elenco delle notifiche per gli utenti dell’app. Se questa opzione è disabilitata, la scheda delle notifiche non verrà visualizzata nell’app.
P) Abilita il popup di accesso: Con questa opzione l’amministratore può abilitare o disabilitare il pop-up di accesso/registrazione per i nuovi clienti.
5.2 Impostazioni per le notifiche push
I Google Primary Services per le notifiche push sui dispositivi mobili sono utilizzati da WooCommerce Mobile App Creator per Android e iOS per sfruttare la potenza delle notifiche push. Fornisce questo pratico strumento di marketing per aumentare le vendite catturando subito l’attenzione degli utenti. Con l’aiuto della tua app mobile WooCommerce, puoi facilmente evidenziare le tue offerte e promozioni attuali. WooCommerce Mobile App Maker offre notifiche sia automatiche che personalizzate.
A) Account di servizio JSON: Con la deprecazione della tradizionale API di messaggistica push di Firebase, è stata sostituita da un file JSON dell’account di servizio. In questa sezione, gli amministratori possono configurare il file JSON dal loro account Firebase. Puoi configurarlo tu stesso oppure possiamo fornirti il file JSON dell’account di servizio durante il processo di creazione dell’app per la tua comodità. B) Abilita/Disabilita notifica creazione ordine: Abilita/disabilita la notifica push automatica inviata agli utenti dell’app al momento della creazione corretta dell’ordine. –> Titolo e messaggio per la notifica push: per creare un ordine correttamente, inserisci il titolo e il messaggio nelle impostazioni della notifica push. C) Notifica di modifica dello stato dell’ordine: Gli utenti dell’app possono scegliere se ricevere notifiche push automatiche quando cambia lo stato di consegna del loro ordine precedente. -> Titolo e messaggio per la notifica push: Inserisci il titolo e il messaggio ogni volta che lo stato di consegna di un ordine precedente viene aggiornato nelle impostazioni della notifica push. D) Abilita/disabilita la notifica carrello abbandonato: Abilita/Disabilita le notifiche push automatiche che vengono inviate agli utenti i cui carrelli sono stati abbandonati ma non è stato effettuato alcun acquisto. Inserisci il titolo e il messaggio per la notifica push inviata agli utenti dell’app che hanno abbandonato i loro carrelli. E) Intervallo di tempo: Intervallo di tempo (in ore) entro il quale gli utenti dell’app che hanno abbandonato il carrello senza effettuare alcun acquisto riceveranno le notifiche push.
5.3 Cronologia delle notifiche push
Questa scheda include una cronologia di ogni tipo di notifica push inviata a un utente con informazioni rilevanti. Il rivenditore ha accesso a tutte le notifiche inviate in precedenza. Inoltre, una notifica personalizzata creata nel backend può essere inviata agli utenti tramite questa scheda. Tramite notifiche inviate manualmente, puoi facilmente informare i clienti su qualsiasi informazione o sconto pertinente al negozio.
Invia notifica: Puoi scegliere di inviare manualmente una notifica agli utenti dell’app utilizzando questa opzione. In base allo screenshot qui sotto, puoi personalizzare il titolo della notifica, il messaggio, la landing page, l’immagine, ecc.
a) Titolo della notifica push: Questo è il nome della notifica push manuale che invierai agli utenti dell’app. b) Messaggio di notifica push: Il testo della notifica manuale che deve essere inviata agli utenti dell’app. c) Tipo di dispositivo: Puoi specificare quali utenti su Android, iOS o entrambe le piattaforme desiderino ricevere la notifica push manuale. d) Tipo di immagine: Puoi caricare il banner o l’immagine che vuoi usare per supportare la tua notifica. L’immagine del banner può essere usata direttamente tramite un URL o caricata. e) Immagine di notifica: All’amministratore dello store viene data l’opportunità di visualizzare in anteprima l’immagine di notifica e valutare come apparirà sulle app degli utenti. L’URL effettivo dell’immagine di notifica che verrà inviata agli utenti dell’app è elencato nella voce f. f) Attività di reindirizzamento: Qui puoi selezionare dalla schermata Home, da qualsiasi categoria o da qualsiasi prodotto per reindirizzare la tua notifica. I tuoi utenti saranno indirizzati a qualsiasi cosa tu specifichi quando toccano la notifica push. g) Scegli la categoria/prodotto: Per la notifica puoi selezionare qualsiasi categoria/schermata del prodotto pertinente. h) Invia notifica: Dopo aver creato e visualizzato in anteprima la notifica, è il momento di inviarla alle tue app.
5.4 Procedure di pagamento
Tutti i tipi di metodi di pagamento del sito Web sono supportati da WooCommerce Mobile App Creator per app Android e iOS. Include anche l’opzione per i pagamenti in contrassegno e la flessibilità di includere metodi di pagamento aggiuntivi Web-View. Nella nostra app mobile, l’unica opzione di pagamento disponibile è il pagamento alla consegna per impostazione predefinita. Tuttavia, disabilita il metodo in contrassegno dal back-end del modulo se desideri aggiungere gli stessi metodi di pagamento del tuo negozio WooCommerce. Tutte le opzioni di pagamento disponibili sul tuo sito Web funzioneranno come previsto nelle tue app mobili dopo aver disabilitato il metodo in contrassegno. .
5.5.1 Progettazione della home page
La capacità del plugin WooCommerce Mobile App Builder di progettare e creare più layout della schermata iniziale utilizzando diversi attributi ed elementi di progettazione è una delle sue caratteristiche più sorprendenti. Come si può vedere nello screenshot qui sotto, questa scheda contiene un elenco di layout della schermata iniziale che sono stati precedentemente configurati utilizzando diversi temi e font:
Per configurare i layout della home page, nel back-end sono disponibili i seguenti elementi:
- Le migliori categorie
- Banner quadrato
- Banner scorrevole orizzontale
- Banner griglia
- Bandiera del conto alla rovescia
- Prodotti a griglia
- Prodotti a scorrimento orizzontale
- Prodotti a cui si è avuto accesso di recente
- Aggiungi video di YouTube/carica video nel layout della home page.
- Pop-up di accesso/registrazione per gli utenti non registrati.
- Aggiungi banner personalizzati con dimensioni personalizzate.
Ognuno di questi attributi può essere impostato dal commerciante del negozio e utilizzato per creare e salvare più layout. Questi layout possono essere utilizzati in base al tema e alle specifiche. Inoltre, utilizzando semplicemente una funzionalità di trascinamento della selezione, è possibile modificare le posizioni di diversi elementi.
Categorie principali:
Le categorie principali possono essere configurate, incluse le loro categorie di immagini e di atterraggio o prodotti, e sono mostrate come piccoli quadrati nella schermata iniziale. Il numero massimo di categorie disponibili tramite WooCommerce Mobile App Maker è 8, con un minimo di 4 richieste.
Banner quadrato:
Le categorie principali possono essere configurate, incluse le loro categorie di immagini e di atterraggio o prodotti, e sono mostrate come piccoli quadrati nella schermata iniziale. Il numero massimo di categorie disponibili tramite WooCommerce Mobile App Maker è 8, con un minimo di 4 richieste. Negli aggiornamenti recenti, abbiamo anche fornito l’opzione di mostrare video diversi con la sezione YouTube Video/Video Upload aggiunta nella sezione “Select Image Type”.
Banner scorrevole orizzontale:
Queste porte scorrevoli rettangolari sono disponibili e completamente personalizzabili dal backend. Come i banner square, l’amministratore può anche evidenziare gli slider dei banner aggiungendo elementi video. Inoltre, ora l’amministratore può avere l’opzione di inserire l’ora che desidera impostare per lo scorrimento automatico dei banner.
Banner griglia:
Si tratta di banner quadrati elencati in un formato griglia nella schermata iniziale. Nella schermata iniziale, puoi posizionare tutti i banner che vuoi. Puoi anche cambiare l’immagine della landing page a seconda delle tue esigenze.
Banner con timer per il conto alla rovescia:
Un timer per il conto alla rovescia è disponibile sul banner fornito da WooCommerce Mobile App Builder. Puoi scegliere la landing page e l’immagine del banner, nonché impostare un timer per quando vuoi visualizzare il banner. Il banner scomparirà automaticamente quando il timer scade.
Prodotti quadrati:
Per quanto riguarda i banner, WooCommerce Mobile App Creator fornisce prodotti da mostrare come elenchi quadrati nella schermata iniziale.
Prodotti a scorrimento orizzontale
I prodotti possono essere aggiunti come cursori orizzontali. I prodotti scelti possono rientrare in una qualsiasi categoria specifica o possono essere evidenziati come Best Seller, Prodotti in evidenza, ecc.
Prodotti della griglia:
È anche possibile aggiungere alla schermata iniziale elenchi di prodotti in griglia. È possibile utilizzare qualsiasi categoria per selezionare i beni.
Prodotti visti di recente: WooCommerce Mobile App Creator offre l’elemento scheda recente, che mostra i prodotti più recenti che l’utente ha visualizzato. Per visualizzare l’elemento nella schermata iniziale, basta includerlo nel layout.
Pop-up di iscrizione: Catturare le email dei visitatori è una sfida importante nell’eCommerce. Per semplificare, l’ultima versione di Magento 2 Mobile App Builder include una funzionalità pop-up di login/registrazione. Gli amministratori del negozio possono aggiungere un pop-up che appare per i clienti non registrati, semplificando la raccolta delle email offrendo semplici opzioni di login e aumentando le possibilità di opt-in via email. Nota: quando si progetta un layout nel pannello backend, l’amministratore del negozio può aggiungere fino a 20 elementi.
6.0 Schermate per app mobili
6.1 Home Screen
La schermata Home della tua app mobile WooCommerce sarà esattamente come la vuoi. Hai il controllo creativo completo su come progettare e creare una schermata Home con WooCommerce Mobile App Maker. Puoi creare layout di schermate Home intuitivi utilizzando una varietà di banner (quadrato, griglia, scorrevole), prodotti (quadrato, griglia, scorrevole), banner con timer per il conto alla rovescia e schede di prodotti recenti nel backend.
Inoltre, la disposizione dei diversi elementi di design può essere modificata in base alla situazione. 1. Layout dinamici: Puoi creare e salvare diversi layout nel backend e riutilizzarli per diversi eventi e festival utilizzando una varietà di elementi. La schermata iniziale della tua app può essere creata e personalizzata dinamicamente. 2. Logo del marchio: La sezione centrale-sinistra dell’intestazione superiore dell’app mobile WooCommerce mostra il logo del tuo negozio. Il logo può essere abilitato o disabilitato, così come la sua immagine può essere modificata, dal backend del modulo. 3. Cerca: La funzione di ricerca consente agli utenti dell’app mobile di trovare ciò che stanno cercando in modo rapido e semplice. L’app mobile WooCommerce offre due modi per cercare i prodotti: Nella barra delle schede inferiore dell’app mobile WooCommerce, c’è un’opzione di ricerca. –> Testo: Gli utenti della tua app possono cercare i prodotti desiderati inserendo alcune parole chiave pertinenti. L’app mobile WooCommerce visualizzerà i risultati per quella parola chiave che sono pertinenti. 4. Borsa della lista dei desideri: La borsa della lista dei desideri, che contiene tutti i prodotti aggiunti ai preferiti, è visibile nell’intestazione superiore della tua app mobile WooCommerce. Gli utenti dell’app possono conservare gli articoli della loro lista dei desideri in una borsa per potenziali acquisti futuri. 5. Carrello: Il carrello degli acquisti si trova nella schermata iniziale dell’app nell’angolo in alto a destra. Gli utenti possono conoscere i prodotti aggiunti al carrello direttamente da lì. 6. WhatsApp:
Un’opzione di chat live venditore-acquirente si trova in basso a destra della schermata iniziale. I clienti che utilizzano la tua app mobile possono facilmente e direttamente inviarti messaggi con qualsiasi domanda, e tu puoi rispondere subito.
6.2.1 Un menu a fisarmonica (barra di navigazione)
Sul sito web sono presenti app mobili WooCommerce per Android e iOS sviluppate con una categorizzazione accurata dei prodotti. Gli acquirenti mobili possono sfogliare una varietà di prodotti con facilità. Il menu Accordion è disponibile anche per tutte le pagine CMS. Offre le seguenti alternative:
1. Il mio account
Tutti i dati utente, inclusi i dettagli personali, gli indirizzi di spedizione e i dettagli dell’ordine, possono essere trovati nella schermata Il mio account. I clienti hanno accesso a tutte le loro informazioni e possono aggiornare sia le loro credenziali di accesso che le informazioni personali. 2. Categorie
Queste categorie corrispondono esattamente a quelle del tuo sito web. Per una navigazione semplice, puoi mapparle in modo appropriato e fornire una categorizzazione a 3 livelli agli utenti dell’app. 3. Pagine CMS
Qui vengono visualizzate diverse pagine CMS del tuo sito web, tra cui Chi siamo, Contattaci, Termini e condizioni, ecc. Dal backend di WooCommerce Mobile App Builder, puoi selezionare quella che vuoi che venga mostrata sull’app mobile. 4. Lingua
I tuoi utenti possono visualizzare l’app WooCommerce Mobile nella loro lingua madre utilizzando l’opzione di selezione della lingua. 5. Valute
L’app mobile WooCommerce mostra anche tutte le valute offerte sul tuo sito e-commerce. I clienti possono visualizzare e acquistare prodotti al prezzo nella valuta di loro scelta. 6. Accedi/Esci
Questa opzione semplifica per i tuoi utenti l’accesso e la disconnessione dall’app mobile WooCommerce.
6.3 Schermata Categoria:
La tua app mobile WooCommerce include tutte le categorie associate, le categorie padre e le sottocategorie. La schermata delle categorie è creata con il minimo ingombro in
1. Due visioni fondamentali: Griglia ed Elenco. In ogni inserzione, il nome del prodotto, l’immagine, il prezzo e lo sconto vengono mostrati insieme a un pulsante per aggiungerli alla borsa della lista dei desideri. La navigazione a strati sulle app mobili create con WooCommerce Mobile App Builder semplifica notevolmente la ricerca dei prodotti. Le schermate delle categorie offrono le seguenti scelte:
2. Ordina:
I clienti possono scegliere l’ordine preferito per ordinare i prezzi dei prodotti di categoria utilizzando questa opzione. Le tue app hanno due opzioni di ordinamento: Prezzo: dal più basso al più alto e Prezzo: dal più alto al più basso.
3. Filtro:
Gli utenti possono filtrare i prodotti utilizzando le varie opzioni di selezione fornite nella scheda filtro.
6.4 Schermata del prodotto:
La schermata del prodotto della tua app mobile WooCommerce è semplice e interessante. Insieme al nome e al prezzo, vengono visualizzate varie immagini dello stesso articolo. A seconda dello stato dell’inventario, la disponibilità del prodotto è indicata anche come “In Stock” o “Out Of Stock”. Include i successivi articoli aggiuntivi.
Opzioni prodotto: questa schermata mostra tutte le opzioni disponibili per il prodotto, tra cui taglia, colore e così via. Le scelte di prodotto qui corrispondono a quelle sul sito web.
2. Breve descrizione
Gli utenti potranno decidere rapidamente dopo aver letto la breve descrizione del tuo prodotto.
3. Dettagli e cura del prodotto
Questa pagina mostra tutte le informazioni sul prodotto elencate sul sito web. Gli utenti dell’app possono accedere a questa pagina per informazioni dettagliate sul prodotto.
4. Aggiungi alla lista dei desideri: Toccando “Aggiungi alla lista dei desideri” in basso a sinistra nella schermata del prodotto, gli utenti dell’app mobile possono aggiungere direttamente il prodotto ai preferiti.
5. Aggiungi al carrello: Come suggerisce il nome, cliccando sul pulsante “Aggiungi al carrello” il prodotto viene aggiunto direttamente al carrello, consentendo agli utenti di proseguire con la transazione.
6. Condivisione social del prodotto
In questa schermata, hai la possibilità di condividere il tuo prodotto su vari social network, tra cui Bluetooth ed e-mail. Gli utenti dell’app possono invitare molti utenti alla tua app condividendo i prodotti con i loro amici e familiari su varie piattaforme di social media.
Schermata di accesso 6.6
WooCommerce Mobile App Creator semplifica il processo di accesso/registrazione e offre una varietà di opzioni di accesso con un solo tocco:
1. Accesso
Utilizzando i propri indirizzi email come credenziali di accesso, gli utenti delle app possono autenticarsi e accedere alle app.
2. Registro
L’app mobile consente a tutti i nuovi utenti dell’app di registrarsi e creare un account sullo store. Nel modulo di iscrizione all’app mobile WooCommerce vengono richieste solo le informazioni pertinenti.
3. Usa il numero di telefono per accedere
L’opzione di accesso tramite numero di telefono più semplice e affidabile offerta dalla tua app mobile semplifica per gli utenti l’accesso e la verifica del loro OTP.
4. Utilizza la tua impronta digitale per accedere
Inoltre, i tuoi utenti hanno la possibilità di utilizzare l’autenticazione tramite impronta digitale per effettuare l’accesso. Grazie a questo, ora gli utenti possono accedere rapidamente alle app.
5. Accedi con Facebook
Gli utenti possono accedere all’app effettuando l’accesso con le proprie credenziali Facebook.
6. Accedi con Google
Gli utenti possono accedere all’app in pochissimo tempo utilizzando il proprio account Google.
7. Schermata Carrello:
Tutti gli articoli nel tuo carrello sono visualizzati nella schermata del carrello della WooCommerce Mobile App. Il nome del prodotto, la quantità, il prezzo totale e il costo di spedizione sono tutti visibili agli utenti dell’app.
1.Utilizza il buono
Inserendo i coupon e i voucher attivi attualmente sul tuo sito web, questa opzione consente agli utenti di ricevere sconti e offerte.
2. Il costo totale del prodotto
Gli utenti possono accedere a questa pagina per visualizzare il costo totale del loro carrello della spesa. Viene aggiornato automaticamente ogni volta che si verifica una modifica nella quantità di un prodotto o un’aggiunta.
3. Revisione della quantità del prodotto
Con l’opzione “Aggiorna quantità”, gli utenti dell’app possono persino modificare la quantità del prodotto.
4. Rimuovi l’oggetto
Gli utenti dell’app possono rimuovere facilmente un prodotto dal carrello selezionando “Rimuovi” dal menu.
6. Continua alla cassa
Selezionando “Continua al checkout”, gli utenti dell’app mobile front-end possono proseguire con le schermate di checkout e pagamento. Nella schermata di checkout, riceveranno un reindirizzamento.
6.8 Processo di pagamento
Il processo di checkout nell’app mobile WooCommerce Builder è semplificato. Nel processo di checkout dell’app mobile, gli utenti front-end hanno la possibilità di scegliere i dettagli di spedizione, i dettagli di fatturazione, i numeri degli ordini, i commenti sugli ordini e così via.
Gli ordini possono essere effettuati utilizzando solo pochi semplici passaggi sulle app Android e iOS. 1. I clienti possono scegliere e aggiungere l’articolo desiderato ai loro carrelli. Quando si clicca sul carrello, l’utente può anche scegliere la quantità di prodotto desiderata. Gli utenti dell’app front-end mobile possono anche visualizzare il numero totale di prodotti e i costi di spedizione. Nella parte inferiore della stessa pagina, il cliente può anche scegliere di utilizzare qualsiasi coupon o codice coupon. 2. L’utente può rivedere l’ordine e vedere diversi dettagli dopo aver selezionato l’opzione Continua al checkout, come il costo del prodotto, il costo della spedizione, l’indirizzo di spedizione (che può essere modificato nella stessa pagina), il riepilogo dell’ordine (il numero di prodotti), il costo totale e così via. Nella stessa pagina, il cliente può anche scegliere il metodo di spedizione preferito. L’opzione di commento all’ordine che appare nella parte inferiore dello schermo consente all’utente di includere anche eventuali richieste o requisiti speciali.
Gli utenti possono scegliere tra tutte le opzioni di pagamento del sito Web in questa schermata. L’app per lo shopping include un’opzione di pagamento in contrassegno come forma di pagamento standard. L’utente verrà indirizzato alla schermata di riepilogo dell’ordine dopo aver completato l’attività di pagamento, dove il cliente può visualizzare lo stato, il costo e altre informazioni relative ai propri ordini. Gli utenti delle app mobili front-end riceveranno anche i messaggi popup di conferma dell’ordine sugli schermi dei loro telefoni cellulari.
6.9 Schermata Il mio account
Gli utenti dell’app eCommerce Android/iOS possono visualizzare tutte le informazioni dell’account, inclusa una cronologia degli ordini precedenti, nella schermata Il mio account. Le seguenti opzioni sono disponibili nella schermata Il mio account:
- Ordine Storia
Gli utenti apprendono tutti i dettagli dell’ordine effettuato in precedenza. La data in cui è stato inviato l’ordine, il numero dell’ordine, il prezzo e lo stato della consegna sono tutti visibili sullo schermo degli utenti.
2. Aggiorna profilo:
Gli utenti possono anche aggiornare le informazioni del loro profilo salvate in precedenza, come nome o cognome, numero di telefono e password.
3. Indirizzo/i di consegna
Gli utenti dell’app hanno accesso all’elenco completo degli indirizzi di spedizione salvati. Da qui, puoi anche aggiungere un nuovo indirizzo di spedizione.
4. Dettagli dell’ordine:
L’elenco completo degli ordini effettuati in precedenza è disponibile per gli utenti dell’app.
5. Funzione di riordino
Selezionando il pulsante “Reorder” puoi riordinare direttamente un prodotto. Premendo un singolo pulsante, tutti gli ordini precedenti verranno aggiunti al carrello.
6.10 Schermata dei dettagli dell’ordine
La schermata dei dettagli dell’ordine dell’app eCommerce WooCommerce mostra ogni aspetto dell’ordine, incluso l’indirizzo di spedizione, un riepilogo dei prodotti, le opzioni di spedizione e pagamento e il costo totale. Da questa schermata, gli utenti possono persino seguire la consegna degli ordini effettuati in precedenza.
7.0 Tutorial video
