Come creare modelli master per presentazioni in Figma

Se stai creando una presentazione stilizzata, ma non vuoi utilizzare modelli abusati da PowerPoint, Presentazioni Google o Canva, puoi creare i tuoi modelli master per i tuoi progetti di presentazione futuri.

Questa è un’ottima opzione per coloro che desiderano design di presentazione a tema o che hanno bisogno di seguire una guida di stile di marca. Continua a leggere per scoprire come utilizzare Figma per creare modelli master per le tue presentazioni.

1. Come impostare un documento Figma per le presentazioni

Registrati per un account gratuito su Figma.com o, se hai già un account, accedi. Puoi utilizzare Figma direttamente nel tuo browser oppure puoi scaricare l’app desktop.

Apri un nuovo file di progettazione, quindi fai clic su Senza titolo in alto per rinominare il file, ad esempio “Modello master presentazione”. A sinistra, fai clic su Pagina 1, quindi sul segno più per aggiungere una nuova pagina. Rinominare la nuova pagina in “Modello”. Ciò consente di mantenere le diapositive master separate dalle diapositive di progettazione in un secondo momento.

Per creare una cornice, ovvero il nome di Figma per una tavola da disegno o un’area di disegno, utilizzate lo strumento cornice (F), quindi fate clic in un punto qualsiasi per aprire una cornice. Nelle impostazioni a destra, modificare gli attributi W e H in una dimensione di presentazione adeguata; stiamo usando 1920 x 1080, che è la dimensione standard dello schermo. Questo sarà il tuo primo modello master.

Fare doppio clic sul titolo blu nella parte superiore della cornice per rinominarlo. Pensa al layout di pagina che stai pianificando e assegnagli un nome di conseguenza, ad esempio “Top Title Two Column” o “Top Title Right Picture” sarebbe utile.

2. Progetta i layout di presentazione

Per facilitare la progettazione del layout, è possibile utilizzare la griglia di layout. Per attivarlo, seleziona la cornice, quindi sulla barra degli strumenti di destra fai clic sul segno più accanto a Griglia di layout. Questo apre una griglia rossa traslucida sopra il tuo design.

Per creare colonne, più facili da progettare, fai clic sull’icona della griglia punteggiata quadrata in Griglia di layout, quindi fai clic su Griglia nell’elenco a discesa e scegli Colonne. Imposta il conteggio su 12, che è tipico per la progettazione dello schermo. La griglia non salva sul progetto finale. Puoi accenderlo o spegnerlo temporaneamente utilizzando l’icona dell’occhio o rimuoverlo definitivamente facendo clic sull’icona meno accanto all’occhio.

Indipendentemente dal fatto che si utilizzi o meno la griglia di layout, è possibile iniziare ad aggiungere componenti segnaposto di base al layout della prima diapositiva. Nel complesso, il layout delle diapositive dipende da te.

3. Crea un layout di testo a due colonne

Iniziamo con la progettazione di un titolo superiore con una diapositiva di testo a due colonne. Per aggiungere il segnaposto del titolo, utilizzare lo strumento testo (T) e digitare “Segnaposto titolo”. La dimensione predefinita del testo in Figma è piuttosto piccola, quindi con il segnaposto digitato, evidenzialo e usa le impostazioni di destra per aumentare le dimensioni e scegliere un font: scarica un font se necessario. È inoltre possibile impostare la crenatura e altri attributi.

Per adattarsi alla larghezza della diapositiva, aumentate la larghezza della casella di testo del titolo facendo clic e trascinando l’angolo verso destra. Lascia un margine su ciascun lato. Ciò significa che la casella di testo ospiterà diverse lunghezze del titolo nelle presentazioni future.

Per aggiungere un’area di testo del corpo a due colonne, utilizzare lo strumento testo (T) e trascinare la casella di testo in base alla griglia del layout, lasciando spazio sufficiente per una seconda colonna delle stesse dimensioni accanto ad essa.

Con la casella di testo in posizione, scegli un carattere e una dimensione adatti. Selezionare la casella di testo e duplicarla tenendo premuto Option (Mac) o Alt (Windows) mentre si trascina la casella. Questo crea un layout a due colonne; tuttavia, è possibile utilizzare questo sistema per progettare altri tipi di layout.

4. Aggiungi un colore di sfondo o un’immagine

Puoi impostare un colore di sfondo selezionando la cornice e andando su Riempi nel menu di destra per scegliere un colore. Ma se preferisci usare un’immagine, o un insieme di immagini, come sfondo, puoi. Basta trascinare l’immagine di sfondo da una cartella sulla cornice. Puoi ridimensionarlo subito trascinando gli angoli per adattarli alla tua cornice.

