top of page
1) Feature: Filtering Bundles by Operator
Problem Statement:
As a UI/UX Designer at Ubisoft, I was involved in this complex project that required an extended development phase of six months with a new season launch as a deadline. In order to optimize our filtering system, our team followed the design thinking framework to develop multiple viable solutions.
To begin with, we empathized with our users and gathered research data on their pain points with the current filtering system. Based on our insights, we ideated multiple solutions through divergent thinking and created mock-ups of each concept. We then held feedback rounds with other developers to ensure technical feasibility and refine our ideas further.
Once we had several promising concepts, we moved on to prototyping. We created click dummies that were A/B tested with our target audience to gather feedback and refine our designs. We defined key performance indicators (KPIs) to track the success of our solution and worked closely with our research facility to gather valuable insights that helped us understand user preferences and areas for improvement.
The implementation of this feature happened collaboratively with me as the visual designer responsible for the widget/ component creation and as an advisory role for our UX engineers, to ensure that our documentation is clearly understood by everyone involved.
Throughout the design thinking process, we constantly iterated and refined our solutions based on user feedback and data insights. This collaborative approach allowed us to develop a filtering system that met our users' needs while also aligning with our technical requirements and design aesthetics. By utilizing design thinking, we were able to create a solution that not only improved the user experience, but also positively impacted the financial success of our organization.
One of the frequently requested features from our users is the incorporation of a more advanced filtering system for item bundles in our game. With over 80 playable characters that can be customized, players often tend to have a few preferred operators for customization. This can cause them to feel overwhelmed with the plethora of options we offer.
We identified that the root of the problem was the presentation of the Operator Bundles menu, which displayed bundles related to all operators. Our users expressed a desire for a more efficient and dependable way to filter bundles specific to their favourite operators.
Development Process:
Solution:
.png)
UI/UX Designer for Tom Clancy's Rainbow Six Siege
Company: Ubisoft Blue Byte GmbH
As a UI/UX Designer at Ubisoft, my work revolves around crafting impactful and visually stunning features that align with the overarching aesthetic of Tom Clancy's Rainbow Six: Siege in-game shop. This requires utilizing advanced software tools such as Miro, Figma, and the Adobe Creative Cloud for ideation, wireframing, and prototyping. These tools allow me to create user-centered designs that are intuitive, aesthetically pleasing, and optimized for the user's experience.
In order to achieve this, I spend a significant portion of my day expanding and preserving design patterns and component libraries. This helps me to ensure that the design language and visual components across all features are consistent and maintain a cohesive user experience. Additionally, hosting design sprints and workshops is another essential part of my daily routine. This allows me to work collaboratively with other members of the team, including developers and product managers, to ideate and iterate on potential solutions and design features that will enhance the user experience.
As a UI/UX Designer, I am also responsible for advocating for feature ideas and collaborating cross-functionally to ensure that all aspects of the product are working towards a common goal. This requires me to have a deep understanding of the product vision, as well as the needs and desires of the users. Operating under a Scrum-influenced methodology is another key aspect of my role. This allows me to work in an agile and iterative way, constantly refining and improving the product based on user feedback and business needs.
Furthermore, due to the global presence of our teams, it's essential for me to maintain clear and professional communication with diverse groups in various time zones. This involves collaborating with team members across different regions, working together to ensure that the delivery of high-quality products is seamless and ultimately impacts the financial success of our organization.
The subsequent presentation of my work at Ubisoft solely showcases the final outcomes of our development features. As per the terms of my Non-Disclosure Agreement (NDA), I am prohibited from visually disclosing the full details of my work process. Nevertheless, I have provided a comprehensive description to follow the development process.
2) Feature: Bravo Packs & Tokens
Problem Statement:
In the context of our project, we utilized the design thinking process to develop a new premium loot-box feature that would promote the Premium Battlepass and increase revenue. Our development phase involved several stages, including understanding user needs, ideation, prototyping, and testing.
Our first step was to understand how the new feature should behave and where it should be placed within our menus. We collaborated with our Monetization team to identify the most effective way to promote the Premium Battlepass. After brainstorming and conducting user research, we decided that a new premium loot-box would be the best approach. By allowing players to purchase high-value items from the loot-box using a currency promoted on the Premium Battlepass, we created a strong incentive for players to upgrade to the Premium Battlepass.
We also wanted to ensure that the user experience was consistent with our other loot-boxes. By reusing the same information architecture, we were able to minimize the need for users to relearn a new feature. This made it easier for players to intuitively use the new feature. To further reinforce the value of the premium loot-box, we wanted to add a few new UI elements to make it clear to players that this feature offered high-value rewards.
The next step in our development process was to create wireframes and gather feedback from our project teams. We developed click-prototypes and presentations for the Monetization Team, who were the product owners of this feature. This helped us to refine the design and ensure that it met the needs of all stakeholders.
The Premium Battlepass, which is a paid feature to bind players to our game on a long-term, has encountered a loss of appeal resulting in a decline of purchases made by players. In collaboration with the Monetization team, we endeavored to develop novel features aimed at rekindling player interest and driving renewed purchases of the Premium Battlepass.
The observed goals of this feature have been to expand the Premium Battlepass player base through targeted acquisition campaigns. And lastly, implementing retention initiatives to cultivate loyalty and extend the subscription duration of existing Premium Battlepass players.
Development Process:
Wireframes:
Gallery
Within this gallery, you will discover additional examples of my role as a visual designer within the Rainbow Six franchise throughout 2021 and 2022. My responsibilities as a visual designer encompassed a broad range of tasks, including the design of loot boxes, rebranding of shop categories, creation of item presentations, and motion design. Moreover, my contributions extended beyond these specific tasks, as I worked collaboratively with cross-functional teams to ensure the delivery of compelling visual assets that aligned with the game's branding and user experience objectives.
2021
2022
Finally, we implemented the feature collaboratively, with me also serving as the visual designer responsible for creating the widgets/ components and providing advisory support to our UX engineers. This ensured that our documentation was clear and easily understood by everyone involved in the project.
Overall, our use of design thinking helped us to create a new premium loot-box feature that promoted the Premium Battlepass, increased revenue, and provided a consistent user experience. By following the design thinking process, we were able to develop a feature that met the needs of our users and our business objectives.
Solution:
Prototype Development
During the ideation phase, we created two distinct prototypes based on our existing technology framework. Our aim was to explore the potential of implementing a side modal and a horizontal modal, as both of these functionalities were already incorporated into the game and required minimal technical restructuring. Furthermore, their intuitive design ensured ease of use for players.
We began the development process with basic wireframes and solicited feedback from both our team and the Monetization team. This iterative approach enabled us to refine our ideas and progress to the creation of two high-fidelity prototypes. These prototypes were then tested in an A/B experiment with our research lab to determine their effectiveness.
.png)
Wireframe Side Modal
Wireframe Horizontal Modal
.png)
A/B Testing:
We conducted a user feedback study using click dummies to determine the most suitable version of our modal design. Our participant pool consisted of 21 diverse individuals who are actively engaged in playing our game, each having completed at least one match in the previous week. To eliminate any potential biases, participants were assigned to one of two modal designs and tasked with completing the same set of assignments.
The study involved the observation of participants' interactions with the click dummies and the documentation of their reactions. A brief interview was later conducted to gain further insights into their thoughts.
Our findings indicated that the horizontal modal was the preferred design. The participants found the enhanced navigation and clearer overview, resulting from the additional white space, highly beneficial. While the absence of real-time bundle updates when applying filters was noted as a minor drawback, we addressed this by introducing a small number indicating the total number of filtered bundles in the modal.
In contrast, the side panel design was associated with significant usability issues, as participants struggled to keep track of the operators they filtered and required additional steps to achieve their goals.
In light of these findings, we refined the design and proceeded with production.
Click Dummy Horizontal Modal
Click Dummy Side Modal
.png)
Retrospective
Based on our analytical findings, the implementation of this feature has proven to be highly successful. Our cross-functional team's effective and transparent communication facilitated the exploration of innovative ideas and led to the development of a technically feasible solution. Furthermore, leveraging existing functionality supported by the game allowed us to utilize a substantial portion of our component library, thereby streamlining the development process by at least 5 weeks.
bottom of page