Torna all'app

SimBot v3

Formazione Interattiva WMS Agile — Browser Native Edition

Browser Native Voce + Microfono AI Q&A in Pausa 26 Fasi Bug Detection Osservazioni Utente Dati Reali nel DB

1 Cos'e SimBot

SimBot e un robot formativo che pilota l'applicazione WMS Agile in tempo reale, nel tuo browser. Non e un video preregistrato e non gira su un server remoto: il bot controlla direttamente l'interfaccia che vedi sullo schermo, compilando form, cliccando bottoni e navigando tra le sezioni.

Questa non e una simulazione fittizia. Il bot lavora realmente dentro il software, inserendo dati nel database di produzione. Magazzini, zone, prodotti, ordini: tutto viene salvato e resta nel sistema. Tu e il bot state lavorando insieme, in tempo reale, nel software vero.

L'obiettivo e triplice:

Cosa vedi

A sinistra: l'app WMS caricata in un iframe. Ogni azione del bot e visibile: un cursore blu evidenzia l'elemento cliccato, i campi si compilano in tempo reale.

A destra: il pannello di controllo con log, stato fase, contatore entita e KPI di progresso.

Cosa senti

La voce narra ogni azione usando la Web Speech API. All'avvio presenta l'azienda simulata: "Simuliamo il gruppo Logitech 4PL Group, operatore con 200 dipendenti e 45 milioni di fatturato, 5 siti logistici, 3 clienti in outsourcing..." Poi spiega campo per campo con esempi concreti.

Cosa puoi dire

In pausa, premi il microfono e parla in italiano. Il browser trascrive la voce e invia automaticamente: domande all'AI o osservazioni/migliorie che verranno registrate nel report finale.

Cosa puoi annotare

Il tab Osservazione (giallo) in pausa ti permette di registrare suggerimenti, idee di miglioramento e note. Tutto viene salvato con fase e timestamp. A fine sessione, il report completo e nel log.

2 Come funziona (Architettura)

SimBot v3 e completamente browser-native. Non usa Playwright, Puppeteer o altri tool di automazione server-side.

Architettura tecnica
  • Iframe same-origin: il pannello SimBot (/simbot/panel.html) e servito dallo stesso dominio dell'app WMS. Questo permette l'accesso completo al DOM dell'iframe tramite JavaScript.
  • Automazione DOM: il bot usa frame.contentDocument per accedere all'app, trovare elementi, compilare form e cliccare bottoni — esattamente come farebbe un utente.
  • Web Speech API: la voce usa speechSynthesis nativo del browser. Seleziona automaticamente la voce italiana. Un timer keepalive previene il bug di Chrome che uccide il synth dopo 15 secondi di silenzio.
  • Zero dipendenze: un singolo file HTML con tutto il codice, i dati fixture e gli scenari. Nessun npm, nessun build, nessun server Node.

Flusso di esecuzione

  1. L'utente apre /simbot/panel.html — il browser carica l'app WMS nell'iframe
  2. L'utente sceglie scenario e velocita, poi preme START
  3. Il bot esegue le 26 fasi in sequenza: per ogni entita apre il form, compila i campi, conferma
  4. La voce spiega campo per campo il primo elemento di ogni tipo; gli altri sono piu rapidi
  5. L'utente puo premere PAUSA in qualsiasi momento per fare domande all'AI
  6. Al termine, la fase Verifica controlla che tutti i dati siano nel database

3 L'interfaccia

L'app WMS occupa il 100% dello schermo. SimBot si controlla dalla barra viola in basso.

La barra viola in basso

La barra di controllo SimBot e la striscia viola in fondo allo schermo. E volutamente diversa dal tema dell'app WMS (che e blu scuro) per non confondersi.

ElementoFunzione
SimBot + faseNome del bot e fase corrente in esecuzione
Pallini coloratiProgresso delle 26 fasi: verde = completata, ciano = in corso, rosso = errore
C: / B:Contatori rapidi: C = entita Create, B = Bug rilevati (verde se 0, rosso se >0)
~15minDurata stimata: si aggiorna automaticamente quando cambi scenario o velocita
Scenario / VelocitaSelettori: S2 Fast (~4min) o S2 Full (~15min), e velocita (Veloce/Normale/Lento/Demo)
STARTAvvia la formazione. Controlla se un'altra sessione e in corso (lock).
PAUSAFerma il bot. La barra si espande e mostra il pannello domande/osservazioni con microfono.
STOPInterrompe. I dati creati restano nel database.
▲ FrecciaEspandi/comprimi il pannello log. Click sulla freccia o su qualsiasi punto della barra.
?Apre questa guida rapida

