top
The Nexus Hub
The Nexus Hub
Dedicated socialising platform that helps transform the 'League of Legend' community into a positive environment and reduce the amount of negativity.
Dedicated socialising platform that helps transform the 'League of Legend' community into a positive environment and reduce the amount of negativity.
Dedicated socialising platform that helps transform the 'League of Legend' community into a positive environment and reduce the amount of negativity.
My Role
My Role
During the time frame of 12 weeks as the sole UX researcher and UX/UI designer, I had conducted user research with participants within the community to find out different perspectives and problems, to produce a platform which could satisfy their needs.
During the time frame of 12 weeks as the sole UX researcher and UX/UI designer, I had conducted user research with participants within the community to find out different perspectives and problems, to produce a platform which could satisfy their needs.
Time frame
12 Weeks (Mar 2024 - Jun 2024)
Field of Work
Field of Work
UX/UI Design, Application Design
UX/UI Design, Application Design
Research Method
Research Method
Usability Testing, Design Processes, User Personas,
Usability Testing, Design Processes, User Personas,
Platform
Desktop
Time frame
12 Weeks (Mar 2024 - Jun 2024)
Research Method
Usability Testing, Design Processes, User Personas,
Platform
Desktop
Time frame
12 Weeks (Mar 2024 - Jun 2024)
User Research
User Research
Usability Testing
Usability Testing
User Flow
User Flow
Wireframing
Wireframing
Prototyping
Prototyping
UX/UI Redesign
UX/UI Redesign
Here is a link to a video mock up I have created! (SPOILERS: JUST A MOTION TEMPLATE I HAD FOUND TO USE USED)
Here is a link to a video mock up I have created! (SPOILERS: JUST A MOTION TEMPLATE I HAD FOUND TO USE USED)
Note: You can view the 'Before' and After of the web design here! Please use full screen for a bigger view!
Note: You can view the 'Before' and After of the web design here! Please use full screen for a bigger view!
Note: You can view the 'Before' and After of the web design here!
Please use full screen for a bigger view!
Project Overview
Project Overview
Project Overview
League of Legends is a team-based game where two teams of five aim to destroy each other's base, choosing from over 140 champions. The diverse community includes players, fans, and esports enthusiasts. Riot Games organizes events and competitions, and the community is known for fan art, cosplay, memes, and discussions on strategies and updates.
League of Legends is a team-based game where two teams of five aim to destroy each other's base, choosing from over 140 champions. The diverse community includes players, fans, and esports enthusiasts. Riot Games organizes events and competitions, and the community is known for fan art, cosplay, memes, and discussions on strategies and updates.
League of Legends is a team-based game where two teams of five aim to destroy each other's base, choosing from over 140 champions. The diverse community includes players, fans, and esports enthusiasts. Riot Games organizes events and competitions, and the community is known for fan art, cosplay, memes, and discussions on strategies and updates.
So what is the problem within the 'League of Legends' community?
So what is the problem within the 'League of Legends' community?
Currently within the community, there are still problems that has not been address yet, causing socialisation between individuals to be difficult, making it harder for players to enjoy the overall experience within the game and the community.
Currently within the community, there are still problems that has not been address yet, causing socialisation between individuals to be difficult, making it harder for players to enjoy the overall experience within the game and the community.
What do I want to achieve out of this project?
What do I want to achieve out of this project?
Positive Community Environment
To design a platform where league known as one of the most 'toxic' game environment, can move into the direction of a positive community.
Positive Community Environment
To design a platform where league known as one of the most 'toxic' game environment, can move into the direction of a positive community.
Positive Community Environment
To design a platform where league known as one of the most 'toxic' game environment, can move into the direction of a positive community.
Reduced Confirmation of Bias Reinforcement
To help reduce the belief of bias reinforcement so that beginners or league enthusiasts can have a chance to learn more varieties of gameplay with the motivation to becoming a better player.
Reduced Confirmation of Bias Reinforcement
To help reduce the belief of bias reinforcement so that beginners or league enthusiasts can have a chance to learn more varieties of gameplay with the motivation to becoming a better player.
Problems that I have encountered
Problems that I have encountered
Problems that I have encountered
1
Toxic Behaviour and Negative Attitude
The behaviour of toxicity within the league community can negatively impact the experience of players, leading to the discouragement of new players from joining or continuing to get involved with the community.
Toxic Behaviour and Negative Attitude
The behaviour of toxicity within the league community can negatively impact the experience of players, leading to the discouragement of new players from joining or continuing to get involved with the community.
2
Online disinhibition effect
The anonymity in League of Legends can lead to the online disinhibition effect, causing impulsive or inappropriate behaviour that negatively impacts social interactions.
Online disinhibition effect
The anonymity in League of Legends can lead to the online disinhibition effect, causing impulsive or inappropriate behaviour that negatively impacts social interactions.
3
Lack of Inclusivity
Certain groups facing discrimination or marginalization based on factors such as Gender, race, ethnicity, or sexual orientation.
Lack of Inclusivity
Certain groups facing discrimination or marginalization based on factors such as Gender, race, ethnicity, or sexual orientation.
4
Reinforcement of Biases (Filter Bubble)
Players exposed to biased or one-sided information about game mechanics, and strategies, limits information user see on internet.
Reinforcement of Biases (Filter Bubble)
Players exposed to biased or one-sided information about game mechanics, and strategies, limits information user see on internet.
So I asked myself…..
So I asked myself…..
How might we reduce these issues to foster a more inclusive and positive community environment?
How might we reduce these issues to foster a more inclusive and positive community environment?
To Capture the Essence of the Community . . .
To Capture the Essence of the Community . . .
To Capture the Essence of the Community . . .
I have conducted several interviews with people who are either knowledgeable about the game or involved with the community. Below are questions I had asked to get a better understanding were:
I have conducted several interviews with people who are either knowledgeable about the game or involved with the community. Below are questions I had asked to get a better understanding were:
1
Introduction and Icebreaker questions
What is something that you really look forward to everyday?
If there was one thing you could do in your life, what would it be?
What was your dream job back when you were a kid?
2
General Questions
Do you like to play video games or get involved with them online or offline?
What is your hobby and background?
What social media platforms do you use often?
3
Activity, Task and Action Questions
What is one activity you often do besides playing? Is this out of habit/casual or is this to be more competitive?
If you were helping a friend to learn about League, what options would you consider to encourage reading news updates and learning new information?
What is something you would add in to help prevent toxicity inflicted onto members of the community outside or inside of the game?
As someone who has played experienced toxicity in a game at least once, what were some things you did to prevent them to from stopping your experience of having fun in league?
4
Context Questions
As league is considered a really old but fun game to play in today's gaming society, do you yourself play the game?
How many hours do you usually play the game a week?
As someone who likes to play league, how often do you get involved with the league community on social media (Reddit, Twitter Etc?
IF a lot, then what are some things that really interests you to do or get involved with the community?
IF sometimes, then what is one thing that really interests you to get involved?
IF not so much, then what is one thing that you would be interested in to get you more involvement?
4
Context Questions
Do you have any connections with the league of legends community outside of online forums and groups?
What is one aspect of the league community that you like or dislike and why?
What aspects do you think makes up a casual and a competitive play?
As a league player, do you like to play casually or competitive or a bit of both?
What is the differences between a casual player and a competitive player?
5
Explorative / Speculative
If there was only one activity you could do besides playing, what would you choose?
If there was one decision or event that could help to grow the league community in the future to be bigger than it is currently, what do you think it is?
Besides playing, what aspect of the community is keeping it alive and popular to this very day and why?
6
Warm Up
End off with a Thank you
Ask how they find that interview - Was it difficult or easy to easy?
How relatable did they find all these questions?
1
Introduction and Icebreaker questions
What is something that you really look forward to everyday?
If there was one thing you could do in your life, what would it be?
What was your dream job back when you were a kid?
2
General Questions
Do you like to play video games or get involved with them online or offline?
What is your hobby and background?
What social media platforms do you use often?
3
Activity, Task and Action Questions
What is one activity you often do besides playing? Is this out of habit/casual or is this to be more competitive?
If you were helping a friend to learn about League, what options would you consider to encourage reading news updates and learning new information?
What is something you would add in to help prevent toxicity inflicted onto members of the community outside or inside of the game?
As someone who has played experienced toxicity in a game at least once, what were some things you did to prevent them to from stopping your experience of having fun in league?
4
Context Questions
As league is considered a really old but fun game to play in today's gaming society, do you yourself play the game?
How many hours do you usually play the game a week?
As someone who likes to play league, how often do you get involved with the league community on social media (Reddit, Twitter Etc?
IF a lot, then what are some things that really interests you to do or get involved with the community?
IF sometimes, then what is one thing that really interests you to get involved?
IF not so much, then what is one thing that you would be interested in to get you more involvement?
4
Context Questions
Do you have any connections with the league of legends community outside of online forums and groups?
What is one aspect of the league community that you like or dislike and why?
What aspects do you think makes up a casual and a competitive play?
As a league player, do you like to play casually or competitive or a bit of both?
What is the differences between a casual player and a competitive player?
5
Explorative / Speculative
If there was only one activity you could do besides playing, what would you choose?
If there was one decision or event that could help to grow the league community in the future to be bigger than it is currently, what do you think it is?
Besides playing, what aspect of the community is keeping it alive and popular to this very day and why?
6
Warm Up
End off with a Thank you
Ask how they find that interview - Was it difficult or easy to easy?
How relatable did they find all these questions?
1
Introduction and Icebreaker questions
What is something that you really look forward to everyday?
If there was one thing you could do in your life, what would it be?
What was your dream job back when you were a kid?
2
General Questions
Do you like to play video games or get involved with them online or offline?
What is your hobby and background?
What social media platforms do you use often?
3
Activity, Task and Action Questions
What is one activity you often do besides playing? Is this out of habit/casual or is this to be more competitive?
If you were helping a friend to learn about League, what options would you consider to encourage reading news updates and learning new information?
What is something you would add in to help prevent toxicity inflicted onto members of the community outside or inside of the game?
As someone who has played experienced toxicity in a game at least once, what were some things you did to prevent them to from stopping your experience of having fun in league?
4
Context Questions
As league is considered a really old but fun game to play in today's gaming society, do you yourself play the game?
How many hours do you usually play the game a week?
As someone who likes to play league, how often do you get involved with the league community on social media (Reddit, Twitter Etc?
IF a lot, then what are some things that really interests you to do or get involved with the community?
IF sometimes, then what is one thing that really interests you to get involved?
IF not so much, then what is one thing that you would be interested in to get you more involvement?
Do you have any connections with the league of legends community outside of online forums and groups?
What is one aspect of the league community that you like or dislike and why?
What aspects do you think makes up a casual and a competitive play?
As a league player, do you like to play casually or competitive or a bit of both?
What is the differences between a casual player and a competitive player?
5
Explorative / Speculative
If there was only one activity you could do besides playing, what would you choose?
If there was one decision or event that could help to grow the league community in the future to be bigger than it is currently, what do you think it is?
Besides playing, what aspect of the community is keeping it alive and popular to this very day and why?
6
Warm Up
End off with a Thank you
Ask how they find that interview - Was it difficult or easy to easy?
How relatable did they find all these questions?
1
Introduction and Icebreaker questions
What is something that you really look forward to everyday?
If there was one thing you could do in your life, what would it be?
What was your dream job back when you were a kid?
2
General Questions
Do you like to play video games or get involved with them online or offline?
What is your hobby and background?
What social media platforms do you use often?
3
Activity, Task and Action Questions
What is one activity you often do besides playing? Is this out of habit/casual or is this to be more competitive?
If you were helping a friend to learn about League, what options would you consider to encourage reading news updates and learning new information?
What is something you would add in to help prevent toxicity inflicted onto members of the community outside or inside of the game?
As someone who has played experienced toxicity in a game at least once, what were some things you did to prevent them to from stopping your experience of having fun in league?
4
Context Questions
As league is considered a really old but fun game to play in today's gaming society, do you yourself play the game?
How many hours do you usually play the game a week?
As someone who likes to play league, how often do you get involved with the league community on social media (Reddit, Twitter Etc?
IF a lot, then what are some things that really interests you to do or get involved with the community?
IF sometimes, then what is one thing that really interests you to get involved?
IF not so much, then what is one thing that you would be interested in to get you more involvement?
Do you have any connections with the league of legends community outside of online forums and groups?
What is one aspect of the league community that you like or dislike and why?
What aspects do you think makes up a casual and a competitive play?
As a league player, do you like to play casually or competitive or a bit of both?
What is the differences between a casual player and a competitive player?
5
Explorative / Speculative
If there was only one activity you could do besides playing, what would you choose?
If there was one decision or event that could help to grow the league community in the future to be bigger than it is currently, what do you think it is?
Besides playing, what aspect of the community is keeping it alive and popular to this very day and why?
6
Warm Up
End off with a Thank you
Ask how they find that interview - Was it difficult or easy to easy?
How relatable did they find all these questions?
1
Introduction and Icebreaker questions
What is something that you really look forward to everyday?
If there was one thing you could do in your life, what would it be?
What was your dream job back when you were a kid?
2
General Questions
Do you like to play video games or get involved with them online or offline?
What is your hobby and background?
What social media platforms do you use often?
3
Activity, Task and Action Questions
What is one activity you often do besides playing? Is this out of habit/casual or is this to be more competitive?
If you were helping a friend to learn about League, what options would you consider to encourage reading news updates and learning new information?
What is something you would add in to help prevent toxicity inflicted onto members of the community outside or inside of the game?
As someone who has played experienced toxicity in a game at least once, what were some things you did to prevent them to from stopping your experience of having fun in league?
4
Context Questions
As league is considered a really old but fun game to play in today's gaming society, do you yourself play the game?
How many hours do you usually play the game a week?
As someone who likes to play league, how often do you get involved with the league community on social media (Reddit, Twitter Etc?
IF a lot, then what are some things that really interests you to do or get involved with the community?
IF sometimes, then what is one thing that really interests you to get involved?
IF not so much, then what is one thing that you would be interested in to get you more involvement?
Do you have any connections with the league of legends community outside of online forums and groups?
What is one aspect of the league community that you like or dislike and why?
What aspects do you think makes up a casual and a competitive play?
As a league player, do you like to play casually or competitive or a bit of both?
What is the differences between a casual player and a competitive player?
5
Explorative / Speculative
If there was only one activity you could do besides playing, what would you choose?
If there was one decision or event that could help to grow the league community in the future to be bigger than it is currently, what do you think it is?
Besides playing, what aspect of the community is keeping it alive and popular to this very day and why?
6
Warm Up
End off with a Thank you
Ask how they find that interview - Was it difficult or easy to easy?
How relatable did they find all these questions?
Note: These are some questions from each of my research methods I conducted to gain results from users!
Note: These are some questions from each of my research methods I conducted to gain results from users!
Note: These are some questions from each of my research methods I conducted
to gain results from users!
After obtaining the responses within the interviews in relation to my community problems, I have then organised some of the following answers into a measurable chart that will be able to help define my audience better.
After obtaining the responses within the interviews in relation to my community problems, I have then organised some of the following answers into a measurable chart that will be able to help define my audience better.
A Closer Look at Additional Research Strategies
A Closer Look at Additional Research Strategies
Having done a considerable amount of interviews with people within the community to view their opinions from their own perspective, I then used the results gained to produce some user personas. I have also completed some additional research sprints and secondary research that not only will help me in better understanding the community even further but also the users' behaviours and their actions.
Having done a considerable amount of interviews with people within the community to view their opinions from their own perspective, I then used the results gained to produce some user personas. I have also completed some additional research sprints and secondary research that not only will help me in better understanding the community even further but also the users' behaviours and their actions.
Max Lizama
Like to use often:
About
A 20-year-old student who plays League of Legends casually.
Behaviour
Plays League to improve skills and reach higher levels.
Values teamwork, relies on friends' support and positivity to cope with negativity.
Task
Improve League skills.
Find positive networks for mental health support.
Frustrations
Mentally disheartened by toxicity but remains resilient.
Seeks a supportive environment for better mental health.
Feelings
Frustrated by toxicity but
stays determined.
Positive teammates help foster a sense of a healthier community.
Needs
Resilience to endure game toxicity.
Positive community improvements.
A comfortable, enjoyable environment for all players.
Kevin Nguyen
Like to use often:
About
A 17-year-old League player feeling excluded due to lack of inclusivity.
Behaviour
Plays League to improve skills and reach higher levels.
Values teamwork, relies on friends' support and positivity to cope with negativity.
Task
Improve League skills.
Find positive networks for mental health support.
Frustrations
Disheartened by discrimination and exclusion.
Discouraged by lack of awareness about diversity.
Feelings
Frustrated by discrimination but continue to endures.
Positive teammates foster a healthier community.
Needs
Sense of community belonging.
Connect with others aligning interests.
Promote inclusivity and diversity.
Max Lizama
Like to use often:
About
A 20-year-old student who plays League of Legends casually.
Behaviour
Plays League to improve skills and reach higher levels.
Values teamwork, relies on friends' support and positivity to cope with negativity.
Task
Improve League skills.
Find positive networks for mental health support.
Frustrations
Mentally disheartened by toxicity but remains resilient.
Seeks a supportive environment for better mental health.
Feelings
Frustrated by toxicity but
stays determined.
Positive teammates help foster a sense of a healthier community.
Needs
Resilience to endure game toxicity.
Positive community improvements.
A comfortable, enjoyable environment for all players.
Kevin Nguyen
Like to use often:
About
A 17-year-old League player feeling excluded due to lack of inclusivity.
Behaviour
Plays League to improve skills and reach higher levels.
Values teamwork, relies on friends' support and positivity to cope with negativity.
Task
Improve League skills.
Find positive networks for mental health support.
Frustrations
Disheartened by discrimination and exclusion.
Discouraged by lack of awareness about diversity.
Feelings
Frustrated by discrimination but continue to endures.
Positive teammates foster a healthier community.
Needs
Sense of community belonging.
Connect with others aligning interests.
Promote inclusivity and diversity.
Max Lizama
Like to use often:
About
A 20-year-old student who plays League of Legends casually.
Behaviour
Plays League to improve skills and reach higher levels.
Values teamwork, relies on friends' support and positivity to cope with negativity.
Frustrations
Mentally disheartened by toxicity but remains resilient.
Seeks a supportive environment for
better mental health.
Feelings
Frustrated by toxicity but
stays determined.
Positive teammates help foster a sense of a healthier community.
Needs
Resilience to endure game toxicity.
Positive community improvements.
A comfortable, enjoyable environment
for all players.
Task
Improve League skills.
Find positive networks for mental health support.
Kevin Nguyen
Like to use often:
About
A 17-year-old League player feeling excluded due to lack of inclusivity.
Behaviour
Seeks inclusive, diverse League communities.
Engages in high-energy conversations about inclusivity.
Frustrations
Disheartened by discrimination and exclusion.
Discouraged by lack of awareness about diversity.
Feelings
Frustrated by discrimination but continue to endures.
Positive teammates foster a healthier community.
Needs
Sense of community belonging.
Connect with others aligning interests.
Promote inclusivity and diversity.
Task
Improve League skills.
Find positive networks for mental health support.
Empathy Map
This empathy map is to help me understand what you currently do and don't know about the people within your chosen community.
Context Map
This context map is here to help me consider what you do and don't know about the users in the community
Statistic Summary
This statistic summary is here to help me to gauge the different kind of activities users like to get involved in within the community.
Framing Problem Statements
I wanted to look more into who the users are, their needs and some insights I have gotten back from my interview with my participants. Therefore I decided to do further research, one mainly from each of the problems of toxicity/negative interactions, lack of inclusivity and filter bubble.
Max
Wants to look for ways to positively improve the community
Having done a considerable amount of interviews with people within the community to view their opinions from their own perspective, I then used the results gained to produce some user personas. I have also completed some additional research sprints and secondary research that not only will help me in better understanding the community even further but also the users' behaviours and their actions.
Max wants to be able to look for any possible ways that can help improve the community positively so that he can help players who are experiencing damage to their mental health while enduring a period of toxicity.
How might we be able to create ways that players can positively improve the community?
How might we be able to prevent the damages that toxicity have on players' mental health?
Kevin
Wants to feel a sense of belonging within the community.
Being able to recognise the user needs to feel a sense of belonging and inclusivity within the community is crucial. The lack of inclusivity goes beyond what is shown in gameplay but also reaches the concept of connection between other players as well. As far as my research shows, there needs to be a set of protection that will help defend these players from being discriminated from the community.
Kevin wants to feel a sense of belonging within not only the game but also in the community as he has been feeling a lack of inclusivity during his time with the community.
How might we be able to provide a place of belonging for players who are feeling this way?
How might we be able to turn that lack of inclusivity into something they can take advantage of in a positive direction?
Tec
To be able to break out of his filter bubble.
The user has mentioned that they want to be able to break out of their filter bubble so that they are able to learn more about the game however does not have any sense of encouragement or reason to do so, resulting in being hesitant to break out.
Zii wants to be able to break out of his filter bubble so that he can continue to keep improving to be a better player in the game.
How might we be able to provide encouragement to players to break out of their filter bubble?
How might we be able to help them become a better player in the future?
Testing Problems - Ask Why
Having explored further into my user problems through user stories, ‘How might we’, and problem statements, I then started exploring whether I have defined the problems so that not only can I solve the problems to an accurate degree but also help me with expanding my ideas of visually creating the solution.
Problem
Max wants to be able to look for any possible ways that can help improve the community positively so that he can help players who are experiencing damage to their mental health while enduring a period of toxicity.
Kevin wants to feel a sense of belonging within not only the game but also in the community as he has been feeling a lack of inclusivity during his time with the community.
Tec wants to be able to break out of his filter bubble so that he can continue to keep improving to be a better player in the game.
Why #1
It is a problem because without any ways of positive improvement, the game won't continue to be fun for the players to enjoy but rather a place of negative and toxic behaviour.
It is a problem because without a sense of belonging not only within the game but also in the community, he will feel alone and excluded.
It is a problem without keeping up to date with patch notes, buffs and nerfs, he will find it very difficult to keep improving to be a better player.
Why #2
This is true because since there is currently no way for to game to be improve in a positive direction, this will also affect the community as well in terms of impulsive behaviours.
This is true because, by prioritising diversity and fostering a feeling of belonging, the community can provide a more pleasant and satisfying experience for Gabriel and its members.
This is true because due to the game and character stats getting updated often, he might find the character he really like to use not being good anymore and will lose more often than winning.
When
This can happen at anytime when interacting with the community including playing matches, getting involved in forums or chatting online in a live group.
This can happen at any time when feeling the desire to get involved with the community or wanting to have someone who he can talk to that can understand him in terms of terminology used.
This can happen maybe every week to a fortnight as most game updates happen during this time.
How Often
This depends on how often it happens but as the community is mostly filled with toxic players, the chances of happening is mostly often.
This depends on how much he likes to get involved with the community whether if being a really talkative and passionate person, or someone who likes getting involved a lot.
This depends on how often he likes to play the game and how many characters he likes to play as different champions has different stats and abilities.
How Severe
As to how severe this problem may be, this could very well be a large problem which concerns not only current players but new players who thinks the game is cool and wants to get involved with the community.
As to how severe this problem could be, it be a large problem depending on whether his desire to feel a sense of belonging has been indirectly rejected so many times to the point that it may cause problems.
The severity could be a medium problem based on how much he desires to be a better player and whether he is willing to learn more than sticking with the belief outdated patch notes.
Empathy Map
This empathy map is to help me understand what you currently do and don't know about the people within your chosen community.
Context Map
This context map is here to help me consider what you do and don't know about the users in the community
Statistic Summary
This statistic summary is here to help me to gauge the different kind of activities users like to get involved in within the community.
Framing Problem Statements
I wanted to look more into who the users are, their needs and some insights I have gotten back from my interview with my participants. Therefore I decided to do further research, one mainly from each of the problems of toxicity/negative interactions, lack of inclusivity and filter bubble.
Testing Problems - Ask Why
Having explored further into my user problems through user stories, ‘How might we’, and problem statements, I then started exploring whether I have defined the problems so that not only can I solve the problems to an accurate degree but also help me with expanding my ideas of visually creating the solution.
Empathy Map
This empathy map is to help me understand what you currently do and don't know about the people within your chosen community.
Context Map
This context map is here to help me consider what you do and don't know about the users in the community
Statistic Summary
This statistic summary is here to help me to gauge the different kind of activities users like to get involved in within the community.
Framing Problem Statements
I wanted to look more into who the users are, their needs and some insights I have gotten back from my interview with my participants. Therefore I decided to do further research, one mainly from each of the problems of toxicity/negative interactions, lack of inclusivity and filter bubble.
Testing Problems - Ask Why
Having explored further into my user problems through user stories, ‘How might we’, and problem statements, I then started exploring whether I have defined the problems so that not only can I solve the problems to an accurate degree but also help me with expanding my ideas of visually creating the solution.
Note: These are some of the extra research I have conducted to learn more about my users!
Max Lizama
Like to use often:
About
A 20-year-old student who plays League of Legends casually.
Task
Improve League skills.
Find positive networks for mental health support.
Frustrations
Mentally disheartened by toxicity but remains resilient.
Seeks a supportive environment for better mental health.
Feelings
Frustrated by toxicity but
stays determined.
Positive teammates help foster a sense of a healthier community.
Needs
Resilience to endure game toxicity.
Positive community improvements.
A comfortable, enjoyable environment
for all players.
Behaviour
Plays League to improve skills and reach higher levels.
Values teamwork, relies on friends' support and positivity to cope with negativity.
Kevin Nguyen
Like to use often:
About
A 17-year-old League player feeling excluded due to lack of inclusivity.
Task
Improve League skills.
Find positive networks for mental health support.
Frustrations
Disheartened by discrimination and exclusion.
Discouraged by lack of awareness about diversity.
Feelings
Frustrated by discrimination but continue to endures.
Positive teammates foster a healthier community.
Needs
Sense of community belonging.
Connect with others aligning interests.
Promote inclusivity and diversity.
Behaviour
Seeks inclusive, diverse League communities.
Engages in high-energy conversations about inclusivity.
Max Lizama
Like to use often:
About
A 20-year-old student who plays League of Legends casually.
Task
Improve League skills.
Find positive networks for mental health support.
Frustrations
Mentally disheartened by toxicity but remains resilient.
Seeks a supportive environment for better mental health.
Feelings
Frustrated by toxicity but
stays determined.
Positive teammates help foster a sense of a healthier community.
Needs
Resilience to endure game toxicity.
Positive community improvements.
A comfortable, enjoyable environment
for all players.
Behaviour
Plays League to improve skills and reach higher levels.
Values teamwork, relies on friends' support and positivity to cope with negativity.
Kevin Nguyen
Like to use often:
About
A 17-year-old League player feeling excluded due to lack of inclusivity.
Task
Improve League skills.
Find positive networks for mental health support.
Frustrations
Disheartened by discrimination and exclusion.
Discouraged by lack of awareness about diversity.
Feelings
Frustrated by discrimination but continue to endures.
Positive teammates foster a healthier community.
Needs
Sense of community belonging.
Connect with others aligning interests.
Promote inclusivity and diversity.
Behaviour
Seeks inclusive, diverse League communities.
Engages in high-energy conversations about inclusivity.
Empathy Map
This empathy map is to help me understand what you currently do and don't know about the people within your chosen community.
Context Map
This context map is here to help me consider what you do and don't know about the users in the community
Statistic Summary
This statistic summary is here to help me to gauge the different kind of activities users like to get involved in within the community.
Framing Problem Statements
I wanted to look more into who the users are, their needs and some insights I have gotten back from my interview with my participants. Therefore I decided to do further research, one mainly from each of the problems of toxicity/negative interactions, lack of inclusivity and filter bubble.
Testing Problems - Ask Why
Having explored further into my user problems through user stories, ‘How might we’, and problem statements, I then started exploring whether I have defined the problems so that not only can I solve the problems to an accurate degree but also help me with expanding my ideas of visually creating the solution.
Empathy Map
This empathy map is to help me understand what you currently do and don't know about the people within your chosen community.
Context Map
This context map is here to help me consider what you do and don't know about the users in the community
Statistic Summary
This statistic summary is here to help me to gauge the different kind of activities users like to get involved in within the community.
Framing Problem Statements
I wanted to look more into who the users are, their needs and some insights I have gotten back from my interview with my participants. Therefore I decided to do further research, one mainly from each of the problems of toxicity/negative interactions, lack of inclusivity and filter bubble.
Testing Problems - Ask Why
Having explored further into my user problems through user stories, ‘How might we’, and problem statements, I then started exploring whether I have defined the problems so that not only can I solve the problems to an accurate degree but also help me with expanding my ideas of visually creating the solution.
Let the Fun Design Process Begin
Let the Fun Design Process Begin
Let the Fun Design Process Begin
Now that all the research has been completed in trying to understand the community and its individuals within, I then did sketches using the results to produce some wireframes. This would help me to get a more general idea of what the design could potentially look like.
Now that all the research has been completed in trying to understand the community and its individuals within, I then did sketches using the results to produce some wireframes. This would help me to get a more general idea of what the design could potentially look like.
Nexus Hub Homepage
This dashboard design aims to create a modern, aesthetic platform that encourages users to engage with various activities, including live stream matches, reading game guides, and participating in community forums.
Livestream Interface
This sketch represents my vision for the interface of live-streaming esports matches:
Main video streaming platform
Video navigation bar similar to YouTube and Twitch
Toggleable sidebar displaying the chatbox or match timestamps
Live Chatbox
This sketch shows an expanded interface for the chatbox, featuring tabs for detailed views of the chat and timestamps.
Users can also send League-related emojis and stickers to enrich the chat experience.
Team Builds
In this sketch design, I've created an expanded interface displaying characters from both teams, along with their chosen builds and stats.
This setup allows for discussion in the chatbox among viewers.
Personalised Layout
This sketch was a design that I thought the interface could look like as I drew up examples of users being able to personalised the layout of their interface similarly to LOLEsports.
Nexus Hub Homepage
This dashboard design aims to create a modern, aesthetic platform that encourages users to engage with various activities, including live stream matches, reading game guides, and participating in community forums.
Livestream Interface
This sketch represents my vision for the interface of live-streaming esports matches:
Main video streaming platform
Video navigation bar similar to YouTube and Twitch
Toggleable sidebar displaying the chatbox or match timestamps
Live Chatbox
This sketch shows an expanded interface for the chatbox, featuring tabs for detailed views of the chat and timestamps.
Users can also send League-related emojis and stickers to enrich the chat experience.
Team Builds
In this sketch design, I've created an expanded interface displaying characters from both teams, along with their chosen builds and stats.
This setup allows for discussion in the chatbox among viewers.
Personalised Layout
This sketch was a design that I thought the interface could look like as I drew up examples of users being able to personalised the layout of their interface similarly to LOLEsports.
Nexus Hub Homepage
This dashboard design aims to create a modern, aesthetic platform that encourages users to engage with various activities, including live stream matches, reading game guides, and participating in community forums.
Livestream Interface
This sketch represents my vision for the interface of live-streaming esports matches:
Main video streaming platform
Video navigation bar similar to YouTube and Twitch
Toggleable sidebar displaying the chatbox or match timestamps
Live Chatbox
This sketch shows an expanded interface for the chatbox, featuring tabs for detailed views of the chat and timestamps.
Users can also send League-related emojis and stickers to enrich the chat experience.
Team Builds
In this sketch design, I've created an expanded interface displaying characters from both teams, along with their chosen builds and stats.
This setup allows for discussion in the chatbox among viewers.
Personalised Layout
This sketch was a design that I thought the interface could look like as I drew up examples of users being able to personalised the layout of their interface similarly to LOLEsports.
Nexus Hub Homepage
This dashboard design aims to create a modern, aesthetic platform that encourages users to engage with various activities, including live stream matches, reading game guides, and participating in community forums.
Livestream Interface
This sketch represents my vision for the interface of live-streaming esports matches:
Main video streaming platform
Video navigation bar similar to YouTube and Twitch
Toggleable sidebar displaying the chatbox or match timestamps
Live Chatbox
This sketch shows an expanded interface for the chatbox, featuring tabs for detailed views of the chat and timestamps.
Users can also send League-related emojis and stickers to enrich the chat experience.
Team Builds
In this sketch design, I've created an expanded interface displaying characters from both teams, along with their chosen builds and stats.
This setup allows for discussion in the chatbox among viewers.
Personalised Layout
This sketch was a design that I thought the interface could look like as I drew up examples of users being able to personalised the layout of their interface similarly to LOLEsports.
Nexus Hub Homepage
This dashboard design aims to create a modern, aesthetic platform that encourages users to engage with various activities, including live stream matches, reading game guides, and participating in community forums.
Livestream Interface
This sketch represents my vision for the interface of live-streaming esports matches:
Main video streaming platform
Video navigation bar similar to YouTube and Twitch
Toggleable sidebar displaying the chatbox or match timestamps
Live Chatbox
This sketch shows an expanded interface for the chatbox, featuring tabs for detailed views of the chat and timestamps.
Users can also send League-related emojis and stickers to enrich the chat experience.
Team Builds
In this sketch design, I've created an expanded interface displaying characters from both teams, along with their chosen builds and stats.
This setup allows for discussion in the chatbox among viewers.
Personalised Layout
This sketch was a design that I thought the interface could look like as I drew up examples of users being able to personalised the layout of their interface similarly to LOLEsports.
Constructing our User Flow
Constructing our User Flow
After having figured out what are some potential features I wanted to implement into my solution, I then created a simple user flow diagram that helps to map out the directions I want to build my solution.
After having figured out what are some potential features I wanted to implement into my solution, I then created a simple user flow diagram that helps to map out the directions I want to build my solution.
A Style Guide is Essential for Effective UI Design
A Style Guide is Essential for Effective UI Design
For the style guide, I have chosen to use similar colour palettes that is currently being used within the game itself as the colours are what defined the community itself.
For the style guide, I have chosen to use similar colour palettes that is currently being used within the game itself as the colours are what defined the community itself.
Here are the final designs
Here are the final designs
Here are the final designs
After creating the style guide and user flow along with following my sketches as a guideline, I was able to create the final high fidelity design of the Nexus Hub platform which will help to solve the current problems that are within the league community.
After creating the style guide and user flow along with following my sketches as a guideline, I was able to create the final high fidelity design of the Nexus Hub platform which will help to solve the current problems that are within the league community.
Nexus Hub Home Page
Here I have created a homepage of the Nexus Hub which displays the livestream match, different tabs relating to the current match and on the right with a schedule of upcoming matches.
I have also added in a expanded version of the left side bar so that users that may have accessibility problems will also be able to use the navigation bar easier.
Nexus Hub Home Page
Here I have created a homepage of the Nexus Hub which displays the livestream match, different tabs relating to the current match and on the right with a schedule of upcoming matches.
I have also added in a expanded version of the left side bar so that users that may have accessibility problems will also be able to use the navigation bar easier.
Nexus Hub Recent News
On the left image shows the recent news that can be accessed on the side navigation bar.
Users can click into one of those news article to view current events or news that is happening leading to a more detailed news article on the right image.
Nexus Hub Recent News
On the left image shows the recent news that can be accessed on the side navigation bar.
Users can click into one of those news article to view current events or news that is happening leading to a more detailed news article on the right image.
Nexus Hub Character Wikipedia
On the left image shows a list of current characters within the game and users who wants to learn more about the game can access this page within the platform.
This gives them a variety of knowledge to learn and to leave their reinforcement bias behind them.
Nexus Hub Character Wikipedia
On the left image shows a list of current characters within the game and users who wants to learn more about the game can access this page within the platform.
This gives them a variety of knowledge to learn and to leave their reinforcement bias behind them.
Nexus Hub Communities
On the left image shows a list of communities that a user can join and through this, they will be able to socialise with other existing users on the platform within the community.
The leader board design shown on the right image also gives a user their collection of contribution points and these points can be earned through being helpful within the community or doing something positive for others.
View More
Nexus Hub Communities
On the left image shows a list of communities that a user can join and through this, they will be able to socialise with other existing users on the platform within the community.
The leader board design shown on the right image also gives a user their collection of contribution points and these points can be earned through being helpful within the community or doing something positive for others.
View More
Nexus Hub Home Page
Here I have created a homepage of the Nexus Hub which displays the livestream match, different tabs relating to the current match and on the right with a schedule of upcoming matches.
I have also added in a expanded version of the left side bar so that users that may have accessibility problems will also be able to use the navigation bar easier.
Nexus Hub Home Page
Here I have created a homepage of the Nexus Hub which displays the livestream match, different tabs relating to the current match and on the right with a schedule of upcoming matches.
I have also added in a expanded version of the left side bar so that users that may have accessibility problems will also be able to use the navigation bar easier.
Nexus Hub Recent News
On the left image shows the recent news that can be accessed on the side navigation bar.
Users can click into one of those news article to view current events or news that is happening leading to a more detailed news article on the right image.
Nexus Hub Recent News
On the left image shows the recent news that can be accessed on the side navigation bar.
Users can click into one of those news article to view current events or news that is happening leading to a more detailed news article on the right image.
Nexus Hub Character Wikipedia
On the left image shows a list of current characters within the game and users who wants to learn more about the game can access this page within the platform.
This gives them a variety of knowledge to learn and to leave their reinforcement bias behind them.
Nexus Hub Character Wikipedia
On the left image shows a list of current characters within the game and users who wants to learn more about the game can access this page within the platform.
This gives them a variety of knowledge to learn and to leave their reinforcement bias behind them.
Nexus Hub Communities
On the left image shows a list of communities that a user can join and through this, they will be able to socialise with other existing users on the platform within the community.
The leader board design shown on the right image also gives a user their collection of contribution points and these points can be earned through being helpful within the community or doing something positive for others.
View More
Nexus Hub Communities
On the left image shows a list of communities that a user can join and through this, they will be able to socialise with other existing users on the platform within the community.
The leader board design shown on the right image also gives a user their collection of contribution points and these points can be earned through being helpful within the community or doing something positive for others.
View More
Nexus Hub Home Page
Here I have created a homepage of the Nexus Hub which displays the livestream match, different tabs relating to the current match and on the right with a schedule of upcoming matches.
I have also added in a expanded version of the left side bar so that users that may have accessibility problems will also be able to use the navigation bar easier.
Nexus Hub Recent News
On the left image shows the recent news that can be accessed on the side navigation bar.
Users can click into one of those news article to view current events or news that is happening leading to a more detailed news article on the right image.
Nexus Hub Character Wikipedia
On the left image shows a list of current characters within the game and users who wants to learn more about the game can access this page within the platform.
This gives them a variety of knowledge to learn and to leave their reinforcement bias behind them.
Nexus Hub Communities
On the left image shows a list of communities that a user can join and through this, they will be able to socialise with other existing users on the platform within the community.
The leader board design shown on the right image also gives a user their collection of contribution points and these points can be earned through being helpful within the community or doing something positive for others.
View More
Now to put the newly design platform to the test
Now to put the newly design platform to the test
Now to put the newly design platform to the test
To test how effective the Nexus Hub platform was, I had conducted another series of test to see how well the platform works in response to the solution of current problems.
To test how effective the Nexus Hub platform was, I had conducted another series of test to see how well the platform works in response to the solution of current problems.
Initial Impression Test
From this test, I found that during the initial impression test on the 'builds' page, participants correctly identified its purpose:
56% understood it as "viewing the best build for this champion."
44% understood it as "learning more about the chosen champion's build."
First Click Test
From this test, participants achieved an overall success rate of 44% when first clicking on the “Expand” button, taking an average of 21 seconds. The remaining 56% chose other options:
33% clicked on the ‘Live chat’ option, averaging 11 seconds.11% clicked on the ‘Team build’ option, averaging 18 seconds.
11% clicked on the ‘Timestamps’ option, averaging 5 seconds.
5 Seconds Test
From this test, participants demonstrated strong recall abilities:
89% remembered the forum feed.
67% recalled the left sidebar.
44% remembered the title of posts and featured content.
However, none of the participants were able to recall the ‘Create post’ button, despite its importance as a primary interaction point within the League community.
Prototype, Time on Task Test
From this time-on-task test, participants achieved a 44% success rate in completing the task, averaging 28 seconds per attempt. However, there were also 37% misclicks, and 56% of participants were unable to fully or somewhat complete the task:
44% clicked on the esports page but did not proceed to click into the “LEC” article.
12% were unable to complete the task at all.
Initial Impression Test
From this test, I found that during the initial impression test on the 'builds' page, participants correctly identified its purpose:
56% understood it as "viewing the best build for this champion."
44% understood it as "learning more about the chosen champion's build."
First Click Test
From this test, participants achieved an overall success rate of 44% when first clicking on the “Expand” button, taking an average of 21 seconds. The remaining 56% chose other options:
33% clicked on the ‘Live chat’ option, averaging 11 seconds.11% clicked on the ‘Team build’ option, averaging 18 seconds.
11% clicked on the ‘Timestamps’ option, averaging 5 seconds.
5 Seconds Test
From this test, participants demonstrated strong recall abilities:
89% remembered the forum feed.
67% recalled the left sidebar.
44% remembered the title of posts and featured content.
However, none of the participants were able to recall the ‘Create post’ button, despite its importance as a primary interaction point within the League community.
Prototype, Time on Task Test
From this time-on-task test, participants achieved a 44% success rate in completing the task, averaging 28 seconds per attempt. However, there were also 37% misclicks, and 56% of participants were unable to fully or somewhat complete the task:
44% clicked on the esports page but did not proceed to click into the “LEC” article.
12% were unable to complete the task at all.
Initial Impression Test
From this test, I found that during the initial impression test on the 'builds' page, participants correctly identified its purpose:
56% understood it as "viewing the best build for this champion."
44% understood it as "learning more about the chosen champion's build."
First Click Test
From this test, participants achieved an overall success rate of 44% when first clicking on the “Expand” button, taking an average of 21 seconds. The remaining 56% chose other options:
33% clicked on the ‘Live chat’ option, averaging 11 seconds.11% clicked on the ‘Team build’ option, averaging 18 seconds.
11% clicked on the ‘Timestamps’ option, averaging 5 seconds.
5 Seconds Test
From this test, participants demonstrated strong recall abilities:
89% remembered the forum feed.
67% recalled the left sidebar.
44% remembered the title of posts and featured content.
However, none of the participants were able to recall the ‘Create post’ button, despite its importance as a primary interaction point within the League community.
Prototype, Time on Task Test
From this time-on-task test, participants achieved a 44% success rate in completing the task, averaging 28 seconds per attempt. However, there were also 37% misclicks, and 56% of participants were unable to fully or somewhat complete the task:
44% clicked on the esports page but did not proceed to click into the “LEC” article.
12% were unable to complete the task at all.
Initial Impression Test
From this test, I found that during the initial impression test on the 'builds' page, participants correctly identified its purpose:
56% understood it as "viewing the best build for this champion."
44% understood it as "learning more about the chosen champion's build."
First Click Test
From this test, participants achieved an overall success rate of 44% when first clicking on the “Expand” button, taking an average of 21 seconds. The remaining 56% chose other options:
33% clicked on the ‘Live chat’ option, averaging 11 seconds.11% clicked on the ‘Team build’ option, averaging 18 seconds.
11% clicked on the ‘Timestamps’ option, averaging 5 seconds.
5 Seconds Test
From this test, participants demonstrated strong recall abilities:
89% remembered the forum feed.
67% recalled the left sidebar.
44% remembered the title of posts and featured content.
However, none of the participants were able to recall the ‘Create post’ button, despite its importance as a primary interaction point within the League community.
Prototype, Time on Task Test
From this time-on-task test, participants achieved a 44% success rate in completing the task, averaging 28 seconds per attempt. However, there were also 37% misclicks, and 56% of participants were unable to fully or somewhat complete the task:
44% clicked on the esports page but did not proceed to click into the “LEC” article.
12% were unable to complete the task at all.
Initial Impression Test
From this test, I found that during the initial impression test on the 'builds' page, participants correctly identified its purpose:
56% understood it as "viewing the best build for this champion."
44% understood it as "learning more about the chosen champion's build."
First Click Test
From this test, participants achieved an overall success rate of 44% when first clicking on the “Expand” button, taking an average of 21 seconds. The remaining 56% chose other options:
33% clicked on the ‘Live chat’ option, averaging 11 seconds.11% clicked on the ‘Team build’ option, averaging 18 seconds.
11% clicked on the ‘Timestamps’ option, averaging 5 seconds.
5 Seconds Test
From this test, participants demonstrated strong recall abilities:
89% remembered the forum feed.
67% recalled the left sidebar.
44% remembered the title of posts and featured content.
However, none of the participants were able to recall the ‘Create post’ button, despite its importance as a primary interaction point within the League community.
Prototype, Time on Task Test
From this time-on-task test, participants achieved a 44% success rate in completing the task, averaging 28 seconds per attempt. However, there were also 37% misclicks, and 56% of participants were unable to fully or somewhat complete the task:
44% clicked on the esports page but did not proceed to click into the “LEC” article.
12% were unable to complete the task at all.
Reflective Learning
Reflective Learning
Reflective Learning
1
What challenges did I encountered during this project
What challenges did I encountered during this project?
Throughout this project, I had a lot of fun creating and producing the final prototype that can help solve the current problems in the community. However there were also many challenges that I had encountered within the user research and user testing as through this phase of the project.
I needed to understand more of the community members' psychology to get a better definition of what makes them unable to get involved even though they want to.
Throughout this project, I had a lot of fun creating and producing the final prototype that can help solve the current problems in the community. However there were also many challenges that I had encountered within the user research and user testing as through this phase of the project.
I needed to understand more of the community members' psychology to get a better definition of what makes them unable to get involved even though they want to.
2
What did I achieve out of this project?
As I was the lone member in this project, there were many challenges that I had to overcome and through those challenges within the 12 weeks (3 months), I was able to prioritise each tasks that are needed to be complete with time management being the foundation of this project.
What did I achieve out of this project?
As I was the lone member in this project, there were many challenges that I had to overcome and through those challenges within the 12 weeks (3 months), I was able to prioritise each tasks that are needed to be complete with time management being the foundation of this project.
3
What are my future goals after this project?
What are my future goals after this project?
Working on this project has now allowed me to become a much stronger designer in all aspects and UX and UI design and I hope to continue improving much more in the future.
Working on this project has now allowed me to become a much stronger designer in all aspects and UX and UI design and I hope to continue improving much more in the future.
Let's Collaborate!
Let's Collaborate!
Let's Collaborate!
The ideal solution always starts with you. Let's collaborate to make your
imaginary ideas come into reality together!
The ideal solution always starts with you. Let's collaborate to make your imaginary ideas come into reality together!
