Fan-made champion Select interface :))) Hope you like it !

DOPE LUX FLEXING·May 22, 2015·487 votes·62,608 views

Fan-made champion Select interface :))) Hope you like it ! Here's another update from InFlames & Kindlejack thanks ^^ ! http://i.imgur.com/xNWOriy.png

239 Comments

RiotKindlejackMay 23, 201565 votes

Nice! You don't have to stick with the current layout though, I'm sure there's a better option. Is there any way to show all the champions at once so there's no need for a scroll bar? Or would that be too crazy. Is the technology there? I don't know. Maybe when we all have oculus rifts you'll be standing in a crowded room and have to push champions aside while frantically searching for the one you want to play. Or they'll be floating heads surrounding you crying out 'Pick me! Pick me! Or teeny mouse sized in a big fish tank and you pick out the one you want like goldfish. A dark abyss stands before you and you call out the champions name then play your flute-dagger like Green Ranger and it summons them from the void?

Looks really slick UI wise. I'd love to see alternate art of champions looking sad that shows up when they get banned >:P

R2D20May 24, 20155 votes

You've really thought about this huh?

Jeddy017May 24, 20153 votes

Amumu must always be banned then.

Solari FortuneMay 24, 20151 votes

{quoted}

Nice! You don't have to stick with the current layout though, I'm sure there's a better option. Is there any way to show all the champions at once so there's no need for a scroll bar? Or would that be too crazy. Is the technology there? I don't know. Maybe when we all have oculus rifts you'll be standing in a crowded room and have to push champions aside while frantically searching for the one you want to play. Or they'll be floating heads surrounding you crying out 'Pick me! Pick me! Or teeny mouse sized in a big fish tank and you pick out the one you want like goldfish. A dark abyss stands before you and you call out the champions name then play your flute-dagger like Green Ranger and it summons them from the void?

Looks really slick UI wise. I'd love to see alternate art of champions looking sad that shows up when they get banned >:P

I like the Idea of virtual reality picking champs, although you would have to worry about your champs getting jealous cause they didn't get picked.

RiotKindlejackMay 24, 201512 votes

Did you ever happen to play DoA: Beach Volleyball?

Mistress MadokaMay 24, 20153 votes

Is it sad that I never played it but I still get the joke?

RiotKindlejackMay 26, 20154 votes

I vaguely remember my housemate playing it; if I recall there was a 'jealousy' system.

FreshMeat707May 25, 20153 votes

{quoted}

Did you ever happen to play DoA: Beach Volleyball?

Oh god please no

DaenMay 24, 20154 votes

you'll be standing in a crowded room and have to push champions aside while frantically searching for the one you want to play. Or they'll be floating heads surrounding you crying out 'Pick me! Pick me! Or teeny mouse sized in a big fish tank and you pick out the one you want like goldfish. A dark abyss stands before you and you call out the champions name then play your flute-dagger like Green Ranger

I'll have some of what he's having.

VierMay 22, 201552 votes

Really nice, very well done! Just curious where the names of allies would be? Also the Summoner 1-5 for the enemy (or is that not needed?)

TraxinatorMay 22, 201512 votes

Well, it shouldn't say "Summoner" since they no longer exist. item 3070

Blue Moon WolfMay 23, 20156 votes

that empty curve under the summoner spells would be a good place for names.

Celtic8789May 23, 20153 votes

That's actually a good idea on where to put the summoner names.

ZJnTbuxsKXMay 22, 201530 votes

I dunno, from a design perspective it has a LOT of wasted space, I'd much rather have functionality and efficiency in a champ select design over subjective attractiveness. Of course this is all my personal opinion as I do not visually like it, I'm not a fan of the design itself, nor the layout they have chosen.

