Reimagining Squid Game as an App: Would You Survive?
Squid Game, Netflix’s recent k-drama hit has skyrocketed to the top ranking spot just 4 days after its release. Given the popularity of this series, fans from all over the world have been creating Squid Game inspired clothing merchandise and attempting to carve out shapes from dalgona cookies. Some countries have even installed Younghee, the larger-than-life scale robotic doll, at selected shopping mall entrances or tourist attractions.
Among the 2359 Media team, we have our fair share of Squid Game fans comprising of those that binge watched the entire series in a single setting. Being an innovation house and doing what we are best at, the team started to ideate on the possibilities of what Squid Game could look like if it was on an App instead. However, we’ll be introducing a PG twist to it, whereby instead of death as a consequence from losing, the player will instead be eliminated with the option to restart the game.
Before we deep dive into the design thinking process, it is important to address the key objective and goal that we envisioned for the mobile app.
Research
Research was conducted to conceptualise how the recruitment and onboarding experience could be tweaked into a version for the app. This was important as we had no intentions for the app concept to stray too far from the original game concept.
Persona
User Flow
To ensure a smooth user experience for the players, it was critical that we map out the user flow. This helps us to determine the entire user journey from the onboarding phase to the end outcome of the game. This process was also essential as it directly impacts the decision-making process for the mechanism/features required for each screen.
The following were also some key considerations that we wanted to delve deeper into:
- Is there a way for existing users to access the game or do all participants need to be registered as a new player?
- Will this app be exclusive to a certain group of people or can everyone access this app?
- How would the winners receive the prize money?
- As we are keeping this PG friendly, what kind of forfeits could we enforce on players who are unable to complete the games?
- Should we consider setting a participation expiry time?
Wireframes
We kickstarted our design process by creating wireframes as it helps us to better capture the entire user flow for both new and existing users. This in turn helps us to determine the ‘must have’ elements for each screens.
For instance, the onboarding process would require an assignment of player ID as well as an identity photo to be taken for each player. Hence, there was a need to visualise and translate how the mechanism for this identification process would be presented.
Style Guide
Referencing the key colours that represented both the antagonists and players, we decided to implement the primary colours of green, pink and black, accompanied by secondary colours of white and grey.
The fonts of the app were picked and referenced from the key visuals from Netflix while the primary CTA buttons are in pink and green. This was with the intention to grab users’ attention and to produce a more noticeable effect in contrast to the other elements on the screen. The key buttons and headlines are in the font called Termina, while the secondary text are in a font called Poppins.
Onboarding
The onboarding process kicks off with players making a selection of representing either an existing or new player. Regardless of their choice, they will be directed to a screen where they have to upload an image of themselves, key in their bank details and agree to the terms and conditions. For the account verification stage, players will also be required to key in the 5 digits alphanumeric entry from the transaction generated during the initial phase.
Once verified, they will be brought to a set of screens where they will be informed of the compulsory deposit to proceed with the game. As the instructions are disseminated from the guards, the titles of these screens are represented in the colour pink. Players proceed by selecting the green ‘actionable’ buttons in the app.
Onboarding (Deposit)
From this point onwards, players are warned that they are not able to exit the game and are taken to a countdown screen for the official start of the game.
Event and Game Countdown
The countdown screen page consists of a short game summary to warm players up along with a list of instructions to ensure fairness of gameplay. Most importantly, a countdown timer is present to prepare users for the upcoming game.
A game timer is also available on the screen to indicate the remaining time left for players to complete the games’ objectives. In the event that they successfully complete the game, they will progress and move on to the next game. Otherwise, they will be eliminated by the guards and the app will automatically close.
Getting Feedback on Initial Design
In the midst of transitioning from the draft black/white wireframes to the hi-fi full colour wireframes, the design was run through internally with the design team to gather feedback on the overall flow. Through the collaborative design thinking process, we wanted to identify any areas that we could improve to create a better user experience.
Wireframes Hi-Fi (final)
- Onboarding and Introduction
In the process of working on the draft, there were some identified improvements that could be made for some of the screens. For instance, in terms of visual improvements, we decided to introduce the app with a splash image of the hit drama series so that users could better resonate.
During the first draft of the hi-fi screen designs, the colour on some buttons and prompts were white, which stood out quite brightly against the black background. A colour contrast as such would affect a user’s vision on the app. To help improve the usability experience, the colours of the prompts were adjusted to a different shade of grey instead, so it is not so glaring on the user, together with the secondary colours of pink and green.
Apart from focusing on aligning the app’s features with the Squid Game concept, we were also hoping to enhance other non-gaming aspects, such as adding logos to the banks to improve familiarity of the banks. Additionally, micro-interactions were implemented to provide immediate feedback when users select their preferred banking options. Upon selection, the button turns to a lighter shade of grey, with the logo inverted to white.
- Onboarding (Deposit)
In the deposit screen, an image of the frontman was included along with a speech bubble, to run users through the rules of the game and what the user has to do to participate in the game.
The deposit amount is highlighted in a colour of gold/orange, accompanied by an illustration of a phone. When the payment is completed, players will be able to see an illustration of money flying out from the bag. Thereafter, the player will be taken to their profile, with the randomly-assigned Player ID.
- Event Countdown
To make the screens more engaging and create an awareness of the time, the timer is made into a depleting circular line around the countdown details.
- Games’ Countdown, Intro and Gameplay
In the game screens, instead of just a button countdown, a sentence is included to indicate how long more before the game starts, along with a real timer below, albeit smaller. This gives an exact indication of the time left to the user. Once the game starts, a full screen timer of ‘3..2..1’ is shown in the style of an old film followed by a brief explanation of the game.
If the user clears the game successfully, they are brought to a congratulatory screen which features money entering their bag.
- Champion and Winner
In the final game, Squid Game, players can expect a similar procedure to take place. The only difference is that there is no timer in this final round.
Once the user becomes an eventual Champion, the screen transits to the screen with the frontman, informing the players to check their bank account for the credit of the game’s prize money.
Conclusion
For the purpose of a mini project exploration, only 2 games were created to focus on. That said, an ‘enticing’ game app as such, attached with a grand prize, would draw many players to the game.
Learning Points/Takeaways
One takeaway would be that it is important to stick closely to the original concept of the series in both the overall user experience and visual designs. This was important as we wanted players to relate to Squid Game in the version of a mobile app.
To garner players’ interests in the mobile game, there was also a need to be concise with the details and visuals of the entire experience, ranging from the onboarding process all the way to the end outcome of the game.
At 2359 Media, we actively encourage our designers to explore possible design solutions together while having fun working on the project, as well as to keep our creative juices flowing.
Photos and Vectors Sources
Squid Game logo, frontman and guards vector: freelogovectors, Vectorlogo4u
Other vectors: Vecteezy
Show stills: Reddit, CapitalFM, Cosmopolitan, Cheatsheet
