00 / MMXXVI

Especialista en
Diseño de producto

Quién soy Alejandra Ranzuglia
Qué hago Diseño de producto · Branding · Código
Dónde La Plata, Argentina
Disponibilidad Freelance · Abierta a ofertas
01 / UX/UI & Apps
UX/UI · Android · 2024

App Formosa

Cliente
Igeo Consultora · Gobierno de Formosa
Rol
UX/UI Designer
Plataforma
Android mobile
Duración
4 meses
Estado
Implementado
UX / UI Material Design 3 Figma Design System
126 pantallas alta fidelidad
2 roles de usuario
4 meses de proyecto

El proyecto

Trabajé para modernizar el proceso de relevamiento catastral de la Provincia de Formosa. El sistema existente era de escritorio y obligaba a los agrimensores a volver a la oficina para cargar datos levantados en campo. La nueva versión tenía que funcionar desde el celular del agrimensor y del inspector municipal, operar sin conexión y sincronizar cuando hubiera red. Construí el design system en Figma siguiendo Material Design 3, con componentes, tokens y estados documentados.

App Formosa — bienvenida y registro de dispositivo
App Formosa — pantallas de trabajo en campo
Ver caso completo Ver menos

El desafío

La app debía servir a dos perfiles de usuario, con necesidades distintas, que operaban sobre el mismo sistema de datos catastral: agrimensores que trabajan en campo bajo el sol y con guantes, e inspectores municipales que operan desde oficina. Los puntos críticos: la autenticación en condiciones de campo, no perder datos si se corta la red, y un proceso de registro de dispositivo que requiere presencia física (y que el usuario no sabe que va a necesitar hasta que ya está ahí).

App Formosa — fotos del inmueble y DDJJ mejoras
App Formosa — listas de actividades por rol

Proceso

Con el equipo técnico de Igeo Consultora tuvimos reuniones semanales durante cuatro meses. El cliente llegó con wireframes de baja fidelidad en Balsamiq que documentaban los flujos base; traduje esa lógica funcional al lenguaje de diseño: jerarquía de información, estados de error, flujos de edge case y consistencia visual.

App Formosa — wireframes Balsamiq, flujos base
Flujo base entregado por el cliente en Balsamiq, punto de partida del diseño.
App Formosa — prototipo de alta fidelidad
Diseño final: autenticación, dashboard y trabajo en campo, con flujos y estados propios.
App Formosa — Algunos componentes de sistema de diseño
Nota: se muestra una selección de componentes, no el design system completo del proyecto.

Decisiones de diseño

Biometría facial en lugar de huella dactilar

Los agrimensores trabajan con las manos en condiciones que inutilizan el sensor de huella. El reconocimiento facial es más confiable en campo. Requirió diseñar una pantalla de captura con instrucciones claras de distancia y luz.

Resultado · Autenticación funcional en condiciones de campo sin necesidad de quitarse los guantes.

Flujo de campo como checklist progresivo

En lugar de un formulario único, el flujo se organizó en tres secciones con estado visible: fotos del inmueble, DDJJ Mejoras, Informe de estado parcelario. Cada sección muestra si está completa, pendiente o con error. El botón "Finalizar actividad" permanece deshabilitado hasta completar las secciones obligatorias.

Resultado · Cero actividades enviadas con datos incompletos: el botón no habilita hasta completar las secciones obligatorias.

Sistema de errores en tres niveles

Modales para errores bloqueantes que requieren decisión, banners informativos para avisos de contexto, y estados inline para errores de campo. Esto redujo las interrupciones en los flujos principales.

Resultado · Menos interrupciones en los flujos críticos de campo: solo los errores bloqueantes detienen al usuario.

Diferenciación visual por rol

Agrimensor y Municipal comparten la misma base de componentes, diferenciados con un badge de rol en el header (cyan para agrimensor, verde para municipal), visible en todas las pantallas de sesión activa.

Resultado · Diferenciación de rol visible en todo momento, sin riesgo de confusión entre perfiles.

App Formosa — pantallas de error y validación
App Formosa — mensajes y confirmaciones
App Formosa — pantallas de explicación de toma de foto para biometría y de toma foto
App Formosa — datos de perfil y sincronización de tareas

El resultado

126 pantallas de alta fidelidad. Flujos completos para ambos roles, los estados de error del sistema catastral, y el proceso de registro, activación y desregistro de dispositivo.