Let us take a look at space usage(Keep in mind these aren't 100% accurate as I only quickly sliced the image into rectangular shapes, but for arguments sake it is still relevant).

Overall Pixel Count : 256,000

Champion Selection Area: 37,812 (14.7%) Picked Champions Area: 92,976 (36.3%) Chat Area: 29,197 (11.4%)

Other areas being Rune/Mastery Selection, Bans, Random Champ portrait next to Rune/Mastery Selection. My question is this, why does the Picked Champion Area overshadow the most important visual of Champ select by over 2x.

Again, this is purely my opinion, and my opinion alone.

KarlyrMay 22, 20154 votes

This is pretty what I thought too, BUT (there's a huge one there) 75% of the time i just end up searching the champ that I wanna pick. To me, the more important thing about champion select are the champions currently picked. It helps the summoner focus on the other picks instead of his own. (Thinking about yourself vs thinking for the team basically)

You could still reduce just a bit the size of the portraits to help this issue though. (Just so you have at least 2 portraits more width wise) You would have more space for the chat.

IMO the current champ select screen has A LOT of wasted space anyway. The ban section is huge for nothing, there is a lot of space in between summoners choices.

His iteration helps a lot adressing these issues.

DaenMay 22, 20153 votes

75% of the time i just end up searching the champ that I wanna pick

I'd be interested to see statistics on who does what. Personally I just enjoy seeing the champion list, it's nice to be able to scroll through it and pick champions rather than needing to search. The main thing about this rework that gets me, in this regard, is that there are 20% fewer champions shown on the screen at any given time. The current live client shows 4 rows of 10, this rework shows 4 rows of 8.

In addition, there's just no reason that the portraits themselves are so much larger than the main source of interaction. You don't interact with portraits or bans, they are just visual. The only real interaction portions are the section where you choose your champion and the chat box, and they are the smallest/least visually present elements in the entire window.

HolowHall of HalMay 22, 201520 votes

'I main hookers' What a slut

ZirzonMay 22, 201513 votes

item 3070 Thresh Blitzcrank Nautilus

supes the lostMay 22, 201519 votes

I love this, it looks like a fighting game roster.

DaenMay 22, 20159 votes

I really love the design, it's quite pretty.

That being said, I think something like this could only really work if the client could be fullscreen; there is a ton of space being taken up by those champion portraits, and the champion selection box really suffers because of it. There's also a lot going on with the interface here and it could potentially be a bit distracting,

Basically, from a UI perspective it's beautiful. From a UX perspective it needs some work, namely with sizing and maybe bringing out the middle rather than making the sides stand out so dramatically. There is also a significant amount of empty space where the champion selection box curves upward at the bottom, on each side; this makes the box look even smaller than the space affords.

In this remake there are 8 champions displayed horizontally rather than the 10 displayed in live, with the same four rows. This is 32 champions displayed at once rather than 40, which is effectively a 20% reduction in usability.

One other question: If Riot were to increase the number of bans, where would this fit into the UI rework you have designed? The current implementation has space built into the UI for another two bans on each side (for a total of ten bans) if needed.

Edit: This just occurred to me, where is the Lock In button?

KoddaMay 22, 20152 votes

Agreed, i think the LoL client should be full screen, while being able to minimize it like the normal one.

Sky ShadowMay 22, 20158 votes

I love the design and think this is an AWESOME Champion Select screen!

But under the sleek new look and polish, I can see some flaws and if you don't mind, I'll write some feedback that I believe could greatly improve it.

It needs to have the Summoner Names under the splash arts to see who picked what champion and who is talking.
The 'lock in' button is just a picture of the champion so for new players, I can see them being really confused as to where it is. I think it should actually say 'lock in' and be on the right side where it's always been for clarity.
The Annie splash art being mirrored really triggers my inner OCD. I really don't like it.
The bans should really need labelled. Leaving them unlabelled like that for veteran players is fine, but once again. Someone who doesn't play this regularly or spectates wouldn't know what that is.
The Blue and Red side need to be more pronounced. You can barely tell what side you're going to be on and for some color blind people, the background for the sides looks the same.
This is just a request mostly, but it would be really cool if we could get a 'select ward skin' button.

Other than that. This is an extremely well done Champion Select screen. I hope that Riot will implement something that looks like this.

RussoRedMay 22, 20156 votes

just one question why is annie the only one thats backward

AkriyaMay 22, 20154 votes

actually Orianna is backwards too and I don't think its backwards so much as that's the pose in the art so that's just the way it works out, if you put her on the other team she would be facing the right direction:P

RussoRedMay 22, 20154 votes

{quoted}

actually Orianna is backwards too and I don't think its backwards so much as that's the pose in the art so that's just the way it works out, if you put her on the other team she would be facing the right direction:P

shes not backwards in her splash she has her back twards you looking over her left shoulder its on the right side

MelledoneusMay 22, 20156 votes

Riot, you just found a potential graphic designer.

RootworthMay 22, 20155 votes

Too flashy and fatty. Needs to be simple and sleek.

Curling VeigarMay 22, 20155 votes

what retards leave gragas and sejuani unbanned?

BADxW0LFMay 22, 20154 votes

this is probably an older model from before the tank meta...retard (only saying so because you seem it's appropriate to call people retards when you don't think)

MacDthreeMay 22, 20153 votes

shhh don't use logic. he wont get it.

CantripMay 22, 20153 votes

The only thing I'd change is the summoner spell position, needs to be horizontal for clarity on which key I'm binding it to. Other than that, I'd love to see something as slick as this! +1

LOL SpammerMay 22, 20153 votes

"I main hookers" shakes head and sighs quietly

KaipopMay 23, 20153 votes

You can't see enemy summoner spells in champion select.

DigielfMay 22, 20152 votes

Yes the one that we have right now is terribly old Riot are sad virgin nerds who cant even make an interface

MacDthreeMay 22, 20152 votes

and you're a "sad virgin nerd" who can't even use proper grammar or punctuation. So I guess you belong here.

DaenMay 22, 20155 votes

I'm sorry, this has to be done because you said the following:

who can't even use proper grammar or punctuation

Thus:

and you're a "sad virgin nerd" who can't even use proper grammar or punctuation. So I guess you belong here.

Improper grammar - Started first sentence with a conjunction
Improper grammar - Started first sentence without a capital letter
Improper grammar - Started second sentence with a conjunction

MacDthreeMay 22, 20152 votes

y u maek me crai

DaenMay 22, 20154 votes

i sory did not maen 2 pls forgiv me

AMYS GRAVEMay 22, 20152 votes

Its missing summoner names by the champions being picked, so i can see in chat that inflames has a "mid or adc pref" but i don't know where they are in pick order.

Other than that i think this is great, very well put together.

AsheGetsGankedMay 23, 20152 votes

could use some tweaking, but I like this a lot better than what we have now. Looks badass!

MaliginantMay 23, 20152 votes

Was this done in Photoshop or is this a fully functional interface which you made? If it's the later, in the name of awesome things, could you please make it available for download.

shejkouMay 23, 20152 votes

Riot can we have it?:DDD

Vento ÂureoMay 23, 20152 votes

pls riot create this wonderful champ select this would be perfect to evryone Braum Braum

MFTORANK1May 23, 20152 votes

I want this in the game ASAP great job

MarhsallLee67May 23, 20152 votes

Shout-out to the hooker main in the chat.

DecrousMay 23, 20152 votes

Looks good, very modern looking compared to what we have now. could use some tweaking though with maybe the bans and size of the champion pictures (I fail at spelling the word) and the size of the masteries/runes. That's just my opinion.

Freddi kunMay 24, 20152 votes

I WANT IT (╯°□°)╯︵ ┻━┻

InFlamesMay 24, 20152 votes

I'm the original creator of this mockup. It seems to have been reuploaded, for better quality here's the PNG with some changes (tentative) http://i.imgur.com/xNWOriy.png