Connecting-Gamers

A website that connects gamers with like minded individuals Contact Details: Owner: Mike Powell Contact: [email protected]

[connecting-gamers]

Finding out the highest prioritized stat

Ok now that we can see number of users matched.

and we can see the stats per group.

Let’s work out which stat people put as their highest priority.

Basically we are going to loop all groups. Then loop all users in that group and work out what each persons highest stat is. Then we will count how many times each stat is someones highest.

ok so the basic concept here is we will start at 0 then compare each stat, iuf its higher we store that stat in it’s place and check the next stat. then finally increment whichever was highest in the object.

It’s a bit messy but if anyone has any suggestions on how to improve this let me know.

Lastly all we need to do is return the total tallies and output it to a pie graph and we get this result.

[connecting-gamers]

Showing stats for all groups.

Ok firstly let’s make a function that loops all groups.

we will also log out a result per group to make it easy to see if we have an error.

Looks like it is working fine.

Now the fun stuff. we want to map these arrays into key value pairs in order to display them in a handy chart.

Great now we can pass that data to our graph and render it everytime we run the sort method. The result looks like this.

[connecting-gamers]

Showing stats per group

Ok let’s show some stats per group now. We want to loop all the groups, Work out how many users share the same stat value for each stat and output the data to a graph.

First let’s make a function that loops every member in a group. We will make an object to hold that users matches, We will also make a variable for each stat to keep track of how many users matched.

Great, now we can loop each user again and compare them against the first loop. We will ignore ourself to ensure we only compare against other users. If a stat matches we increase the stat counter by 1. and we also increase the counter for that individual match.

Great now that we have that for each user, after we loop all the users we want to check how many matches we had and divide the total by the number of matches we had.

We need to do this because otherwise we will count both sides of the match. EG if 4 users share the same stat, they will match the other 3 users 4 times totalling 12. so by dividing by 3 we get the result we want which is 4.

Next up we will make a function that loops all groups.

[connecting-gamers]

Displaying data

So now it’s time to start displaying the results of our matching. Firstly we need 2 fields to change the data. Users in each group and Fields to match users by. We also need a handy button to press to sort the data.

Great so now that we have that we need to group the users into a grid. I chose Material UI to quickly mock something up.

It shows all the groups that were made and displays each users name and their stats.

Next I added some graphs to show how many users were matched and if we had any users left out. And also a bar graph which shows how many users matched with others users on each stat. So a value of 75 on teamwork means that 75 users placed with a user who has the same stat as themself.

Now we can start to see flaws in our coding which is perfect! That’s all for this log. speak soon.

[connecting-gamers]

Starting on the sorting algorithm

Ok so my plan here is to create some variables to start with.

We need:

Users to be matched - All registered users for the event

Number of Users Per Group - We will start with 4

Number of fields to check - We will start with all 5.

So first of all we make a copy of all users registered for this event.

Then we created a new array to hold everyone who is already grouped.

Then we set our group size variable and work out how many groups we will end up with.

lastly we make a new array to hold all the groups we will create.

 Great now we need to loop the amount of groups we need and start matching users.

ok so first we start a loop.

Then we make a new array to hold the group

Then we get the very first user in the registered array and remove them from the registered array (so we don’t grab them again)

We add them to the new group and then we add them to the usersgrouped array

Firstly we need a function that will compare 2 users.

This is a rudamentry function which will compare the stats of 2 users and return the sum of the absolute differences.

You can also see it takes a fields to match number, starting at 1 and ending at 5 (compare all stats)

Now the function that we use to compare each stat is very simple.

Great now that we have that lets sort the entire registered users array in order of how close they match to the first users. Ideally we want 0 (meaning all stats are equal)

Once we have sorted the list we will loop for however many users we need to add to the group.

Grab the first one and place it into the groups array.

and add the user to the usersgrouped array.

Then add that group to the array of groups.

Lastly we will log out some stats and then update our state.

That’s all for this post see ya next time when we start displaying the groups we matched.

[connecting-gamers]

Created a function to delete dummy data

Next up was making a function to clear out dummy data.

To do this I created an API route which removes all users that start with test. This works great and then we want to clear out the registered users on the test-event.

Great now that we can generate Dummy Data and we can clear it. We can start on the sorting algorithm.

[connecting-gamers]

Created Dummy Data

To enable easy testing i needed a way to generate dummy data.

So i created a function that creates X amount of users and registers them for the event.

This was harder than it appears as i needed to distribute 25 points over 5 stats without going under or over.

The way i approached it was first to create a dummy user with empty stats.

Then i needed to start calculating their stats.

First i start with 25 points to distribute then i start picking a random value between 1 and 10 for the first 2 stats.

I then need to start checking our value to check we still have enough points left to distribute as now it’s possible the lowest we will have left is 5 but we are getting a number up to 10.

