The four apps
CCMA as the main public media entity of Catalunya wanted to have a coherent and modern package of four apps:
TV3: the main public TV channel of Catalunya with a lot of own produced programs, sports and international films. All this content is also available on demand on their website and app.
324: the specific channel of news in Catalunya where you can see recent as well as past news or follow the 24h information live channel.
Super3: the kids channel of CCMA where families and kids can see all the chapters from their favorite cartoon series or watch the live streaming TV channel.
Catalunya Radio: the main public radio channel of Catalunya. Where you can live stream the radio through your app or listen specific radio content via internet.
The team
This project was developed in a waterfall approach with a team created inside Worldline Iberia. Focusing on the design there where a UX Designer (Fabio de Pascale) and two UI Designers (Carles Salas and Marc Alcobé) involved in the process.
My role
Because of having some parallel projects at the same time the design team decision was to split roles between UX and UI. In this case the role that I took together with a colleague was focused on the UI Design of the app and the creation of visual elements for it.
Design process
As the UX part was already defined the process in this case started with the UI Design:
With the wireframes on the table and the whole UX research done the first step was to see how the client is using their corporative branding and how this can be applied to the app. The client decided to use a custom design closer to their website and other channels from the company.
Having the webs from CCMA as a reference and the branding guidelines it was the moment to start designing the mock-ups from the already approved wireframes.
With all the mock-ups done the next step was to create a prototype for the client to showcase and give feedback and also to deliver it to the developers. For that InVision was the tool selected for the easy communication between all the parts involved in the process.
With the InVision prototype created the app was presented to the client to get the final approval. In this case the presentation was at the clients headquarters together with a future technology workshop about AR, VR and immersive experiences for media channels.
With the last feedback session, a final version of the InVision prototype, the measurements and the exportable assets the developers where ready to finalize the app. Afterwards a last iteration with design approvals were done to ensure that the design and the app looked exactly the same.
.svg){kind=small}