Cómo crear plantillas maestras para presentaciones en Figma

Si está creando una presentación estilizada, pero no quiere emplear plantillas usadas en exceso de PowerPoint, Google Slides o Canva, puede crear sus propias plantillas maestras para su futuro diseños de presentación.

Esta es una excelente opción para aquellos que desean diseños de presentación temáticos o que necesitan seguir una guía de estilo de marca. Sigue leyendo para descubrir cómo usar Figma para crear plantillas maestras para tus presentaciones.

1. Cómo configurar un documento Figma para presentaciones

Regístrese para obtener una cuenta gratuita en figma.com, o si ya tiene una cuenta, inicie sesión. Puede usar Figma directamente en su navegador, o puede descargar la aplicación de escritorio.

Abre un Nuevo archivo de diseño, luego haga clic Intitulado en la parte superior para cambiar el nombre de su archivo, como "Plantilla maestra de presentación". A la izquierda, haz clic en Página 1, entonces la Signo de más para agregar una nueva página. Cambie el nombre de la nueva página a "Plantilla". Esto le permite mantener sus diapositivas maestras separadas de sus diapositivas de diseño más adelante.

Para crear un marco, el nombre de Figma para una mesa de trabajo o lienzo, use el Herramienta Marco (F), luego haga clic en cualquier lugar para abrir un marco. En la configuración de la derecha, cambie el W y H atributos a un tamaño de presentación adecuado; estamos usando 1920 x 1080, que es el tamaño de pantalla estándar. Esta va a ser su primera plantilla maestra.

Haga doble clic en el título azul en la parte superior del marco para cambiarle el nombre. Piense en el diseño de la página que está planeando y asígnele el nombre correspondiente; por ejemplo, "Título superior, dos columnas" o "Imagen derecha del título superior" serían útiles.

2. Diseñe los diseños de presentación

Para ayudar con el diseño del diseño, puede usar la cuadrícula de diseño. Para activarlo, seleccione su marco, luego, en la barra de herramientas de la derecha, haga clic en el Signo de más junto a Cuadrícula de diseño. Esto abre una cuadrícula translúcida roja en la parte superior de su diseño.

Para crear columnas, que son más fáciles de diseñar, haga clic en el icono de cuadrícula de puntos cuadrados en Cuadrícula de diseño y, a continuación, haga clic en Red en el menú desplegable y elige columnas. Establezca el conteo en 12, lo cual es típico para el diseño de pantalla. La cuadrícula no se guarda en su diseño final. Puede encenderlo o apagarlo temporalmente usando el icono de ojo o eliminarlo permanentemente haciendo clic en el icono menos junto al ojo.

Ya sea que use la cuadrícula de diseño o no, puede comenzar a agregar componentes básicos de marcador de posición a su primer diseño de diapositiva. En general, el diseño de sus diapositivas depende de usted.

3. Crear un diseño de texto de dos columnas

Comencemos con el diseño de un título superior con una diapositiva de texto de cuerpo de dos columnas. Para agregar su marcador de posición de título, use el Herramienta de texto (T), y escriba "Marcador de posición de título". El tamaño de texto predeterminado en Figma es bastante pequeño, así que con su marcador de posición escrito, resáltelo y use la configuración de la derecha para aumentar el tamaño y elegir una fuente:descargar una fuente si es necesario. También puede establecer el interletraje y otros atributos.

Para acomodar el ancho de la diapositiva, aumente el ancho del cuadro de texto del título haciendo clic y arrastrando la esquina hacia la derecha. Deja un margen a cada lado. Esto significa que el cuadro de texto se adaptará a diferentes longitudes de título en futuras presentaciones.

Para agregar un área de texto de cuerpo de dos columnas, use el Herramienta de texto (T) y arrastre el cuadro de texto de acuerdo con su cuadrícula de diseño, dejando suficiente espacio para una segunda columna del mismo tamaño al lado.

Con su cuadro de texto en su lugar, elija una fuente y tamaño adecuados. Seleccione el cuadro de texto y duplíquelo manteniendo presionado Opción (Mac) o alternativa (Windows) mientras arrastra el cuadro. Esto crea un diseño de dos columnas; sin embargo, puede usar este sistema para diseñar otro tipo de diseños.

4. Agregar un color de fondo o una imagen

Puede establecer un color de fondo seleccionando el marco y yendo a Llenar en el menú de la derecha para elegir un color. Pero si prefiere usar una imagen, o un conjunto de imágenes, como fondo, puede hacerlo. Simplemente arrastre su imagen de fondo desde una carpeta a su marco. Puede cambiar su tamaño de inmediato arrastrando las esquinas para que se ajusten a su marco.