Pannello espanso (click sulla barra)

Nell'app WMS

Durata stimata

Nella barra viola e sempre visibile la durata stimata (~Xmin) che si aggiorna automaticamente in base allo scenario e alla velocita selezionati:

ScenarioVeloceNormaleLentoDemo
S2 Fast~2 min~4 min~7 min~10 min
S2 Full~8 min~15 min~25 min~35 min

Gestione sessioni

4 Le 26 fasi del percorso formativo

Il percorso copre tutte le 23 sezioni del WMS Agile, dalla configurazione iniziale alla gestione operativa quotidiana.

Blocco 1 — Setup e Struttura (fasi 00-05)

#FaseCosa faCosa spiega
00ResetElimina dati SimBot precedentiImportanza di partire da un database pulito
01LoginAccesso come adminI 3 ruoli (admin, supervisor, operator) e le 23 sezioni
02DashboardTour della dashboardKPI principali, health banner, risorse, feed alert
03WarehouseCrea 5 magazziniCodice, nome, indirizzo (per trasporti), superficie (densita stoccaggio)
04ZoneCrea 30 zone6 tipi zona con esempio reale, 5 ambienti termici con range
05BinCrea 27 locazioni4 tipi bin, FEFO vs FIFO, bin dedicato, capacita massima

Blocco 2 — Anagrafica (fasi 06-09)

#FaseCosa faCosa spiega
06ProdottiCrea 61 SKUSKU, categoria, storage type (refrigerato/surgelato/ambiente), peso, tracciabilita lotto
07PackagingTour GS1Gerarchia EA>INNER>CASE>LAYER>PALLET, EAN-13, GTIN-14
08Clienti/Fornitori15 fornitori, 20 clienti, 4 corrieriCanali (HORECA, GDO, e-commerce, pharma), priorita, SLA, tipo servizio corriere
09Operatori8 mezzi + 6 operatoriTipi mezzo (AGV, forklift, cobot, scanner), turni, badge

Blocco 3 — Operativita (fasi 10-16)

#FaseCosa faCosa spiega
10InventarioLotti + stock inizialeScadenze per tipo (30gg latticini, 180gg surgelati, 365gg secchi)
11InboundOrdini + receiving + putawayFlusso 3 fasi: ordine fornitore, controllo QC, stoccaggio
12OutboundOrdini + wave + picking + shipFlusso 5 fasi: ordine, conferma, wave, picking/packing, spedizione SSCC
13TMS3 autisti + giro consegnaDriver, veicolo, giro di consegna, manifesto tappe
14Tracking3 colli con scanTimeline eventi, stati (dispatched, in_transit, delivered)
15Missioni5 missioni operative8 tipi missione, priorita, assegnazione, progresso %
16Conformita4 NCRWorkflow NCR: aperta > indagine > azione correttiva > risolta

Blocco 4 — Funzioni Avanzate (fasi 17-22)

#FaseCosa faCosa spiega
174PL & Billing3 aziende multi-tenantModello 4PL, SLA per tenant, fatturazione Revolut
18Yard3 trailer banchinaGestione piazzale: banchine, staging, parcheggio
19MappaTour planimetriaSVG interattivo, posizione AGV, sensori IoT
20CalendarioTour disponibilitaChiusure a cascata, festivita, turni
21NotificheTest alert4 tipi alert SSE: stock, batteria, SLA, temperatura
22AI AssistantDomanda all'AIClaude + RAG, knowledge base, modelli disponibili

Blocco 5 — Analisi e Verifica (fasi 23-25)

#FaseCosa faCosa spiega
23Operativita5 giorni simulatiRitmo quotidiano: inbound, outbound, movimenti, missioni, alert, NCR
24Report & KPITour 6 tab reportKPI trend, ABC Pareto, forecast, stock valuation
25VerificaConteggi + navigazione completaCollaudo pre go-live: ogni entita verificata, ogni sezione navigata

5 Scenari disponibili

S2 Fast

Scenario rapido per test e demo veloci.

  • 1 magazzino (Hub Nord Segrate)
  • 6 zone, 3 bin
  • 5 prodotti, 2 fornitori, 2 clienti, 1 corriere
  • Durata: ~3 minuti (velocita Normale)
