CASO DE ESTUDIO // WEBAPP

OBSERVATORIO DEL JUEGO CV – Framework TypeScript para encuesta multistep

Proyecto de desarrollo web para el Observatorio del Juego de la Comunitat Valenciana, centrado en la creación de una encuesta digital extensa, estructurada por pasos y preparada para recoger información de forma clara, progresiva y ordenada.

La solución se desarrolló con un framework en TypeScript orientado a formularios multistep, permitiendo dividir una encuesta compleja en bloques manejables, controlar la navegación entre pasos, validar respuestas y mejorar la experiencia del usuario durante todo el proceso.

El formulario incluye múltiples áreas de análisis, como información personal, frecuencia de juego, tipología de juegos, juego online, ubicación, motivaciones y sensaciones asociadas al juego. La propia web estructura la encuesta en apartados como “Información personal”, “Frecuencia juego”, “Tipología de juegos”, “Internet”, “Motivaciones” y “Sensaciones”.

TECNOLOGÍAS UTILIZADAS
CSS3 HTML5 JS TS
ROL Desarrollador Frontend
CRONOLOGÍA 2023_DEPLOY
CLIENTE Observatorio del Juego CV

EL RETO

El Observatorio del Juego CV necesitaba una herramienta digital capaz de recoger respuestas en una encuesta amplia, con muchas preguntas, diferentes tipos de opciones y una estructura dividida en secciones temáticas.

El principal reto era evitar que el usuario se enfrentara a un formulario demasiado largo o difícil de completar. La encuesta debía sentirse guiada, clara y progresiva, permitiendo avanzar y retroceder entre pasos sin perder el contexto ni la información introducida.

Además, el formulario debía gestionar preguntas de respuesta única, selección múltiple, escalas de valoración, aceptación de condiciones y estados finales como envío correcto, error o encuesta ya respondida. La web muestra controles de navegación “Anterior”, “Siguiente” y “Enviar”, además de mensajes de estado para error, respuesta completada o encuesta ya contestada.

"El reto era transformar una encuesta extensa y sensible en una experiencia digital clara, progresiva y fácil de completar, sin perder control técnico sobre validaciones, navegación y estado del formulario."

LA SOLUCIÓN

Se desarrolló un framework en TypeScript para gestionar formularios multistep de forma modular y escalable.

La arquitectura permitió dividir el formulario en pasos independientes, controlar el avance del usuario, gestionar el estado de las respuestas y aplicar validaciones antes de permitir continuar o enviar la encuesta.

A nivel frontend, se trabajó una experiencia centrada en la claridad: bloques agrupados por temática, navegación paso a paso, opciones bien organizadas y una interacción sencilla para reducir fricción en un formulario con gran volumen de preguntas.

La solución también contempló los estados finales del proceso, incluyendo aceptación de política de privacidad y términos de uso antes del envío de la encuesta.

Framework en TypeScript

Desarrollo a medida para gestionar formularios multistep con una arquitectura modular, mantenible y preparada para crecer.

Encuesta paso a paso

División de un formulario extenso en bloques temáticos para mejorar la comprensión, reducir fricción y facilitar la finalización.

Gestión de estado frontend

Control de respuestas, navegación, avance entre pasos y estados del formulario desde una lógica centralizada.

Validaciones guiadas

Sistema preparado para comprobar respuestas obligatorias, aceptación de condiciones y reglas necesarias antes del envío.

IMPACTO TÉCNICO

El proyecto permitió construir una herramienta digital específica para la recogida de datos mediante una encuesta extensa, manteniendo una experiencia más clara y controlada que un formulario convencional.

A nivel técnico, el valor principal estuvo en crear una solución propia con TypeScript, evitando depender de un plugin genérico y permitiendo un mayor control sobre la lógica del formulario, la navegación, las validaciones y los estados de usuario.

El resultado fue una encuesta multistep más ordenada, mantenible y preparada para gestionar un volumen alto de preguntas sin sacrificar la experiencia de usuario.

TypeScript FRAMEWORK

Arquitectura frontend desarrollada a medida para controlar formularios complejos.

Multistep ENCUESTA GUIADA

Formulario dividido por pasos para mejorar comprensión, ritmo y finalización.

UX Forms MENOS FRICCIÓN

Experiencia pensada para hacer más manejable una encuesta larga y sensible.

Validación CONTROL DEL FLUJO

Gestión de respuestas, condiciones obligatorias y estados antes del envío.

Datos RECOGIDA ESTRUCTURADA

Organización de preguntas por bloques temáticos para facilitar el análisis posterior.