Demo

Crea un assistente per cataloghi industriali come la nostra demo

Tutta la realizzazione in sintesi

Un unico dataset condiviso alimenta un’esperienza di ricerca per specifiche e una chat con un application engineer. I datasheet supportano le risposte tecniche; moduli e servizi collegati supportano le azioni di confronto, disponibilità e preventivo.

La demo del catalogo industriale aiuta gli ingegneri a passare da una domanda sulle specifiche a una decisione di acquisto. Possono cercare per codice articolo, valore nominale o interfaccia; confrontare componenti; controllare disponibilità e tempi di consegna; aprire un datasheet; e creare un preventivo in tempo reale senza lasciare il catalogo.

Questa guida segue la realizzazione nell’ordine che conta: indicizzare le prove, rendere la ricerca il percorso rapido, aggiungere strumenti per azioni reali e poi testare il risultato.

1. Indicizza le pagine e i documenti

Crea un dataset di memoria e acquisisci le pagine di prodotto, categoria, specifiche e disponibilità. Poi includi i documenti di prodotto che contengono i dettagli che una scheda prodotto non riporta.

Da includere nella scheda prodottoPerché conta
Datasheet e mappe dei registriRispondono alle domande elettriche e sulle interfacce.
Dichiarazioni di conformitàSupportano le verifiche di certificazione.
Note CAD e PDF tecniciDanno agli ingegneri il dettaglio necessario per scegliere un componente.

Inserisci ogni documento nella pagina di prodotto pertinente, così il crawler può indicizzarlo e restituirlo come fonte. Gli ingegneri chiedono valori massimi, assorbimento di corrente, profili di rifusione e indirizzi I²C: questi dati di solito sono nel PDF, non nei testi di marketing.

Copertura dei documenti significa copertura dei prodotti

In un catalogo tecnico, un indice completo delle pagine non basta. Controlla nel dataset i dati contenuti nei documenti, non solo i titoli dei prodotti e gli URL.

Consulta Creare una knowledge base e Configurare i job di acquisizione dati.

“Un numero corretto con il datasheet sbagliato alle spalle è comunque una risposta sbagliata.”


Un ingegnere che conosce il vincolo deve poterlo digitare e ottenere una risposta diretta con fonti. Per questo la homepage mette in primo piano un centro di ricerca intelligente, mentre una chat con un application engineer gestisce le domande più approfondite che richiedono contesto o un botta e risposta.

Esigenza dell’ingegnereInterfaccia miglioreCosa offre
Trovare un componente o una specifica notiRicerca per specificheUna risposta scritta con schede dei componenti come fonti.
Confrontare opzioni o interpretare un risultatoChat con l’application engineerUna conversazione contestuale e strumenti tecnici.
Controllare un ordine o un preventivoChat sensibile al contestoInformazioni legate all’acquirente che ha effettuato l’accesso.

Usa un testo segnaposto che insegni lo stile della query: “Cerca per codice articolo, specifica, interfaccia, package o categoria.” Quando la ricerca è vuota, mostra componenti in evidenza così la homepage continua a sembrare un catalogo.

Usa un’unica knowledge base per entrambe le interfacce

L’esperienza di ricerca e la chat sono configurazioni separate, ma usano un solo dataset. Così ogni dato resta coerente e puoi aggiornare una revisione del datasheet una sola volta.

  • Mantieni le fonti allineate. Ricerca e chat recuperano le stesse informazioni sui componenti.
  • Tieni le funzionalità dove servono. Moduli e servizi collegati appartengono all’assistente; il dataset condiviso mantiene le loro risposte ancorate allo stesso catalogo.
  • Tieni distinti i compiti. La ricerca serve per una risposta rapida e con fonti. La chat serve per la domanda successiva: “Quale costa meno a volume, ed è disponibile?”

Consulta Creare un centro di ricerca e Configurare il recupero nel centro di ricerca.

Dai all’assistente un ruolo preciso