El prototipo fue usado directamente como referencia de desarrollo por el equipo técnico de Igeo Consultora, sin iteraciones adicionales de especificación. Hoy está implementado en el sistema catastral de la provincia de Formosa.

Lo que aprendí

Diseñar para trabajo de campo impone restricciones que el diseño de escritorio ignora: guantes, sol, conexión intermitente, presión de tiempo. Cada decisión de interacción (tamaño de toque, número de pasos, claridad del estado) tiene consecuencias reales cuando el usuario está parado en el medio de un lote en Formosa a 40 grados. Ese contexto físico fue el criterio de validación de cada pantalla.


Web · Organización de DDHH — 2026

Nexum

Cliente
Nexum Human Rights
Rol
Diseño y desarrollo
Stack
Figma Make · WordPress
Alcance
Sitio institucional · Gestión de noticias
Estado
Live
Sitio
nexumhumanrights.org ↗
Web Design WordPress Figma Make Editorial

El proyecto

Nexum Human Rights necesitaba un sitio institucional sólido, pero el pedido de fondo era otro: que el equipo pudiera publicar noticias sin depender de un desarrollador para cada actualización.

Nexum Human Rights — sitio institucional
Ver caso completo Ver menos

Proceso y decisiones

Partí de un manual de marca que el cliente ya tenía, así que el trabajo fue traducir esa identidad a un sistema que alguien sin conocimientos técnicos pudiera manejar día a día. Diseñé los componentes en Figma pensando en cómo se iban a cargar desde WordPress, no solo en cómo se iban a ver, y fui armando la arquitectura de contenidos junto con la interfaz para que no quedaran desacopladas. Hoy el equipo de Nexum administra el sitio de forma autónoma desde la entrega.

Nexum Human Rights — Algunos componentes de sistema de diseño
Nota: se muestra una selección de componentes, no el design system completo del proyecto.
Nexum Human Rights — sitio institucional

Web · Maquinaria agrícola — 2026

Ranzuglia

Cliente
Ranzuglia SRL
Rol
Diseño y desarrollo
Stack
Figma Make · Claude
Alcance
Landing page · Catálogo de productos
Estado
Live
Sitio
ranzugliasrl.com.ar ↗
Web Design Figma Make IA Agéntica Frontend

El proyecto

Landing page para Ranzuglia SRL, negocio familiar de venta de maquinaria agrícola en la provincia de Buenos Aires. El objetivo era generar confianza en productores que compran maquinaria pesada y no están acostumbrados a decidir este tipo de compra por internet.

Ranzuglia SRL — landing page maquinaria agrícola
Ver caso completo Ver menos
Ranzuglia SRL — landing page maquinaria agrícola

Proceso

A la marca de la empresa la había diseñado en 2007. Volver sobre ella casi veinte años después implicó actualizarla al entorno web sin perder lo que ya funcionaba en papelería e impresión. Trabajé el diseño en Figma y la implementación con Claude, revisando avances en cada etapa en lugar de esperar a un cierre final. Como el público son productores agropecuarios que valoran lo conocido, traté de que cada pantalla transmitiera la misma seriedad que transmite la empresa en persona.

Ranzuglia — componentes del sistema de diseño.
Nota: se muestra una selección de componentes, no el design system completo del proyecto.
Ranzuglia SRL — landing page maquinaria agrícola

UX/UI · GIS Mobile — 2023

Metrogas

Cliente
Igeo Consultora
Rol
UX/UI Design · Design System
Stack
Figma · Material Design 3
Alcance
App GIS mobile · Sistema de componentes
Estado
No implementado
UX/UI Design System Material Design 3 GIS Figma

App GIS mobile para inspectores de red de Metrogas, con tres estados de interfaz construidos sobre un design system propio basado en Material Design 3, pensado para uso en campo.

Metrogas GIS mobile — mapa limpio, dial de acciones y sidebar de búsqueda
Ver caso completo Ver menos

El desafío

Una app GIS no funciona como una app común: el mapa es el contenido, no el fondo. El reto fue lograr una interfaz que no le quitara protagonismo a la cartografía, que diera acceso a capas y filtros sin sacar al inspector del contexto espacial, y que pudiera usarse con una sola mano durante una inspección.

Decisiones de sistema

Reemplacé la barra de herramientas fija por un FAB expandible, para que las acciones aparezcan solo cuando hacen falta. La búsqueda por atributos se resolvió con un sidebar deslizable, sin salir de la vista principal. Y documenté cada estado de cada componente (default, hover, disabled) para facilitarle el trabajo al equipo de desarrollo.

