Gorilla FC re-design
Gorilla FC is an official Seattle Sounders fan club, and their old website was in need of an update. As part of General Assembly UXDI course, my partner and I completely re-designed the Gorilla FC experience.
We updated the existing site to create a more professional, branded website that easily allows users to donate to Gorilla FC, become a member, and purchase merchandise.
Our process included screeners, interviews, affinity diagrams, card sorting, creating and informing two personas, information architecture, interface design, and usability testing.
Screeners & interviews
Our group developed two brief screener surveys; one designed for current GFC members, and one for prospective members. The results of the screener allowed us to target ideal interview subjects.
We were able to conduct thirteen total interviews - four with current GFC members and nine with prospective members.
For the current GFC members, the questions were focused on what tasks they seek to accomplish when using the website, and the pain points within that process.
The interviews with prospective GFC members focused on what they seek when interested in becoming involved with a fan club-like organization.
Affinity diagrams
After conducting interviews, we created affinity diagrams that would help us in creating personas. We evaluated statements from our interview subjects, and sorted them into several "I statements" that would shape our personas.
Proto-personas
Once we had finished the affinity diagrams, we were able to create two proto-personas, each with their own pain points and goals. Francis (left) would be our primary proto-persona, and Janet (right) would be our secondary proto-persona.
We also created user stories for both of our personas. These personas and their stories would help us design an experience with as few pain points as possible.
The user story of Francis, our primary persona, is as follows:
Francis is an openly gay 29 year-old programmer from Pasco, WA who just moved to Seattle for a job. He has been a supporter of the Sounders since they joined the MLS, and discovered Gorilla FC while at a Sounders game. He craves shared experiences, especially involving soccer, his favorite sport. He volunteers with organizations that he aligns with, and he enjoys participating in an ongoing dialogue about things like the Sounders.
Information architecture
We were able to re-organize the global navigation with the findings from our interviews, card sorts, and affinity diagrams. We wanted to clarify everything to allow the user to find anything they are looking to find through the global navigation.
Through interviews and the ensuing affinity diagrams we were able to find out the general information the users seek. Card sorts allowed us to see the associations that the users make, and how they see relationships between the pieces of information on the site.
Visual design
One of the primary goals of our client was a site with increased visual branding. Among other issues, the old design lacked visual storytelling. It was gloomy and uninviting. Many of the elements on the page carry equal visual weight, thus the users eye does not have an entry point.
The low contrast ratio between text and background - black or green text on a dark gray background - makes the text difficult to read or even notice.
In short, there were many areas for improvement in regards to the interface design. Our group agreed that the new design should have a clear global navigation, and should feel sporty and friendly - two main tenets of Gorilla FC.