So for the next 2 stats i check to ensure the value is over 9 and if not i get a random number between 1 and the amount of points left to distribute.

Now for the last stat it starts to get tricky, If we have less than 10 left then we can just make the last stat equal to the amount of points left. But if we have more than 10 left we need to start looping over previous values and adding 1. Keeping track as we go.

Here is where it gets messy.

Great lastly we just double check nothing went wrong with any of the values. had some rare cases of numbers turning up undefined.

Now we just change the values on the dummy user we made and add it to the list of users to create

Then we use an InsertMany operation on the database to create all the users.

and then we loop each of those created users and add them to the event.

Great this works perfect. Only issue is it always starts at 0 , so if we don’t delete the dummy data and try to create a new lot they will have the same id causing errors in the database operation.

To fix this we just need to create another function to clear out all dummy data.

until next time when we finally start the sorting algorithm.

[connecting-gamers]

Variables

There will be a number of variables i need to cement for further work on the project.

Number if fields we want to match

When matching users we want to be able to adjust how many fields we will check before we call it a match. Such as first we try to find a user with the same first preference as the first user, we then look at the next field and so on and so forth until we hit this number of matches. If we make this configurable server side it can allow us to run simulations before cementing a final match.

Max difference value:

This value will be the max differences that the players can have before eliminating them from the matching algorithm.

Keep searching after 2 matches:

This will be a boolean to decide if we should keep checking further stats if we already matched their first 2. If we have a large player pool to pick from we can afford to have this checked, otherwise we might need to have it unchecked.

Output variables:

These variables are what we can output when we run simulations on the matches. It would be helpful if we could run the simulation then see a graph of results, then we can choose to finalise the matches or keep tweaking before finally settling on our results.

Number of users who matched with first pref.

Number of users who matched with second pref.

Number of users who matched with third pref.

Number of users with no matches

Number of users in a group less than 3

With all of this still to code its going to be a busy week!

[connecting-gamers]

Validating Hypothesis

To validate my hypothesis I made a hypothesis statement. The case being that we can match a lot of users that don’t match well, or we can match little users who match very well. It’s going to be a balancing act to get them to match well.

It also comes down to a simple algorithm or a more complex one.

On the other side of the coin, For this project how much of the website i want to build depends on how much documentation i will need to write, The more documentation and the less time i have to work on the project.

So i will need to focus only on a basic implementation in order to complete enough work.

[connecting-gamers]

Hypothesis

This week in class we went over validation of our innovation. First up was forming a hypothesis. Context - Connecting Gamers Problem - Some gamers dislike the toxicity of multiplayer gaming and would prefer to play with gamers without those issues. Question: How can we connect these gamers together without matching purely on skill Hypothesis: Matching users with players with similar preferences in play style results in a more enjoyable experience. Hypothesis 2: users who would not normally play games multiplayer will when matched with users with a similar mindset.

[connecting-gamers]

Started development

So i started to make the website using React + Mongo + Express and Node. I am using this system as it allows me to very quickly prototype the website, hot reloading and build an API enpoint to easily manipulate data.

I use Mongo for the database due to it being based on JSON objects, Me being familiar with it and of course it is very easy to change at any time without breaking anything.

So far i have added User registration using Discord

Then I have started working on the Event system. So far i have a way to create events but have not added a way to view them yet.

Next up i wish to make a page that will allow me to test my matching algorithm and fill the database with dummy user test data to test it.

[connecting-gamers]

Algorithm Adjustments

After meeting with our mentor another approach to the matching algorithm was suggested.

Instead of only using the highest stat and start matching from there, it was suggested that we use a matrices calculation to do the matching.

So first we take player 1 with the following stats

Fun: 10

Skill: 5

Comm: 5

Teamwork: 3

Friendly: 2

We then take Player 2

Fun: 5

Skill: 10

Comm: 3

Teamwork: 5

Friendly: 2

We then subtract each users skill from each other to be left with the differences. in this case:

Fun: (10 - 5) = 5

Skill: (5 - 10) = 5 (it’s -5 but we don’t care about negative numbers, just the difference)

Comm: (5 - 3) = 2

Teamwork: (3 - 5) = 2

Friendly: (2 - 2) = 0

We now have a difference value for each stat. So we take the highest ranked stat, in player ones case it is Fun and we search for a user that has the lowest difference (being 0).

This is very similar to our first way but with the benefit of giving us a sum of all the difference to tell the difference between 2 players.

For example if we have 20 users who all matched with 0 on Fun (meaning they had the same stat) we then can rank them by the lowest amount of differences. (sum of all the difference values) and order them by the lowest.

Just another method We will have to test out.

[connecting-gamers]

Working on the matching algorithm for users

