Web y Diseño Movil
El emblemático teatro de artes escénicas apostó por un restyling total de su página web, de la mano de Omatech. Para la nueva web cultural, que incorporó un sistema de ticketing, aplicamos la guía de estilo predeterminada y nos encargamos de crear y realizar el desarrollo y la puesta en marcha.
Teatre Lliure condesa en su página web un gran número de funcionalidades, como la cartelera, sistema de ticketing para la adquisición de entradas, así como un repositorio del historial de obras. Desde Omatech nos encargamos de unificar las distintas utilidades en una única web conectando las distintas plataformas en un solo site.
El diseño
Las auténticas estrellas de Teatre Lliure son las obras y por consecuencia los carteles de estas, dispares entre si crean una web llena de color y alegría, por eso el foco debe recaer sobre ellos. Para realzar el protagonismo de los espectáculos apostamos por una interfaz austera, con una combinación monocroma con toques de color rojo. Además, creamos la iconografía exclusivamente para este proyecto.
Con el propósito de mejorar la usabilidad y la experiencia de usuario realizamos una gran apuesta por una sincronía entre elementos en movimiento y estáticos en todo el site. Para algunas de las animaciones se utilizó el Scroll para reducir el espacio, como por ejemplo en la cabecera de la página.
Herramienta para retoque fotográfico.
Editor gráfico utilizado para la aplicación web.
Interacciones
El prototipado es uno de los puntos clave antes de la maquetación final, consiste en realizar un boceto del contenido, la distribución de este y la organización de las distintas páginas.
Al realizar este proceso nos permite comprobar que toda la navegación funciona, realizar tests de usuario, obtener las primeras conclusiones antes de pasar a la fase de maquetación, y realizar las correcciones necesarias con el cliente.
Prototipado interactivo hecho en Invision.
Diseño realizado con la aplicación Figma.
Mobile first
Toda la navegación, interfaz e interacciones se plantearon teniendo como referencia la versión para dispositivos móviles, ya que la fuente del tráfico era principalmente desde estos dispositivos.
Accesibilidad
En Omatech somos extremadamente estrictos en la implementación de una maquetación totalmente accesible, realizando tests de contraste, velocidad, lectura de pantalla y la optimización del markup para conseguir una carga del contenido rápida y limpia.
Sin perder de vista la accesibilidad y usabilidad, en la fase de maquetación se implementaron pequeñas animaciones en el contenido que ayudaron a crear una navegación más atractiva y dinámica.
Sostenibilidad
El mundo digital aporta respuestas al problema medioambiental que existe a nivel global, un claro ejemplo es la reducción del consumo del papel y por ende la deforestación masiva de bosques y selvas. Aunque no es oro todo lo que reluce, y sólo el uso y mantenimiento de la red supone unas emisiones de CO₂ de 800 millones de toneladas.
Para reducir las emisiones desde Omatech hacemos una fuerte apuesta para que todos nuestros proyectos digitales sean más sostenibles y que hagan un consumo mínimo de energía cuando reciben visitas. Para conseguir nuestro propósito nos basamos en tres pilares, la reducción del tamaño y peso de las imágenes, la optimización del código y facilitar una buena experiencia de usuario.
Optimización
Tener un buen posicionamiento en el buscador de Google es elemental para conseguir la visibilidad digital deseada y así tener unas buenas métricas en alcance. El algoritmo de Google premia esas webs que priorizan los elementos que mejoran la experiencia de usuario.
El motor de búsqueda más conocido a nivel mundial evalúa principalmente tres aspectos: la velocidad de carga del contenido (LCP), la estabilidad de su diseño (CLS) y la capacidad de respuesta o interacción (FID).
Programación a medida
Una de nuestras premisas es una programación meticulosa para llevar a cabo los requisitos de cada proyecto. Nuestro objetivo es ofrecer soluciones de calidad, flexibles y modulares, para que puedan crecer y adaptarse a un mercado que cambia constantemente.
Para Teatre Lliure hicimos un trabajo muy ambicioso e implementamos un framework PHP con un excelente código robusto y escalables. Implementamos Laravel- mySQL, que ofrece un resultado reusable y fluido para los trabajos de mantenimiento posterior.
Para que las funciones complejas de la web funcionaran correctamente apostamos por JavaScript, un lenguaje que permite tener bajo control casi todos los mecanismos existentes para sites, así como elementos gráficos y multimedia. Además, para hacer este tipo de acciones utilizamos bibliotecas de JavaScript.
Usado el framework de código abierto.
Base de datos de almacenamiento
Integraciones
Para Teatre Lliure un requisito indispensable era facilitar la navegación de los
usuarios por la web, así como simplificar todos los procesos de registros y
compra.
La gestión de venta de las entradas es posible gracias a la plataforma
SecuTix, que dispone de un servicio Single Sing On (SSO) el cual permite a los
usuarios de Teatre Lliure vincular su inicio de sesión en la página web con esta
plataforma.
Además, también utilizamos sus Webservices (API Restful) para recuperar los datos de los usuarios, la información de las distintas sesiones y los pases a los espectáculos.
Migración de datos
En Omatech somos extremadamente estrictos en la implementación de una maquetación totalmente accesible, realizando tests de contraste, velocidad, lectura de pantalla y la optimización del markup para conseguir una carga del contenido rápida y limpia.
Sin perder de vista la accesibilidad y usabilidad, en la fase de maquetación se implementaron pequeñas animaciones en el contenido que ayudaron a crear una navegación más atractiva y dinámica.
CMS
Para la gestión del contenido se substituyó el Drupal existente por nuestra Editora propia para gestionar y actualizar toda la información de la web, sistema de ticketing y aplicaciones de una manera fácil, sencilla e intuitiva. Para facilitar la labor de actualización, y que se pueda hacer desde el front end, apostamos por un estándar de programación MVC (Modelo-Vista-Controlador).
Así nos aseguramos de que las continuas modificaciones que se realizan en la web de Teatre Lliure se llevan a cabo fácilmente y sin complicaciones, sin dejar de lado la identidad corporativa y la imagen de marca ya preestablecidas.
En Omatech somos expertos en crear páginas autogestionables.
