Skip to content

Editor di credenziali

L'Editor di credenziali è un editor visivo integrato in badges.ninja che ti permette di realizzare immagini professionali senza bisogno di strumenti esterni.

Editor — integrato nella finestra Crea credenziale accanto al modulo laterale

Panoramica

L'editor si apre premendo il campo immagine durante la creazione o la modifica di una credenziale. Mette a disposizione una tela dove combinare modelli, testi e sfondi personali per comporre l'immagine della credenziale.

Selettore di modelli con filtri forma e colore

Scegliere un modello

L'editor include oltre 80 modelli integrati organizzati su due dimensioni per trovarli in fretta:

  • 8 forme — Cerchio, Quadrato arrotondato, Esagono, Scudo, Ottagono, Rombo, Stendardo, Sigillo
  • 8 tavolozze cromatiche — Oro, Argento, Bronzo, Blu, Verde, Cremisi, Porpora, Grafite

Per sceglierne uno:

  1. Premi Modelli nella barra degli strumenti dell'editor.
  2. Utilizza i filtri Forma e Colore in alto nel selettore per restringere l'elenco. Il contatore a destra indica quanti modelli corrispondono (es. 8 / 84).
  3. Premi un modello per applicarlo alla tela.

I modelli generati sono volutamente essenziali — scegli una forma e una tavolozza, poi aggiungi testo, icone e nastri all'interno dell'editor.

Modello applicato alla tela

Aggiungere forme, nastri e icone

Popover delle forme

Popover delle icone con barra colore

Oltre ai modelli, l'editor include tre librerie aggiuntive che puoi sovrapporre a qualunque modello:

  • Forme — oltre 80 forme vettoriali (cerchi, scudi, esagoni, stelle, medaglie, sigilli, ghirlande, stendardi, figure geometriche) raggruppate per categoria
  • Nastri — 20 nastri decorativi da sovrapporre
  • Icone — 50 pittogrammi (atomo, trofeo, cervello, valigetta, certificato, codice, corona, rombo, diploma, tocco, lampadina, medaglia, razzo, scudo spuntato, stella, bersaglio, coppa, …)

Seleziona un elemento da qualsiasi popover e viene inserito nella tela con il colore corrente. La Barra colore dentro ogni popover ti permette di ricolorare l'elemento prima di inserirlo — utile quando desideri un colore diverso da quello della barra principale.

Caricare uno sfondo o un'immagine personale

Puoi caricare un'immagine tua da usare come sfondo o come livello superiore:

  1. Premi Carica nella barra degli strumenti.
  2. Scegli un file dal tuo dispositivo (sono consigliati PNG o JPG).
  3. L'immagine appare nella tela come oggetto selezionabile — puoi trascinarla, ridimensionarla, ruotarla o spostarla dietro agli altri elementi.

Caricare un'immagine non cancella il modello né i livelli esistenti — si sovrappone semplicemente sopra.

Per sfondi completi, utilizza un'immagine quadrata di almeno 600×600 pixel.

Aggiungere testo

Elemento di testo inserito nella tela

  1. Premi il pulsante Testo nella barra degli strumenti.
  2. Compare un nuovo elemento di testo sulla tela.
  3. Premi il testo per selezionarlo e digita il contenuto.
  4. Trascina l'elemento nella posizione desiderata.

Puoi inserire più elementi di testo per parti diverse della credenziale (titolo, destinatario, data, ecc.).

Cambiare font

Testo passato da Arial a Georgia — font serif applicato all'elemento selezionato

L'editor include 11 font (Arial, Georgia, Times New Roman, Pacifico, Roboto, Open Sans, Montserrat, Lato, Raleway, Oswald, Playfair Display):

  1. Seleziona un elemento di testo sulla tela.
  2. Premi il menu a tendina Font nella barra degli strumenti.
  3. Scegli fra i font disponibili.

L'anteprima mostra l'aspetto di ciascun font prima della selezione.

Cambiare colore

Selettore colore aperto; scegli qualsiasi hex — l'oro offre un forte contrasto sui modelli blu scuro

Il selettore Colore nella barra controlla due cose contemporaneamente:

  • Testo selezionato — definisce il colore di riempimento di qualunque elemento di testo selezionato.
  • Colore di inserimento predefinito — per le forme, i nastri e le icone inseriti in seguito, oltre che per gli oggetti SVG selezionati (ricolora tracce e riempimenti al volo).

Scegli un colore dalla tavolozza oppure inserisci un codice hex. All'interno di ogni popover di forme/nastri/icone è presente anche una Barra colore minore per scelte puntuali che non modificano il colore della barra principale.

Allineare gli elementi

Testo centrato orizzontalmente e verticalmente tramite i pulsanti di allineamento

La fila da 6 pulsanti di allineamento opera sugli oggetti selezionati rispetto alla tela:

PulsanteAzione
Allinea a sinistraFissa l'oggetto sul bordo sinistro della tela
Centra orizzontalmenteCentra sull'asse X della tela
Allinea a destraFissa l'oggetto sul bordo destro della tela
Allinea in altoFissa l'oggetto sul bordo superiore della tela
Centra verticalmenteCentra sull'asse Y della tela
Allinea in bassoFissa l'oggetto sul bordo inferiore della tela

Trascinando un elemento vicino al centro della tela, appaiono guide di allineamento tratteggiate di colore porpora e l'oggetto si aggancia con precisione.

Selezione multipla e livelli

  • Tieni premuto Shift e premi per selezionare più oggetti, oppure trascina un rettangolo di selezione sulla tela.
  • Utilizza Porta in fondo / Porta in primo piano per governare l'ordine Z.
  • Premi Delete o usa il pulsante Elimina per rimuovere la selezione.
  • Annulla / Ripeti (o Ctrl+Z / Ctrl+Shift+Z) percorrono le ultime 20 modifiche.

Eliminare elementi

  1. Seleziona l'elemento da rimuovere (o usa shift-clic per più elementi).
  2. Premi il pulsante Elimina nella barra oppure il tasto Delete.

Consigli per un buon design

  • Semplicità — utilizza un testo chiaro ed evita il sovraffollamento. Spesso la credenziale verrà mostrata a dimensioni ridotte.
  • Contrasto elevato — assicurati che il testo risulti leggibile sopra lo sfondo.
  • Inserisci il nome della credenziale — destinatari e verificatori devono comprenderla a colpo d'occhio.
  • Formato quadrato — le credenziali risultano migliori come immagini quadrate.
  • Coerenza del marchio — impiega i colori e i font della tua organizzazione su tutte le credenziali.
  • Prova a piccole dimensioni — visualizza in anteprima a 100x100 pixel per garantire la leggibilità.

Salvare l'immagine della credenziale

Credenziale finale composta

Quando sei soddisfatto del design, premi Fatto o Salva nell'editor. L'immagine viene catturata dalla tela e associata alla tua credenziale. Verrà caricata su IPFS quando creerai o salverai la credenziale.

badges.ninja Documentation