Sitio corporativo · UX/UI · Identidad digital

PinApp

PinApp conecta talento tecnológico con empresas que necesitan escalar sus equipos digitales. El proyecto consistió en diseñar la interfaz y experiencia del sitio institucional que presenta sus tres líneas de servicio: Staffing, Delivery PODs y Head Hunting.

imagen principal — producto en contexto, full bleed
Cliente PinApp
Año 2025
Mi rol UX/UI Designer
Servicios UX · UI · Diseño responsive

El proyecto

Un sitio institucional para una empresa de staffing y desarrollo tecnológico

PinApp ayuda a compañías a incorporar tecnologías digitales y escalar sus equipos a través de tres servicios: colocación de talento técnico (Staffing), equipos de desarrollo dedicados (Delivery PODs) y búsqueda especializada (Head Hunting).

Mi trabajo se enfocó exclusivamente en el diseño de interfaz y experiencia (UI/UX) del sitio — no participé en su construcción — traduciendo sus tres líneas de servicio, su cultura y su propuesta de valor en un sitio claro, confiable y fácil de navegar para potenciales clientes.

El reto

Explicar tres servicios distintos sin que se sintieran como tres sitios distintos.

Usuario

Clientes B2B evaluando proveedores de talento y desarrollo tecnológico — necesitan confianza y claridad rápida.

Producto

Tres servicios (Staffing, Delivery PODs, Head Hunting) con procesos y públicos distintos, que debían convivir bajo una sola identidad.

Restricción

Comunicar seriedad corporativa sin perder la energía y el color de la marca.

Entender antes de diseñar

Antes de diseñar pantallas, revisé cómo PinApp se presenta hoy: sus servicios, su cultura y los casos de éxito que ya había construido con clientes como el ecosistema Agora.

01

Los tres servicios (Staffing, Delivery PODs, Head Hunting) comparten el mismo proceso base — entender la necesidad, definir alcance, hacer seguimiento — pero se explicaban con lenguajes distintos.

02

La marca tiene una identidad visual fuerte (azul marino + coral) que no estaba siendo aprovechada de forma consistente en todo el sitio.

03

El equipo y la cultura interna son un diferenciador real frente a otras consultoras de staffing, pero no tenían un lugar visible en el sitio.

El reto no era solo mostrar qué hace PinApp, sino por qué confiar en ellos para hacerlo.

imagen — auditoría de pantallas / mapa de uso

Decisiones que definieron el sitio

01

Un selector de servicios en vez de tres páginas iguales

En lugar de tres páginas de servicio idénticas en estructura, diseñé un selector interactivo en el home donde cada servicio se expande con su propia foto y resumen — permite comparar sin tener que navegar.

Reduce la decisión inicial del usuario a: "muéstrame lo que me interesa".

visual — flujo de aprobación progresivo
antes
después
visual — tabla como espacio de trabajo
02

La cultura como parte de la propuesta de valor

Diseñé la sección "Nosotros" con el equipo real, la misión y testimonios de cultura interna, dándole tanto peso visual como a los servicios — algo poco común en sitios de este rubro.

Las empresas contratan personas, no solo procesos.

03

Casos de éxito como prueba, no como portafolio

En vez de listar clientes, cada caso de éxito (Agora Pay, Agora Shop, Agora AhorraMás, Agora Club) se presenta con el problema real que resolvía para el usuario final del cliente.

Prueba social basada en resultados, no en logos.

visual — hilo de contexto en el detalle

Exploración

Antes de llegar al selector interactivo de servicios, probé alternativas para resolver cómo mostrar tres servicios con el mismo peso.

arrastra →
v1 — tres tarjetas iguales
Clara pero plana: no comunicaba que cada servicio tiene un proceso distinto.
v2 — pestañas horizontales
Obligaba a elegir antes de comparar — perdía la vista general.
v3 — acordeón vertical
Funcional en mobile, pero perdía impacto visual en desktop.
v4 — selector expandible
La dirección final: cada servicio se expande con foto real al pasar el cursor, sin perder el resto visible.

El producto

Un sitio de una sola narrativa: qué hace PinApp, quiénes son, y qué han logrado — cada sección construye confianza hacia el formulario de contacto.

pantalla completa — panel principal
detalle — tabla editable
mobile — aprobación

El selector de servicios se adapta a un acordeón vertical en mobile, manteniendo la misma lógica de exploración.

detalle — estados
detalle — filtros
video — microinteracción

Una identidad consistente en cada sección.

Trabajé sobre la identidad ya existente de PinApp (azul marino, coral, tipografía geométrica), llevándola a un sistema aplicable a todo el sitio.

visual — anatomía de componente y estados
Color

Azul marino como base corporativa, coral como acento para llamados a la acción y momentos clave.

Tipografía

Una tipografía geométrica sans-serif para titulares, con jerarquía clara entre secciones.

Componentes

Tarjetas, selectores expandibles y bloques de equipo reutilizables entre Home, Nosotros y Casos de Éxito.

Responsive

Cada patrón (selector, carrusel, grid de equipo) rediseñado específicamente para su versión mobile, no solo reordenado.

Resultado

Un sitio que ya no necesita explicar tres veces lo mismo — cada servicio se entiende con su propio espacio, dentro de una sola identidad.

El selector interactivo de servicios se convirtió en el patrón central del sitio, reutilizado luego en Casos de Éxito.

La sección de cultura y equipo le da al sitio un tono humano poco común en el rubro de staffing tecnológico.

Lo que me dejó este proyecto

01

Cuando varios servicios comparten un mismo proceso, vale la pena diseñar un solo patrón flexible en vez de una página por servicio.

02

La cultura interna de una empresa de servicios es, muchas veces, su argumento de venta más fuerte — vale la pena diseñarla con la misma intención que el producto.

03

Diseñar solo la capa de UI/UX, sin construir, exige documentar decisiones con más detalle para que el equipo de desarrollo las implemente con la intención correcta.

¿Tienes un proyecto en mente?

Hablemos →
Siguiente proyecto

Ver más