Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

V I S UA L E F FEC T S T H E C O M P L E T E G U I D E T O C R E AT I N G P R E

V I S UA L E F FEC T S T H E C O M P L E T E G U I D E T O C R E AT I N G P R E PA R E D B Y T H E L E A G U E O F L E G E N D S V F X D I S C I P L I N E W I T H I N L E AG U E O F L E G E N D S 2 C O N T E N T S OVERVIEW Our philosophy and goals towards creating compelling visual fx GAMEPLAY Areas of focus, representing the gameplay space, and level of importance VALUE Determining and using value ranges COLOR Color relation, hue usage, saturation levels, and color palette examples SHAPES Shape language, shape silhouettes, and illusion of movement TIMING Communicating gameplay, animating accurate movement, and reducing visual noise I IV II V III VI OVERVIEW S E C T I O N I 4 VFX GOALS: — PROVIDE VISUAL CLARITY FOR GAMEPLAY — MINIMIZE VISUAL CLUTTER — DELIVER VISUAL EFFECTS THAT PROMOTE A CHAMPION’S THEMES — CREATE EFFECTS THAT SURPRISE AND DELIGHT PLAYERS Whether it’s magic, fire, smoke, explosions, or the occasional sparkle, the visual effects discipline at League is tasked with bring- ing all these elements to life. They understand game design and translates artwork to visualize the magical world of Runeterra. Over the years, we have developed a unified visual style that’s set to hit a core group of goals. S E C T I O N I / / O V E R V I E W OUR PHILOSOPHY GAMEPLAY S E C T I O N I I 6 DEFINING GAMEPLAY BY CREATING AREAS OF FOCUS S E C T I O N I I / / G A M E P L AY PRIMARY ELEMENT RULES — IT IS AN EFFECT’S FOCAL POINT — IT SERVES AS THE SPELL’S MAIN PURPOSE — THE EFFECT COMMUNICATES GAMEPLAY CLEAR AND ACCURATELY SECONDARY ELEMENT RULES — THE ELEMENT ENHANCES A CHAMPION OR SPELL’S THEMATIC — IT SUPPORTS THE PRIMARY ELEMENT BY PUSHING VALUE AND SATURATION — THE ELEMENT UTILIZES MULTIPLE HUES AND A WIDER SATURATION RANGE TO ENHANCE AN EFFECT’S OVERALL VISUAL APPEAL VFX is closely connected to gameplay and visual design. Our VFX artists must have a deep understanding of League of Legends to clearly translate gameplay into a visual experience that is compelling and readable. In order to do that, we’ve defined a series of primary and secondary elements for each experience we create. This serves as our guiding light to ensure every visual effect promotes gameplay clarity by emphasizing the focal point of the effect, as well as reducing overall visual noise that may confuse players while it occurs. PROJECT LEONA’S W Leona’s W (Eclipse) forms a shield around her that explodes. The primary element should be the border of the Eclipse spell; in order to avoid the explosion, players must be able to easily identify the effect’s radius. The secondary effects are the faint electric energy within the circle. They are used to enhance the project skin line’s theme. A guide on how to define primary and secondary elements S E C T I O N I I / / G A M E P L AY AREAS OF FOCUS 7 PRIMARY ELEMENTS — HIGH VALUE RANGE — STRONG CONTRAST IN VALUE OR SATURATION — CLEAR SILHOUETTE — HIGH OPACITY — STRONG SHAPE — INTENSE MOVEMENT SECONDARY ELEMENTS — LOWER VALUE RANGE — SMALL SIZE — BLURRY SILHOUETTE — LOW OPACITY — SIMPLE SHAPE — SUBTLE MOVEMENT 8 S E C T I O N I I / / G A M E P L AY ACCURATE REPRESENTATION OF AREAS OF EFFECT Clarity is paramount for a competitive experience that is meant to be played and watched. Providing an accurate representation of gameplay allows players and viewers to clearly understand and anticipate gameplay. ACCURATE REPRESENTATION Omega Squad Teemo shows the AoE with a subtle ring, and the explosion was made to accurately communicate the area of effect. INACCURATE REPRESENTATION The radius of Teemo’s mushroom explosion is about 600 units. However the mushroom’s explosion only covers half of its radius and an area indicator is missing. 9 S E C T I O N I I / / G A M E P L AY ACCURATE REPRESENTATION OF EFFECT HITBOXES Clarity is paramount for a competitive experience that is meant to be played and watched. Providing an accurate representation of gameplay allows players and viewers to clearly understand and anticipate gameplay. ACCURATE REPRESENTATION DJ Sona’s ultimate shows the rectangular AoE clearly. The effect is shown at ground level so that the camera angle doesn’t affect its position. INACCURATE REPRESENTATION Sona’s old ultimate covered a wider range than its actual size. It often confused players when Sona’s ultimate missed a target but the visuals connected with the target. 10 An effect’s visual presence should communicate its degree of impor- tance to players and viewers. For example, if a champion’s basic attack effect had the same visual importance as her ultimate, it can confuse the player or viewer. Also this makes the ultimate less satisfying. In order to determine these levels of importance, we map specific aspects of VFX to spells’ power spikes. This ensures that the form matches the function of all visual effects. While determining an effect’s level of importance, we evaluate 3 core components: S E C T I O N I I / / G A M E P L AY READABLE Players and viewers can immediately understand an effect’s purpose EMPHASIS Visual effects direct players to focus on important spells while reducing the visual noise in team fights SCALE OF IMPORTANCE Each visual effect should match its level of importance to gameplay LEVEL OF IMPORTANCE LUX BASIC ATTACK VS ULTIMATE Since the impact of Lux’s Ultimate is so much greater than her basic attack, it should always be visually louder. 11 The level of importance can be controlled by size, shape, timing, value, saturation and opacity. The importance of each particle should be determined by the effect’s level of impact to gameplay, as shown below. S E C T I O N I I / / G A M E P L AY SCALE OF IMPORTANCE IDLE PARTICLE — LOW OPACITY — BLURRY SHAPES — SUBTLE MOVEMENT DEFENSIVE SPELL — LOW SATURATION — LOW OPACITY — BLURRY SHAPES — SUBTLE MOVEMENT GAME CHANGER — HIGH SATURATION — HIGH OPACITY — HIGH VALUE RANGE — CLEAR SILHOUETTE — INTENSE MOVEMENT BASIC ATTACK — SMALL SIZE DAMAGE SPELL — HIGH SATURATION — HIGH OPACITY — CLEAR SILHOUETTE ULTIMATE — HIGHEST SATURATION — HIGHEST OPACITY — HIGHEST VALUE RANGE — LARGE SIZE — IMPACTFUL ANIMATION VALUE S E C T I O N I I I 13 HOW TO DETERMINE VALUE RANGE UI VALUE RANGE CHARACTER VALUE RANGE ENVIRONMENT VALUE RANGE Manipulating value range is the key to communicating magical effects. All magic and energy have a different level of value range and opacity to ensure they represent the power levels of each visual effect correctly. To make sure these stay cohesive throughout the game, we adhere to a few guidelines when creating visual effects. S E C T I O N I I I / / VA L U E VFX VALUE RANGE GUIDELINES — HIGHER VALUE RANGE DRAWS MORE FOCUS — CONTRAST CAN CREATE A CLEAR AREA OF EFFECT — AVOID USING 100% OR 0% VALUES, AS IT CAN BE CONFUSED FOR THE GAME ENVIRONMENT OR UI VALUE RANGE BY EACH DISCIPLINE VFX VALUE RANGE 14 VALUE RANGE IN CONTEXT S E C T I O N I I I / / VA L U E UI VALUE RANGE CHARACTER VALUE RANGE ENVIRONMENT VALUE RANGE VFX VALUE RANGE 15 S E C T I O N I I I / / VA L U E ENHANCING MAGICAL EFFECTS BY USING PROPER VALUE RANGE In Master Arcanist Ziggs’s Bouncing Bomb, Pushing the value at the center of magical effects can help to make the effects look more powerful and magical. ACCURATE REPRESENTATION By pushing the value to the center of the bomb, there is a clearer focus to the effect. This makes it easier for players to notice the spell in team fights. INACCURATE REPRESENTATION With no visual “center” to the effect, it is difficult to no- tice where the effect is going to deal the most damage, as it falls into the background of the map. 16 ACCURATE REPRESENTATION With glow and illumination applied, there is so much more life to the effect. This also assists in conveying the motion, direction, and duration of the effect. INACCURATE REPRESENTATION Without an illuminated effect applied, the effect loses a lot of life and feeling of magic. S E C T I O N I I I / / VA L U uploads/s3/ lol-guide.pdf