NFT FC

UX/UI, product design
Project Description
NFT FC is a Metaverse project looking to support upcoming players and develop their relationship with football fans. The task was to create, design and deliver a product that matched the vision of the project.
My Contributions
As the founder of the project, I worked closely with our partners at Overtime to develop the application.

To create the app I hired a team of creatives and developers to help build the final product. To find product market fit before the build we conducted a series of user interviews.

After finding PMF and interviewing users I built the UI for the application. From here we used user feedback  to improve the app and its features, to increase usability and functionality.
View the final video here
Project Overview
Platform details
2022
Young athletes are provided very little support along their journey of trying to become a professional athlete. This makes it even harder for international athletes outside of European countries to make it. Our goal was to create an app that allowed football fans to support upcoming athletes from around the world, and later receive benefits for doing so.

Using blockchain technology, fans could buy NFT's of the players to support them. We could later identify who supported the player and give back a range of rewards.

The app itself would have 2 users, fans and players. This can often provide challenges similar to what AirBNB faced when they first launched and addressed the common "chicken or the egg problem". Why would players come to our app if no fans were supporting them and why would fans come to our app if no players were on there?

To solve this problem we first wanted to understand whether our idea had traction, so we sought out product market fit as best we could.
Research
Research & PMF
Product market fit can be hard to obtain before a product is released. For startups this proves tricky as product market fit is usually obtained post launch and we weren't blessed with endless financial means that most large scale companies are. We not only wanted to find product market fit and prove that users would use our product, but also identify who these users were to attract more of them.

We set up a series of questions that asked football fans 4 questions:

1. How interested are you in supporting upcoming players and participating in their success? A) Very interested B) Somewhat interested C) Not interested

2. What type of people do you think would most enjoy supporting upcoming players and following along with their journey?

3. What do you think the main benefit for supporting players on our platform would be?

4. How can we improve NFT FC for you?

From here we segmented the responses and eliminated the users responses who said they wouldn't be interested in using our platform. Our goal is to find product market fit with our high expectation customer (HXC) in mind. Using our users responses to the second question, we crafted a rich and detailed vision of the NFT FC HXC, specifically focusing on responses from users who would be very interested in our product.

We then wanted to convert on the fence users into NFT FC lovers so we looked at questions 3 and 4. Using word cloud, we put the responses to question 3 from very interested users into a word cloud; which gave some surprising results. We thought customers would most be interested in future giveaways and connections to professional athletes, however they were most interested in the intrinsic value of supporting young players.

To convert on the fence users, we took the people who would be somewhat interested in NFT FC whose main benefit was also the intrinsic value and put their responses to question 4 into a wordcloud. This helped guide the decision making process behind how to improve the product to gain better product market fit.
User personas
Target market
As a result of our research we effectively created a picture of our high expectation customer. The form itself also included questions asking them where they spend the majority of their time, which would later help with marketing.

We decided our platform had 2 main user profiles; football fans and football players. Football fans can also be split into a general football fan and a parent who wants to support the children's dreams. Below is an outline of the 2 main user profiles for our app.
Site map
User journey
Now that we had a better understanding of what our customers wanted from our platform, we could create a more effective site map.

There were some limitations to what we could build, as the blockchain we were building on didn't have some functions yet. We had constant meetings with the developers throughout the build to better understand what we could and couldn't include in the first product.

The site map itself started off with a normal website that was used to show the products main features and benefits. This websites main purpose was to lead users to click the "Enter app" button which then led the web app. From here users could view players on the app and decide which one they wanted to support (buying an NFT).
Wireframes
Wireframe sketches
Once we had the site map, I created a series of wireframe sketches to show the outline of sections throughout the website and app. The wireframes helped us save time before developing the product in Figma, as some initial things needed to be changed due to limitations on the backend.
Optimisation
User feedback and testing
We continually used our product market fit survey to survey new users. These users came from our community channels like Discord and Twitter. We didn't want to interview the same user twice in case it would detract them from our final product.

We specifically focused on the fourth question, "How can we improve NFT FC for you?". Once we had built the first draft product in figma, we looked at the customers answers to this question who said they would be somewhat interested in our product. This made is pretty clear where we needed to improve the product moving forward. See the word cloud below that highlights what these customers wanted to see.
Design choices
UI design psychology
My choice of colour throughout the website was very deliberate. Although the brand guidelines I created took inspiration from brands like Nike, who use bright colours against black/white backgrounds, I also deliberately chose between the green, blue and pink for different elements throughout the website.

Blue is most often associated with loyalty and trust. Brighter blues can be affiliated with communication and intrigue, making great call to action button colours. I also used the rule of 60/30/10 throughout the website, with 60% being a black, white or grey colour and 30% being green.

Almost every section of the website has an element of animation or a component that users can interact with. This subtle use of movement grabs the users attention.

Most dApps (decentralised applications) you see on the internet now tend to have black backgrounds. I decided to go with a lighter background, to stand out against the sea of black applications. I also thought a lighter background represented a sense of optimism, which I thought was important due to the current backlash you see against many blockchain applications.
Final Product
Full UX/UI
Below is a look at the final solution. It was clear after our user feedback that football fans wanted more videos and reels of the players. We made this a focus on the player profile pages so that fans can learn more about the player they want to support.

This build was made in collaboration with Overtime and an external developer team.

Unfortunately this product never went live due to financial reasons.

Lets create together

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.