FanPlei is the leading fantasy sports site in Mexico, with free and paid contests available for NFL, MLB, UEFA Champions League and Liga Mexico.
Our challenge was to redesign the FanPlei platform with a focus on increased usability, engagement and retention. I worked with FanPlei stakeholders and customers over a 9-week period to create this proof of concept.
To kick off the project, I interviewed all 4 FanPlei stakeholders to understand their business goals, challenges, and overall team dynamic. We came away from the interviews with a few key insights:
- Most Mexicans don’t know what fantasy sports are quite yet. FanPlei’s challenge is to educate the Mexican public and make them excited about this new sports concept. The redesigned FanPlei platform must cater to both users who are brand new to fantasy sports and to more experienced fantasy players.
- Even though FanPlei.com’s traffic has doubled in the last 6 months, their MAU has been stagnant at around 1,100 users. The new traffic that has been coming to FanPlei.com from various social channels has not resulted in more regular users.
- While almost all active FanPlei users play in public contests, only around 10% of users are playing contests with their friends. We believe that improving the FanPlei social experience will result in more users inviting their friends to join FanPlei and will in turn get them hooked on playing with their friends on a weekly basis.
Defining Business Goals
After completing stakeholder interviews, I met with the entire team and we defined a few key business goals for the project.
- Increased participation in private contests. Only 10% of users are currently playing with their friends. We will aim to get at least 20% of FanPlei users playing with their friends.
- Increased user retention. In the last few months, less than 1% of traffic coming from social media (facebook/instagram/twitter) has been converting into regular users. We will aim for at least 3% of new site traffic from social media converting into regular FanPlei users.
- Increased monthly active users, currently around 1,100. We will aim for at least 2,000 MAU within 3 months after the launch of the redesigned platform.
Five FanPlei users (both new and experienced) were interviewed over Skype. We generated a few important takeaways from speaking with users:
- Watching sports is predominantly a social activity. Friends will make plans to get together, cook and watch NFL games on Thursday, Sunday and Monday.
- Most FanPlei users check scores and player stats outside of FanPlei.com when selecting their FanPlei lineup. They prefer sites such as Mediotiempo, ESPN.com & NFL.com. “Using the other stats sites gives context to FanPlei Points”, one user said.
- Most FanPlei users play at least one recreational sport. They believe that playing sports, exercising and spending time outside are all part of living a balanced and healthy life.
We followed up our interviews with five remote usability tests using lookback.io. Users were asked to complete a series of tasks on FanPlei’s desktop and mobile site, and their activities were recorded. We analyzed the results of these usability tests with an affinity mapping exercise and identified some common usability problems:
Usability Affinity Map
- Only two out of five users figured out how to invite their friend to a contest. All five users initially clicked the “Create Contest” button, created a lineup, and got stuck when they couldn’t find a way to invite their friend to the contest. Most users then tried clicking on “Friends” in the menu bar, and most gave up at this point. A few users referenced a Facebook or WhatsApp search option when trying to find their friends. The “invite friends” option is buried in the secondary navigation of the “Friends” page, and only two users were able to find it.
Solution: Gives users a quick way invite friends to a contest, rather than making them create a league, invite friends to the league and then create a contest (1 step instead of 3). Integrate FanPlei’s search tool with Facebook and Whatsapp so users can easily find their friends (see Invite Friends wireframe).
- There were many interpretations of the “Multi-Entry” section. One user thought selecting Multi-Entry meant “public”, while a second user thought it meant “multiple people” and a third user didn’t understand why a multi-entry option existed if you’re only allowed to create one lineup.
Solution: Reduce the clutter and eliminate this feature for now. The multi-entry feature is not intuitive for new users and even advanced players hardly use it.
- Most users did not understand the prize structure section. The layout of the prizes data table is overloaded with input fields, confusing formulas and repetitive information.
Solution: Simplify the prize structure by eliminating the data table and just use a simple text box to display the prizes by place (see Create Contest wireframe).
Speaking with stakeholders, interviewing users and conducting usability tests helped us understand FanPlei’s business goals and usability problems within the current system. I wireframed some potential solutions to the problems that we discovered in usability testing
(click to expand).
I presented our usability findings and some low fidelity wireframes of FanPlei’s main features to the team. The stakeholders were overall satisfied with my proposed solutions, so I began to create a style guide and high-fidelity mockups.
We began creating our high-fidelity mockups by researching fantasy sports platforms and more general Mexican sports culture.The team wanted to go for a minimal and clean UI similar to FanDuel, but with bolder, more vibrant colors that embody the spirit of Mexican futbol. We wanted to continue using green as our brand’s primary color, but we felt that the current FanPlei green was not as fresh and exciting as it could be.
After producing some mockups, we built a prototype that takes a desktop user through the flow of creating a contest and inviting their friend(s) to join the contest. Users had a very difficult time performing this task in our first round of usability testing, so we wanted to test our proposed solutions to this task with another round of users. We believe that improvements to this functionality will get more users playing FanPlei with their friends, which will in turn boost the platform’s retention and growth.
After completing this clickable prototype, I want to complete at least one more round of usability tests before shipping the first version of our redesigned FanPlei platform. In future usability tests, I want to see improvements in the main usability roadblocks we initially discovered (see Usability Insights section). I also want to look at Google Analytics data for improvements in the key metrics we initially defined (increased % of private contests, increased retention, increased MAU).
Overall, this project has been a valuable lesson in utilizing stakeholder input and usability data to create a design system from the ground up. The brand refresh was an especially fun exercise that pushed my limitations as a budding visual designer. I plan to take on more freelance projects like this in the future.
Create contest before
Create contest after
Mobile lobby before
Mobile lobby after
Mobile hamburger menu before
Mobile hamburger menu after