overview
PROBLEM
Coaches will rely on word-of-mouth and outdated listing sites to find new jobs. Modern job sites like Linked-In, Glassdoor, or Google Jobs don't allow coaches to address the needs for a new position or help highlight their own coaching career.
SOLUTION
Create a sports focused social media website. It should allow coaches to connect with their coworkers, learn about new positions, and highlight their own achievements all in one place.
AUDIENCE
Coaches across the USA (any sport, any grade)
ROLES
Solo Product Designer
TIME FRAME
July 2021 - Current (ongoing)
TOOLS
Figma, Google Docs, Slack, Tettra
research process
Kick-Off
I was approached my coworker, Diontre, one weekend about this side project he was doing with some friends. He played college football and now coached a local high school football team. Throughout this phone call, he told me about all the coaches he has talked too and found that a lot of them really only found new job through their friends or very outdated sports news sites that just happened to also post job listings. So he started this project as a LinkedIn for coaches around the January of 2021, he and everyone else on the team were development focused. They had some ideas about UI/UX design, but quickly found they needed some more man power in that section, which is where I came in.
Some wireframes and the version of the app when I joined the team
Some examples of what I've designed now
Laying the Foundation
So from what Diontre had told me, it seemed like they were leaning towards the Google Material design system for the front end. Also since they already had some designs in place I was able to get the feeling they were looking to achieve. But before I started any wireframes or page designs I made sure to start on the component / design library.
I chose to use Figma as my design tool as it's what I'm most familiar with and most of the other people on the team used it before. Thankfully Google has released a figma design kit that I was able to clone and start making changes too. Though it was a bit outdated when I cloned it so I had to do a decent amount of work to get the components and constraints working throughout all of the parts of Material Design. This is still something that I do pretty often when designing pages, as I do a more "fix as I go" methodology for this project.
My layout for the component library
While we had a great idea, and a pretty clear goal of what we wanted for out end product, we did make sure it wasn't misguided. We sent out google surveys to our network of coaches to figure out what they felt they needed in the app. We even got some online interviews with different types of coaches in diferent states. Some were college football, highschool, one even was a personal trainer!
Notes from some of interviews
design
"Lesser artists borrow; great artists steal" - Picasso
This quote from Picasso is something I have thought about very often throughout this project. As once I finished the foundations of the design system I started on the page designs. Since we were basically following a social media model, I looked at Facebook, Twitter, LinkedIn, and Instagram and "stole" parts of their layouts and interactions of the components. Now it's easy to just steal things from other popular social media designs because obviously they work to some degree. But as a UX designer I needed to know why these designs work as well.
So for every part of a page or interaction I would check at least three different sites to see how they handled it. From that I found that almost all of the major social media sites have the same layout and interactions, which makes sense. If your site differs too much from the norm that users are used to, then they'll get confused and it'll drive them away. Though I definitely heard the flip side of this where the need for familiarity stifles creativity of online spaces.
Facebook, LinkedIn, and Instagram all using simlar modals to post
The Process
Firstly I went and saw what pages they had already made and simply created updated figma versions of those pages. It was mainly the home page and some of the log in flow. Next the team met up to decide what pages would we need to be considered a "regular" social media site. From this meeting we found an obvious few: search, profile, settings, login, notifications, and messages.
All the pages I've designed for this project
So I got to working. This was also my first project designing a completely responsive site, so there was a learning curve there, making sure all of my constraints would work well when going from laptop down to a phone. Whenever I would finish one of these pages I would go to Diontre or someone else on the team to get their feedback and anything and then I change stuff as they brought up issues or tech restraints. This process took months and more meetings as to figure out what would be included for MVP.
An example of every page having to have "three" designs
MVP is a bit unique for this project. As while it has taken months to get to this point we've been of the mind that as a start up we should get something out there. While I'm the type of person who loves to work on something until it's perfectly polished before presenting it, there was a great argument that getting something out there will help use gain valuable user feedback. At this point we had a pretty limited range of a research group, mainly based in southeast Wisconsin of people we already know with a few other coaches outside that network. But if we have something out there that actual users can interact with it puts us in a better situation of what type of features to add and to see what's not working currently.
Validation
In-Team Reviews
As I stated before, I'm in constant discussions with the other members on our team going through interactions and making sure things are on the right track. We don't expect things to be perfect, but if this gains traction we recognize that there might be a decent amount of just general clean up to do. On my side that just means making things are as consistent as they can be in the figma and doing to front end reviews much more in-depth.
Users
As of the end of January 2021 we currently have around 200 users on our production site. Which is a major milestone and our team feels incredibly proud of, especially for doing this work all while we have full-time jobs. But from those 200 users, we've already gotten some feedback. One of the main things we found was a need to want to promote players. So say like a highschool coach really sees their starting quarterback going to a good football college, they can have some way to display that to potential recruiters. It's the user feedback like that, that really cemented that process that we chose to work through. It's showing us that there's really potential for the project and that the users want more out of it.
take aways
Design Systems are intense, but needed
Creating the entire component library was a major hurdle. But once over that hill I was able to churn out page designs like there was no tomorrow. I had already had experience with an in-depth system from my job at Uline. But this project allowed me the creative freedom of building my own from the ground up.
User Feedback
In the beginning of this project I was very much in the mindset of having to make sure every single feature was 110% polished. Now I still don't like turning out work that I don't feel is up to par, but in this case it made sense to cut minor corners. We could spend years going back and forth getting ideas, changing our minds, going back on those changes, etc. But in the end that process would just be us blindly throwing things at the dartboard. We needed and honestly still do need that user feedback to drive our decisions. Because while our team is incredibly smart, our users might not view things in the same way as a UX designer or a developer does.
Team Relationships
Most of my previous work, the team dynamics have been different. I was stifled by thing like all the team members were all in the UX major so we had the same perspective, I was working part-time so my growth with the team was stunted, or UX was divided from the dev process where I was design only. But this project helped to merge a lot of these. I was able to come to any number of the people on this team and ask them how they styled this and put in my input and vice versa. I'm not saying any of my previous teams were terrible, but having this as a side project and having all of us grinding away at the same exact goal helped to strengthen the relationships and helps how I grow other relationships as well.
