Werkveilig

Contexto

Presentar las áreas del Instituut voor Veiligheid & Milieu a visitantes con objetivos distintos: encontrar una formación, entender los servicios o pedir apoyo. Un gran volumen de contenido tenía que seguir siendo fácil de abarcar.

El reto

No mezclar cursos, sectores, servicios y contenido experto en un solo flujo. La navegación debe ayudar a cada visitante a reconocer su necesidad y llegar a una oferta concreta.

Qué hicimos

1. Varias entradas, una sola arquitectura

   La portada presenta las áreas principales, y la estructura interior separa formación, servicios, necesidades sectoriales y conocimiento. Cada entrada continúa como un recorrido propio.

2. El catálogo de formación como herramienta de trabajo

   El UX/UI desarrolla el paso de un área general a un curso concreto. El catálogo tiene su propia jerarquía de información y una presentación responsive.

3. El contacto en el momento justo

   Formularios y puntos de contacto forman parte de la estructura de la oferta. Se puede hacer una pregunta o inscribirse justo donde se ha entendido el servicio que se necesita.

4. Un sistema para mucho contenido

   Exo 2 une navegación, títulos y texto principal. El contraste de peso y tamaño separa los niveles, y el color distingue superficies y acentos.

Qué desarrollamos

1. Arquitectura y recorridos de usuario

   Ordenamos un gran volumen de información en servicios, sectores, formación y contenido experto, y diseñamos el camino hasta el área adecuada y su punto de contacto.

2. UX/UI y sistema visual

   Diseñamos interfaces coherentes para la portada, el catálogo y las secciones interiores, con maquetaciones de escritorio y móvil que mantienen la marca reconocible y la jerarquía clara.

3. Desarrollo y configuración

   Desarrollamos la web, los formularios y los puntos de contacto, y conectamos las estructuras de servicios y sectores con el catálogo de formación y los recursos expertos.

4. SEO, pruebas y lanzamiento

   Organizamos el contenido y la estructura SEO, hicimos las pruebas y la optimización final, y llevamos el proyecto al lanzamiento con un recorrido continuo desde conocer la oferta hasta contactar.

Sistema visual

Una base verde, un acento lima y un texto azul verdoso oscuro crean una interfaz profesional y fácil de leer. En la portada, una gran foto va acompañada de entradas a cada área, y después se alternan bloques informativos y visuales.

Familia

Exo 2 · pesos 300, 400, 700, 800

Texto principal

16 px · 300 · interlineado 1,5

H1

800 · clamp(32 px, 4vw, 52 px) / 1

H2 / H3

28–44 px / 24–28 px · peso 800

Navegación / botones

18 px, 800 / 16 px, 700

Contenedor

1280 px; bloques anchos hasta 1456 px; márgenes de 24 px

Anchos de referencia

640 · 768 · 1024 · 1280 · 1456 px

Recorridos y material

Un área en la portada → servicios o catálogo de formación → una oferta concreta → la consulta. Las secciones sectoriales y el contenido experto dan entradas adicionales a la misma estructura.

Promoción

Optimizamos la web para buscadores, configuramos una cuenta de Google Ads y pusimos en marcha la publicidad y la promoción en buscadores.

El resultado

IVM cuenta con una web corporativa en funcionamiento para el mercado neerlandés. La empresa, sus servicios, la formación y los recursos expertos comparten una misma estructura. Cada visitante elige un área y contacta para su necesidad desde una pantalla grande o desde el móvil. Arquitectura, diseño y desarrollo completo se hicieron en un solo proyecto, hasta el lanzamiento.

Herramientas y desarrollo

UX/UI · desarrollo web responsive · HTML / CSS · estructura SEO