Brief:
with an exclusive license create a new premium service with a unique football experience. Through the best content: Live matches timeline, statistics and results, Permanent updates on the rankings of the most important competitions and tournaments, Comprehensive news coverage of the club including hourly updates, A choice selection of content.
Goal:
The main goal is to offer fan charts and premium and entertainment content to fans
allow users manage their accounts and all the transactions.
allow users manage their accounts and all the transactions.
With different hierarchy levels of navigation and simply visual design, we don’t overwhelm the user with all information of the team we can offer, we divided editorial from fans content.
My Role:
UX/UI Designer designer.
I was responsible for create exclusively content for fans like Quizzes, screen backgrounds, fan charts, and editorial information (News, statics and results from the competitions and tournaments) to give the users greater satisfaction and better user experience with minimum effort.
Responsive design, using the editor based on the design system we created to our services.
Work hand too hand with developers (front and back) to carry out this project.
Stay aligned with product owners, stack holders and marketing team to offer a exquisite product.
Research and generate business strategy based on the User Centric Design.
Frame work
Before thinking any design solution, I had to invest about the behavior of the football environment specially from the Real Madrid´s fans, and make a benchmark from the editorial news portals and the official website of the team to offer different content.
we focused on the content we could offer to our users, something that the official website do not offer. Then, me and my team proposed rapid wireframes and made our first MVP. Once validated with user testings and with the approvement from PO and the development team, we started with final version of the website.
After our first version we had to pivot sometimes to improve the usability of the website focused on mobile.
Approach
We used an Agile framework to validate and pivot if was necessary, make tests and improve the design and usability.
On the first stage, we did a kick off with the client, After that, we defined the product we could offer, and then we set all the architecture and design. After some design propositions, we were made our last version of the web but still working on new ideas to improve fan content product.
On the first stage, we did a kick off with the client, After that, we defined the product we could offer, and then we set all the architecture and design. After some design propositions, we were made our last version of the web but still working on new ideas to improve fan content product.
Current Colour Palette
We decided to preserve the blue pallet from the football team but differentiate the color from the official website(black, gold and the dark blue). We did a distinct with the pale blue and dark blue to contrast headlines and links. We also decide to use white as background because it is an editorial and statistics page, so we needed the user feels confortable to read and compare without effort.
Blue used to make feel friendly and inviting web
Key Work
User research on the field, prototyping, user testing, and UI design
Visual design: choose typography, colors, iconography.
Visual Design Benchmark
Wireframes and MVP
Look and feel, skin website
Quiz web-app design
Screen backgrounds design
Collaboration with team UX: Javier Pascual, Javier Díaz and Francisco Celemín.
Thanks for watching :)