So since we are using Mongo for our userbase i thought the matching algorithm should be simple aswell. But i’ll leave it easy to tweak.

Firstly we should work with the data we have. So we know we have 5 stats which each stat ranging from 1-10 points. When the user signs up they are able to “spend“ 25 points in order to rank what is most important to them.

They are unable to make each stat the full 10 marks as that would not provide any benefit, so they only have 25 points to distribute.

Seen below is an even distribution of points

My first plan for the matching algorithm is to first find the users top preference. Let’s say for example purposes they put fun at 10.

I will now first filter any other users that also put fun at 10 to decrease the list. if there is no other user that has a 10 in fun, we will look for a match with a 9 in fun. and so on and so forth.

Once this first filter has been applied ideally we have more matches than we need, If we are buiilding a team of 5 and we have 20 users who matched we can then start filtering the list further.

We will then start to filter the users who matched on the second highest trait.

Once we have at least some users who also have a 10 in fun if we have less than the number we need (say 5 in a group) we will then start expanding our search to also find users who match on the players second highest choice.

We will repeat this process until we are left with the amount of players that we need for the group. We then remove each of these players from being matched further and move onto the next player who is not in a team yet and begin the process again.

This is just the first revision of what i expect will be many optimisations as we use trial and error to improve the system.

[connecting-gamers]

UML Time!

This week i got a start on working out how the database would look. I decided to start simple with a basic UML layout.

I wanted to keep it basic to start with and then expand as the weeks go by and we need more details. I’ll be using Mongo as my database solution. As it uses simple JSON storage which makes it easy to remodel the db anytime we need. And it has great query methods allowing you chain filters and sort by anything and everything very easily.

The basic concept is the database will hold a list of Users, Votes and Events.

Events hold:

A list of users registered

A start date

Users hold:

Their ID (unique)

Their username

An array of events they are registered for

An array of votes (Votes are what they ranked another player on)

A stats Object (which holds their user preferences for Fun, Skill, Communication, Teamwork and friendliness)

Their email

Their discord ID (taken when they auth using discord)

Votes hold:

The ID of the person who voted

The ID of the person being voted on

An object of scores for each value we are ranking them on. (fun, skill, communication, teamwork and friendliness.)

After each game the users will be able to rank the players they played with and give them a score out of 5 for each field. This will assist in deciding whether to match that player together again.

Stay tuned for more information

[connecting-gamers]

Timeline and scope

Thought it would be best to lay out a rough plan for the timeline of the project

week 3 - Idea generation and project info.

week 4 - Work on a basic prototype template to test out user creation and profiles.

week 5 - Add a simple auth system that allows users to sign up using discord and populate their profile.

week 6 - Start work on matching algorithm and run automated testing.

week 7 - Work on user profiles and style of the website and test discord integration

week 8 - perform user testing and get feedback, possibly get design input from team

week 9 - revise and implement any feedback received, perform final testing and documentation.

[connecting-gamers]

Validation

First we want to look at technologies we could use to implement our system.

The main ones are Discord which will allow us to ensure all users can come together and voice chat, and easily join games together.

Using their Rich Embed and Game Bridge systems.

https://discordia.me/gamebridge

This will allow users to be put into the same chat room when it’s time to group up, add friends easily and keep in touch outside the system.

The next is a Javascript technology we can use to rapidly build the website.

React js and Material UI will ensure it is quick to prototype and functions well.

This also allows us to ensure the website works well on mobile, desktop and all platforms.

https://reactjs.org/

Then we wanted to look at existing solutions that might already exist.

Overdog - Xbox

Overdog is a social matchmaking app for xbox one, It allows gamers to be matched based on their shared interests. Users build a gaming profile based on a range of interests such as music, movies, entertainment, sports and more.

Leaping Tiger - Mobile

Leaping tiger is a mobile location based matchmaking app which provides gamers a way to find and connect with each other regardless of their game or platform. Users create profiles comprising of game tags, social media info and biography. Users can check in and choose a platform and game to post live updates.

Our system is going to be different as it’s more a real life system designed to be used at real life events, To keep it simple to start we will make it so that admins can create events and users can register for them.

[connecting-gamers]

Game Interventions

Our next task was to look for nodes of opportunity for intervention in this system and try to frame a solution.

A couple of ways we thought we could disrupt this sytem was to create a multiple choice series of cards the user could click. It would present 3 options at a time to the user and ask which they prefer.

For an example one set of options could look like:

Do you play games to:

Have fun!

Win!

Socialize with friends

Using the system like this would be useful for sorting the players into different player types.

Another set of questions could be:

When you play with friends, you like to:

Be the leader

Follow the groups plan

Be a rogue on my own! 

Simple questions like this would help to match teams with like minded people and ensure everyone has a good time.

This could look something similar to how Potter more handles it.