Product designer currently working at Greybox solutions, a digital healthcare startup in Montreal.
Thumb_AFTV.jpg

AFTV mobile app

A mobile app design for football fans to help them follow their favorite club, interact with other fans, find routes to different stadiums and more.

  The Project:  Arsenal Fan TV is first of all a youtube channel that started to upload content with fans reactions after the games of the Arsenal FC. It got very popular quickly due to the "raw" footages of the many supporters of the club, giving their takes on the performances, players and staff ratings, predictions and even more. They have a website but wanted to offer even more to the Arsenal FC fans with a new app and many new features specific to the app to really make it a "must have" for the fanbase, and this is where my work started...   The Challenge:  Creating an app that is easy to use, but with many and sometimes complexes features. Also designing for a very wide range of users. AFTV beeing a very popular youtube channels that provides content for users of all ages (from 14 years old to 50 years old approximatly). The other challenges were to design the new features that had to added on the app. Such as; integrating a store system within the app, giving fans live commentary for the Arsenal FC games for the fans who couldn't catch the games, or also the "PL grounds section" which could give the directions to the opposing teams stadiums, so that the fans can easily find the route to take in order to attend the next away game of the club.    The Solutions:    So after  doing some profiling and creating user personas and doing some research about others football related apps. I realized that, as mentioned above, the AFTV followers/users vary from a very wide range of age (approx. 14 to 50 years old). So the design had to very simple and clear, you don't want to confuse and lose unexperienced users. And at the same time things had to be very clean and well organised, because that's what more experienced users expect and want from football apps. 

The Project:
Arsenal Fan TV is first of all a youtube channel that started to upload content with fans reactions after the games of the Arsenal FC. It got very popular quickly due to the "raw" footages of the many supporters of the club, giving their takes on the performances, players and staff ratings, predictions and even more. They have a website but wanted to offer even more to the Arsenal FC fans with a new app and many new features specific to the app to really make it a "must have" for the fanbase, and this is where my work started...

The Challenge:
Creating an app that is easy to use, but with many and sometimes complexes features. Also designing for a very wide range of users. AFTV beeing a very popular youtube channels that provides content for users of all ages (from 14 years old to 50 years old approximatly). The other challenges were to design the new features that had to added on the app. Such as; integrating a store system within the app, giving fans live commentary for the Arsenal FC games for the fans who couldn't catch the games, or also the "PL grounds section" which could give the directions to the opposing teams stadiums, so that the fans can easily find the route to take in order to attend the next away game of the club. 

The Solutions: 
 So after  doing some profiling and creating user personas and doing some research about others football related apps. I realized that, as mentioned above, the AFTV followers/users vary from a very wide range of age (approx. 14 to 50 years old). So the design had to very simple and clear, you don't want to confuse and lose unexperienced users. And at the same time things had to be very clean and well organised, because that's what more experienced users expect and want from football apps. 

Personas

Personas

So to get a better understanding of what the app should offer in terms of usability, features, visual style and more. I started to do some research of potential users to create personas and therefore, know who I was going to design for.     

Persona_1_Claude_small.jpg
Persona_2_DT_small.jpg
Sketching

Sketching

I started sketching out various ideas to work on some of the most important request I had from the user research and different personas. With ideas for the directions of the stadiums, fixtures and rankings, news of the Arsenal FC.

AFTV_sketch1_small.jpg
Userflows

Userflows

After sketching out ideas. I started to do user flows to structure the information and have a better idea of the general user experience. user flows really help to create the user experience by deciding what the user will be able to do with the app and how can he get to specific destinations.

UserFlow_PL_Ground_small.jpg
UserFlow_Shop_small.jpg
Wireframes

Wireframes

Wireframes help to join together the sketches and the user flows. Giving a more advanced idea of what the app will look like visually and on a UX point of view.

UI/Visual Design

UI/Visual Design

So after the wireframes were created, I had a more concrete idea on how the app was going to be designed and structured. I started to work on the visual design of the app. AFTV already has a branding, so I picked the colors they use as main colors to keep the brand continuity (red/white). I went with a minimal design style to keep it clean visually and easier to understand and interact with for the user. Also during and after the design phase of the project,  I did some prototyping so i could ask people to try and explore the app. Giving them goals and tasks to achieve and see if they were able to achieve the tasks without confusion or struggles. It helped me notice if there was anything in the design or architecture that had to change or be tweeked. The results were pretty convincing, here is the link to the prototype: https://invis.io/8PBLLJEF6

Visual_guidelines_small.jpg
UI_design_small.jpg