Si usa un imagen como fondo, asegúrese de organizar la imagen para que esté en la parte posterior o inferior de las capas de cada diapositiva haciendo clic con el botón derecho y seleccionando Mandado hacia atras, o arrastrándolo hacia abajo en la paleta de capas de la izquierda.

Para editar aún más la imagen, en Llenar, haga clic Imagen en el menú desplegable. Podrá cambiar el modo de fusión, el factor de recorte y otros aspectos. Para cambiar la opacidad, cambie el porcentaje junto al menú desplegable.

Para una imagen individual que no sea un fondo, use el Herramienta Marco (F) para dibujar un marco donde desea que se coloque la imagen y arrastre el archivo desde su computadora al marco. Entonces puede usar la misma configuración que antes.

5. Cómo crear estilos de texto en Figma

Al crear una plantilla maestra, los estilos de texto deben ser consistentes en todas las diapositivas. Esto se puede hacer manualmente configurando cada componente de texto para que sea el mismo, pero si tiene muchas diapositivas, esto puede ser tedioso. ¿Las buenas noticias? Puede automatizar sus estilos de texto en Figma.

Con el texto elegido seleccionado, por ejemplo, un subtítulo en su estilo, fuente y tamaño preferidos, haga clic en el botón cuadrado de cuatro puntos junto a Texto en el menú de la derecha. Haga clic en el Signo de más para marcar un nuevo estilo.

En la ventana emergente, asigne un nombre al estilo, por ejemplo, "Título de la diapositiva o Texto del cuerpo". Al diseñar otras diapositivas en esta plantilla, puede elegir el estilo enumerado en el menú de texto seleccionando el texto y eligiendo el estilo. Para desvincular el estilo y anular la función, haga clic en el icono de enlace roto que aparece al pasar el cursor sobre el título del estilo de texto.

Funciona de manera similar para los colores. Seleccione algo con el color que desee, luego haga clic en el botón de menú Figma y Acciones rápidas. Escriba "Seleccionar todo con el mismo relleno" y seleccionará todo del mismo color. Luego puede configurar eso como estilo de color debajo del Llenar menú de la misma manera que se crea un estilo de texto. Esto funciona bien para los colores de fondo simplemente seleccionando el marco y eligiendo su color.

Si aún no está siguiendo una guía de estilo, hay muchas formas de generar paletas de colores.

6. Crear componentes

Para poder usar sus plantillas más tarde, deben ser componentes, por lo que se vinculan. Para convertir el marco en un componente, seleccione el marco actual y haga clic en Comando + Opción + k (Mac) o Control + alternativa + k (Ventanas).

El título del marco cambiará de azul a púrpura con un ícono de diamante para mostrar que ahora es un componente. Luego, para duplicar el marco, haga clic en Comando + D (Mac) o Control + D (Windows) una vez y arrastre el nuevo marco a la derecha del primero.

Separe el componente del duplicado del original haciendo clic derecho en el título del nuevo marco y eligiendo Separar instancia. Cambie el nombre de la nueva diapositiva con un título apropiado para su diseño. Agregue el nuevo diseño a la diapositiva y luego conviértalo en su propio componente haciendo clic en Comando + Opción + k (Mac) o Control + alternativa + k (Ventanas). Este proceso debe realizarse cada vez que cree una nueva diapositiva.

Cuando diseñe el diseño para cada nueva diapositiva, use su texto y estilos de color listos para usar para ahorrar tiempo. Complete este proceso con tantas diapositivas base como necesite, asegurándose de que todas estén tituladas con nombres descriptivos.

7. Cómo usar tus diapositivas maestras

Para usar las diapositivas para sus futuros diseños, seleccione Página 1 en el Paginas menú, con su plantilla bajo su propio título, y cree un nuevo marco del tamaño de una presentación. Luego, a la izquierda, haz clic en Activos > Componentes locales donde deberían estar las diapositivas de su plantilla. Arrastra las diapositivas de la plantilla a tu nuevo marco y céntralo. Edite los marcadores de posición para su contenido.

Siga este mismo proceso hasta que su presentación esté completa.

Ahorre tiempo creando sus propias plantillas maestras en Figma

Puede proporcionar su plantilla maestra a compañeros de equipo o de trabajo, guardarla para su uso personal o incluso venderla como paquetes de diseño. Si bien al principio puede parecer desalentador crear una plantilla de patrón de diapositivas, ayudará a la productividad cuando realice futuras presentaciones en Figma y, en última instancia, ahorre tiempo.

Las 10 mejores características de Figma que todos los diseñadores deberían usar

Leer siguiente

Sobre el Autor