Configura l’assistente flottante come application engineer per questo catalogo. Il suo comportamento deve essere inequivocabile:

  • Rispondere a partire da specifiche e datasheet indicizzati.
  • Citare il componente o il documento che supporta la risposta.
  • Identificare i componenti con il loro codice di catalogo.
  • Usare un’azione in tempo reale per un preventivo, un controllo di disponibilità o un selettore invece di descrivere come farlo.
  • Dichiarare quando le fonti non supportano una risposta.

Non è solo una questione di tono. Un valore di tensione o di coppia sbagliato non è semplicemente una raccomandazione debole: può portare a un ordine sbagliato. Consulta Creare un assistente e Lanciare un assistente.


3. Usa suggerimenti che dimostrano che il catalogo sa rispondere

I suggerimenti tecnici devono nominare componenti reali e decisioni reali. Ognuno è una piccola promessa che l’assistente deve mantenere.

  • Sensore I²C a 3,3 V per il CX-40
  • Quali moduli hanno certificazione CE e FCC?
  • Datasheet, disponibilità e tempi di consegna del CX-40
  • Confronta il CX-40 e il CX-08

Questi esempi coprono una ricerca per specifiche, la conformità, la consultazione di documenti e disponibilità e il confronto. Consulta Scrivere suggerimenti utili per il centro di ricerca.

4. Trasforma una domanda in un flusso di lavoro tecnico

Le risposte testuali gestiscono “Qual è il valore nominale?” Una selezione di componenti o una decisione di acquisto richiede alcuni dati strutturati. La demo li raccoglie con brevi widget all’interno della conversazione.

WidgetRaccoglie o mostraRisultato
Ricerca componentiCategoria, specifica, certificazione e caso d’usoCorrispondenze ordinate e il motivo per cui ciascuna è adatta.
ConfrontoDa due a quattro codici articoloUna vista affiancata delle differenze.
Preventivo / RFQComponente e quantitàFasce di prezzo, totale e tempi di consegna.
Controllo disponibilitàComponente e contesto della sedeDisponibilità attuale.

Ogni widget è un modulo dell’assistente con un trigger, dei campi e un’azione di invio. I widget avanzati usano un campo WIDGET: il template contiene il markup, le funzioni helper gestiscono gli eventi e un servizio collegato fornisce i dati.

Mantieni gli helper al livello superiore

Dichiara ogni helper dei widget come funzione di primo livello. Altrimenti il bundle degli helper può non registrarsi senza un errore evidente.

// A helper wired from the widget markup (oninput="skdwn.instance.helpers.ikcCompareSearch(event)").
function ikcCompareSearch(event) {
  skdwn.instance.executeProxyRequest('part-search', {}, (res) => {
    const matches = JSON.parse(res.payload.reply).matches;
    renderCompareRows(matches);
  }, { query: event.target.value });
}

Consulta Acquisire lead e usare i moduli.


5. Collega le azioni del catalogo in tempo reale

Usa i servizi collegati per i dati che cambiano: risultati del selettore, fasce di prezzo, disponibilità e tempi di consegna. L’assistente chiama ogni servizio tramite il suo ID, mentre l’endpoint reale e le eventuali credenziali restano lato server.

ServizioResponsabilità
SelettoreValuta il catalogo e restituisce le corrispondenze con le relative motivazioni.
PreventivoApplica le fasce di quantità e restituisce totale e tempi di consegna.
DisponibilitàRestituisce la disponibilità nelle varie sedi.

Registra ogni servizio con un ID, un metodo e un URL. Inserisci i valori di ogni chiamata nei segnaposto {{params.x}}:

part-quote  GET  https://your-site/api/quote?sku={{params.sku}}&quantity={{params.quantity}}

Restituisci una risposta breve che la conversazione possa mostrare direttamente:

{
  "reply": "**Quote VC-Q-560146** — 20 × CX-40 — **Total EUR 699** — lead time 4 days",
  "references": [
    { "title": "CX-40 Cortex-M4 Dev Board", "url": "/demos/industrial-catalog/product/cx40-dev-board" }
  ]
}

Restituisci la risposta, non il record grezzo

