FEATURE DESIGN

๐Ÿ‘‰๐Ÿป OVERVIEW

This was a Bold beat feature in the Wizard of Oz Magic Match -3 game by Zynga, 2022

Responsibilities: Based on a one-pager of the core gameplay, research, design the flow, content, art direction, and UI integration in Unity of the entire feature

๐Ÿ“ข PRODUCT GOALS:

  • Increase engagement by driving more attempts and maintaining a winning streak
  • Increase ARPU(Average Revenue Per User) through increased motivation to pay in Desperate Buy dialogs (to be validated via conversion metrics)

๐Ÿ“ RESEARCH INSIGHTS:

The feature was completely revised after we did not receive copyright approval from Warner Brothers, the Intellectual Property (IP) owners, for a pet feature using (Toto- the dog character from the fiction).

Before the disapproval, we had already tested a prototype of the Pets version of the feature, which gave us early insight into the core gameplay and the steps needed to onboard.

  • Players comprehended the onboarding flow.
  • They were intrigued and delighted to see a new power-up/booster introduced after a long hiatus.
  • Give players an emotional IP connection, as most VIP players (contributing to the gameโ€™s long-term retention) choose to play this game because of their love of the IP.

This image has an empty alt attribute; its file name is Freespinsbg-1024x566.png

  • Tackle the loss of perceived progress upon level loss โ€” you must find the balance between not cannibalizing loss aversion and providing a warm, fuzzy incentive to keep playing.
  • This can be a nice, emotional narrative moment and reasonably combat impulse quits after losing a chunk of progress on a streak, collectibles, etc.

Based on both qualitative and quantitative data insights, the overall analysis of why sessions end in the game:

  1. Difficulty
  2. No progress
  3. Loss of collectibles
  4. Out of lives
  5. Had your fill โ€” natural session end
  6. Specific frustrations โ€” case by case

๐Ÿ”ฎ FICTION

This image has an empty alt attribute; its file name is Untitled-2-1024x388.png

Tower of Magic is the wicked witches โ€˜s lair and her flying Winged Monkeys from The Wizard of Oz, a 1939 Warner Bros Movie from which the game IP is based.

  • The Feature introduces five new exclusive power-ups that the Winged Monkeys have stollen, each locked in a tower floor.
  • The Winged Monkeys are quite unafraid of anything but the green potion that the Wicked Witch of the West uses it to control them.
  • The feature prompts players to collect potion-flask of the magic green potion whose fumes can scare away the Wingem Monkey guarding each exclusive power-up.
  • When all the Winged Monkeys are scared away, a magic hat is found that reaps durable rewards.

This image has an empty alt attribute; its file name is Untitled-1024x346.jpeg

  • The feature introduces the new exclusive power-ups and their benefits
  • Grants player a magic potion and ask them to sink it
  • The potion level rises to unlock the benefit and introduces the concept of depletion
  • Feature introduces the concept of milestones based on the number of unlocks
  • Prompt the task that needs to be completed to collect potions that is, winning levels on the attempt. The prompt leads the player to the existing game-level flow.
  • The benefit of the exclusive powerup will be available on the first level that the player initiates after unlocking it for the first time.
  • A one-step flow will introduce the interaction needed to use the power-up.

๐Ÿ“ฒ WIREFRAMES

As per usual process guidelines, wireframes were initiated after 1-pager of the game design document was shared and would be developed in close collaboration with game designers, PMs, and visual artists in the initial stages.

Constraints:

  1. All power-ups should be visible at all times
  2. A secondary progression of achieving chest rewards based on the magic hat collection
  3. A custom purchase storefront dedicated for the feature
  4. Mechanics and states of unlocking a power-up and time left to use it
  5. Showcasing the depletion of the progress meter for the magic potion

This UX document contains all the flows within the feature. It was shared with feature stakeholders and collaborators from when initial wireframes were made to document and help discuss scope, costing, and feedback.

This image has an empty alt attribute; its file name is Untitled-3-1024x448.png

Main UI of feature with state changes, notes on animation and VFX states, prefabs, Sprites, and GameObjects needed in Unity

This image has an empty alt attribute; its file name is Untitled-4-1024x320.png

Wireframes with rough conceptual art of supporting dialogs and notes on animation and VFX state change

๐ŸŽจ ART COLLABORATION

As the feature owner, alongside the game designer, I was responsible for sharing the art vision with the visual artists, maintaining the game’s higher voice and tone vision.

While wireframing, I would request and guide the art point of contact to initiate exploring key elements, such as the tower in this case, which would prove really helpful in creating visual hierarchies early on.

I initiated mood boards for different UI elements and handed them to the art team for further brainstorming and discussion.

