Archive

Posts Tagged ‘clarity’

 

Dev Blog Visual Hierarchy Banner

The latest dev blog draws a neat comparison between the old Summoner’s Rift and the new and how the updated art assists gameplay.

 

Working on the reimagined art style of Summoner’s Rift has been a rewarding, but not small, undertaking – we want to deliver a unique, timeless art style that remains relatable years after its creation. Our goal is to create a style independent of a particular time or place that retains the “inviting, magic-infused forest” vibe of Summoner’s Rift. This means improving the style, cohesion & fidelity of the art while not being held back by technological constraints. Finally, the various aspects of this art style must all be aimed at clarifying gameplay in order to truly give players a more meaningful and immersive experience while playing League.


Timeless Style

Timeless art has to have a uniquely recognizable style all its own, but must also be anchored in reality to be relatable. With that challenge in mind, we drew inspiration from our favorite games, works of art, and animated films in order to come up with the hand-painted, yet graphic style we developed while working on Summoner’s Rift.

image

We applied these inspirations to Summoner’s Rift in a variety of ways. Whimsical trees juxtaposed with more aggressive and stylized rocks; high contrast with soft, welcoming foliage and flowers abutted by sharp and cracked geological shapes. This pairing is key to the map’s shape language and extends similarly to the creatures living on the Rift, with a carefully balanced proportion of elements inspired from both reality and imagination. These dichotomies, along with the proportions, shape conventions, hues and values of the updated Rift all come together to create the “uniquely LoL” aesthetic we’ve been shooting for.

 

Thematic Cohesion

ThematicCohesion

Creating a cohesive theme on the Rift requires all its art to refer back to a singular vision built through story, concept art, and real world reference. This creates consistency among the different elements within the environment and ensures that the things you see in game while playing actually belong together, establishing a more believable and immersive world. Even the scale of buildings and foliage has been addressed. We’re working to create a world where the various elements of the landscape all feel right at home next to champions’ style, scale and overall look.

One of the main things we have to consider is that Summoner’s Rift is the canvas on which all of our champions must sit. The champion pool holds a broad spectrum of styles – from the whimsical nature of Teemo or Lulu, to the darker aggression of Nocturne or Zed. In order to ensure champions fit into the world, we have to blend the painterly baseline of the environment and monsters with more graphic elements that relate to the art of even the grittiest champions. This spectrum (from painted to graphic) is something we’ll continue to refine as we iterate on SR and League’s overall art style.

 

Increasing Clarity

Increasing gameplay clarity is a primary focus when it comes to updating Summoner’s Rift. Clarity, for art, means creating art that minimizes visual clutter.

PanthOldSR PanthSRU

Quite simply, in every second of a game of League, we’re communicating a ton of information. So when we talk about working to improve clarity, we’re talking about improving the accuracy and usefulness of all of this information and enabling players to more easily digest what’s going on during gameplay.

This means simplifying shapes and values to make for easy visual reads no matter where you are on the map or what you’re looking at. The map should always relate to the champions, but it also needs to sit behind and frame them clearly as players run around shooting off abilities in groups of up to 10 at a time.

ClarityFlow

Another concept we keep in mind when pursuing clarity is “flow” – essentially, the art should be a soft visual indicator that subtlety suggests the path. It should clarify game space, not clutter it. Applying visual design elements to make for readable paths should help players in understanding exactly where they are and where they’re going while navigating the Rift.

 

Visual Hierarchy

We also try to bring more clarity to players by looking at the overall map in layers, as a hierarchy of visual elements, which ties together a lot of the things we’ve discussed above. The images below take a look at this hierarchy, with the accompanying graphs displaying value saturation constraints for each layer.

VisualHierarchy1-wt

First is the background which sits behind everything else and serves as a canvas for other elements.

VisualHierarchy2-wt

On top of that are the characters, which are second in contrast and visibility so that they stand out from the background. Players need to always be able to clearly understand exactly where their champion (and others) are on the map.

VisualHierarchy3-wt

Visual Effects come third, so that in the middle of a busy team fight you can clearly see when a Kog-Maw’s lobbing artillery at you or the Sion train is barreling your way.

VisualHierarchy4-wt

Finally, the User Interface sits atop everything and is the easiest element to see. Although it sits on the top layer, it’s slim and small as possible to avoid obscuring gameplay.

 

