Not retaining users even after handing out their signup bonus is never fun for any business, and it wasn't fun for PokerBaazi. This issue became the only problem to be solved through this module. Read on as I discuss how we managed to overhaul the signup process, enhancing user experience to make them stay on the platform and make their first deposit with us.
What was the challenge?
New users weren't making their initial deposits, so the percentage of first-time deposits was relatively low on the platform.
It directly affected the retention rates as players were not encouraged to stay on the platform and play a game because they hadn't made a deposit.
The frauds over signup bonus were relatively high as some users only signed up to get the bonus and later played on other platforms, not ours.
What was happening in the market?
Initial research suggested there could be two possible solutions to this problem.
One is creating a daily streak sort of model where users have to maintain a minimum threshold to get constant rewards.
Another is giving the user a finite day journey to finish tasks familiarising themselves with the platform correctly.
We chose to give users a finite day journey over a constant streak.
Targeted user story 🤔
As a new user, I want to get some bonus, so that I can feel encouraged to deposit money in my PokerBaazi wallet.
The journey 🚗
We chose to create a seven-day journey for the user where they would have to finish specific tasks, and on completion, they would receive a gift (in this case bonus in their PokerBaazi wallet). The ultimate goal was to push users to make their first deposit on our platform even without being too particular. So we tried to find a design solution where the task to make a deposit almost felt low priority compared to other tasks yet strategically placed right in front of the users' eyes, so it's hard to miss.
We achieved this by making the design of the FTD card bit different and placing it right under the task of the day.
Refer to Fig. 3. for the aspirational journey map that I wanted to achieve.
Refer to Fig. 4. for the feature prioritisation.
This or That? 🤷
Another vital question was whether to create the whole design on Dark or Light mode.
As the app has both modes, it was tricky to decide. Initially, we thought creating it on dark mode would give it an edge over the rest of the app's pre-lobby (before gameplay) interface. Also, dark would help us play a lot with colours to create something fancy enough. We did the initial POC of this module for dark mode, and it used neon colours and other pattern infused backgrounds to create a visually appealing dark mode design for the module.
The design also featured a full-page screen for a more immersive experience.
The fall of the dark 🚦
The dark mode idea couldn't sustain itself in our initial testing. So we had to drop it and go back to the drawing board to try something in light mode this time.
The reason for not going forward with dark mode was that we reserved this visual mode for the gameplay where the app engaged pro poker players for longer durations. Incorporating a similar pattern in the initial stages just when the user launches the app might confuse them in the long run. They would also start connecting this module with gameplay, which was not what we intended. Also, the shift from dark to light was very abrupt in this case. The screen was only supposed to show during the launch of the app. The visual connection between the lobby and this module was missing heavily.
Also, we even changed the full-screen pop up to a bottom sheet that covers half or 2/3rd of the screen, giving the sense of what's behind on the main home screen and giving users the choice of dragging it down to close it and move forward, skipping this whole module if need be effortless.
Refer to Fig. 5. below.
The Call To Action ☎️
While designing the CTA button for the locked state of tasks and goals for the coming days, we again faced a dilemma of whether the design should be as per the usual pattern or make it stand out by breaking the pattern.
We came up with two approaches: keeping the button's recall value intact by keeping it according to the last buttons used by the user in the flow and changing the button slightly by adding an icon in the button along with the text. The idea here was to make the locked state more prominent as it will happen in the future, and the user still has a chance to win it. But while doing it, we were running at risk of breaking the usual recall value that we created with other button states.
Finally, we settled for using the same pattern and not changing it as the locked button didn't feel so important that changing its style would do any good as the button itself would be in the disabled state, represented by grey colour.
Refer to Fig. 6. below.
Refer to Fig. 2. on top for a better understanding of flow, if you skipped the line!
For the goal diggers 🏆
What should happen when someone hits the mark?
We wanted to answer this question through some fantastic experience that marks the end of the journey on completing a particular goal. We wanted to give users a sense of accomplishment through visuals that make them feel they should come back for more such tasks in future. Hence, we explored and came up with an animation that opens a treasure chest with some bonus money and coins, signifying that the user has won some bonus by doing something extraordinary by finishing the task after signup on PokerBaazi.
The elements of this screen are reusable and easy to be used in various settings. The animation starts with the chest itself, followed by a congratulations banner/ribbon unrevealing itself. Then we show the user what he has won, be it some bonus, a ticket to a tournament, or something else. Another crucial component of this screen is the CTA button which is context-aware. When a user finishes a task directly related to gameplay, the button says "Play Now," but in other cases, when no such follow-up action is needed, the CTA is not visible. Instead, the user only sees the option to close the pop-up.
Heuristic Audit 🧐
Now let's discuss how well our design solution holds its ground during a heuristics audit.
Aim:
Get a high score that solidifies that the solution works. It will provide a good user experience to its end users, which will increase the overall First-time deposit numbers for new signups and increase the users' screen time by encouraging them to use the app for at least 7 days right after signup.
Scoring Method:
The design is scored based on 10 usability heuristics put forward by the Nielsen Norman Group. The score could be 0 or 1 for each, which means the highest score could be 10, and the lowest would be 0.
1. Visibility of System Status
System status visibility has a lot of importance in this user journey. The weekdays' selection itself shows the users which day they have selected or which days they can't access for now. The checkmark and deselected states on the icons show this information clearly. Users can change the current selection and see the icon change colour whenever the next day becomes available. Similarly, the buttons work on a similar principle, keeping this in mind. If some particular task or flow is not available, for now, the button shows a locked state very clearly, which helps users know that they have to wait until the button is unlocked and ready to register clicks. Once the users finish a task or flow, they see completed status right over the button for that flow. Even the text of the Call to Action button is changed accordingly.
SCORE: 1/1
2. Match Between System and the Real World
Designing the app honouring the real world match is crucial, as it connects the application with the players really well. We can find hints of this scattered across all screens in the flow. For example, if we look at the design and font used to write the heading of this flow, we can see that the bulbs and lights give a feel of a carnival or a fun exercise, just as we see it in real with blinking bulbs and decorative signs.
SCORE: 1/1
3. User control and Freedom
No flow is mandatory and provides a clear exit at any point if users don't want to continue. The users can even cancel/close the pop-up before starting the flow itself. Hence, it's safe to say that our new user journey passes this too.
SCORE: 1/1
4. Consistency and Standards
Call to Actions and fonts are used per design guidelines to keep users' familiarity with the overall app intact. Even the bottom sheet maintains platform standards, whether it's the interaction or the corner radius of the sheet.
SCORE: 1/1
5. Error Prevention
As this module is a part of the overall app, usual error preventions incorporated in the app also safeguard it, including being accessible in case of no internet. There are no input text fields in this module, and hence no such validation error can occur. There's virtually no such state or interaction where it would be required to give any specific error message apart from when the internet drops off and the app has to reconnect. In that case, the default system message that tells that app is trying to reconnect does the job. Every action in this flow starts a new flow that initiates a new task. So, discussing error handling in those flows will be out of scope as here we are only considering the holistic view of the new user journey loop.
SCORE: 1/1
6. Recognition Rather Than Recall
The idea here is to create an easily recognisable experience, reducing the overall cognitive load on the user's brain. To achieve this, we ensured that our UI elements were as per the usual pattern, prevalent across other products on the web. Users can quickly notice this fact if they check the 7 Day selector UI, and the label of each day is DAY1, DAY2 and so on. This labelling decreases the cognitive load by helping users recognise clearly which day of the promotion they are on or which day's tasks have been unlocked or are still locked. Similarly, the buttons also have clear labels of the task they would perform once user clicks are registered.
SCORE: 1/1
7. Flexibility and Efficiency of Use
Due to various business requirements, users do not have much flexibility in this flow. If they have to participate in this promotion, following the steps is necessary. However, the process is efficient, still as it lacks flexibility, so I am not marking it with a score of 1. This flow favours first time users over experienced PokerBaazi users; this is another argument for not making it so flexible. We assume that novice users prefer a set procedure to an expert way to finish a task.
SCORE: 0/1
8. Aesthetic and Minimalist Design
Aesthetic and Minimalistic design is prevalent in the overall application by default, and there's no reason not to create this flow similarly. We have put extra effort to ensure that the content used in text placeholders, heading and Call to Actions is very precise and completely relevant. There is no additional information that doesn't go with the flow. To make the UI elements used in this particular module a little more aesthetic, we even explored different colour and gradient options for highlighting most import UI cards and Call to Actions.
SCORE: 1/1
9. Recognise, Diagnose, and Recover from Errors
As mentioned before, all error messages handled in this flow are the same as the main app. These messages have been used at multiple places already, and they convey the error to the user clearly without confusing them.
SCORE: 1/1
10. Help and Documentation
We have designed this module with no help or instruction documentation for users, making it relatively easy to understand. But the app, in general, does have various ingress points to contact help if users have to.
SCORE: 0/1
Conclusion 🎯
FINAL SCORE: 8/10