Disney Lorcana

Add a Feature

Role :

UX/UI Designer

Platform :

Mobile App

Tools :

Wireframes, Low Fidelity Screens, High Fidelity Screens, User Testing

Year :

2024

Project Overview

Brief Introduction

Disney Lorcana is a trading card game where people collect cards which features Disney characters. Very similar to Magic: The Gathering or Pokemon. The is relatively new and fairly easier to learn.

The Problem

Without diving into all app features, there are two problems that need to be addressed. Firstly, the catalog section helps players and collectors track their cards, but with 947 cards and more on the way, finding and recording them manually is tedious. Secondly, new, casual, and competitive players go to third party websites for deck building and understanding the meta.

The Solution

The solution is the enhance user experience by introducing features like card image scanning and a dedicated decklist section will reduce reliance on third party websites for deck building and staying updated on the meta.

Research

Competitor Analysis

I explored mobile apps in the trading card game genre and found that two of the most popular during this time of research were Konami's NEURON and Magic: The Gathering Companion. NEURON stood out with its detailed features like card scanning, deck building, and rulings, offering a more extensive experience compared to the others.

User Interview Insights

After talking to Disney Lorcana players, I found that many struggled with deck building, wanted a simpler way to manage their cards. They also really wanted a card scanning feature to quickly check card details. This feedback led me to focus on creating a better deck building tool and a card scanner for the app to make the game experience smoother and more enjoyable.

Deck Building

"TCG players would benefit from the app's deck building and card management features." - Kevin

Scanning Feature

"I was hoping to see options for inputting how many of each card I have and maybe a way to use the camera and scan like the Yu-Gi-Oh Neuron app." - Rob

Tutorial System

"Adding more interactive tutorials and beginner friendly features could enhance the app's usability for newcomers like myself." - Lena

Personas

I developed personas that capture the different types of Disney Lorcana players, focusing on what both competitive and casual gamers need from the mobile app. By getting to know their preferences and playstyles, I aimed to create an app that truly connects with everyone and enhances their overall experience

POV & HMW

I centered the POV and HMW on the challenges players and collectors face, like managing their card collections and searching builds that are relevant to the meta.

POV

Competitive TCG players frequently depend on features such as real time deck testing, YouTube, and various apps and websites to access deck lists and recent tournament standings. This helps them stay informed about the meta and maintain their competitive edge.

POV

TCG collectors and users want easy ways to manage their card collections through features like card scanning, uploading and additional filter options.

HMW

How can we create a user-friendly tool that give access to deck lists from different platforms and tournament standings from different sources?

HMW

How might we improve collection management by allowing users to scan and upload effortlessly?

Ideation Process

User/Task Flows

I created a user flow that outlines the steps a user would take when adding or exploring decks and using the camera feature to scan cards. This flow also simplifies how players can easily explore and modify their deck builds.

Design Process

Low-Fidelity Wireframes

Starting with low-fi wireframes, I focused on the layouts and navigation. I aimed to make it easy for players to find decklists and use the camera feature, all while keeping the layout clean and tasks straightforward.

High-Fidelity Wireframes

After validating the lo-fi structure, I moved on to creating a hi-fi wireframe that mirrored the game’s theme and layout, making sure the app felt cohesive. I also added more tasks, like signing in, exploring decklists, and scanning cards to save to the collection.

Testing & Iterations

Prototype

The final prototype let players interact with the app, guiding them through signing in, exploring decklists, saving and sharing their favorites, and using the camera feature to add cards to their collection.

View Prototype

Usability Test Results

User feedback revealed several recommendations such as adding a share button or a save button instead of using the "+" in the decklists to avoid confusion. They also expressed their appreciation for the camera scan feature as this is something that is not implemented in the app in general.

Success Metrics

Completion Rate : % of participants able to complete the tasks successfully
Error Rate : Number of errors made by users during tasks
Time Completion: Average time taken to complete tasks

Recommendations & Feedback

Users suggested there could be a share button or a button to save rather than the "+" in the decklists
Users like the camera scan feature

Results

100% users completed tasks
80% users tried clicking the other decklists
60% users suggested a share button for the decklists
Average time spent : 38s

Revisions

Based on the feedback I received, I added a save and share deck button to make it easy for everyone to access. I also included a back button so users can return to the previous screen. Additionally, I created a new screen to show the sharing options and made sure to highlight that the deck was saved by labeling it as "saved."