Metrogas — componentes del sistema de diseño.
Nota: se muestra una selección de componentes, no el design system completo del proyecto.

El proyecto no llegó a producción: Igeo Consultora no logró un acuerdo para avanzar con el lanzamiento.


Web · E-commerce tecnología — 2022

Agon

Cliente
AC EASTWAY S.A
Rol
Diseño y maquetado
Stack
HTML · SCSS · JavaScript
Alcance
E-commerce · Catálogo · Carrito
Estado
No implementado
UI Design HTML/SCSS JavaScript E-commerce Figma

El proyecto

Diseño y maquetado de un e-commerce de tecnología y electrónica de consumo, a partir del manual de marca que ya tenía el cliente. Antes de maquetar armé un design system en Figma (componentes, tokens, estados) para que las decisiones de diseño quedaran resueltas desde el principio.

Agon — e-commerce tecnología y electrónica
Ver caso completo Ver menos
Agon — componentes del sistema de diseño: colores, tipografía, botones, chips, checkbox, card de producto e íconos
Nota: se muestra una selección de componentes, no el design system completo del proyecto.

Alcance técnico

Maqueté todo en HTML y SCSS, con JavaScript para los filtros de catálogo, el carrito dinámico y las transiciones de interfaz: el circuito completo de un e-commerce real, con sistema de diseño, maquetado y lógica de interacción. AC EASTWAY S.A no avanzó con el lanzamiento.


02 / Branding & Packaging
Branding · Packaging · Papelería — 2025

Klasse

Cliente
AC EASTWAY S.A
Rol
Branding y packaging
Verticales
Línea Blanca · Tecnología · Herramientas
Entregables
Manual de marca · Packaging · Papelería corporativa
Estado
Implementado
Branding Packaging Manual de marca Color coding Illustrator Photoshop

El desafío

El cliente necesitaba una marca para tres verticales de producto que funcionara como un sistema único en el punto de venta: línea para el hogar, tecnología de consumo y herramientas. El reto fue que cada una tuviera identidad propia sin romper la coherencia de la marca madre.

Klasse — sistema de identidad visual completo
Ver caso completo Ver menos

Arquitectura de color coding

En góndola, un cliente decide en segundos. El rojo identifica línea blanca y tecnología; el azul, herramientas. La grilla no cambia, cambia el color, así que la marca se reconoce aunque el producto sea completamente distinto. Sin leer una etiqueta.

Klasse — packaging tostadora, línea roja
Klasse — packaging pava eléctrica digital, línea roja

Desarrollo del sistema

Construí un sistema que se adapta a formatos y proporciones de pack muy distintos sin perder consistencia. El manual de marca incluye valores Pantone, CMYK y RGB para producción a gran escala, más pautas para papelería corporativa, entornos digitales y merchandising.

Klasse — packaging taladro, línea azul
Klasse — packaging compresor de aire, línea azul
Klasse — packaging micrófono inalámbrico, línea roja
Klasse — packaging cafetera de filtro, línea roja

Branding · Canal de streaming — 2024

LaCa

Cliente
LaCa — canal político independiente
Rol
Branding
Alcance
Identidad visual · Piezas digitales · Merchandising
Resultado
115.000 seguidores en Instagram
Estado
Implementado
Branding Streaming Piezas digitales Merchandising

El desafío

El pedido fue crear desde cero una identidad para un proyecto de análisis político independiente que quería diferenciarse de los medios tradicionales desde el primer posteo. No había historia previa ni audiencia, solo la idea de un canal plural y moderno.

LaCa — sistema de identidad visual completo
Ver caso completo Ver menos

Sistema cromático y tipográfico

Definí una paleta de cuatro colores (cian, magenta, verde y amarillo) sobre un fondo de alto contraste, para que cada voz del canal pudiera tener su color sin que el sistema se fragmentara. El logotipo tiene volumen tridimensional y la tipografía es de impacto, pensada para funcionar en placas de streaming, portadas de video y posteos donde hay que detener el scroll.

Desarrollo del sistema

Armé el manual con especificaciones RGB, CMYK y Hex, y definí cómo se aplica la identidad en cada formato: placas en vivo, overlays de streaming, papelería del estudio y merchandising. Hoy el canal tiene 115.000 seguidores en Instagram.