Se utilizzate un’immagine come sfondo, assicuratevi di disporre l’immagine nella parte posteriore o inferiore dei livelli per ogni diapositiva facendo clic con il pulsante destro del mouse e scegliendo Invia a indietro oppure trascinandola verso il basso nella tavolozza dei livelli di sinistra.

Per modificare ulteriormente l’immagine, in Riempimento fare clic su Immagine nel menu a discesa. Sarai in grado di modificare il metodo di fusione, il fattore di ritaglio e altri aspetti. Per modificare l’opacità, modificare la percentuale accanto al menu a discesa.

Per una singola immagine che non è uno sfondo, utilizzate lo strumento cornice (F) per disegnare una cornice in cui desiderate posizionare l’immagine e trascinate il file dal computer nella cornice. Quindi è possibile utilizzare le stesse impostazioni di prima.

5. Come creare stili di testo in Figma

Quando si crea un modello master, gli stili di testo devono essere coerenti in tutte le diapositive. Questo può essere fatto manualmente impostando ogni componente di testo per essere lo stesso, ma se si dispone di molte diapositive, questo può essere noioso da fare. La buona notizia? È possibile automatizzare gli stili di testo in Figma.

Con il testo scelto selezionato, ad esempio un sottotitolo nel suo stile, carattere e dimensione preferiti, fai clic sul quadrato di quattro punti accanto a Testo nel menu a destra. Fare clic sul segno più per impostare un nuovo stile.

Nel popup, assegna un nome allo stile, ad esempio “Titolo diapositiva o Corpo testo”. Quando si progettano altre diapositive in questo modello, è possibile scegliere lo stile elencato nel menu di testo selezionando il testo e scegliendo lo stile. Per scollegare lo stile ed eseguire l’override della funzionalità, fate clic sull’icona del collegamento interrotto visualizzata quando si passa il puntatore del mouse sul titolo dello stile di testo.

Funziona in modo simile per i colori. Seleziona qualcosa con il colore desiderato, quindi fai clic sul pulsante del menu Figma e su Azioni rapide. Digita “Seleziona tutto con lo stesso riempimento” e selezionerà tutto dello stesso colore. Quindi puoi impostarlo come stile di colore nel menu Riempimento nello stesso modo in cui crei uno stile di testo. Questo funziona bene per i colori di sfondo semplicemente selezionando la cornice e scegliendo il colore.

Se non stai già seguendo una guida di stile, ci sono molti modi per generare tavolozze di colori.

6. Creare componenti

Per poter utilizzare i modelli in un secondo momento, devono essere componenti, quindi si collegano. Per trasformare il fotogramma in un componente, selezionate il fotogramma corrente e fate clic su Cmd + Opzione + K (Mac) o Ctrl + Alt + K (Windows).

Il titolo della cornice passerà dal blu al viola con un’icona a forma di diamante per mostrare che ora è un componente. Quindi, per duplicare la cornice, fai clic su Cmd + D (Mac) o Ctrl + D (Windows) una volta e trascina il nuovo fotogramma a destra del primo.

Scollegate il componente del duplicato dall’originale facendo clic con il pulsante destro del mouse sul titolo del nuovo fotogramma e scegliendo Scollega variante. Rinominare la nuova diapositiva con un titolo appropriato per il layout. Aggiungi il nuovo design alla diapositiva e rendilo un componente a sé stante facendo clic su Cmd + Opzione + K (Mac) o Ctrl + Alt + K (Windows). Questo processo deve essere eseguito ogni volta che si crea una nuova diapositiva.

Quando progetti il layout per ogni nuova diapositiva, usa gli stili di testo e colore già pronti per risparmiare tempo. Completa questo processo con tutte le diapositive di base di cui hai bisogno, assicurandoti che siano tutte intitolate con nomi descrittivi.

7. Come utilizzare le diapositive master

Per utilizzare le diapositive per i progetti futuri, scegli Pagina 1 nel menu Pagine, con il modello con il proprio titolo, e crea una nuova cornice delle dimensioni di una presentazione. Quindi, a sinistra, fare clic su Risorse > Componenti locali in cui devono trovarsi le diapositive del modello. Trascinate le diapositive del modello sulla nuova cornice e centratela. Modifica i segnaposto per i tuoi contenuti.

Seguire lo stesso processo fino al completamento della presentazione.

Risparmia tempo creando i tuoi modelli master in Figma

Puoi fornire il tuo modello principale a compagni di squadra o colleghi, conservarlo per uso personale o persino venderlo come pacchetti di progettazione. Anche se inizialmente può sembrare scoraggiante creare un modello di schema diapositiva, aiuterà la produttività quando si effettuano presentazioni future in Figma, risparmiando in definitiva tempo.