Fito Páez · Rock and Roll Revolution
Diseño gráficoArte de tapa
Proyectos
Pignatta Distribuciones
Sitio web · 2026
El proyecto
Pignatta Distribuciones es un distribuidor mayorista de General Pico, La Pampa. Desde 1994 lleva las principales marcas del consumo masivo a almacenes, supermercados y comercios de más de 50 localidades de La Pampa, Buenos Aires y San Luis.
El proyecto llegó a través de la agencia BEE: un sitio nuevo que mostrara lo que la empresa es hoy, ordenara la información para sus clientes y cargara rápido en cualquier dispositivo.
Mis tareas
Me encargué del proceso completo: la investigación del sitio anterior, la organización del contenido, los wireframes, las tres propuestas visuales, el diseño final, el desarrollo y la puesta en línea en el hosting del cliente.
Cada etapa se presentó en un documento con link propio, para que el cliente la revisara y respondiera sobre algo concreto.
Etiquetas
Sitio webDiseño webArquitectura de informaciónWireframesDesarrollo webDistribución mayoristaAgencia BEE
- Cliente
- Pignatta Distribuciones · General Pico, La Pampa
- Agencia
- BEE
- Alcance
- Investigación, contenido, wireframes, diseño, desarrollo y publicación
- Tiempo
- 6 semanas desde la aprobación del presupuesto
pignattadistribuciones.com.ar
- de velocidad en computadora (antes, 59)
- 99
- de velocidad en computadora (antes, 59)
- páginas, del inicio al contacto
- 6
- páginas, del inicio al contacto
- catálogos por rubro para descargar
- 7
- catálogos por rubro para descargar
- localidades en el mapa de cobertura
- +50
- localidades en el mapa de cobertura
De un vistazo
Cómo se llegó al sitio
Del sitio que había a uno nuevo, en cinco pasos.
01 / 05
El sitio anterior
Cumplía, pero repetía contenido, tenía datos viejos y tardaba en cargar.
02 / 05
El contenido
Primero, qué tiene que decir cada página y qué tiene que poder hacer quien entra.
03 / 05
Los wireframes
El sitio en gris, navegable, para acordar la estructura antes del diseño.
04 / 05
Tres propuestas
Tres caminos visuales sobre la misma estructura. Pignatta eligió el tercero.
05 / 05
El sitio terminado
Fotos y video reales, catálogos por rubro y una versión pensada para el celular.
pignattadistribuciones.com.ar
- El mismo contenido en varias páginas
- Catálogo de 2020
- Velocidad: 59/100
Contenido · Inicio
MenúLogo · Nosotros · Marcas · Catálogos · Cobertura · Contacto
TítuloTodas las marcas en un solo lugar.Entrega en 24 h.
BajadaEl distribuidor mayorista que abastece tu negocio en La Pampa. Pedido con tu ejecutivo, entrega al día siguiente.
BotonesVer catálogoPedir una visita por WhatsApp
SecciónLo que hacemosDistribuciónLogística integralCadena de fríoEjecutivos de ventas
SecciónLo que distribuimosFiambres · Lácteos · Alimentos · Bebidas · Limpieza · Congelados
SecciónQuiénes somos+30 años · +50 localidades · Entrega en 24 h
SecciónCobertura · Preguntas frecuentes
01
Lo que encontré
Antes de proponer nada, revisé el sitio que tenía Pignatta, sus redes y a las distribuidoras de la zona. Pignatta era de las pocas con sitio propio: una ventaja para aprovechar.
Le pasa a muchos sitios: se publican, nadie los actualiza y con los años empiezan a fallar. Cambian las marcas, los catálogos y la tecnología, y el sitio se queda atrás de la empresa.
- 01Varias páginas mostraban exactamente el mismo contenido.
- 02El catálogo para descargar era de 2020 y pesaba 15,5 MB.
- 03Había localidades que no coincidían y marcas que ya no distribuían.
- 04El mapa del sitio que lee Google estaba vacío.
- 05En computadora, la velocidad era de 59 sobre 100.
¿Te suena?
Si tu sitio quedó desactualizado, es un buen momento para rehacerlo.
Datos viejos, páginas que fallan, nadie que lo mantenga: es lo más común y tiene arreglo. Contame cómo está el tuyo y te paso un presupuesto.
02
Ordenar la información
Antes de dibujar, escribí el contenido: qué páginas necesita el sitio, qué dice cada una y qué tiene que poder hacer quien entra.
Quedaron seis páginas, cada una con una acción principal. Ese documento fue la base de todo lo que vino después.
Página principal
Inicio
Portada con video · Qué hacemos · Marcas · Quiénes somos · Cobertura · Preguntas frecuentes
→ Ver marcas o pedir una visita
Nosotros
- Historia desde 1994
- Cifras e infraestructura
- Línea de tiempo
→ Conocer la empresa
Marcas
- Marcas exclusivas
- Todas las marcas, por empresa
→ Ver qué se puede pedir
Catálogos
- Catálogos por rubro
- Descarga en PDF
→ Descargar un catálogo
Cobertura
- Mapa interactivo
- Localidades por provincia
→ Ver si llegan a tu zona
Contacto
- WhatsApp directo
- Dirección y horarios
→ Escribir por WhatsApp
03
Ajustes y sitio terminado
Con la dirección elegida, el diseño se volvió sitio. Lo fui ajustando en rondas cortas, siempre sobre el mismo link, así el cliente veía el avance real:
- La versión para celular y las animaciones.
- Catálogos ordenados por rubro y nuevas localidades en San Luis.
- Fotos, video y textos reales, el mapa de cobertura interactivo y el carrusel de productos.
- Ajustes después de presentarlo en la empresa.
- Los últimos detalles: el botón de WhatsApp y las frases que rotan.
«Son detalles, la página está muy buena!!»
pignattadistribuciones.com.ar
Más de 30 años de trayectoria,con un sitio a la altura.
Seis páginas, una acción clara en cada una.
Lo que no se ve
Rápido, liviano y hecho a medida
59
Antes · abril 202699
AhoraVelocidad en computadora según PageSpeed Insights, la herramienta de Google. Lo principal aparece en 0,9 s; antes tardaba 2,9 s.
- Accesibilidad72 → 95
- Buenas prácticas92 → 100
- Buscadores83 → 100
Las dos mediciones
6semanas
Desde la aprobación del presupuesto hasta el sitio en línea. Mes y medio es el tiempo promedio de un sitio así.
Hecho a medida
HTML, CSS y JavaScript escritos para este sitio, sin plantillas ni WordPress. Carga solo lo que usa.
Mapa interactivoCatálogos de 74,8 a 3,7 MBVideo optimizadoDatos de la empresa para GoogleHosting y dominio del cliente
04
El proceso, en limpio
Así trabajo un sitio, y así salió el de Pignatta.
- 01
Investigación
El sitio actual, las redes y la competencia.
Contenido repetido, datos viejos y un catálogo de 2020.
- 02
Orden del contenido
Qué dice cada página y qué tiene que poder hacer quien entra.
El mapa del sitio, aprobado antes de dibujar.
- 03
Wireframes navegables
La estructura en gris, para acordarla antes del diseño.
Dos rondas de revisión con el cliente.
- 04
Tres propuestas
Tres caminos visuales sobre la misma estructura.
Pignatta eligió el rojo cinematográfico.
- 05
Desarrollo con link fijo
El sitio se construye y se revisa siempre en el mismo link, en rondas cortas.
Fotos, video, catálogos y mapa, sumados sobre la marcha.
- 06
Publicación y medición
Lo pongo en línea en el hosting del cliente y mido el resultado.
La velocidad pasó de 59 a 99.
Mes y medio, el tiempo promedio de un sitio así.
«Felicitaciones, quedó hermosa».
