Project Overview
Main Street first emerged in 2014 as Houston Muay Thai and quickly grew, gaining a high reputation as one of the best Muay Thai gyms in Texas. In 2018 the two founders, coaches Robert (Bob) Perez and Michael Corley, decided to part ways. Kru Bob Perez retained the original location and changed the name to Main Street Boxing and Muay Thai, adding boxing and MMA to the list of programs. Since the split, the gym has gone through expected fluctuation of membership.
As co-owner and head coach, Kru Bob sees the opportunity to increase membership by improving the gym’s current website, but doesn't have the bandwidth to tackle it himself.
The goal is to design a responsive website for Main Street Gym that will:
A more detailed outline of the project is in the project brief.
Scroll ↓
Research
GOALS
• Discover how people learn about Main Street
• Narrow the target audience
• Identify the goals, needs, motivations, and frustrations of said target audience
• Study the gym’s direct and indirect competitors
ASSUMPTIONS:
• Young males are the primary target audience
• Coaches mainly want to attract and train serious fighters who want to compete
• Word-of-mouth is the number one way the gym gets exposure
• People don’t come back because they feel intimidated
The details of the research phase are outlined in the research plan.
An in-depth analysis of the market research can be seen here.
Once I felt like I had a solid understanding of the market, I researched the top boxing and martial arts gyms in the greater Houston area to put together a comprehensive competitive analysis.
Key Takeaways...
✔ Most of the successful gym sites had a strong social media presence, with inviting photos and videos
✖ Almost all lacked a clear path for new members to sign up online.
Based on what I uncovered in the research, I came up with 3 provisional personas. This helped me when it was time to conduct user interviews.
USER Interviews
Preparing: I prepared two scripts — one for Kru Bob and employees, and the other for active members.
Recruiting: I interviewed 5 current members and 3 employees. It took me 5 days to complete this portion.
Documenting: I divided the feedback into separate transcripts of the employees and members then used that information to put together a research debrief.
Kru Bob Perez
This interview was very valuable for the next phase because it allowed me to concentrate my energy on recruiting the right people and also answered some of my initial assumptions.
This interview was very valuable for the next phase because it allowed me to concentrate my energy on recruiting the right people and also answered some of my initial assumptions.
I learned that, at least for Main Street, young males are NOT the primary target audience, and coaches DON'T mainly want to train fighters.
Active Members
After Kru Bob told me that women and children were the two demographics he wanted to attract, I decided to stick with women as the primary user group for this project. The main reason I didn't include children for this iteration was time, logistics, and scheduling conflicts.
After Kru Bob told me that women and children were the two demographics he wanted to attract, I decided to stick with women as the primary user group for this project. The main reason I didn't include children for this iteration was time, logistics, and scheduling conflicts.
It was important for me to visualize the patterns I uncovered in the research, so I created an empathy map of the data. From those patterns I was able to define the overall insights and needs of the users.
Persona
As part of the final synthesis process, I used the persona to create a storyboard. Here is where I was able to describe how the product would solve the problem for the target user:
Myriam confidently signed up for the trial membership because the website had all the information she needed to make her decision.
Define
PRODUCT ROADMAP
Scroll ↓
SITEMAP AND REQUIREMENTS
I used the roadmap to help me organize the content into appropriate categories for the sitemap. A more detailed overview is in the product requirement document. This part wasn't very glamorous but it was necessary to keep the product requirements in focus. For this user journey I highlighted the registration process of a new user, a missing ingredient to the original site.
Scroll ↓
Design
I was mindful to design the mid fidelity wireframes with sections that easily scaled from different screen resolutions. This was a problem I encountered during the competitive analysis.
Scroll ↓
Prototype & Test
This time I recruited people that weren’t part of the gym but that fit the characteristics of the target audience. I also created a self-administered questionnaire that could be filled out remotely.
Summary of Findings
A more detailed review of the data is in the complete usability test plan and findings document.
I synthesized the findings into an affinity map where I highlight the patterns I noticed from the user feedback. From these insights I was able to prioritize the revisions for the final prototype.
Final Thoughts
The feedback I received was generally positive . I tried not to give too much vocal direction during the tests to see where the subject ended up from one page to the other. I also wanted to leave the first scenario open for them to decide at which point in the journey they felt “comfortable” taking the plunge for the 3 day trial.
What I took away from the administering portion is that I need to be a little clearer in my instructions in the beginning without nudging them too much in the “right” direction during the test. Holding back helped me see holes in the design.
Overall, I think the testing went well and I received excellent feedback to move forward.
Next Steps
PRIORITY REVISIONS
After receiving great feedback from the usability test on how to improve the prototype, I prioritized the following:
1) Videos and photos to sustain engagement with the site
2) More appealing call-to-action to persuade users to signup
3) Highlight benefits of becoming a full-time member
For the brand, I started with the colors I saw on the inside and outside of the gym: red, black, and white. Then I created a mood board with images that fit the gym's aesthetic. After that it was easy for me to pick the rest of the design elements for the new website.
Scroll ↓
Post Mortem
What went wrong?
Interviewing - During user interviews, since I was conducting them in the gym, it was difficult for me to find an appropriate spot that was private enough. I also couldn’t use the recorder because there was so much background noise. I would plan better and be more prepared for this part if I were to do it again.
Interviewing - During user interviews, since I was conducting them in the gym, it was difficult for me to find an appropriate spot that was private enough. I also couldn’t use the recorder because there was so much background noise. I would plan better and be more prepared for this part if I were to do it again.
What could I have done better?
Scope and time - I should have kept the scope of the project front and center. There were also areas that I could have spent less time on and I would have gotten the same or even better result.
Scope and time - I should have kept the scope of the project front and center. There were also areas that I could have spent less time on and I would have gotten the same or even better result.
What did I learn?
When to step back - I took too much time on some areas, like designing multiple screens to have a more robust prototype. Even though it wasn’t difficult, the screens weren’t necessarily vital to the scope of the project.
When to step back - I took too much time on some areas, like designing multiple screens to have a more robust prototype. Even though it wasn’t difficult, the screens weren’t necessarily vital to the scope of the project.