Usa S2 Fast per verificare che il bot funzioni prima di lanciare la formazione completa.
S2 Full (Enterprise)

Scenario completo che simula un gruppo logistico 4PL reale.

  • 5 magazzini (Nord, Sud, Pharma GDP, E-commerce, Resi)
  • 30 zone (ambient, refrigerato, surgelato, controllato)
  • 27 bin (pallet, standard, pick face, bulk)
  • 61 prodotti (latticini, surgelati, pharma OTC/GDP, cosmesi, household, tech)
  • 15 fornitori, 20 clienti, 4 corrieri, 8 mezzi, 6 operatori
  • Durata: ~15-25 minuti (velocita Normale)
Usa S2 Full per la formazione completa o per demo a potenziali clienti.

6 Interazione in pausa: Domande, Osservazioni e Microfono

Durante la pausa il bot si ferma e appare un box interattivo con due modalita.

Tab Domanda

Fai una domanda sul sistema WMS. L'AI risponde a voce e per iscritto. Se l'AI non e disponibile, il sistema usa una knowledge base locale con 12+ risposte pronte sui concetti chiave.

Esempi:

  • "Cosa sono le zone di quarantena?"
  • "Che differenza c'e tra FEFO e FIFO?"
  • "Come funziona il ciclo inbound?"
  • "Cos'e il modello 4PL?"
  • "Come funziona la wave di picking?"
Tab Osservazione

Registra un suggerimento, una miglioria o una nota. Ogni osservazione viene salvata con timestamp e fase corrente. A fine simulazione il log mostra un Report Osservazioni completo.

Esempi:

  • "Aggiungere campo altezza scaffale nei bin"
  • "Il form zone dovrebbe mostrare un'anteprima della mappa"
  • "Manca il campo email nel form fornitore"
  • "La priorita del cliente dovrebbe essere piu visibile"

Input vocale (Microfono)

Oltre a scrivere, puoi parlare. Il bottone microfono (rosso) accanto al campo input attiva il riconoscimento vocale del browser:

  1. Premi il bottone microfono — diventa rosso e appare "Sto ascoltando..."
  2. Parla in italiano — il browser trascrive la tua voce in testo
  3. Il testo viene inserito automaticamente nel campo e inviato (domanda o osservazione in base al tab attivo)
  4. Se e una domanda, l'AI risponde a voce. Se e un'osservazione, viene registrata.
Il microfono usa la Speech Recognition API nativa di Chrome. Funziona meglio con Chrome 90+. Firefox e Safari hanno supporto limitato. Il microfono del computer deve essere attivo e il browser deve avere il permesso di accesso.

Come funziona il flusso

  1. Premi PAUSA — il bot si ferma e la voce dice "Puoi farmi una domanda oppure registrare un'osservazione"
  2. Scegli il tab: Domanda (ciano) o Osservazione (giallo)
  3. Scrivi nel campo + Invio, oppure premi il microfono e parla
  4. La risposta appare nel pannello e viene letta a voce
  5. Premi RIPRENDI quando sei pronto a continuare

7 Glossario concetti chiave

SKU

Stock Keeping Unit: codice univoco di un prodotto. Esempio: SB-FOOD-LATT-001 = Latte Fresco Intero 1L. Appare su etichette, bolle, picking list e fatture.

FEFO

First Expired First Out: i prodotti con scadenza piu vicina escono per primi. Obbligatorio per alimentari deperibili e farmaci.

FIFO

First In First Out: i prodotti entrati per primi escono per primi. Per articoli senza scadenza ma dove conta la rotazione.

GDP

Good Distribution Practice: standard europeo per la distribuzione farmaceutica. Richiede catena del freddo tracciata (2-8°C), lotti registrati, documentazione completa.

Wave

Raggruppamento di piu ordini per ottimizzare il percorso di picking. Il sistema calcola la sequenza ottimale per prelevare tutti i prodotti con il minor numero di passaggi.

Putaway

Lo stoccaggio della merce ricevuta nelle locazioni corrette. Il sistema suggerisce il bin in base a: tipo prodotto, temperatura, capacita, e vincoli FEFO/FIFO.

SSCC

Serial Shipping Container Code: codice GS1-128 univoco per ogni collo spedito. Formato 18 cifre. Permette il tracking dall'uscita dal magazzino alla consegna.

4PL

Fourth Party Logistics: un operatore gestisce la logistica per piu clienti nello stesso magazzino. Ogni cliente (tenant) ha dati separati ma condivide infrastruttura e risorse.