Invisible Technology

Last but not least among our goals is creating an art style without visible technology – things like hard polygon edges or crunchy, overly realistic textures. Thinking back to our favorite games from 5 or 10 years ago, most were using various forms of art technology that look almost archaic to us now. While we loved the vibe of these games, it’s clear when looking back at the art that technology was often a limitation. Few games and movies successfully break this boundary, but it’s something we really aspire to with the Rift’s updated art style.

Some big wins we get from building this way include a fully cohesive look and a unified, painted style across the entire map. We’ve limited ourselves to polygon budgets that would typically create very low-end looking, hard edges; however, the new art uses a technique in which painted elements define edges and hide the tech. Take a look at the evidence in the screenshot of the Golem pit comparison below:

InvisTech1 InvisTech2

The old map uses visible tech – polygon edges stick out and date the visuals. The new version shows how we’re choosing what edges we like and using alpha-blending and hand-painted geometry to achieve the desired look. This technique can also be done on much “cheaper” geometry for video cards to render, allowing us to improve other map elements like visual effects or animated parts of the environment.

 

Looking Ahead

That’s it on the art for now! Looking ahead to open beta and beyond, we intend to continue adding polish to the updated map and eventually bring the artistic style of League of Legends to other parts of the game. Thanks, and we’ll see you on the Rift!



If you have any questions, feel free to ask me at @NoL_Chefo or e-mail me at nolchefo@gmail.com.


 

LoL Design Values Banner

 

Another devblog has been posted by Riot, this time on the topic of in-game clarity, the controversy of jungle timers and lots more!

 

DevBlog: In-depth with Clarity

Jungle Timers Small Q&A

 

Recent News

 

Skins-Concept-Team-QA-Banner

PBE-June-23-Banner

Traditional-skin-for-post-vu-Caitlyn-Banner

 

 

Welcome to the first deep-dive entry in our ongoing League of Legends design values! A few weeks ago we spoke about our core design pillars in League, and we promised additional entries that would go in-depth with each particular one.Up today we’ve got Richard ‘Nome’ Liu, an environment and clarity designer for League of Legends. In addition to talking at length about gameplay clarity, Nome’s also going to be talking about the decision-making that went into the development of jungle timers. So read on to hear Nome’s thoughts on clarity and why it’s so important to League of Legends as a whole!

 Chris ‘Pwyff’ Tom

 

 

What is Clarity

 

Super Nomegeta This article is written by clarity and environment designer Richard “Nome” Liu

Can you spot exactly where you are in a teamfight?When you glance at the scoreboard, can you figure out whether you or your opponent has a higher minion score in less than three seconds?

On first use – without reading the tooltip – can you understand the full effects of an ability?

On a deeper level, how much information does a player need to make a meaningful choice, and how many more layers can be added before that choice turns into bookkeeping of obscure information?

 

 

Where information is presented is important. When Shyvana was updated, her melee attack effects were moved to their affected ability tooltips — since that’s where they’re most relevant!

These are the kind of challenges – and more – that the gameplay clarity team tackles on a daily basis, and they’re ones that we firmly believe can be improved in League of Legends. As mentioned in our design values dev blog, gameplay clarity is incredibly important for the evolution of League of Legends and our mission is to ensure that players are fighting their opponents, not the game.

But what is gameplay clarity? Clarity is pervasive. It’s in visuals, gameplay, design, art, and everything in-between. In League of Legends, gameplay clarity relates to the availability of information as well as the intentional obfuscation of it. We can make clear gains – like updating minion particles to be more accurate in their direction – but these aren’t what we’re here to discuss.

So what are we here for? Well, with the push of Jungle Timers to the PBE, we felt this would be a good time to discuss gameplay clarity in spaces yet to be explored as well as how we’re aiming to improve your gameplay experience.

 

 


Jungle Timers Putting The Focus on Mastery Banner


 

Boiling down what we talked about in our design values, League of Legends provides three basic paths to mastery: personal expertise, teamwork, and adaptability – our focus will be on the first. Personal expertise is a complex soup of skills but we can generally agree that elements like mechanical mastery, situational awareness, and game knowledge are vital ingredients.

