Temi e branding

L’aspetto visivo di una scorecard si articola su due livelli indipendenti.

Il tema ne stabilisce la personalità: tipografia, raggio degli angoli, ombre, texture e animazioni. La palette del brand ne definisce le tinte. Scegliere un tema non vincola i colori, e impostare una palette non modifica la tipografia: seleziona il tema più adatto al tuo pubblico e adatta i colori al tuo marchio.

I quattro temi

default

Carattere sans-serif neutro di sistema, angoli arrotondati in modo equilibrato e ombre classiche delle schede. Non impone uno stile vistoso.

Ideale quando la scorecard viene incorporata in un sito preesistente e non deve contrastare con il design circostante, o quando la palette del tuo marchio guida interamente l’impatto visivo.

playground

Vivace e accattivante. Font Nunito e Quicksand, bordi ampiamente smussati, emoji sfocate fluttuanti sullo sfondo e transizioni elastiche e scattanti.

Pensato per il pubblico consumer, autovalutazioni disimpegnate e contenuti ideati per la condivisione social. È la scelta predefinita per le nuove scorecard.

Da evitare per argomenti seri — finanze, salute, rischi aziendali o ristrutturazioni — dove il tono giocoso risulterebbe inadatto.

obsidian

Editoriale e ricercato. Titoli in Instrument Serif su testo principale in DM Sans, schede effetto vetro (glassmorphism), grana delicata e movimenti misurati.

Perfetto per diagnosi direzionali ed executive, società di consulenza e B2B ad alto valore: contesti in cui il lettore valuta se valga la pena dedicarti tempo.

Da evitare con un pubblico prettamente tecnico e ostile a qualunque aspetto che ricordi una brochure commerciale.

brutalist

Essenziale e ad alto contrasto. Font Space Mono e JetBrains Mono, angoli retti senza arrotondamenti, ombre nette nere e sfalsate, accento verde acido e transizioni immediate senza easing.

Ideale per strumenti per sviluppatori, audit di sicurezza e infrastruttura e agenzie con un’identità visiva decisa: utenti che associano la spaziatura fissa a solidità tecnica.

Da evitare se l’esattezza della tua palette è fondamentale: questo tema impone superfici e tinte di contrasto proprietarie.

Scegliere tra i temi

Chiediti cosa stesse facendo il partecipante trenta secondi prima di atterrare sulla tua scorecard e cosa farà trenta secondi dopo averla conclusa. Un CTO che valuta una consulenza e un marketer che clicca su LinkedIn desiderano ambienti visivi profondamente diversi.

Nel dubbio, opta per la soluzione più sobria. Il vero valore risiede nelle domande, non nella cornice.

Disponibilità in base al piano

I temi dipendono dal piano sottoscritto. Se provi a impostarne uno non incluso nel tuo abbonamento, il salvataggio verrà respinto indicando i temi a te riservati. Un assistente IA che interroga scorecard_design_guide conosce i temi attivi sul tuo profilo e non ti proporrà opzioni non disponibili.

La palette del brand

Dieci colori espressi in valori esadecimali:

Chiave	Destinazione d’uso
primary	Pulsanti, indicatori di avanzamento ed enfasi principale
primaryForeground	Testo e icone collocati sopra il colore primary
accent	Evidenziazioni puntuali
background / backgroundDark	Sfondo generale della pagina
surface / surfaceDark	Schede e pannelli in rilievo
text / textDark	Testo del corpo
muted	Testi secondari

I valori *Dark si applicano nella modalità scura. Configurali in maniera specifica invece di limitarti a invertire la versione chiara, operazione che produce spesso tinte spente.

Un controllo importante: accertati che primaryForeground sia perfettamente leggibile su primary, e text su background, alle normali dimensioni di lettura.

Come configurarlo

Nel pannello di amministrazione, entrambe le opzioni si trovano nella schermata di modifica della scorecard.

Da un assistente IA, le impostazioni si gestiscono tramite update_scorecard_config:

{
  "slug": "leadership-check",
  "theme": "obsidian",
  "branding": {
    "colors": { "primary": "#2563eb", "primaryForeground": "#ffffff" }
  }
}

Richiedi subito dopo la previewUrl: ogni bozza ne genera una per verificare l’effetto finale prima della pubblicazione. Il prompt MCP choose_theme ti accompagna in questa scelta attraverso un dialogo interattivo.