• Saltar a la navegación principal
  • Saltar al contenido principal

Juanpol

Vibe Coding y diseño UX y UI con IA

  • Vibe coding
  • Product Design
  • Design system
  • Tutoriales de Figma
  • Blog
  • Newsletter
Figma / Template de Figma Sites para crear un portfolio

Template de Figma Sites para crear un portfolio

Aquí te dejo el link para descargar el template de Figma Sites para crear un portfolio UX. Mi deseo es ayudarte a mostrar tu trabajo como diseñador UX/UI de forma profesional, limpia y sin complicarte la vida.

Como siempre, nada de layouts sobrecargados, nada de espejitos de colores innecesarios. Solo un sistema sólido, modular y fácil de publicar para que un recruiter entienda quién eres y cómo piensas desde la primera pantalla.

Descarga este template de Figma Sites
Descarga este tenplate de Figma Sites

Índice del artículo

Toggle
  • Anatomía del template
  • Qué hay dentro del template y cómo está diseñado
  • Para qué puedes usar este portfolio hecho en Figma Sites
  • Por qué funciona
  • Template

Anatomía del template

Cuando diseño un portfolio no pienso en “poner proyectos”.

Pienso en contenido, en cómo estructurarlo, que tenga ritmo visual, en decisiones de UX y en cómo se va a comportar cada bloque desde un monitor panorámico hasta un móvil en vertical.

Por eso la V1 de este template está dividida en tres piezas principales:

  • Home, donde introduces tu perfil, tu mensaje y tu selección de proyectos
  • Página de proyecto, diseñada para contar procesos, no solo resultados bonitos
  • Página Genérica, ideal para publicaciones, estudios, notas o documentación apoyada en IA

Todo está preparado para funcionar con los breakpoints esenciales: 2xl, xl, lg, md, sm y xs, ajustando cada layout para que nada se rompa y el contenido respire.

Qué hay dentro del template y cómo está diseñado

Figma Sites te obliga a pensar en diseño y publicación como un solo flujo, no diseñas “para luego”, diseñas mientras publicas.

Por eso la estructura del template sigue una lógica clara:

  • Hero limpio y directo para presentarte sin ruido
  • Grid de proyectos responsive, estable y fácil de escanear por parte del usuario
  • Bloques de texto con line-height realista fácil de leer
  • Imágenes preparadas para adaptarse a todos los anchos de contenedor
  • Modularidad, para que puedas duplicar secciones o crear variantes sin romper nada

En la página de proyecto todo gira alrededor de dos cosas: explicar qué has hecho y demostrar cómo piensas.

Dejé espacio para headings nítidos, imágenes grandes, descripciones largas, decisiones de diseño, aprendizajes y todos esos detalles que diferencian un buen case study de un “antes y después”.

La página Genérica, en cambio, está pensada para contenido que no encaja en la estructura de un proyecto: Acerca de, Contacto, Servicios, notas con información legal, etc.

En próximas versiones del template añadiré apartado de Blog, con templates específicos.

Tutorial para montar el template en Figma Sites

Para qué puedes usar este portfolio hecho en Figma Sites

Este template funciona tanto para estudiantes que están construyendo su primer portfolio como para profesionales que quieren actualizar el suyo sin tocar código.

Puedes usarlo para:

  • Mostrar proyectos reales y conceptuales
  • Documentar procesos UX/UI con profundidad
  • Integrar contenido generado con IA (texto, imágenes o vídeo)
  • Crear estudios de caso completos y presentables
  • Enseñar cómo piensas, cómo decides y cómo trabajas

Por qué funciona

Porque está diseñado con intención, porque sigue una estructura que cualquier recruiter entiende en segundos. Y porque está pensado para que puedas mantenerlo tú mismo sin esfuerzo.

Este template no intenta “parecer bonito”, intenta comunicar con claridad y respeto por tu trabajo.

Y eso, en un portfolio UX, es exactamente lo que importa.

Template

Te dejo un link para descargar el template, si lo compartes cita la fuente juanpol.com, gracias!

Aprende sobre UX/UI + IA, Figma y Product Design

📣 Apúntate a mi newsletter semanal

🔥 Únete a la comunidad UX y UI fácil en Discord

🔴 Suscríbete al canal de YouTube para ver tutoriales

Acerca de Juanpol

Diseñando desde 1993 y todavía aprendiendo. Actualmente como Product Designer en Freepik, aquí comparto mis notas sobre lo que voy probando de UX/UI e IA.

Juanpol

Juanpol

Vibe Coding y diseño UX y UI con IA

  • Acerca de
  • info@juanpol.com
  • LinkedIn
  • GitHub
  • YouTube
  • Discord
  • Telegram
  • X | @juanpol

  • Aviso legal, Privacidad y Cookies

Utilizamos cookies propias y de terceros para fines analíticos y para mostrarte publicidad personalizada o a partir de tus hábitos de navegación. Puedes informarte más sobre ellas en los

Resumen de privacidad

Utilizamos cookies propias y de terceros para fines analíticos y para mostrarte publicidad personalizada o a partir de tus hábitos de navegación. Puedes cambiar la configuración u obtener más información consultando la política de cookies.

Cookies estrictamente necesarias

Las cookies estrictamente necesarias tiene que activarse siempre para que podamos guardar tus preferencias de ajustes de cookies.

Cookies de terceros

Esta web utiliza herramientas de estadística para recopilar información anónima tal como el número de visitantes del sitio, o las páginas más populares.

Dejar esta cookie activa nos permite mejorar nuestra web.

Política de cookies

Más información sobre nuestra política de cookies.