Restituisci markdown pronto da mostrare più i riferimenti alle fonti. Passare il JSON grezzo del dominio costringe l’assistente a formattare un risultato che il servizio sa già come esprimere.

Usa GET per le ricerche esplorative dei widget, come il completamento automatico, e POST per un invio intenzionale di un modulo, come l’invio di una richiesta di preventivo. Invia dal servizio un normale User-Agent da browser, così un WAF non blocca silenziosamente la richiesta. Consulta Servizi collegati.

6. Adatta modalità e aspetto alla pagina

Lo stesso assistente non deve presentarsi allo stesso modo ovunque.

PaginaInterfacciaModalità
Home e ricercaRicerca per specificheCentro di ricerca
ProdottoRicerca nell’intestazione + pannello inlineOverlay, espanso nel contesto
CategoriaChat flottantePulsante “Chiedi a un application engineer”
AccountChat sensibile al contestoChat flottante con il contesto dell’acquirente

Usa metadati per pagina per descrizione, suggerimenti e contesto. In una pagina prodotto, mantieni la domanda legata a quel componente. In una pagina account, lascia spazio a una conversazione su ordini e preventivi.

Allinea al catalogo i colori del brand e di accento, le superfici, i testi, i pulsanti e l’intestazione della ricerca. Cura lo stile dei campi dei moduli quanto quello del contenitore dei widget, così gli strumenti di confronto e preventivo sembrano parte dell’esperienza di prodotto. Consulta la sezione sull’aspetto di Lanciare un assistente.


7. Aggiungi l’integrazione e il contesto dell’acquirente

Carica il runtime una sola volta, poi avvia la ricerca e l’assistente application engineer nei rispettivi contenitori.

<div id="seekdown-assistant-root"></div>
<script src="https://saas.seekdown.ai/js/seekdown-assistant.js"></script>
<script>
  // Spec search center and floating application engineer on the same page.
  skdwn.startAssistant({ assistantId: 'catalog-search', container: '#catalog-search',
    config: { settings: { baseTemplate: 'overlay' } } });
  skdwn.startAssistant({ assistantId: 'application-engineer', container: '#app-engineer',
    config: { settings: { floatingActionButton: { useFloatingActionButton: true } } } });
</script>

Per l’account professionale, passa userId e un additionalContext conciso al caricamento dell’assistente. Ogni risposta legata all’account può così usare quel contesto, mentre la consultazione dei dati privati resta dietro un servizio collegato.

Prima del lancio, aggiungi il sito alle origini consentite e genera una chiave API. Consulta Pubblicare un assistente.

8. Testa le prove e mantienile aggiornate

Testa il catalogo come farebbe un ingegnere:

  • Codici articolo esatti e vincoli di specifica.
  • Domande sulle certificazioni e recupero dei documenti.
  • Un preventivo per una quantità reale e un controllo di disponibilità.
  • Richieste non supportate.

Per ogni risultato, controlla la risposta e la sua fonte. Un numero corretto che rimanda al datasheet sbagliato è comunque un difetto.

Dopo ogni revisione del catalogo o di un documento, verifica il nuovo dato nella fonte, nel dataset e nella risposta dell’assistente. Pianifica le acquisizioni in base alla frequenza con cui cambiano catalogo e datasheet.

Una regola operativa semplice

L’assistente è un livello di accesso sopra il catalogo. La sua precisione non può superare la precisione e l’aggiornamento delle fonti sottostanti.

Crea l’integrazione con un client MCP

Il codice di collegamento degli endpoint, gli helper dei widget, l’integrazione e le istruzioni di comportamento sono tutti lavori adatti a un client MCP come Claude Code, GitHub Copilot o Codex. Dagli un brief preciso, poi rivedi i contratti dei dati e i risultati: “Trova componenti per specifica, confrontali, prepara un preventivo per una quantità e controlla la disponibilità.” Consulta Collegare client MCP.


Correlati: Creare una knowledge base · Creare un centro di ricerca · Creare un assistente · Servizi collegati · Pubblicare un assistente · Collegare client MCP. Per la versione di questa configurazione per un negozio al consumo, consulta Come è stata creata la demo del negozio retail.