Most of these are universal to the League of Legends experience and are agnostic to the map, mode, or champion you play – though a few of them can be overloaded based on your preferences. Regardless, we’ve also declared that a few things aren’t part of the experience, like hardcore multi-unit micromanagement, rote memorization of patterns, or bookkeeping.

 

 

The new jungle timers are nestled at the top of the screen. They won’t be presenting any new or hidden information. Rather, they present existing information in a visual display.

Jungle timers fall into that last case, and serve as an example of important information being presented in an impractical manner. Looking back, there was a lot of internal debate over whether this level of information should be exposed.

On one side, a case could be made that map-level objective awareness is a significant aspect of skill – and to that, we wholeheartedly agree. We would not, for example, alert you when an opponent entered your immediate radius from fog, nor would we ever track enemy cooldowns for you. Your interactions with your opponents are sacred and we will always leave those interactions alone.

On the other side – and here’s what finally changed our minds – the jungle is a constant environment; unlike champions, monsters will always be where you expect them to be; unlike cooldowns, there is no variability in respawn rates. With timestamps available in the team chat window, timing of jungle monsters often came down to whoever remembered to type it out. We also don’t want to beat around the bush here: the emergence of third party applications put fuel on the fire, but they only increased our confidence that such a feature was in line with our values.

Ultimately, the question we asked was whether bookkeeping of jungle timers (which, as I mentioned before, was often solved by doing quick math in the chat box) contributed satisfaction of the play experience and we realized it was just too much of a routine task to be of significant value.

 

 

Turrets How Clarity is Applied Banner

 

But this dev blog isn’t all about jungle timers (although they’re the most contextually relevant), and I’d like to highlight other uses of clarity. We’re not always about displaying all information – clarity is about intentionality: a game that makes every piece of knowledge available creates information paralysis, while a game that hides all information promotes mental archiving rather than rewarding moment-to-moment mastery. The job of design is to use informational clarity (or the lack thereof) to create interesting situations.

 

 

It’s extremely important for players to understand when they’re being targeted by a turret. At the same time, it’s important to leave space where players can be baited into taking turret shots as well.

To provide an example in which clarity is important in limited scope, we can look at turrets. It’s incredibly important to understand when you’re targeted by a turret, as their attacks are especially impactful and feature a unique set of rules: they ignore a portion of your armor and deal increased damage with each successive hit. To this end, turrets utilize exaggerated ceremony: there’s a persistent targeting laser, a distinct sound alerts you when you’re targeted, and it fires bright balls of energy. Now here’s something turrets don’t feature: a persistent range indicator (outside of Co-Op vs AI and beginner games).

Certainly a range indicator would improve clarity around the turret – no one denies this. A scenario where one player harasses another under the turret is rife for plays to be made, and this contributes heavily to our decision-making. When an indicator is present, the play is between the aggressor and the indicator rather than the aggressor and the defender. If we were to make turret range indicators permanent, then aggression would be boiled down to who can toe the line better, which ultimately decreases the potential for interesting plays to arise.

 

 


The Sanctity of Clarity Banner


 

For my final point, we’ve covered when information should be exposed and when it should be hidden. Now, I want to briefly touch on when information is available but inaccessible.

A good example here would be the visual update to Karthus’ Lay Waste. The previous particle grossly misrepresented the ability’s area of effect, while the new particle is far more functionally accurate. In approaching a change like this, the argument could be made that inaccurate particles create gameplaythrough deception, but this collides directly with clarity as a core value: the game should never deceive players. The player should deceive other players!

 

 

It was easy to hide the old particle, but the resulting gameplay was deceptive. The new particle communicates the gameplay clearly.

On this point, creating gameplay through intentional miscommunication doesn’t actually add depth or personal mastery. One Karthus may be strategically and tactically superior to the other, but if the better Karthus loses because he didn’t know the skittle extended beyond its indicated hitbox, that’s not a victory that can be chalked up to skill. The job of clarity is to refine knowledge such that both parties can make intelligent choices. If one player makes a fatal error (either due to a lack of knowledge or mechanical skill), they should lose due to their opponent’s superior skill, not the inconsistency of a game rule (that all particles accurately represent their hitboxes).

 

 


Onwards Banner


 

We’re passionate about pushing League of Legends to be more readable, understandable, and usable – all so that we can put the focus back on personal mastery. On that note, while clarity is a design value we’ve been pursuing for some time, it’s also one where we have great opportunities to grow. Our hope is that as we continue to add more clarity to League of Legends, we’ll also be pushing the envelope of player skill.

