1. Web Design
  2. UX/UI

Tutorial de Figma: Más tips sobre cómo diseñar una página web

Para finalizar la serie de consejos de diseño web, aquí tienes otro tutorial de Figma con tres de ellos que entran en la categoría de “misceláneos”.
Scroll to top
This post is part of a series called Figma Tips and Tricks.
Figma Handoff and Testing Tips

Spanish (Español) translation by Eva Collados Pascual (you can also view the original English article)

Para finalizar nuestra serie de consejos y trucos, aquí tienes un otro tutorial de Figma con tres de ellos que entran en la categoría de “misceláneos”.

Mira el video con más consejos de diseño web sobre cómo usar Figma

1. Cambio rápido al Modo de contornos

Uno de los mejores consejos para diseño web y otros tipos de diseño consiste en cambiar al modo contorno de vez en cuando, ya que te proporcionará una mejor idea de qué está pasando en tu diseño. También te resultará útil cuando necesites precisión al trabajar. Para cambiar utiliza los atajos de teclado (CMD o CTRL) + Y, o (CMD o CTRL) + SHIFT + 3 dependiendo de cuál sea tu sistema operativo.

Cambiar rápidamente al Modo contorno en FigmaCambiar rápidamente al Modo contorno en FigmaCambiar rápidamente al Modo contorno en Figma

2. Accede al listado de los atajos de teclado

A través de esta serie sobre cómo usar Figma y cómo diseñar una página web he mencionado distintos atajos de teclado dependiendo de tu sistema operativo. Para aclarar cuál deberías estar usando, pulsa el símbolo de interrogación situado en la parte inferior de la pantalla y selecciona Keyboard Shortcuts para abrir una ventana emergente con los atajos de teclado de tu sistema.

Acede al listado de los atajos de tecladoAcede al listado de los atajos de tecladoAcede al listado de los atajos de teclado

3. Personaliza la cantidad de empuje de desplazamiento

Aquí tienes el tercero de nuestros útiles consejos de diseño web que suele pasar desapercibido. Cuando trabajes con Figma harás gran uso del empuje de desplazamiento, y ya hemos hablado sobre el uso de las teclas de flecha, o las teclas de flecha + la tecla SHIFT para conseguir desplazamientos pequeños y amplios. También podrás personalizar cuan grandes son estos desplazamientos mediante teclado dirigiéndote a Menu > Preferences > Nudge Amount (Menú > Preferencias > Cantidad de desplazamiento). Ahí podrás especificar la cantidad tanto de los desplazamientos pequeños como el de los amplios.

Personaliza la cantidad de tu desplazamientoPersonaliza la cantidad de tu desplazamientoPersonaliza la cantidad de tu desplazamiento

Recursos y tutoriales para aprender más sobre cómo usar Figma y cómo diseñar una página web

¡Con este tutorial de Figma finalizamos nuestra serie con consejos y trucos para este software y sobre cómo diseñar una página web! Gracias por leernos y no olvides que publicaremos mucho más contenido sobre cómo usar Figma en el futuro, no obstante, puedes aprender más sobre Figma ahora mismo con nuestra serie de cursos:

Los kits de UI usados en este tutorial de Figma son totalmente compatibles con la aplicación y están disponibles en Envato Elements:

Kit de plantillas UI para aplicación móvil de finanzasKit de plantillas UI para aplicación móvil de finanzasKit de plantillas UI para aplicación móvil de finanzas
Kit de plantillas UI para aplicación móvil de finanzas

Aprende cómo usar Figma y cómo diseñar una página web

Hemos creado un completo tutorial de Figma para ayudarte a aprender a diseñar con la aplicación. Con independencia de que seas un principiante en el uso de las herramientas de diseño de Figma o no sepas aún cómo diseñar una página web, o de que quieras mejorar aún más tus habilidades, todos estos consejos de diseño web te resultarán muy útiles en tu día a día.