Teatre Nacional de Catalunya

Diseño UX/UI. Arquitectura, prototipado y diseño visual en versión escritorio y móvil.

Briefing

Antecedentes y progreso

Desde RocaSalvatella contactaron conmigo para trabajar en el rediseño de la web del Teatre Nacional de Catalunya. La web se había quedado desfasada, y planteaba inconvenientes en la navegación que dificultaban el acceso a los contenidos por parte del usuario.

Desde la consultora nos traspasaron un Big Picture y una categorización de contenidos. Planteamos la arquitectura y diseño de cada template, trabajamos los wireframe, y finalmente la capa visual.

Partimos de una web ya diseñada, pero que por varios motivos no cumplía una serie de requisitos de navegación y usabilidad. Tuvimos que respetar determinados contenidos ya existentes, pero reformulamos el diseño de cada template. Finalmente actualizamos la identidad visual simplificando la paleta de color, tipografía y efectos.

Client: RocaSalvatella
Date: December 1, 2016
Services: UX Design, UI Design

Wireframes y prototipado

Diseñando tipos de contenido

Antes de abordar la fase de diseño de la capa visual, tuvimos que ubicar en cada template los tipos de contenido  correspondientes: imágenes, calendarios y fichas de obra, descripciones, menús transversales e interiores… Cada tipo de contenido debía tener un sitio dentro del template en función de su importancia y la relación con el resto del contenido.

Para hacer una simulación con el cliente final más fiel a la realidad, además de diseñar wireframes de cada template construimos un prototipo en RP Axure que simulaba interacciones, enlazaba secciones y mostraba los diferentes flujos de usuario.

Prueba y error

La finalidad de diseñar estos wireframes y construir un prototipo era probar que el usuario podía llegar hasta contenido concreto en el mínimo de pasos posibles, y ubicarse en todo momento dentro de la web. Además de prototipar la versión desktop trabajamos una versión móvil para comprobar que estas pautas se lograban también en resoluciones reducidas.