Either way, we absolutely welcome your feedback on all of these points – and call us out when we fall flat! If you have any questions, comments, or suggestions on how we can improve the game from a clarity standpoint, be sure to leave them in the comments.

 


Jungle Timers Small QA Banner



 

[ Question ] If I don’t have vision on the enemy’s jungle camp will the timer go off?

 

RoboLions RoboLions: You only get the timer if you were there for the kill, just like the minimap icon on live.

 

 

 

 

[ Follow-up Example ] So if I see it without any monsters, i.e. the camp died 2 minutes prior to me seeing the camp, does the timer start at 3 minutes, or does it not start at all?

 

RoboLions RoboLions: You don’t get a timer in that case. You will only see that it is dead, until it is not dead, just like the minimap.

 

 

 

 

[ Follow-up ] What if I leave a ward at the enemy buff?

 

RoboLions RoboLions: Good question: Since you saw the death, thanks to your ward, you’ll have the timer.

 

 

 

 

[ Clarity ] 

 

RoboLions RoboLions: You will only see that the buff is not alive. Since you missed the actual time of death you don’t get a respawn timer, it’ll show -:– for the timer instead. When the camp respawns it’ll show up as alive, just like the minimap on live. 🙂

 

 

 

Riot opposed Curse Voice because it didn’t give the timers to everyone

 

Phreak Phreak: Yep, that’s the major distinction.

We do not want third-party mods directly affecting in individual player experience. We don’t want League to be a game where you say to your friend, “Hey come try out this game… But if you actually want to win, make sure you download these five additional programs.”

 

 

[ Opinion ] Jungle Timers are taking away from game knowledge players need to develop

 

PhreakPhreak: You still have to keep track of them yourself. But typing “12:20 tb” and pressing Z to check up on it is really no different from pressing Tab and looking at the top of the screen. In fact, inferring your opponents’ timers based on their buffs’ remaining duration even though you didn’t see them is still a skill you’re going to have to retain.

 

 

If you have any questions, feel free to ask me at @NoL_Chefo or e-mail me at nolchefo@gmail.com.

 

 

 

News C2E2

 

 

 

PBE 25 April


 

Previous PBE Updates from Patch 4.7 Cycle:

 

 

New Animations for Flash, Cleanse, Exhaust and Clarity

 

 

Braum New Portrait

 

Q BraumWinter’s Bite [ Q ]

  • Mana cost reduced from 60/65/70/75/80 to 55/60/65/70/75

 

Dragonslayer Braum Passive Icon

 

Check in “Single Posts” for context.

 

Dragonslayer Braum Passive

Dragonslayer Braum Passive

 

 

Lyte AFK Topic

Lyte hopped on a popular thread on Reddit to discuss what’s being done to address unfair scenarios in Ranked.

 

 

Do you think you can better handle player disconnects / AFKs in Ranked?

 

Lyte Button Rioter Lyte: Actually, we agree that we could do more when it comes to better feedback loops (like giving players more information about the results of their reports) or better ways to handle AFKs/DCs.

For example, we’d like to restart games if players fail to connect in the first few minutes, and we’d like to put more aggressive measures into Ranked Modes. But, it takes time to research the underlying problem space and truly understand how to improve it.

We have been working on Team Builder for awhile, and are interested in exploring a version of Team Builder for Ranked Modes–this should address a lot of the frustrations players currently experience with Ranked and do so more effectively than one-off small band-aid features. We want to improve the foundation of the experience, which is way better than giving players better ways to report one another. We want to prevent negative triggers, not just give players ways to react to negativity.

When we start advancing further into the research and prototyping for a version of Team Builder in Ranked, we’ll work on some of the smaller features that are ‘obvious’ along the way. For example, in Team Builder, we actually can do stuff like temporarily ban players from Ranked Modes, or automatically mute players after a streak of negative behaviors.

We took a lot of risks with Team Builder, and we fully plan on taking more risks when exploring the Team Builder for Ranked space. Ranked is my main mode after all, and I’ve accrued over 3000 games in the last few seasons–I’m excited to think about what we can do with this space and I hope players are too.

 

 

How was Team Builder a risky undertaking?

 

