FootballGuys.com is one of the top-ranked fantasy football websites in the world. With a member list in the hundreds of thousands, it has a long track record of being “the source” when it comes to fantasy football projections and analysis.
With hundreds of players in the NFL and thousands of data points for each player, the individual player pages have grown bloated with content. The player pages are overwhelming and user feedback indicates that the content is hard to scan and absorb.
A user who is overwhelmed by too much information or gets ‘lost’ navigating through a site is going to have a bad experience. To avoid these scenarios and improve user experience, I used a process known as Information Architecture.
The first step in the process was to create wireframe sketches using pen and paper. This phase is about generating as many layout ideas as possible. Often the tendency early on is to “over design” but starting with paper helps to avoid confusing well-designed wireframes for good ideas.
The sketching phase helped me focus on the key page elements while shifting less pertinent data farther down the page. We knew from user testing that the draft position rankings and key stats are the first data points most users are looking for.
The next phase was to move our wireframes to the computer. I created several low fidelity wireframes and ultimately a high fidelity mockup plus an interactive prototype for user testing.
Fantasy football owners are looking for the most current data available but often times only have a few minutes per week to invest in research and analysis. Having the most requested data points easily accessible was key to the page refresh.
Based on user testing I highlighted three key stats:
Using a design process that included sketching, wire-framing, and prototyping we produced a vastly improved version of the FBG player page. The improved information architecture helps the page to “breathe”. Key player stats and draft projections are now the focus of the page instead of being buried under a mountain of text.