Branding · Packaging — 2020

Ama

Cliente
Dra. María Amalia Olasagastia
Rol
Branding y packaging
Línea
Medicina y cosmética ayurvédica
Entregables
Manual de marca · Packaging · Papelería
Estado
Implementado
Branding Packaging Manual de marca Illustrator

El desafío

María Amalia es médica con especialización en ayurveda y fitoterapia, y elabora sus propias preparaciones: cremas, ungüentos, infusiones, sérums, pastas dentales, productos para el cabello. El trabajo fue darle identidad a un microemprendimiento donde el producto lo hace ella misma, sin que la marca se sintiera industrial ni perdiera la calidez de eso.

Ama — sistema de identidad visual, tres líneas ayurvédicas
Ver caso completo Ver menos

Arquitectura de color coding

Para diferenciar los tratamientos en la experiencia de consulta y uso diario diseñé una etiqueta con layout idéntico pero con codificación cromática por biotipo: celeste para Vata, ocre para las fórmulas tridóshicas, verde para Kapha y terracota para Pitta.

Ama — línea completa de packaging, tres biotipos
Ama — packaging crema nutritiva, línea Vata

Desarrollo del sistema

El sistema tiene que funcionar en varios tipos y tamaños de frascos y envases, todos hechos en pequeñas tiradas. Documenté la identidad para que pueda imprimir etiquetas nuevas cuando lo necesite, sin depender de un diseñador para cada lote nuevo.

Ama — packaging sérum, fórmulas tridóshicas
Ama — packaging tónico facial

Branding · Papelería — 2024

She

Cliente
She — organizadora de eventos
Rol
Branding
Alcance
Identidad visual · Papelería · Indumentaria
Región
Patagonia, Argentina
Estado
Implementado
Branding Editorial Indumentaria Papelería Illustrator

El desafío

She organiza bodas destino y congresos corporativos desde San Martín de los Andes, para clientes que buscan el mismo nivel de cuidado que verían en una gran ciudad, pero sin perder la conexión con el paisaje patagónico que eligieron. En 2022 diseñé la marca original; en 2024 Silvina volvió para actualizarla sin perder lo que ya funcionaba: más calidez, más presencia.

She — sistema de identidad visual completo
Ver caso completo Ver menos

Arquitectura visual y paleta de materiales

En el restyling mantuve la lógica del isotipo original (letras entrelazadas con elementos circulares), pero lo llevé a un registro más orgánico: tipografía con más contraste, líneas más fluidas y una paleta en tierra cálida que reemplazó el gris neutro. La identidad ganó presencia y elegancia.

She — antes
Antes: Logotipo original.
She — después
Ahora: Logotipo actualizado, con isotipo más orgánico y paleta cálida.

Desarrollo del sistema

El sistema cubre desde la preventa digital hasta el día del evento. Documenté la reproducción cromática en CMYK, RGB y Hex, y definí cómo se aplica el isotipo en piezas impresas, canales móviles, cartelería del evento y merchandising de la firma.


Sobre mí

Sobre mí

Diseño pensando en quien lo usa y en quien lo desarrolla.

Llevo más de diez años diseñando para web y mobile, y en paralelo desarrollando marcas y sistemas de packaging para clientes que van de organismos públicos a médicos con microemprendimientos propios. Esa mezcla me obligó a resolver el mismo problema una y otra vez: mantener coherencia visual cuando el equipo, el cliente y los tiempos cambian a mitad de proyecto.

Trabajar cerca del desarrollo front-end me enseñó a distinguir qué decisión de diseño cuesta una tarde y cuál cuesta una semana; eso se traduce en menos idas y vueltas y en entregas que el equipo puede implementar sin interpretar.

Integro agentes de IA al flujo de trabajo para acelerar iteraciones, explorar variantes y optimizar código.

Busco proyectos que generen desafío real, donde pueda aportar criterio, aprender algo nuevo y trabajar en equipo con personas que también se toman en serio lo que hacen.

Diseño Figma Illustrator Photoshop Design Systems
Código HTML/SCSS Tailwind Bootstrap
Gestión WordPress IA Agéntica
Alejandra Ranzuglia en una cascada

Contacto

¿Hablamos?

Estoy disponible para proyectos freelance y abierta a escuchar propuestas. Si tenés algo en mente, un proyecto, una consulta o simplemente querés conocer más de mi trabajo; escribime.