Lyte Button Rioter Lyte“Let’s be fair, how is restarting games when a player fails to connect risky? How’s giving players more feedback about their reports risky?

Risk could be assessed in a variety of ways–how much impact a feature will actually have on a problem space (and the cost it took to implement it), the player perception of the feature (i.e = whether they support it or not, or think it’s fair or not), and the long-term engagement of a feature (i.e = is the effect of the feature robust enough to last through years? Or, will players stop using it after a few weeks?)”

 

 

Why is nothing being currently done to address these issues?

 

Lyte Button Rioter Lyte: Well, I wouldn’t say nothing is done about it. Players who AFK/DC are actually automatically banned for X games, and they lose LP regardless of the team winning or not.

We could increase the punishment for AFK/DCs, but that doesn’t solve the real problem; the real problem is that you, as a player in the game, feel helpless because you are left playing a 4v5 and 4v5s are extremely tough to win. You feel helpless because a player can AFK/DC and basically force you into a high chance of losing LP.

This problem is actually pretty complicated, and isn’t fixed by just letting you leave games with no LP loss. For example, what about premade situations? Can 2 friends queue up, and 1 friend always leave when they have a disadvantage, allowing the 2nd friend to leave with no penalties?

Do you know how many more games would never complete and would ‘reset’ in 5 minutes, if this feature was implemented? Can you imagine the frustration of playing 5-6 games in a row, and 2 hours later getting 0 LP and completing 0 games?

Again, players that AFK/DC often are automatically banned. I agree, we could improve the experience for the remaining 4 players in the game, but that’s not actually a simple problem.

 

 

Will you add picking Champions to Team Builder?

 

Lyte Button Rioter Lyte: We definitely wouldn’t want to incorporate Champion picking as early as standard Team Builder, because team synergy is more important in competitive League; however, there’s still a question of whether enforcing the meta is OK in Ranked Team Builder and whether that makes it extremely difficult for players to evolve the meta over time.

 

 

League in Chicago C2E2


 

This weekend, for the first time ever, we’re packing up and heading to the Chicago Comic & Entertainment Expo (C2E2)! Our expo booth will feature live art demos with Riot artists, a gallery of jaw-dropping community art, and 360 degree video booths where players can digitize their C2E2 experience with Teemo. We’re also sponsoring the Crown Championships of Cosplay and the Cospitality Lounge, where cosplayers can get dressed, touch up, and chill out.

Can’t make it to C2E2 April 25 to 27? Check out our live coverage on Twitter and tumblr.

Miss the League action at PAX East? We’ve got you covered with tons of cosplay, booth, and behind-the-scenes shots on our tumblr.

 

C2E2

C2E2 Poster

 

 

Single Posts banner


 

 

Will Warwick be the next rework?

 

ZenonTheStoic Button Rioter ZenonTheStoic: Warwick’s not next. Sion’s going to be before Warwick. Warwick is a bit smaller in scope. Sion is going to be a massive overhaul of the champion.

 

 

 

Will Sion be fully relaunched?

 

MeddlerButton Rioter Meddler: Yeah, full relaunch is the plan for Sion. Looking at a complete visual overhaul, mainly or entirely changed kit (focusing on the undead juggernaut part of his current kit has) and some thematic tweaks.

 

 

 

Follow-up: How far into Sion’s rework is the team?

 

MeddlerButton Rioter Meddler: In progress (kit and visuals), but not mostly done – while yet. Stuff so far’s looking cool though, both visually and in general.

 

 

 

Why was Dragonslayer Braum’s Passive Icon changed?

 

RiotWrekz Button Rioter RiotWrekz: This is a totally reasonable question.

Braum’s passive requires a lot of ally interaction, probably the most of any ability in our game outside of thresh lantern. Braum getting Concussive Blows on an enemy is a call to action for his allies to focus fire that target, as a result the call needs to be very clear. We evaluated these things and made the decision that changing the iconography on his skin was too different from the base for allies to be expected to follow up in the way that we wanted, so instead took an approach to make changes to the base icons color that make it feel at home on the skin while still maintaining a consistent and readable shape language/symbol.

We totally think that the dragon face icon was cool, but pushing towards our game design goal of clarity we felt in this case making the gameplay oriented decision of providing a consistent symbol was the best choice for all players experiences.

 

 

 

If you have any questions for me, feel free to ask me at @NoL_Chefo.