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) hyperlinkNote
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àImporta le immagini allecon hyperlink da Figma in dimensione originale x2, formato png. Ridimensionale del formato corretto su BookStack. Importa le immagini senza hyperlink già nelle dimensioni corrette.
Se non è possibile, puoi ridimensionarle direttamente in BookStack mantenendo le proporzioni indicate.(h24px)


Posizionamento nel testo

  • Le immagini devono sempre essere posizionate seguirea ilseguito del testo di riferimento.

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

  • Non devono mai trovarsi sullosulla stessostessa rigoriga 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 anche 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.progressivo di comparsa nella pagina. 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 immaginecome testo alternativo in BoockStack solo il nome (descrizione sintetica).

  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.