PSH — PROMIUM Software Help
PSH è il sistema di help contestuale inline pensato per applicativi software, gestionali e SaaS. Porta la guida direttamente dove l'utente ne ha bisogno: tooltip AI su ogni campo, pannello di help sovrapposto, ricerca semantica — tutto senza uscire dall'applicazione.
Architettura PSH
PSH si compone di tre livelli che lavorano insieme per offrire un'esperienza di assistenza integrata nell'applicativo:
Layer 1 — Tooltip
Icone ? o ℹ accanto ai campi. Click o hover mostrano una spiegazione contestuale del campo specifico.
Layer 2 — Pannello Help
Pannello laterale o modale con la guida completa della sezione corrente, ricerca full-text e navigazione per argomenti.
Layer 3 — AI Assistant
Chatbot integrato nel pannello per risposte libere. Sa in quale schermata si trova l'utente e adatta le risposte al contesto.
PSH vs FAQ System: Il Sistema FAQ è pensato per i visitatori di siti web pubblici. PSH è progettato per utenti interni di software gestionale, SaaS, ERP, CRM — dove l'help deve essere contestuale alla schermata in uso.
Quick Start
Integra PSH nel tuo applicativo in 4 passaggi:
-
Registra il progetto PSH nella dashboard
Dashboard → PSH → Nuovo Progetto. Inserisci nome, URL base dell'applicativo e lingua. Ottieni il tuo
PSH_PROJECT_ID. -
Carica l'SDK PSH nell'applicativo
Includi lo script SDK una volta sola nel
<head>del tuo applicativo web. L'SDK è leggero (<12KB gzip) e non blocca il rendering. -
Mappa le schermate e i campi
Usa gli attributi
data-psh-screenedata-psh-fieldper associare ogni elemento dell'interfaccia al contenuto di help corrispondente. -
Carica i contenuti di help dalla dashboard
Per ogni screen e field definito, inserisci il testo di guida nella dashboard PSH. I contenuti vengono aggiornati in real-time senza deploy.
Integrazione SDK
Caricamento SDK
<script>
window.PSH_CONFIG = {
projectId: 'TUO_PSH_PROJECT_ID',
lang: 'it',
theme: 'light', // 'light' | 'dark' | 'auto'
position: 'right', // posizione pannello help
triggerIcon: 'circle', // icona trigger help
aiEnabled: true // abilita chatbot AI nel pannello
};
</script>
<script src="https://cdn.promiumai.com/psh/v1/sdk.js" async></script>
Inizializzazione manuale (opzionale)
// PSH si inizializza automaticamente se PSH_CONFIG è definito.
// Per inizializzazione programmatica:
window.PSH.init({
projectId: 'TUO_PSH_PROJECT_ID',
lang: 'it',
theme: 'auto',
onReady: () => console.log('PSH pronto'),
onHelpOpen: (screen, field) => {
console.log(`Help aperto: schermata=${screen}, campo=${field}`);
}
});
Tooltip Contestuali
I tooltip si aggiungono a qualsiasi elemento HTML con l'attributo data-psh-field. PSH aggiunge automaticamente l'icona di help accanto all'elemento.
Markup base
<!-- Tooltip su un label di form -->
<label for="codice-fiscale"
data-psh-field="anagrafica.codice_fiscale">
Codice Fiscale
</label>
<input id="codice-fiscale" type="text" />
<!-- Tooltip su una sezione dell'interfaccia -->
<section data-psh-screen="ordini.nuovo_ordine">
<h2>Nuovo Ordine</h2>
<!-- ... -->
</section>
<!-- Tooltip su un campo tabella -->
<th data-psh-field="report.margine_lordo">
Margine Lordo
</th>
Opzioni attributo data-psh-field
| Attributo | Descrizione |
|---|---|
data-psh-field="screen.campo" |
ID del contenuto di help. Formato: nome_schermata.nome_campo. Dot notation per la gerarchia. |
data-psh-position="top" |
Posizione del tooltip: top | bottom | left | right (default: auto). |
data-psh-trigger="hover" |
Come si apre il tooltip: hover | click | focus (default: click). |
data-psh-icon="false" |
Nasconde l'icona di help (utile se vuoi attivare il tooltip via JS). |
Pannello Help
Il pannello Help è un drawer laterale (o modale su mobile) che mostra la guida completa per la schermata corrente. Si apre tramite:
- Click sull'icona Help flottante
[?](aggiunta automaticamente da PSH) - Shortcut tastiera
Shift + H(configurabile) - Chiamata programmatica
PSH.openPanel()
Controllo programmatico
// Apri il pannello sulla schermata corrente
PSH.openPanel();
// Apri il pannello su una schermata specifica
PSH.openPanel({ screen: 'ordini.nuovo_ordine' });
// Apri il pannello con ricerca pre-compilata
PSH.openPanel({ query: 'come inserire un ordine ricorrente' });
// Chiudi il pannello
PSH.closePanel();
// Setta la schermata corrente (navigazione SPA)
PSH.setScreen('clienti.dettaglio_cliente');
// Invia evento custom all'AI (contestualizza le risposte)
PSH.setContext({
userId: '12345',
userRole: 'admin',
currentRecord: 'ordine-#00123'
});
Configurazione completa
| Opzione | Tipo | Default | Descrizione |
|---|---|---|---|
projectId required |
string | — | ID del progetto PSH dalla dashboard. |
lang |
string | it |
Lingua interfaccia PSH (it, en, es, fr). |
theme |
string | light |
light | dark | auto (segue prefers-color-scheme). |
position |
string | right |
Posizione del pannello help: right | left | modal. |
triggerIcon |
string | circle |
Stile icona tooltip: circle (❓) | info (ℹ) | none. |
aiEnabled |
boolean | true |
Abilita il chatbot AI nel pannello help per domande libere. |
shortcut |
string | Shift+H |
Shortcut tastiera per aprire il pannello. false per disabilitare. |
floatButton |
boolean | true |
Mostra il pulsante [?] flottante fisso nella UI. |
trackAnalytics |
boolean | true |
Registra metriche di utilizzo (tooltip aperti, ricerche, query AI). |
fallbackUrl |
string | — | URL della documentazione esterna, mostrato se il contenuto locale non è disponibile. |
Gestione Contenuti Help
I contenuti di help si gestiscono dalla dashboard PSH. Ogni contenuto è associato a un ID univoco del tipo schermata.campo.
Struttura contenuto
{
"id": "anagrafica.codice_fiscale",
"title": "Codice Fiscale",
"tooltip": "Il codice fiscale del cliente. Per persone fisiche: 16 caratteri alfanumerici.",
"description": "Il codice fiscale identifica univocamente ogni persona fisica o giuridica in Italia...",
"example": "RSSMRA80A01H501W",
"related": [
"anagrafica.partita_iva",
"anagrafica.tipo_soggetto"
],
"video_url": null,
"tags": ["anagrafica", "fiscale", "obbligatorio"],
"updated_at": "2026-06-01T10:00:00Z"
}
Import massivo da YAML/Markdown
Per applicativi complessi con centinaia di schermate, importa la documentazione da file YAML strutturati:
screens:
anagrafica:
title: "Gestione Anagrafica"
description: "Sezione per la gestione dei dati anagrafici di clienti e fornitori."
fields:
codice_fiscale:
tooltip: "Codice fiscale del soggetto. 16 caratteri per persone fisiche."
description: "Obbligatorio per soggetti italiani. Usato per la fatturazione elettronica."
example: "RSSMRA80A01H501W"
partita_iva:
tooltip: "Partita IVA aziendale. 11 cifre numeriche."
description: "Obbligatoria per persone giuridiche. Formato: IT + 11 cifre."
example: "IT12345678901"
ordini:
title: "Gestione Ordini"
fields:
data_consegna:
tooltip: "Data di consegna prevista. Non può essere precedente alla data odierna."
tipo_spedizione:
tooltip: "Modalità di spedizione: Standard (3-5gg), Express (24h), Ritiro in sede."
Aggiornamento zero-deploy: I contenuti PSH vengono aggiornati in real-time dalla dashboard senza richiedere nessun rebuild o deploy del tuo applicativo. Modifica, salva: gli utenti vedono il contenuto aggiornato entro 30 secondi.
API & SDK
Metodi SDK disponibili
| Metodo | Parametri | Descrizione |
|---|---|---|
PSH.init(config) |
config: object | Inizializza PSH con la configurazione fornita. |
PSH.openPanel(options?) |
options: {screen?, query?} | Apre il pannello help. Opzionale: schermata target o query pre-compilata. |
PSH.closePanel() |
— | Chiude il pannello help. |
PSH.setScreen(screenId) |
screenId: string | Notifica PSH della schermata corrente (essenziale per SPA). |
PSH.setContext(ctx) |
ctx: object | Fornisce contesto aggiuntivo all'AI (utente, record, stato). |
PSH.showTooltip(fieldId) |
fieldId: string | Apre programmaticamente il tooltip di un campo. |
PSH.hideTooltip(fieldId?) |
fieldId?: string | Chiude uno o tutti i tooltip aperti. |
PSH.search(query) |
query: string | Restituisce Promise con i risultati della ricerca nella knowledge base. |
PSH.destroy() |
— | Rimuove completamente PSH dal DOM e deregistra tutti gli event listener. |
REST API — Gestione contenuti
// Recupera il contenuto di help per un campo specifico
const res = await fetch(
'https://api.promiumai.com/api/v1/psh/TUO_PSH_PROJECT_ID/content/anagrafica.codice_fiscale',
{ headers: { 'Authorization': 'Bearer TUO_API_KEY' } }
);
const content = await res.json();
console.log(content.tooltip);
console.log(content.description);
Casi d'uso tipici
ERP / Gestionale
Help contestuale su ogni campo del gestionale: anagrafica, contabilità, magazzino, ordini. Riduce drasticamente le chiamate al supporto interno.
Dashboard Analytics
Spiegazione contestuale di KPI e metriche: hover su un dato → tooltip con definizione, formula di calcolo ed esempi di interpretazione.
Onboarding utenti
Guided tour interattivo per nuovi utenti. PSH può attivare tooltip in sequenza per guidare l'utente nelle prime operazioni.
Software di compliance
Normative e obblighi legali sempre a portata di click, contestuali al campo che si sta compilando (es. privacy, fiscale, HACCP).
PSH vs Sistema FAQ: quando usare quale
| Caratteristica | PSH — Software Help | Sistema FAQ |
|---|---|---|
| Pubblico target | Utenti di software gestionale/SaaS | Visitatori di siti web pubblici |
| Contesto | Inline nell'applicativo (tooltip, pannello) | Pagina FAQ o widget su sito |
| Integrazione | SDK JavaScript + attributi HTML | Snippet HTML embed |
| Awareness del contesto | Sì — conosce la schermata e il campo corrente | No — risponde a domande generali |
| Contenuti | Guide operative, definizioni campi, procedure | Domande frequenti su prodotto/servizio |
| AI integrata | Chatbot contestuale alla schermata | NLU per ricerca semantica nelle FAQ |
| Caso d'uso ideale | ERP, CRM, SaaS B2B, gestionali aziendali | E-commerce, siti istituzionali, landing page |
Combinazione consigliata: Per i clienti PROMIUM con sia un sito pubblico che un'applicazione gestionale, la combinazione ottimale è FAQ System sul sito + PSH nel software, entrambi con fallback al chatbot PROMIUM Assistant.