Rediseño CADENA 100, RockFM y MegastarFM

Antecedentes

CADENA 100, Rock FM y MegastarFM son las emisoras musicales del Grupo COPE. A mediados de 2018, con el diseño de la web y la app de COPE terminada, comenzamos los rediseños de CADENA100, RockFM y MegastarFM, que nos han llevado algo más de un año. 

Problemas y objetivos

Estos tres productos se habían quedado bastante anticuados y solo respondían a la necesidad de escuchar la radio, sin complementar el resto de necesidades del usuario actual: estar bien informado y sumergirse en el universo de su emisora favorita. 

¿Cuál ha sido mi rol?

En estos 6 proyectos coordiné y dirigí los rediseños de las tres webs y las tres apps: empezando por la conceptualización de cada producto, ayudado con la experiencia de conocer el medio desde dentro por mis trabajos paralelos como director y presentador de programas en radio y tv; preparación y desarrollo de sesiones de coworking y Design Thinking; supervisión y coordinación del diseño de wireframe y diseño de producto por parte de las agencias externas; corrección de errores, proceso de calidad y preparación de entrega a maquetadores y desarrolladores front y validación y seguimiento del producto desarrollado.

Pizarra con un ejercicio de Design Thinking para el diseño UX UI de la web y la app de CADENA 100
Planteamiento

Tanto en las web como en las apps de las tres emisoras intentamos plantear un producto con su propia personalidad pero versátil, que nos funcionase igual en las tres emisoras para ahorrar en costes y en tiempo, y por supuesto que se pudieran seguir personalizando en siguientes iteraciones. Todo ello centrado en el usuario y en algunas investigaciones realizadas. Durante este tiempo hemos ido conceptualizando y diseñando cada uno de los productos en orden de relevancia: CADENA 100, Rock FM y MegastarFM y en paralelo web y app de cada producto.

Proceso

En mi opinión cualquier web o app de un medio de comunicación, aunque sea musical, apoyado en un servicio de radiodifusión “tradicional”, debería tener, como mínimo, tres elementos básicos: portada, detalle de noticia y player. Esto fue lo primero que trabajamos en todos los proyectos, pensando en que tuvieran un punto común a la vez de su propia personalización.

cadena100-rockfm-megastar-home3
Home

Para la portada diseñamos un catálogo de módulos lo suficientemente grande y versátil como para que cada redacción tuviera herramientas suficientes para dotar de jerarquía editorial a los contenidos realizados. Además, añadimos módulos concretos del medio radiofónico musical como la posibilidad de volver a escuchar los programas de antena, los podcast o buscar los contenidos de los artistas más escuchados en cada emisora.

MegastarFM-home-1
MegastarFM-home-2
MegastarFM-home-3
MegastarFM-home-4
Player

El player es el núcleo de cualquier proyecto audiovisual. En el caso de la radio, la transformación digital natural del transistor tradicional a los dispositivos de última generación. Los diferentes directos de audio y vídeo de cada emisora conviven con los contenidos en audio y vídeo de las noticias, o los podcast de antena o exclusivos digitales de cada producto. 

cadena100-rockfm-megastar-player4
cadena100-rockfm-megastar-noticia5
Noticia

Aunque actualmente muchos usuarios se sientan informados únicamente leyendo titulares en webs o redes sociales, es necesario un formato donde poder desarrollar los contenidos propuestos por las redacciones. Con un gran multimedia destacado debajo del titular se refuerza la identidad de radio y la necesidad de documentar con vídeo y sobre todo audio los contenidos noticiosos del ámbito musical. 

Artistas

Los artistas son una parte fundamental de los productos digitales relacionados con la música. Desarrollamos un buscador de artistas con el que se puede acceder a fichas bibliográficas de cientos de artistas de cada emisora para conocerlos en profundidad y estar al día de sus últimas noticias.

cadena100-rockfm-megastar-artistas6
Herramientas

En UX se han utilizado diferentes herramientas centradas en el usuario como Persona, Customer Journey, Focus Group, etc. Para hacer el diseño de estos productos digitales usamos Sketch para wireframes y diseño high-fidelity. Marvel e Invision para presentar los diseños en las reuniones y obtener las validaciones del equipo directivo. Por último, usamos Zeplin para subir los diseños y enviarlos al equipo de maquetación y desarrollo front.

herramientas-sketch-zeplin-cadena100-rockfm-megastar
Datos y resultados

Todavía es pronto para analizar los resultados de los últimos productos lanzados como la web y la app de RockFM y MegastarFM pero antes de llegar al año del lanzamiento, la web y la app de CADENA 100 sí ha conseguido batir algunos récords. El primer mes tras el lanzamiento incrementó su audiencia un 50% y en octubre de 2019 superó por primera vez en la historia a su competidor directo los40.com con más de 2.500.000 usuarios únicos mensuales.