NCR

Non-Conformity Report: segnalazione di un problema (danno, discrepanza, scadenza). Segue un workflow: aperta > indagine > azione correttiva > risolta.

Pick Face

Postazione di prelievo rapido a livello operatore. Contiene poche unita per il picking veloce degli ordini. Rifornita automaticamente dal bulk quando si svuota (replenishment).

8 Bug Detection

SimBot monitora automaticamente ogni operazione e segnala problemi in tempo reale. Il contatore Bug nella barra KPI parte verde (0 bug) e diventa rosso appena viene rilevato un problema.

Cosa viene monitorato

ControlloCosa verificaEsempio di bug
Form aperturaChe DataLoader.newXxx() apra il modale"DataLoader.newZone() chiamato 2 volte ma #modal resta hidden"
Campi formChe ogni campo previsto esista nel DOM"Il campo env_type non esiste nel form #zone-form"
SalvataggioChe il modale si chiuda dopo il click Conferma"Errore salvataggio: modale ancora aperto, possibile errore validazione"
Verifica DBDopo la creazione, controlla via API che i dati siano nel database"Creati 5 warehouse ma nel DB solo 3"
Errori APIRisposte 4xx/5xx dalle chiamate backend"POST /api/zones ritorna 500"

Il Bug Report

A fine simulazione, se sono stati rilevati bug, il log mostra un report completo:

BUG REPORT — 2 problemi rilevati

1. [Zone] Campo mancante: Il campo "operator_type" non esiste nel form #zone-form
2. [Prodotti] Mancano prodotti nel DB: Creati 61 ma nel DB solo 59

Il bug report permette di identificare rapidamente problemi nel frontend, nel backend o nel database. Ogni bug riporta la fase, il tipo di problema e il dettaglio tecnico per facilitare il fix.

9 Requisiti e compatibilita

  • Browser: Chrome 90+ (consigliato), Edge, Firefox, Safari. Chrome ha le voci migliori per la narrazione.
  • Audio: altoparlanti o cuffie per la voce narrante. La prima volta Chrome puo chiedere il permesso per l'audio.
  • Schermo: risoluzione minima 1280x720. Ideale: schermo esterno o modalita fullscreen (F11).
  • Rete: connessione stabile verso app.wms.agile.software. Il bot fa richieste API per creare i dati.
  • Nessuna installazione: tutto gira nel browser, zero dipendenze.

10 Problemi comuni

ProblemaCausaSoluzione
La voce si interrompe dopo le prime fasiChrome uccide il synth dopo 15s di inattivitaIl keepalive timer dovrebbe prevenirlo. Se persiste, ricarica la pagina e riprova.
Il bot si blocca su un formIl modale non si apre o un campo non esistePremi STOP, ricarica, e riparti. I dati gia creati restano.
Errore "Timeout" nel logL'app WMS non risponde (API lenta)Verifica che il server sia attivo. Prova con velocita Lento.
Nessuna voceBrowser senza supporto speechSynthesisUsa Chrome. Verifica che il volume non sia a zero. Clicca l'icona altoparlante per attivare.
L'iframe non caricaProblemi di rete o CORSSimBot deve essere sullo stesso dominio dell'app (/simbot/ servito dal gateway Nginx).

11 Per sviluppatori

Struttura del codice

Tutto il codice e in un singolo file: simbot/panel.html (~2000 righe).

  • Righe 1-95: HTML + CSS del pannello
  • Righe 96-240: Engine (voice, delay, helpers DOM)
  • Righe 240-370: Bot actions (botClick, botFill, botSelect, fillForm, openForm, confirm)
  • Righe 370-420: Array PHASES + phase bar
  • Righe 420-1300: Le 26 funzioni fase
  • Righe 1300-1500: Runner principale, UI handlers, Q&A
  • Righe 1500-1900: Fixture data (scenari S2 e S2-Full)
Aggiungere una fase
  1. Scrivi la funzione async function phaseNuova(data) { ... }
  2. Aggiungi all'array PHASES: { id:'XX', name:'Nome', fn: phaseNuova }
  3. Usa await speak('...') per la narrazione
  4. Usa await nav('view') per navigare
  5. Usa await openForm('DataLoader.xxx()') + await fillForm('form-id', {...}) + await confirm() per le azioni
  6. Ritorna { created: N }

SimBot v3 — WMS Agile © 2026

Avvia SimBot  •  App WMS