End Game MMR Improvement #4 - Progress Bar Same Width

samgawaran commented 2 years ago

Summary

Based on the discussions made in #137 this submission shows the changes in some specific scenarios and on the overall progress bar.

following Juan's suggestions, we would be showing same width on the bar, so its more straightforward

Scenarios are the same as the previous iterations, research is here:

Changes

Details

Victory/Defeat

No changes in Victory/Defeat besides the progress bar

Promoted/Demoted

changes for promoted/demoted: We would always show 3 divisions at any point in the progress bar if the player is on bronze, show Bronze, Silver, Gold
reason for showing 3 divisions is that the same-width style does not suit well in showing just 2 divisions like in the previous iteration. | Sample
If player gets promoted on the gold division. The next ranked game they will play will show Silver on the left-most instead of bronze, if player is demoted to Silver, it will show Bronze on the left-most

Platinum / Top Ranked Player

changes in platinum and top-ranked is the same with promoted/demoted

MMR Change Indicator

The shiny thing is a nice idea but I'm sure there are a few other ones as well. I recommend exploring those designs after the main one is approved.

besides the shimmer, I also saw games like Mobile Legends and League do some sort of Damage type of indicator. yeah, some RPG games do this well on their character's HP bars too.

Submission Checklist

[x] This submission abides by Des-lvl-1, Des-lvl-2 & Des-lvl-3

samgawaran commented 2 years ago

for review: @demiculus @JeffdEon @JuanRoman77

let me know if all is good. added an idea for the change indicators too. It can be modified during the implementation easily if ever.

JeffdEon commented 2 years ago

I'm still not a fan of the multi-bar approach and think I prefer the single bar approach from previous iterations. I'll let the others weigh in.

Now it just seems miss leading, it makes it seems like bronze, silver, gold and platinum all have the same size. Which isn't true. People will perceive equal width as meaning same size, that's typically how progress bars work. They show scale.

samgawaran commented 2 years ago

I'll leave this as is for now. Maybe we could talk more on this on the meeting or I'll post it in the #design channel. Anyhow, I'll do some other stuff first

JeffdEon commented 2 years ago

The design is the only thing preventing https://github.com/colonistio/katan/issues/7867 from being completed. What is the status? I think this should be ready for next update because we will begin showing divisions in the leaderboard next season.

JuanRoman77 commented 2 years ago

@samgawaran what's the view for a player in Bronze division?

samgawaran commented 2 years ago

@samgawaran what's the view for a player in Bronze division?

When Player is Bronze: from left to right - Bronze, Silver, Gold
When Player is Silver: from left to right - Bronze, Silver, Gold
When player is Gold from left to right - Bronze, Silver, Gold
If player reaches Platinum from left to right - Silver, Gold, Platinum

JeffdEon commented 2 years ago

Every time I see this design i don't like it. I'm going to again re-emphasize that equal sizes bars does NOT make sense. Progress is not scaled linearly, divisions are different widths, its not intuitive and confusing.

I see 2 options

Irrelevantly small equal widths on each side. Center bar is scaled linearly showing % progress to next division.

Back to original design which is simpler, more intuitive and easier to implement.

People want to know the progress of their current division scaled to the correct values. I've never seen a non-linear scale bar broken into 3 arbitrary widths.

If I had to choose between the 2 I'd still go with the second option.

JeffdEon commented 2 years ago

I'd like to finalize design soon so this can be implemented. Next build is getting made in a week and I'd like this to get implemented for next version.

@demiculus can you go over these issues, pick the best one and update the implementation task and assign? https://github.com/colonistio/katan/issues/7867

JuanRoman77 commented 2 years ago

It doesn't matter if it's simpler and easier to implement, when it's confusing and inconsistent

Items in that design have different sizes, different relative positions, no clear limits, no division names. Feels like it will take ages to reach the next level.

demiculus commented 2 years ago

@samgawaran Go with the proposal here: https://github.com/colonistio/design/issues/129

There is only gifs to Victory & Defeat, show the gifs to Ranked Up/Down
Write the names of the tiers https://i.imgur.com/XpkTKbu.png bronze, gold etc..
Make sure to show all possible cases clearly in images
Update the implementation issue: https://github.com/colonistio/katan/issues/7867
Send me a message on discord you updated
I'll edit and assign it to someone

colonistio / design