What is UFL The must-have real-time fantasy football app for the 2017/2018 season. Experience the new way playing along with your friends with live football, enjoyed by over 1,000,000 football fans last season.
Now covering every match from the English Premier League, Spanish La Liga, French Ligue 1, Italian Serie A, UEFA Champions League, UEFA Europa League, MLS, English Championship, Internationals, with more leagues coming soon!
My Contributions
The brief for the role was to take the startup to a new level regarding the look, interaction and functionality. So that meant resigning the UX, which meant Fixing flows, creating interaction flows and creating new features. The app needed a facelift and identity before the app was very blue and had no interactions which made it feel very bland and lifeless. So I created a style and interaction guides, which has details about the UI,UX elements and Animation elements.
UX/UI Redesign for the world up, this including new features like Drafting, Pre-drafting, Data scout and the store. Creating a new brand style guides and social media content templates.
THE PROJECT GOAL
"Give the Game some life so it feels more like a game and make it sticky for users"
The Challenges
UX/UI Redesign for the world up, this including new features like Drafting, Pre-drafting, Data scout and the store. Creating a new brand style guides and social media content templates.
MY THOUGHTS ON UFL'S GAME MECHANICS
All games need an economy. The game’s economy is the heart of the game’s reward structure and is imperative to its success. Our focus is on F2P games. Based on micro-transactions, F2P games are a dual-currency mechanism, allowing the user to further himself within the game using both real-money currency (AKA hard currency), as well as virtual currency (AKA soft currency).
Reel them in first, monetize second. Let your users experience the game. Get them engaged with and hooked on the game. Then, and only then, gently introduce them to the different monetization options. Identify those stages within our game where the “tension” created is at its best — not too early, as you will “dis-convert,” not too late — as you will “miss-convert.” we need to get it just right.
Balance our sources and sinks. An essential key to building an enticing game economy is balanced. We must ensure your sources (a user buys + earn) are in optimum balance with our sinks (a user’s spend), and that the game’s buy/earn ratio is at its optimum.
The more options users have to gain in-game currency, the better. We should let the user earn, and make it fun and effective to spend.
Virtual goods are the engine that runs our game economy. A user must want to buy, buy more and buy again. If you provide goods that never expire (powerups), a user might buy once, but then has no reason to buy more, and definitely not to buy again. Virtual goods must be of evident value, and linked either to consumption or expiration over time, driving the user to purchase them time and time again (diamond club)
We have to invest in a dynamic and enticing store. Our store will be visited by your players often; it too has to deliver a great, game-enhancing experience and be accessible anywhere.
We need to offered store items need to progress as the game progresses. Add new items from time to time.
Make it selective. Different items need to be offered to different players at different points of the game’s flow like a power-up for the first half or player cards that you can only use for one player. Don’t make all items available to all players at all times. We need to provide multiple access options to the different offers.
UFL
he must-have real-time fantasy football app for the 2017/2018 season. Experience the new way playing along with your friends with live football, enjoyed by over 1,000,000 football fans last season.
Now covering every match from the English Premier League, Spanish La Liga, French Ligue 1, Italian Serie A, UEFA Champions League, UEFA Europa League, MLS, English Championship, Internationals, with more leagues coming soon!
Let's take a closer look.
UFL IA
I started but creating the hole user flow and pinpointing the areas that have issues and need UX fixes. All the elements in red are significant issues, and orange are Issues that could be confusing for a user.
UFL Sign up process REVIEW
When looking at the Data for sign up, it was clear there was a massive drop off, which was the first thing I recommended the team to do.
UX ISSUES WITH SIGN UP
I started but creating the hole user flow and pinpointing the areas that have issues and need UX fixes. All the elements in red are significant issues, and orange are Issues that could be confusing for a user.
UX REDESIGN
When looking at the Data for sign up, it was clear there was a massive drop off, which was the first thing I recommended the team to do.
UX MENU
When looking at the Data for sign up, it was clear there was a massive drop off, which was the first thing I recommended the team to do.
Fixtures
I started but creating the hole user flow and pinpointing the areas that have issues and need UX fixes. All the elements in red are significant issues, and orange are Issues that could be confusing for a user.
CURRENT DESIGN UX - The main problem is it's very confusing which games the user is in and when the game starts or has started.
UI - Very blue and hard to find out what is the main focus for the user
REDESIGN The idea was to make the fixture screen clear and easy to find out what was the competition and put the main focus on the games and teams
New Fixtures Stats
When looking at the Data for sign up, it was clear there was a massive drop off, which was the first thing I recommended the team to do.
PROFILE ISSUES
UI - Profile need to be cleaned up there is a lot of floating icons and is very dark.
UX - The content needs to be laid out in an easily digestible way, lots of elements are competing against each other and it not clear what is the main user focus.
New Fixtures Stats
UI - Profile need to be cleaned up there is a lot of floating icons and is very dark.
UX - The content needs to be laid out in an easily digestible way, lots of elements are competing against each other and it not clear what is the primary user focus.
Profile image big and bold, so the user knows it's them — icons beneath the user's info.
simple bar showing leader-boards
The main focus is the user's results and a new feature of collecting coins and power-ups. Before user got pushed pop-ups which if a user player more then one game can get very annoying so this will solve this
OLD GAME SCREEN
Search icon? This is not searching its adding friends, so it needs to change
Five tabs is a lot user comprehension is hard we can see from user testing they found navigation hard. The feed user found it hard to understand what points are for what actions. this needs to be part of on-boarding. (CALENDER BUTTON) WE CAN'T RELY ON A LEARN BEHAVIOR FOR GOING BACK TO THE FIXTURE SCREEN, WE SHOULD KEEP IT BUT NOT RELY ON IT AND WE SHOULD KEEP THE INTERACTION THE SAME FOR IOS AND ANDROID
Profile image big and bold, so the user knows it's them — icons beneath the user's info.
simple bar showing leader-boards
The main focus is the user's results and a new feature of collecting coins and power-ups. Before user got pushed pop-ups which if a user player more then one game can get very annoying so this will solve this
WIRES GAME SCREEN
Top Nav simplified to three tabs game tab, Leaderboards and game stats.
Icons have changed to make comprehension simpler. In the case of the leaderboards, we also show them where they are in the leaderboards without having to go to the tab. so the text will change every time the user moves places.
I've changed the size of the area of the players and power-ups and condensed it so that the user can see more of the timeline
The users player picks and power-ups are consolidated into a smaller but easier to use way. Now to a user, the main focus is the power up button and the player's data.
for the world cup we should have 2d kits and logo details to make the app much more compelling.
The users player picks and power-ups are consolidated into a smaller but easier to use way. Now to a user, the main focus is the power up button and the player's data.
for the world cup we should have 2d kits and logo details to make the app much more compelling.
Halftime is an excellent time to onboard users. They have 15 mins free why not push them some content.
for existing users give them a first half match report.
Feeds is now clear to read. power-ups act is a different way which now makes them pop out more, and there is a clear distinction
Nice to have something to represent the game the user is playing.
POWER UPS?
In games, a power-up is an object that adds temporary benefits or extra abilities to the player character as a game mechanic. This is in contrast to an item, which may or may not have a permanent benefit that can be used at any time chosen by the player.
OLD POWER UPS
For a UX view, there are know buttons which make it hard for a user to pick or know what to do. we need to make sure users does not have to overthink about how to do something and adding items such as button helps with affordances
UI there is confusion overbalance on the screen icons and text are flighting for user focus.we need to make the action clear to the user.
How many power ups can I use? Can i use more than one? Can i user all at the same time? What the limitations to them? a new user will need some help learning this.
NEW POWER UP SCREEN
Power up progress bar help users understand how many powerups they can use but also how many they have used already.
The business has decided to have power-ups as collectable and added a couple of news one ahead of the world cup. This makes comprehension a little easier as we can explain power-ups when they collect them and also in there innovatory. The user can also buy a pack of power-ups which will help with retention and economy.
TRADING PLAYERS
I started but creating the hole user flow and pinpointing the areas that have issues and need UX fixes. All the elements in red are significant issues, and orange are Issues that could be confusing for a user.
Trading is hard for the user and is not flexible to learn about players.
We are also adding more player data and data scout actions to the players. So we will need to make this full screen and make the data clear to the user.
UX is not clear which user you selecting.
POWER UPS UX
The user can now do the interaction on one screen; the user can select a players shirt which will open up their player data so they can make informed decisions. This screen also makes it clear to see players overall data and whether they are performing well.
POWER UPS UI
The user can now do the interaction on one screen, the user can select a players shirt which will open up there player data so they can make informed decisions. This screen also make it clear to see players overall data and weather they are performing well.
CURRENCY COINS, XP AND POWER UPS
Virtual goods are the engine that runs our game economy. A user must want to buy, buy more and buy again. If you provide goods that never expire (power ups), a user might buy once, but then has no reason to buy more, and definitely not to buy again. Virtual goods must be of evident value, and linked either to consumption or expiration over time, driving the user to purchase them time and time again (diamond club)
STORE & Monetization
To speed up levelling or get access to new features users can buy a superscription to the diamond club, which give users access to player-team data, longer power-ups and no adverts.
Many free-to-play games are designed to create never-ending needs. The game gives users enough resources to get started and to discover what it has to offer if you level up.
STORE & Monetization
We know from user feedback that users loved the idea of player cards and that a power-up could be attached to it. The idea is to create a never-ending need, so the more you play, the more chance of getting bigger and better cards, but it also creates emotion and delight for the user.
Human nature always makes us take the challenges and prove that we can handle them. So, a challenge is thought to be one of the most compelling game elements motivating people to take action which can be a great tool on the way for UX improvement. To enhance the challenging effect, it may be a good idea to use some kind of rewards, so that users could feel even more motivated.
Psychology tells us that collectables often associated with positive emotions, such as pleasure and excitement, motivating individuals who experience these emotions while acquiring to keep acquiring, despite negative consequences.
This will help create Empathy with users context, emotions, goals, and motivations
GAME ANIMATIONS
Psychology tells us that Animation helps creates and helps with users context, emotions, goals, and motivations. Below i have listed all the actions in the game that could add emotions and feelings when something happens in a game. Football already provides a basic level of emotions all we will be doing is adding a layer which will make the game more sticky for the user and creates excitement even if the user is not watching a live game.
ANIMATING POWER UPS
The old app was very flat and data-driven, Football create a massive amount of emotions, and we need to create tho's feelings when a user uses our app. below are examples of animations what will tap into users emotions
GOALS
Goals are a big deal in football and for the game. If a user picks a player that scores a goal, they get 50 points which are the highest 50 points you can receive. but on the old app, a user could not tell the importance of a goal as it was just in the timeline, which does not create emotions or excitement
GOAL's In the new design, the animation like this one (goal) will create and encourage feel and mood. The animation will make gameplay actions more important and create a narrative for the user to develop emotions from.
ANIMATION POWER UPS
Examples of animations that help make gameplay actions have more impact on a users emotion.
PROTOTYPE
In this prototype, you be able to play around with power-ups, interact with the stores and buy power-up packs, see a player score and feel the interactions on players
GET IT
its live on both IOS and andriod.
TAKEAWAYS
I left UFL about halfway through the Build mainly due to how the company was run but also broken promises. But never the less they did build something that looks like my designs, but the implementation is a little short.
One thing I have learnt the hard way is knowing when to leave a role when I put a lot of my IP and effort into building a product it's hard to let go, but in this case, it had to be done. Mainly for my sanity. But the changes that I did make does mean that the company is still around and is making money.