Skip to main content

Utilizzo delle immagini

Questo documento spiega come gestire, preparare e inserire correttamente le immagini all’interno dei manuali BookStack.

Dimensioni delle immagini

Le immagini devono rispettare alcune misure standard, in base al tipo di contenuto rappresentato:

Tipo di immagine Larghezza (px) Altezza (px) Note
Schermate intere o molto dettagliate 350 proporzionale Usata per pagine, viste o layout completi
Dettagli di schermate (sezioni o pannelli) 250 proporzionale Usata per focus su parti di interfaccia
Icone o strumenti 24 24 Usata per elementi come strumenti di misura, bottoni, simboli
Componenti UI (bottoni, caselle di testo, searchbar, snackbar, ecc.) proporzionale 24 Altezza fissa per garantire uniformità visiva

💡 Se possibile, importa già le immagini alle dimensioni corrette.
Se non è possibile, puoi ridimensionarle direttamente in BookStack mantenendo le proporzioni indicate.

Posizionamento nel testo

  • Le immagini devono sempre seguire il testo di riferimento.

  • Se le immagini sono schermate intere / o dettagli devono essere separate da una riga di spazio sopra e sotto.

  • Non devono mai trovarsi sullo stesso rigo del testo.

  • Una sola immagine per riga.

Esempi:

  • Per aggiungere un gruppo al progetto, clicca sul bottone Aggiungi.

    1. bottone aggiungi.png

    Si apre la schermata di selezione dei gruppi.
  • Ricevi la mail di benvenuto
    Dopo che la tua utenza è stata creata, riceverai una mail con un link per il primo accesso. Controlla la tua casella di posta, se non la trovi subito controlla anche la cartella spam.

    1. mail di benvenuto.png

Gestione e caricamento delle immagini

Tutte le immagini utilizzate nei manuali devono essere caricate prima nella cartella dedicata dello SharePoint UX UI → Assets, all’interno del percorso:

📁 Manuali EagleArca Bookstack img

Le cartelle di SharePoint devono seguire la stessa struttura ad albero di BookStack, in modo che ogni pagina del manuale abbia la propria cartella immagini.

Nomi dei file

Ogni immagine deve avere un nome chiaro, breve e ordinato, secondo questa struttura:


numero progressivo. descrizione sintetica.png

Esempi:

  • 1. mail di benvenuto.png

  • 4. icona area cerchio.png

💡 Usa sempre numeri progressivi per mantenere l’ordine con cui le immagini compaiono nella pagina del manuale.

Collegamento su BookStack

Per inserire correttamente le immagini nei manuali:

  1. Sincronizza sul computer la cartella SharePoint dove sono salvate le immagini.

  2. In BookStack, durante la modifica di una pagina, clicca su Inserisci immagine.

  3. Seleziona Carica immagine.

  4. Cerca la cartella SharePoint sincronizzata sul tuo PC.

  5. Seleziona l’immagine desiderata e conferma.

💡 In questo modo l’immagine resterà sincronizzata con l’archivio UX UI e potrà essere aggiornata facilmente in caso di modifiche grafiche.

Back to top