Reflection

Having grown up playing TCGs, the ability to leverage modern technology to enhance user experiences with additional features was satisfying. One of the biggest challenges I encountered was the lack of access to existing design assets, such as fonts, colors, and the overall UI kit. This forced me to recreate many elements from scratch, which was time-consuming but also a valuable learning experience in resourcefulness and adaptability.

Role :

UX/UI Designer

Platform :

Mobile App

Tools :

Style Guide, Wireframes, Logo Design, High Fidelity Screens, User Testing

Year :

2024

Project Overview

Brief Introduction

This project aims to develop a companion app that enhances the gaming experience by providing players with a user friendly platform to manage in game activities. Offering features such as inventory management, store for browsing and purchasing, class and raid guides, and honing your gear!

The Problem

Lost Ark is an amazing game, but it can be a bit overwhelming. The complex system can be tough to navigate, especially without the right tools or guidance. This can lead to frustration and make it harder for players to fully enjoy what the game has to offer.

The Solution

Lost Ark provides a highly useful, user-friendly resource for Lost Ark players. Making the game more accessible and enjoyable by providing guides, inventory management, and tips tailored to Lost Ark's unique gameplay. Whether you're a newcomer or a seasoned player, this project is designed to enhance your experience and help you make the most of your time in and out of the game.

Research

User Interview Insights

After talking to Disney Lorcana players, I found that many struggled with deck building, wanted a simpler way to manage their cards. They also really wanted a card scanning feature to quickly check card details. This feedback led me to focus on creating a better deck building tool and a card scanner for the app to make the game experience smoother and more enjoyable.

Deck Building

"TCG players would benefit from the app's deck building and card management features." - Kevin

Scanning Feature

"I was hoping to see options for inputting how many of each card I have and maybe a way to use the camera and scan like the Yu-Gi-Oh Neuron app." - Rob

Tutorial System

"Adding more interactive tutorials and beginner friendly features could enhance the app's usability for newcomers like myself." - Lena

Competitor Analysis

Personas

I developed personas that capture the different types of Disney Lorcana players, focusing on what both competitive and casual gamers need from the mobile app. By getting to know their preferences and playstyles, I aimed to create an app that truly connects with everyone and enhances their overall experience

POV & HMW

I centered the POV and HMW on the challenges players and collectors face, like managing their card collections and searching builds that are relevant to the meta.

POV

TCG collectors and users want easy ways to manage their card collections through features like card scanning, uploading and additional filter options.

HMW

How can we create a user-friendly tool that give access to deck lists from different platforms and tournament standings from different sources?

HMW

How might we improve collection management by allowing users to scan and upload effortlessly?

Ideation Process

User/Task Flows

I created a user flow that outlines the steps a user would take when adding or exploring decks and using the camera feature to scan cards. This flow also simplifies how players can easily explore and modify their deck builds.

Design Process

Low-Fidelity Wireframes

Starting with low-fi wireframes, I focused on the layouts and navigation. I aimed to make it easy for players to find decklists and use the camera feature, all while keeping the layout clean and tasks straightforward.

High-Fidelity Wireframes

After validating the lo-fi structure, I moved on to creating a hi-fi wireframe that mirrored the game’s theme and layout, making sure the app felt cohesive. I also added more tasks, like signing in, exploring decklists, and scanning cards to save to the collection.

Testing & Iterations

Usability Test Results

User feedback revealed several recommendations such as adding a share button or a save button instead of using the "+" in the decklists to avoid confusion. They also expressed their appreciation for the camera scan feature as this is something that is not implemented in the app in general.

Success Metrics

Completion Rate : % of participants able to complete the tasks successfully
Error Rate : Number of errors made by users during tasks
Time Completion : Average time taken to complete tasks

Recommendations

Users suggested there could be a share button or a button to save rather than the "+" in the decklists
Users like the camera scan feature

Results

100% users completed tasks
80% users tried clicking the other decklists
60% users suggested a share button for the decklists
Average time spent : 38s

Revisions

Based on the feedback I received, I added a save and share deck button to make it easy for everyone to access. I also included a back button so users can return to the previous screen. Additionally, I created a new screen to show the sharing options and made sure to highlight that the deck was saved by labeling it as "saved."

Prototype

