Diseño de UI general para componentes y email

Una selección de diseños de email, componentes y wireframes para marcas con las que he trabajado

  • Diseño UI/UX
  • Diseño web
  • Design System
  • Wireframing
  • Prototipado

Decisiones clave de diseño

Claridad, diseñada en cada capa

  1. Wireframes de baja fidelidad

    Los wireframes de baja fidelidad establecen estructuras claras para componentes web y campañas de email de distintas marcas.

  2. Ideación

    Las imágenes editoriales y el espacio en blanco generoso permiten que los banners y los emails comuniquen su mensaje sin competir con la información clave.

  3. Diseño final

    Los patrones de comercio reutilizables alinean escritorio y móvil y dejan espacio a la expresión de cada campaña.

Enfoque y proceso

Primero la evidencia. Después la expresión.

Cada pieza empieza como un wireframe de baja fidelidad para acordar la estructura y la jerarquía, y luego se convierte en un componente reutilizable, un banner o una plantilla de email que se mantiene consistente en cada marca.

Hero banners

Hero banner de la venta de Black Friday de una marca de cuidado de la piel, 25% de descuento en todo el sitio, en escritorio y móvil, con una fila de beneficios del producto debajo
Hero banner de una venta de invierno de botas para mujer, hasta 50% de descuento, en escritorio y móvil, con una fila de logotipos de revistas de moda
Hero banner de Michele Lopriore, The Ultimate Winter Shoes, en escritorio y móvil
Hero banner de Colombiana, Curves and Confidence, 40% de descuento con el código HEATWAVE, en escritorio y móvil, con una fila destacada de Best Sellers

Email

Dos plantillas de email de Blue Bottle Coffee, It’s been a while y Are you ready for a refill, cada una en versión de escritorio y móvil
Dos plantillas de email de belleza y hogar, una caja colectiva de temporada y un aviso de producto de nuevo en stock, cada una en versión de escritorio y móvil
Dos plantillas de email de Black Friday de cuidado de la piel, 25% de descuento en todo el sitio con selección de la temporada, en versión de escritorio y móvil
Dos plantillas de email de fragancias de 5 Sens, Make ’em Catch Feelings y Relationships are complicated, en versión de escritorio y móvil

Wireframes y componentes

Página de producto de una tienda de muebles de oficina mostrada como wireframes en escala de grises junto al diseño final, con galería, detalles del producto, preguntas frecuentes, reseñas y productos relacionados
Lienzo de Figma con opciones de escritorio y móvil para un interruptor de suscripción en el carrito lateral, unidas por conexiones azules de prototipo

Construyamos algo extraordinario.

Abierto a posiciones remotas de Senior UI/UX Designer y Design Lead.

HABLEMOS

Los campos marcados con un asterisco son obligatorios.