The rise of digital press has seen a tremendous peak over the last years, demanding all sorts of content. Spot On is an online magazine directed to meet the needs and goals of MIllennials interested in sports, encouraged by publishers to provide quality content along with a great digital product for readers. My role was to understand the user requirements and apply their needs to the defined solution and user interface. I collaborated with another UX/UI Designer.
TIMEFRAME
1 weeks (Apr 2020)
DESIGN TOOLS
Figma, Notion, Miro
To start the project knowing better the competitors, working with other UX/UI Designer, we did a competitive analysis to understand what they are doing and what can be improved. We also analyzed the visual attributes.
Based on the primary user persona received at the beggining of the project and on our initial assumptions after doing the competitive analysis, it was about time to talk to some MIllennials and findo out their motivations and needs when readinf online magazines.
We decided to tackle the user's needs and goals using the JBTD framework and not persona this time. JBTD is an outcome-bases approach which in this case would help me to focus on a much learner and agile way on the tasks users are looking to achieve.
As a busy person, I want to be able to listen to articles instead of reading them, so I can check the news at the same time as working or doing other activities.
As a person interested in sports, I want to have an online magazine to explore the content according to my interests, so I can check only the news I like without searching too much within other categories.
As a person who likes to read news around the world, I want to to have the possibility in one place to check everything related to sports by city or country, so I don't have to search for different sources according to location.
Having defined problems and validated initial assumptions I started creating the concept in form of wireframes, with the object of testing and defining the screens breakpoints following the grid rules.
For the UI components of the magazine, colours, fonts, and sizes were carefully selected to meet the brand attributes. Throughout the whole interface design, accessibility was taken into consideration in order to enhance the experience for all users regardless of their ability or situation.
According to our research, many users claimed that they feel overwhelmed by the ammount of articles at the main page in sports magazines, for this reason they need to "dive” into research in others to fins what they are looking for. So in our solution, we offer to them different ways to access the content and customize the experience according to the content that they have interest.
The editorial is organized by tags, splited in sports, cities and authors. In this way the users can navigate and customize their home page according to their interests
The articles show a summary, so the user can have a hint about the topic, also check the tags to see the author name, sport and city related.
Instead of having a long scrollable page we decided to organize the content according to the last updated and create a carroussel where the user can navigate between the previous articles.
As Spot On is a community of local writers, we considered quite relevant to have a section dedicated to authors quotes, to develop connection between readers and writers.
As Sport On will pottentially have a wide range of content, it's important to offer a comprehensive set of "filter" by tags to help user find content faster.
Our primary user persona was focused on knowing new people that have the same interests as him, we also included an events area organized according to the location and city selected.
Having a personalized experience is so important, so we maintained a banner foccus on getting newsletters sign ups, then the user can commit and receive dedicated news from the magazine.
As soon as a user selects a tag, the entire magazine content adapts according to the selected subject. The user can mix selections including sports, authors, and locations, even he can select more than one option from the same category. In this way we are able to offer a specialized experience for each user according to his needs.
Articles Audio As mentioned in our research and in the definition step, one of the points is to give the user the possibility to listen to the article transcript, instead of reading it. With this they have the possibility to access the interesting articles while doing other activities.
After all effort put on the editorial design for about 1 week it'd be amazing to bring some ideas to life. Therefore, I'm open to any partnerships or collaboration if similar brands are interested in this project.
Despite doing a throughout research of competitors' magazines and managed to interview a few people under not ideal conditions due to Covid-19 constraints I would have liked to add more qualitative research in the form of personal interviews.
Really enjoyed working on all those micro-interactions as they proved to be quite helpful in reflecting the brand's personality as well as offering feedback by showing users the results of actions taken. This helps to create a more human experience and reinforce the brand's personality.
It'd be great for personal development as well as to validate final assumptions, to proceed with some usability testing of the prototype. (Open to any feedback!)