The final prototype let players interact with the app, guiding them through signing in, exploring decklists, saving and sharing their favorites, and using the camera feature to add cards to their collection.

View Prototype

Reflection

Looking back on the Lost Ark companion app project, it's been a rewarding experience that combined useful functionality with real player interactions. The goal was to make it more than just a tool, I wanted to make it an app to in game extension. Implementing unique features such as accessing the store, honing equipment, managing inventory, and viewing guides are ways to keep players connected even when they're not actively playing. It has been satisfying to see all of this come together and showcase this project.

Role :

UX/UI Designer

Platform :

Mobile App

Tools :

Style Guide, Wireframes, Logo Design, High Fidelity Screens, User Testing

Year :

2024

Project Overview

Brief Introduction

The Problem

The Solution

Research

User Interview Insights

After talking to Disney Lorcana players, I found that many struggled with deck building, wanted a simpler way to manage their cards. They also really wanted a card scanning feature to quickly check card details. This feedback led me to focus on creating a better deck building tool and a card scanner for the app to make the game experience smoother and more enjoyable.

Deck Building

"TCG players would benefit from the app's deck building and card management features." - Kevin

Scanning Feature

"I was hoping to see options for inputting how many of each card I have and maybe a way to use the camera and scan like the Yu-Gi-Oh Neuron app." - Rob

Tutorial System

"Adding more interactive tutorials and beginner friendly features could enhance the app's usability for newcomers like myself." - Lena

Competitor Analysis

Personas

I developed personas that capture the different types of Disney Lorcana players, focusing on what both competitive and casual gamers need from the mobile app. By getting to know their preferences and playstyles, I aimed to create an app that truly connects with everyone and enhances their overall experience

POV & HMW

I centered the POV and HMW on the challenges players and collectors face, like managing their card collections and searching builds that are relevant to the meta.

POV

TCG collectors and users want easy ways to manage their card collections through features like card scanning, uploading and additional filter options.

HMW

How can we create a user-friendly tool that give access to deck lists from different platforms and tournament standings from different sources?

HMW

How might we improve collection management by allowing users to scan and upload effortlessly?

Ideation Process

User/Task Flows

I created a user flow that outlines the steps a user would take when adding or exploring decks and using the camera feature to scan cards. This flow also simplifies how players can easily explore and modify their deck builds.

Design Process

Low-Fidelity Wireframes

Starting with low-fi wireframes, I focused on the layouts and navigation. I aimed to make it easy for players to find decklists and use the camera feature, all while keeping the layout clean and tasks straightforward.

Low-Fidelity Wireframes

Participants were asked to navigate and locate inventory, guides, and store pages

High-Fidelity Wireframes

After validating the lo-fi structure, I moved on to creating a hi-fi wireframe that mirrored the game’s theme and layout, making sure the app felt cohesive. I also added more tasks, like signing in, exploring decklists, and scanning cards to save to the collection.

Testing & Iterations

Usability Test Results

User feedback revealed several recommendations such as adding a share button or a save button instead of using the "+" in the decklists to avoid confusion. They also expressed their appreciation for the camera scan feature as this is something that is not implemented in the app in general.

Success Metrics

Completion Rate : % of participants able to complete the tasks successfully
Error Rate : Number of errors made by users during tasks
Time Completion : Average time taken to complete tasks

Recommendations

Users suggested there could be a share button or a button to save rather than the "+" in the decklists
Users like the camera scan feature

Results

100% users completed tasks
80% users tried clicking the other decklists
60% users suggested a share button for the decklists
Average time spent : 38s

Revisions

Based on the feedback I received, I added a save and share deck button to make it easy for everyone to access. I also included a back button so users can return to the previous screen. Additionally, I created a new screen to show the sharing options and made sure to highlight that the deck was saved by labeling it as "saved."

Prototype

The final prototype let players interact with the app, guiding them through signing in, exploring decklists, saving and sharing their favorites, and using the camera feature to add cards to their collection.

View Prototype

Reflection

Having grown up playing TCGs, the ability to leverage modern technology to enchance user experiences with additional features was satisfying. One of the biggest challenges I encountered was the lack of access to existing design assets, such as fonts, colors, and the overall UI kit. This forced me to recreate many elements from scratch, which was time-consuming but also a valuable learning experience in resourcefulness and adaptability.

Disney Lorcana

Add a Feature