Early collaboration advantage:

  • One of the strongest aspects of the feature creation was the timely collaboration with the visual art team and point of contact to develop the art vision and test visual layouts and color palettes early on, which was quite parallel to the wireframing. This free-flowing collaboration was time-saving and allowed feature owners like myself to simulate the UI experience very early on.
  • Such a mid to high-fidelity approach helped gain confidence from stakeholders as well.
  • And most importantly, this approach proved helpful in delivering quick prototypes for playtesting purposes.

A sample of early art explorations:

This image has an empty alt attribute; its file name is Zynga-TOM-tower-art-_options-1024x373.png

Final Art from release:

This image has an empty alt attribute; its file name is Untitled-7-1024x464.png

Well-crafted art vision that resulted in unique visual UI in the game, yet very much part of the fiction

This image has an empty alt attribute; its file name is Untitled-8-1024x385.png

Each UI component was designed carefully, keeping in mind the gameโ€™s fiction, tone, affordances, cultural contexts

This image has an empty alt attribute; its file name is Untitled-9-1024x464.png

Coherent UI components and unified design language across feature-related dialogs

โญ UI INTEGRATION

After the final UX and art sign-offs on presentation to key stakeholders, the production phase would begin as per the process guidelines.

This image has an empty alt attribute; its file name is Unity_UI_integration-1024x588.png

UI integration in Unity using placeholder visual components before final art assets are available
  • As the project had very tight deadlines and we had limited tech artists’ resources, I contributed towards the UI integration of the project in close collaboration with game developers, copywriters, senior technical artists, and visual artists.
  • After the UI, integration would begin while the final art assets were being made so as to keep ready the base structure of the prefabs and game objects needed.
  • This also gave a better understanding of the size of art assets needed and size-optimizations of the UI atlas via 9-slicing.
  • This was my third feature integration in Unity, and by then, I was also well versed in creating animation key-frames for flows, for example, First Time User Experience (FTUE)

Reflections regarding improvements:

One of the main constraints in this project was scaling for mobile and the smallest screen sizes. My earliest proposal was to have a vertical scroll so that the scene of the tower would be zoomed in to focus only on the current and the next power-up. The advantage is that the zoomed-in version would allow better sizing of UI such as timers, more detailed VFX (for example, bubbling and fuming of the magic potion), as well as the expression changes on the Winged Monkey’s faces.

This image has an empty alt attribute; its file name is Untitled-12-1024x770.png

Contextual scaling for a more immersive experience

The game design and product team also noted that all the new exclusive power-ups hold the main incentive for players to continue attempting levels. However, that could have been covered by dynamic zooming in every time the Main UI is opened from the HUD, especially during the onboarding. The zoomed-in view would have been really helpful to see the rise in potions and unlock states between levels. This alternative was considered a P2 refinement as we had a very limited buffer on our production costing.

Secondly, while wireframing, I kept in mind a clear hierarchy of actions and progressions in the game to make sure there is minimal cognition load on players and that there can be more space left for narrative elements to be present, such as the background, cauldron, and VFX.

However, there were too many elements for a player to notice. It could have been separated out into different states or screens. The main screen holds a lot of UI components for actions as well, along with two progressions.

๐Ÿ SUCCESS

This image has an empty alt attribute; its file name is Untitled-10.png

  • The feature was a huge success and surpassed metrics expectations from the product-goals perspective.
  • In the first month after release in early 2023, a 12% lift in the Average Revenue per User brought a huge shift in the revenue pattern for the game.
  • The Daily active players of our game also saw a significant lift during the feature.
  • Qualitatively, the feature was very well received amongst the audience as it brought across a new story and immersive experience that players were incentivized to participate in by playing more levels.
  • The success of this feature influenced the creation of a similar feature for the Wizard of Oz Slots game as well, which is based on the same fiction.

This image has an empty alt attribute; its file name is Untitled-11-1024x659.png

๐Ÿ’ก FINAL TAKEAWAYS

  • This project was highly ambitious, yet like most game design projects, we did not have the time to research and playtest as much as we wanted to for validation and testing purposes. However, the insight we had from data analysis and telemetry and leading the Customer Insights testing for this team allowed me to gain intrinsic knowledge and understanding of what our players wanted. For example, the delight that certain players showed in highlighting an IP character and strong narrative elements really connected with players apart from just good usability.
  • This is one of my best works, not only because of the scale of success but because I was very much aligned on the product goals and felt confident after many discussions that this is how we will achieve it. Questioning with Whys and debating about what is important and how much led to making sound UI choices.
  • Going the extra mile in refinements, whether it be going back to the wireframes to change flows, reducing the length of onboarding, simplifying game plays, and reducing cognitive loads, were some of the key reasons for delivering a highly polished feature.
  • Overall, all team members ensured we followed a process that allowed all product owners confidence in the success of the game, which also meant we all were given reasonable creative freedom and felt a good sense of ownership to really put our best into this.

Leave a Reply

Your email address will not be published. Required fields are marked *