Frozenbyte Wiki - User contributions [en]

Level art task

2021-12-08T13:25:18Z

Tero Tirkkonen: /* How To Use Trine 3 Editor */

[[File:Task1.png|right|thumb|700px|Blocked level art base geometry, guide for the level art assignment]]
[[File:Task3.png|right|thumb|700px|A area and B area]]

= Level Art Assignment =
* Your task is to complete the given collision-blocked map. We are looking for an appealing and coherent end result. Your work doesn't need to be 100% finished, but it should give us an idea of your skills with asset placement, composition and lighting.
* You can, for example, create a level art base that could be continued later by adding more detailed level art elements and assets.
* Feel free to change the level in any way you want to make it more to your liking. For example, you can continue the map and design your own area displaying your talents from blocking to the finished level art.
* You can refer to Trine 3 levels, especially the tutorial levels, for inspiration. It's not forbidden to copy some parts of the Trine 3 levels as long as you blend them with your own unique level.
* We recommend using Trine 4: The Nightmare Prince and Trine 4: Melody of Mystery as visual references as well.
* We can see your potential even from a small area brimmed with polished and high-class art - no need to stress yourself over the amount of material needed. Quality overcomes quantity every time!

== Assignment info ==
* Create an environment using the '''Trine 3 editor'''
* The task should be completed in '''4 weeks'''
* Familiarize yourself with the Trine style level art by reading the necessary '''[[Level Art]] pages'''.
* Once you have finished the task, please return '''the map file''', so we can play your level and see your level art from the player's perspective.
* Record '''a video''' where you run through the level and showcase your work. We might not have enough time to play your level, so consider this video as the most important piece of your assignment and the main reference we use when evaluating your work.
* Add between '''2-8 screenshots''' of your favorite spots on the level.

=== The mandatory task ===
* Note: You must complete the task described here to apply
* The level has two areas: Area A and Area B. Area A comes with already-blocked collision boxes to give you an example of the terrain shapes to use
* Build your level art on top of Area A
* Build the lighting setup as well. Use atmospheric effects, like fog, to make the environment feel more believable.
* Create a strong and well-working base geometry. We're looking for something that is both interesting and visually pleasing. The level should have a clear theme.
* The most important aspects of your work are composition, asset placement and lighting.

=== The optional task ===
* Note: This part is not required to apply, but if you're willing, feel free to do it as well.
* Area B has no shapes, as we'd like to see you creating the base geometry there.
* Area A and Area B can be of the same size, but if you want to build a custom-sized Area B, that's fine as well.
* Please leave the collision box blocked shapes to the collision layer, so we can see the base shapes you've used.

=== You will get bonus points for ===
* Demonstrating your ability to transform your unique ideas to a well-executed level art.
* Using the available game assets creatively
* Polished end result
* Clean and optimal approach to level-building, making it easy for others to continue editing your level.

== General Level Art Workflow Tips ==
* Check out the content of our [[Level Art]] sites to familiarize yourself with our level art process and the basics of level art theory. There's plenty of tips available, too!
* Don't be afraid to hijack our assignment and take it in any direction you want to, as long as it shows off your abilities as a level artist. We want to see your visual level building skills, so show them the way that suits you best.
* You can use any assets in the Editor, but try to keep your level coherent and sensible. On the other hand, don't forget that Trine is a fantasy world where anything is possible.
* Keep the limitations of the real-time 3D in mind when creating the environment and use assets with optimization in mind.
* Keep the collisions on the collision layer and add art on the art layer.
* Pay special attention to the composition, asset placement and lighting, as those are the aspects we're most interested in.
* Start with the big shapes. When they are satisfactory, concentrate on the finer details. Use an iterative approach, building the whole level layer by layer.
* Do not scale the objects too big, causing the texture resolution to suffer. A good rule of thumb is that you can scale an asset 20% bigger or smaller than the original size. You can, of course, break these rules if the final result looks amazing.
* Don't forget the lighting, but carry it along the whole level art process starting from the very beginning. Considering lighting implementation is crucial when placing assets into the scene - and so is adjusting the lighting while progressing with the level art.
* The assets can be used in many ways: Don't let obvious approaches or any assumed purpose restrict your creativity! As long as it looks good, anything is allowed.
* When creating a level for an actual game project, you need always to consider gameplay aspects carefully. In this assignment, however, we're evaluating your artistic eye, so don't worry if your gameplay isn't fine-tuned. For example, it's not crucial to match all the collisions perfectly everywhere.
* Remember to test your level with actual characters and run around in your level. We're looking only at those things that the player can see through the cameras while playing the level.
* To come up with interesting ideas for your environment, we recommend using real-life geography and/or architecture as reference material. For this task, you can also use other games (especially Trineverse games) as references.
* Don't worry too much if using the Editor feels difficult at first. Focus on showcasing your skills at creating believable environmental settings by building appealing shapes and lighting arrangements.
* You'll use the publicly released Trine 3 Editor for this assignment. Our current in-house Editor differs a lot from the Trine 3 version since it has undergone a lot of upgrades and improvements. For example, it has a new renderer with pbr materials and a lot of new assets that are all missing from the Trine 3 Editor.
* If we'll hire you, you'll be trained to use our latest Editor version.
* If you have problems with the Editor, please don't hesitate to contact us.

= How To Use Trine 3 Editor =

This page should have all the basics you need to know to learn how to use the editor. It is a lot of information and work to learn to use a new tool and to build a level so we encourage you to ask in case you run into any problems. Just send us any questions you've got and we'll help you to get back on track! The most basic necessities for any map are CamerasystemPrefab, AmbientLightEntity and ColoreffectEntity, they have been added to the map already. After that come collisions and art assets follow. There are many assets for creating beliveability and atmosphere to the level. Lights and fogs for example are very important when creating the look of the level. Try checking the Trine 3 levels and how these things are done in them, for example how waterfall effects in Amadeus's Beach Tutorial level are built. The tutorial levels are all in one level file vertically placed so for the Amadeus's level you need to travel down quite a bit to get there in the Editor.

How to access the required map file: Collision base map is on its own map file. Go to editor, then File > Open map > Open the editor file location binary/data/mission/[test map name].fbe. The map file isn’t automatically in the editor and you have to add the file yourself to this location.

== Basic windows in editor ==

=== Object properties ===
Show '''Object Properties''' dockable window using '''View > Object Properties''' or using '''Ctrl + P'''.

With this window you can modify object's properties.

The properties inside components can be set in alphabetical order from the editor settings: Tools > Options > Properties > "Order Properties In Property Grid".

Components and properties can also be [http://wiki/index.php/Search_properties_and_components_in_Object_Properties_window searched] for inside the window.

=== Scene instance tree ===
Show '''Scene instance tree''' dockable window using '''View > Scene instance tree''' or using '''Ctrl + F2'''.

With this window you can see all instances in the scene/level.

=== Type tree ===
Show '''Type tree''' dockable window using '''View > Type tree''' or using '''Ctrl + F3'''.

With this window you can find entites/types which can be inserted into scene/level.
For example all the 3D art assets, lights and fogs can be found here.

=== Category ===
Show '''Category''' dockable window using '''Categories > Category root''' or using '''Ctrl + Shift + F1'''.

Category window is a configurable window, where you can insert shortcuts to entities/types which you want to insert into scene/level.

=== Resource tree ===
Show '''Resource tree''' dockable window using '''View > Resource tree''' or using '''Ctrl + F4'''.

With this window you can see all the [[resource]]s which are available.

=== Recent objects ===
Show '''Recent objects''' dockable window using '''View > Recent objects'''.

With this window you can see recent types you have used.

=== Modules ===
Show '''Modules ''' dockable window using '''View > Modules'''.

With this window you can modify Module properties which affects various things in editor / engine.

=== Error list ===
Show '''Error list''' dockable window using '''View > Error list'''.

This window shows errors, warnings and info messages generated by editor and engine. Very usefull tool for debugging what's wrong.

=== Reference list ===
Show '''Reference list''' dockable window using '''View > Reference list'''.

When selecting some type or instance you can see '''ReferenceString''' property in the '''Property Window''' and by clicking it with mouse right button and selecting '''Show Reference list''' from the context menu, you can print type's or instance's reference list into this window.

== Basic controls in editor ==

=== Moving camera ===
* WASD - Move camera
* Shift + WASD - Move camera faster
* Right mouse button and drag - Rotate the view

You can also press any of the axes on the editor gizmo on the right upper corner. Pressing on the axis changes the camera rotation to coincide with that axis.

[[File:Gizmo.png]]

=== Object selection ===
* Left mouse button - Select object
* Alt + Left mouse button - Select object behind another object (You may need to click multiple times to select the desired object)
* Shift + Left mouse button - Select multiple objects
* Ctrl + Left mouse button and drag - Box select, select objects in area (if you are selecting a vast amount of objects at once it can be a good idea to de-select View->Tree Update Enabled so the procedure will be faster, but do remember to re-select it after, otherwise you won't be able to operate the object properties)

=== Tool selection ===
* 1 - Move tool
* 2 - Rotate tool
* 3 - Scale tool
* 4 - Area tool
* 6 - Scale specific side tool

=== Copying and pasting ===
* Ctrl + C - Copy selected object(s)
* Ctrl + X - Cut selected object(s)
* Ctrl + V - Paste copied object(s)
* Ctrl + Shift + V - Paste copied object(s) onto the same coordinates they were copied from
* To duplicate an object, hold Shift and move object from one of the arrows while having move tool selected
* You can copy & paste items between separate levels too

=== Undo and Redo ===
* Ctrl + Z - Undo
* Ctrl + Y - Redo

=== Other useful buttons ===
* Space bar - Toggle between Global, Local and Screenspace transform and rotation
* K - Allows you to see lights through collisions
* J - Makes the lights stay the same size no matter how far you are from them
* Ctrl + T replaces selected instance in the scene with the type selected in type tree
* L - Hides lights
* G - Hides lights and all objects that don't have the VisibleInGame on
* P - Selecting an instance within a scene and pressing P Locates selected instance in the type tree
* Ctrl + G - Hides grid
* Control + Left click on a layer hides it.

=== Editing objects ===
Click an object you want to edit in the level. Three arrow or circles should appear depending on what tool you have selected. Use these arrows/circles to move, rotate and scale the object on X, Y and Z axis.
'''Note: You can select objects only from currently selected layer. Change layer by clicking Def., Col., 1, 2... from the tool bar or with Alt + 9, 0, 1, 2, ...'''

[[File:layers.png]]

It's also possible to choose objects on any layer if you want to. Go to Selection -> Selection filter locking and untap the '''Allow selection on active layer only'''.
Just make sure that you keep objects on their dedicated layers if you decide to use this.

=== Editing object properties ===
To edit an object's properties you need to open up the '''Object Properties''' dockable window via '''View > Object Properties''' and then selecting the Object you want to Edit.

=== Adding objects ===
Objects can be added from Type tree window. You can open it from '''View > Type tree'''. Use the Search field to find the objects you are looking for. Most of the time objects you want to use are located under '''TypeRoot/InstanceBase/Entity'''. Also remember to deselect any selected objects in Type tree before searching again.

Finding the right object from the type tree can be quite tricky if you don't know the exact name of the object. A good way to start is to copy them from existing maps.

When inserting objects, you can press and hold Shift and/or Ctrl. Holding Shift attempts to snap the object next to another object, when you move the object above an object already on the scene. Holding Ctrl snaps the movement of the object to the grid.

=== Testing map in editor and saving ===
To test your changes in editor press green play button (F5) to start the level or blue play button (Ctrl+F5) to start from camera position.

To return to editor from play mode, press the blue stop button (Shift+F5).

[[File:play_buttons.png]]

=== Some tips about the type tree ===
TypeRoot -> InstanceBase -> Entity -> ObjectEntity -> object You will find all the objects here

TypeRoot -> InstanceBase -> Entity -> LightEntity You will find all the lights here

Finding items in type tree can be a little bit tricky at times as some tiny problems may occur. When you search for something that has multiple types under it they might not show for some reason.
For example if you search for RockCollisionHelper in the type tree it might only show the RockCollisionHelper instead of all it's variations like BookRockCollisionHelper etc. This can be fixed by either
searching again by typing the desired thing in the search bar or manually clicking the tree to find it.
Also after using one object and then trying to find another object in the type tree, make sure to check the object you used isn't active anymore. Otherwise the Search bar won't search anything.
You can just click anywhere in the empty part of the map to make sure you don't have any object active.

=== Other useful tips ===

Tools -> Options -> properties -> Order Properties In Property Grid to get properties in property window ordered alphabetically

Tools -> Options -> Tool -> Selection highlight self illumination enabled to get rid of the blue highlight when selecting objects

The collisions have VisibleInGame on in this map so that you can see them when you play. It's good to turn them of after you have addded art on them so that you can take a better look at the art. You can make the collisions invisible by choosing the collision, going into its properties and tapping VisibleInGame off from the ModelComponent.

'''How to get FBX assets from the library''':
Type tree has all the assets (https://wiki.frozenbyte.com/index.php/Level_art_task#Type_tree), choose TypeRoot > InstanceBase > Entity > ObjectEntity > object. Component base has the same listing but they can’t be accessed, so make sure you choose InstanceBase and not ComponentBase. Click an asset on the list and move cursor to viewport, and the assets should appear on the cursor. Type tree also has a search function but it has known issues and won’t always work, so you need to be prepared to access files manually as described above. Remove the search word if you want to see all assets and not only limited results.

Resource tree only shows all assets already in the level, it can’t be used to access new ones.

== Lighting in editor ==
[[File:Trine3_lights.gif|thumb|A gif showing the effects of different types of lights on the scene.|480px]]
This page lists the most important LightEntities found in the editor and sheds some light (no pun intented) on their usage. There's a lot of general information about lighting in 3d games and related topics in the internet and elsewhere, so the interested reader is encouraged to do some independent searching for more in-depth discussion. Don't be discouraged by the large number of different properties that the LightEntities might have, most of them work with their default values.

What follows is a general overview of the different light entities you can find in the editor. In addition to general discussion, there are some examples of how each entity should be used.

=== AmbientLightEntity ===
Ambient lights are used in Trine 3 (and in games in general) to emulate the real world phenomenon of [https://en.wikipedia.org/wiki/Radiative_transfer radiative transfer] (energy transfer in the form of electromagnetic radiation, e.g. light). After photons are emitted, they are scattered, absorbed and re-emitted multiple times before finally reaching the viewer. This is one of the reasons why in nature there are no completely sharp or black shadows and that it's hard to find a completely dark place during daytime.

'''AmbientLightEntity''' is most often used as a global ambient light to set the base tone of the scene. If both color components are identical, they will create the effect of a uniformly lit scene. AmbientLightEntity can also be used as a directional light of sorts, if the Color2 component is a darker shade than Color1 component, as it is by default. This still mimics the behaviour of radiative transfer (absorption, emission, scattering), since AmbientLightEntity can't create shadows.

=== DirectionalLightEntity ===
[[File:Directional.png|thumb|DirectionalLightEntity causing an orthographic projection of shadows.]]
[[File:Directional_sunset_on_off.gif|thumb|A DirectionalLightEntity used in Pontius's tutorial for "sunset effect".]]
Directional lights are lights that emulate a light source that is infinitely wide and infinitely far, thus "emitting" light rays that are precisely parallel to each other. On Earth, direct sunlight can be approximated as parallel rays of light, and thus directional lights are used in Trine 3 to emulate sunlight and the sharp shadows caused by it. Another common use for directional lighting is a so-called skylight.

On an overcast day when no direct sunlight reaches the ground, objects are still clearly visible and lit. This is due to the light scattering from particles and water droplets in the atmosphere and reaching the ground through the clouds. The same phenomenon causes the sky to look blue during daylight and to be bright and colourful at all. If there was no atmosphere, there would be minimal scattering of light, resulting in a very dark sky and extremely harsh direct sunlight (among other, perhaps more lethal things), although the Sun would appear to be smaller in size. This is the physical phenomenon called [https://en.wikipedia.org/wiki/Diffuse_sky_radiation "skylight"], which is emulated in Trine 3 with a shadowless directional light that is perpendicular to the ground level, i.e. pointing straight down.

Although the effects of skylight and ambient light in the real world are based on the same physical principles (radiative transfer), in Trine 3 they aren't the same thing. Ambient light emulates the light that has already reached the ground and is just "bouncing back and forth" between different objects making everything look more or less the same from any viewing angle, whereas skylight is the diffuse light "coming straight down from the sky", making things look lighter and brighter from above rather than from below.

'''DirectionalLightEntity''' is a local directional light which uses an [http://db-in.com/images/projection_example.gif orthographic projection] instead of a perspective one. It's local in the sense that it's borders (field of view and range) can be chosen at will so that the light is projected only to a certain area. Most often DirectionalLightEntity is used as a local skylight for the background objects or to create other local but large-scale lighting conditions, like the appearance of a setting sun, as it was used in the beginning of Pontius's tutorial level.

'''SunDirectionalLightEntity''' is a global type of DirectionalLightEntity. It's range and field of view don't have any effect on it like they do on local directional lights. Like other directional lights SunDirectionalLightEntity casts orthographic shadows, but unlike any other light in the editor (except for AmbientLightEntity) it's position doesn't determine "where the light is coming from". The direction of the light can be changed only by rotating the SunDirectionalLightEntity, because it's thought to be infinitely far away.

=== PointLightEntity ===
[[File:Point.png|thumb|A PointLightEntity doesn't cause shadows.]]
[[File:Alpha_point.png|thumb|Fog and a PointLightEntity with RenderAlphaObjects.]]

Point lights are considered to be minuscule points that radiate isotropic light i.e. light that's the same in all directions. In the real world, only stars other than the Sun are considered point sources of light due to the great distance separating them from Earth. The closest thing to a point light on Earth is a light bulb without a lampshade. Since light bulbs without shades are a quite rare thing to see, point lights aren't a very authentic way to light a scene. The good thing is, they can be used together with other sources of light to create more natural lighting conditions. Point lights are also a very good way to highlight something and to make even small details easy to spot.

'''PointLightEntity''' is Trine 3's basic point light. It's color, intensity and range can be chosen to match the desired situation, whether it's large-scale orange-white light coming from bubbling lava or just a tiny speck of light coming from a glowing pink mushroom. PointLightEntity can also be used to cast light on only alpha objects, that is, objects like fog which don't have a solid frame.

PointLightEntity doesn't cast shadows at all and thus its light isn't blocked by any collisions or models. Be sure to take this into account, when you set the intensity and range of your point lights. Speaking of which, range and intensity can be tweaked with the '''scale tool''': When scaled from the middle of the scale tool's gizmo, both range and intensity are affected. When scaled on the green Y-axis, only intensity is affected, where as red x-axis affects range only. Blue line does nothing.

=== AmbientPointLightEntity ===
[[File:Ambient_point.png|thumb|An AmbientPointLightEntity is a local ambient light.]]
Ambient lights were discussed above and [[#AmbientLightEntity]] was said to be used as a global ambient light to set the tone of the scene. Like local directional lights, there are also local ambient lights. PointLightEntity can be used as a local ambient light by changing the property called '''AmbientFactor'''. When this is 0, the PointLightEntity works as a normal point light, but the closer it is to 1, the more it behaves like a local ambient light. This kind of local ambient light works in the same manner as global ambient lights, except it's range can be chosen at will.

=== PointLightEntity with RenderAlphaObjects ===
PointLightEntities can also be used to light alpha objects, like spiderwebs, fogs, clouds etc. In Trine 3 editor the '''RenderAlphaObjects''' property can be set to turn a PointLightEntity into an "AlphaBlendPointLightEntity".

It's noteworthy, that once '''RenderAlphaObjects''' is on, changing the '''Range''' property isn't anymore enough to change the actual range of the light, also the '''Radius''' property should be changed to the same value under PointLightComponent-->PointLightAreaComponent-->SphereAreaComponent->Radius. This only applies to manual editing of Range and Radius, if the scale tool is used to change the range of the point light, the radius is increased automatically.

=== SpotLightEntity ===
[[File:Spot.png|thumb|A SpotLightEntity and a perspective projection of shadows.]]
[[File:Shadow_quality_4.gif|thumb|SpotLightEntity shadows flickering on and off]]
Spot lights are like directional lights but the light projection is different. The light is projected in a cone and the shadow projection is perspective instead of ortographic. A flashlight is an example of a spot light. Spotlights are usually used in combination with point lights to create more realistic lighting conditions.

'''SpotLightEntity''' is the spot light of Trine 3. It shares many of the properties with DirectionalLightEntity (and SunDirectionalLightEntity), since DirectionalLightComponent is a child type of SpotLightComponent. A SpotLightEntity's range, color, intensity, fov and many other properties can be changed at will to reach the desired lighting conditions. SpotLightEntity has also a property called LinearFade. If it's false, the light attenuation of the spot light is more "natural" and fades faster. If set to true, the intensity of the spot light fades linearly, i.e. it's value decreases like 1.0/distance (instead of 1.0/distance squared).

SpotLightEntities have '''ShadowQuality''' set by default to ShadowQuality4. If there are more than four SpotLightEntities with ShadowQuality4 in view, the shadows will start flickering. The same applies to SpotLightEntities with lower ShadowQuality so that
* 4 x ShadowQuality1 = 1 x ShadowQuality2
* 4 x ShadowQuality2 = 1 x ShadowQuality3 and
* 4 x ShadowQuality3 = 1 x ShadowQuality4

All in all there can be a maximum number of 10 shadow casting SpotLightEntities in view at the same time.

<gallery>
File:Ambient_prop.png|AmbientLightComponent
File:Point_prop.png|PointLightComponent
File:Alpha_point_prop.png|Radius, Range and RenderSolid/AlphaObjects.
File:Spot_prop1.png|SpotLightComponent, DirectionalLightComponent and SunDirectionalLightComponent have the same properties, with slightly different settings.
File:Spot_prop2.png|SpotLightComponent cont.
</gallery>

=== ColorEffectEntity ===
[[File:Coloreffectentity.gif|thumb|Different ColorLookupTextures.]]
'''ColorEffectEntity''' is a scene wide effect that sets the tone of the scene. The '''Exposure''' property can be used to change the exposure of the whole scene, i.e. to make the scene globally darker or lighter. The '''ColorLookupTexture''' property can be used to choose a color look-up table from the ones created for the game in question. These can be found under \data\root\instance_base\entity\texture\color_lookup.

=== Bloom ===
[[File:Bloom_lens_flare.gif|thumb|Lens flare effect of bloom.]]
[[File:Bloom_effect_entity.png|thumb|BloomEntity]]

=== General ===
Bloom is a shader effect used in game engines to emulate imaging artifacts of real-world cameras, like [https://en.wikipedia.org/wiki/Lens_flare lens flare], [https://en.wikipedia.org/wiki/Dynamic_range#Photography finite dynamic range] and [https://en.wikipedia.org/wiki/Airy_disk airy discs] caused by the diffraction of light.

In game engines, bloom effect can be used to create a dream-like visual style or emphasize a magically glowing objects. With the right settings it can also enhance the photorealism of the scene by emulating the above mentioned effects.

=== BloomEntity in the editor ===

BloomEntity (BE) can be found from "InstanceBase/Entity/SceneEntity/BloomEntity". BE is a global effect and it has many properties in it's GlowComponent, but most of these don't need to be touched by the user. The two most important ones are:
* Factor
** Determines the weight of the particular BE, if there are more than one in the scene. Mostly used for animation purposes.
* StreakLength
** Setting this to 0 removes the lens flare effect, which is dependant on the relative direction of the BE.

=== Properties of glowing objects ===

Normal entities can be made to glow, like the collisions used in the pictures. Every entity with a ModelComponent has four properties that determine their behaviour with BE. These are:
* SelfIllumination
** The colour of the self illumination. Like the name says, used for objects that are supposed to be self illuminated, like sun, moon and lamps.
* SelfIlluminationFactor
** The strength of the self illumination. Example values used for different entities are 1000 for sun, 2 for moon and 15 for a bright lamp.
* GlowAmountColor
** The colour of the glow effect. Like self illumination, but this adds a soft halo around the object.
* GlowAmount
** The strength of the glow effect. Values usually around or less than 1.

Usually self illumination and glow are used together to achieve the best result.

<gallery>
File:self_ill.png|Self illumination.
File:Glow.png|Glow.
File:Combined.png|Self illumination and glow combined.
</gallery>

=== Additional Shadows ===
There are 3 kinds of shadows: '''fake_shadow_gradient.fbxmodel''', '''fake_shadow_gradient_radial.fbxmofel''' and '''fake_shadow_solid.fbxmodel'''. The solid one is used to block lights by placing the black area to point towards light source (the other side is invisible).
The other two are used to give walls etc some extra shading.

Some ground art pieces are kinda bumpy and there are times when they might look a little bit funny after lights have been added. This can be fixed by using ShadowBias that can be found on the object's properties and changing it to 0.1. Below will be examples and you can see how big the difference is.

<gallery>
File:Level_art_tutorial_withoutshadowbiasv2.png|Before adding ShadowBias
File:Level_art_tutorial_withshadowbiasv2.png|After adding ShadowBias
</gallery>

=== Fog ===
Fogs can be found in Typeroot -> InstanceBase -> Entity -> ObjectEntity -> object -> atmosphere-> fog

'''CircleFogAreaEntity''' and '''SquareFogAreaEntity''' are used to create atmospheric effects and distance fog. It can be found in the type tree under LightEntity. FogAreaEntities work similiarly to DirectionalLights. Use Scale tool to edit Range, Fov and intensity. In Properties under SpotLightComponent you can adjust Color of the fog and thickness. Change Linear overbrightness to make the fog more or less thick. 1 is really thick and -1 is completely transparent.

Level art task

2021-12-08T08:45:20Z

Tero Tirkkonen: /* How To Use Trine 3 Editor */

[[File:Task1.png|right|thumb|700px|Blocked level art base geometry, guide for the level art assignment]]
[[File:Task3.png|right|thumb|700px|A area and B area]]

= Level Art Assignment =
* Your task is to complete the given collision-blocked map. We are looking for an appealing and coherent end result. Your work doesn't need to be 100% finished, but it should give us an idea of your skills with asset placement, composition and lighting.
* You can, for example, create a level art base that could be continued later by adding more detailed level art elements and assets.
* Feel free to change the level in any way you want to make it more to your liking. For example, you can continue the map and design your own area displaying your talents from blocking to the finished level art.
* You can refer to Trine 3 levels, especially the tutorial levels, for inspiration. It's not forbidden to copy some parts of the Trine 3 levels as long as you blend them with your own unique level.
* We recommend using Trine 4: The Nightmare Prince and Trine 4: Melody of Mystery as visual references as well.
* We can see your potential even from a small area brimmed with polished and high-class art - no need to stress yourself over the amount of material needed. Quality overcomes quantity every time!

== Assignment info ==
* Create an environment using the '''Trine 3 editor'''
* The task should be completed in '''4 weeks'''
* Familiarize yourself with the Trine style level art by reading the necessary '''[[Level Art]] pages'''.
* Once you have finished the task, please return '''the map file''', so we can play your level and see your level art from the player's perspective.
* Record '''a video''' where you run through the level and showcase your work. We might not have enough time to play your level, so consider this video as the most important piece of your assignment and the main reference we use when evaluating your work.
* Add between '''2-8 screenshots''' of your favorite spots on the level.

=== The mandatory task ===
* Note: You must complete the task described here to apply
* The level has two areas: Area A and Area B. Area A comes with already-blocked collision boxes to give you an example of the terrain shapes to use
* Build your level art on top of Area A
* Build the lighting setup as well. Use atmospheric effects, like fog, to make the environment feel more believable.
* Create a strong and well-working base geometry. We're looking for something that is both interesting and visually pleasing. The level should have a clear theme.
* The most important aspects of your work are composition, asset placement and lighting.

=== The optional task ===
* Note: This part is not required to apply, but if you're willing, feel free to do it as well.
* Area B has no shapes, as we'd like to see you creating the base geometry there.
* Area A and Area B can be of the same size, but if you want to build a custom-sized Area B, that's fine as well.
* Please leave the collision box blocked shapes to the collision layer, so we can see the base shapes you've used.

=== You will get bonus points for ===
* Demonstrating your ability to transform your unique ideas to a well-executed level art.
* Using the available game assets creatively
* Polished end result
* Clean and optimal approach to level-building, making it easy for others to continue editing your level.

== General Level Art Workflow Tips ==
* Check out the content of our [[Level Art]] sites to familiarize yourself with our level art process and the basics of level art theory. There's plenty of tips available, too!
* Don't be afraid to hijack our assignment and take it in any direction you want to, as long as it shows off your abilities as a level artist. We want to see your visual level building skills, so show them the way that suits you best.
* You can use any assets in the Editor, but try to keep your level coherent and sensible. On the other hand, don't forget that Trine is a fantasy world where anything is possible.
* Keep the limitations of the real-time 3D in mind when creating the environment and use assets with optimization in mind.
* Keep the collisions on the collision layer and add art on the art layer.
* Pay special attention to the composition, asset placement and lighting, as those are the aspects we're most interested in.
* Start with the big shapes. When they are satisfactory, concentrate on the finer details. Use an iterative approach, building the whole level layer by layer.
* Do not scale the objects too big, causing the texture resolution to suffer. A good rule of thumb is that you can scale an asset 20% bigger or smaller than the original size. You can, of course, break these rules if the final result looks amazing.
* Don't forget the lighting, but carry it along the whole level art process starting from the very beginning. Considering lighting implementation is crucial when placing assets into the scene - and so is adjusting the lighting while progressing with the level art.
* The assets can be used in many ways: Don't let obvious approaches or any assumed purpose restrict your creativity! As long as it looks good, anything is allowed.
* When creating a level for an actual game project, you need always to consider gameplay aspects carefully. In this assignment, however, we're evaluating your artistic eye, so don't worry if your gameplay isn't fine-tuned. For example, it's not crucial to match all the collisions perfectly everywhere.
* Remember to test your level with actual characters and run around in your level. We're looking only at those things that the player can see through the cameras while playing the level.
* To come up with interesting ideas for your environment, we recommend using real-life geography and/or architecture as reference material. For this task, you can also use other games (especially Trineverse games) as references.
* Don't worry too much if using the Editor feels difficult at first. Focus on showcasing your skills at creating believable environmental settings by building appealing shapes and lighting arrangements.
* You'll use the publicly released Trine 3 Editor for this assignment. Our current in-house Editor differs a lot from the Trine 3 version since it has undergone a lot of upgrades and improvements. For example, it has a new renderer with pbr materials and a lot of new assets that are all missing from the Trine 3 Editor.
* If we'll hire you, you'll be trained to use our latest Editor version.
* If you have problems with the Editor, please don't hesitate to contact us.

= How To Use Trine 3 Editor =

This page should have all the basics you need to know to learn how to use the editor. It is a lot of information and work to learn to use a new tool and to build a level so we encourage you to ask in case you run into any problems. Just send us any questions you've got and we'll help you to get back on track! The most basic necessities for any map are CamerasystemPrefab, AmbientLightEntity and ColoreffectEntity, they have been added to the map already. After that come collisions and art assets follow. There are many assets for creating beliveability and atmosphere to the level. Lights and fogs for example are very important when creating the look of the level. Try checking the Trine 3 levels and how these things are done in them, for example how waterfall effects in Amadeus's Beach Tutorial level are built. The tutorial levels are all in one level file vertically placed so for the Amadeus's level you need to travel down quite a bit to get there in the Editor.

How to access the required map file: Collision base map is on its own map file. Go to editor, then File > Open map > Open the editor file location binary/data/mission/[test map name].fbe. The map file isn’t automatically in the editor and you have to add .fbe -file yourself from said file location.

== Basic windows in editor ==

=== Object properties ===
Show '''Object Properties''' dockable window using '''View > Object Properties''' or using '''Ctrl + P'''.

With this window you can modify object's properties.

The properties inside components can be set in alphabetical order from the editor settings: Tools > Options > Properties > "Order Properties In Property Grid".

Components and properties can also be [http://wiki/index.php/Search_properties_and_components_in_Object_Properties_window searched] for inside the window.

=== Scene instance tree ===
Show '''Scene instance tree''' dockable window using '''View > Scene instance tree''' or using '''Ctrl + F2'''.

With this window you can see all instances in the scene/level.

=== Type tree ===
Show '''Type tree''' dockable window using '''View > Type tree''' or using '''Ctrl + F3'''.

With this window you can find entites/types which can be inserted into scene/level.
For example all the 3D art assets, lights and fogs can be found here.

=== Category ===
Show '''Category''' dockable window using '''Categories > Category root''' or using '''Ctrl + Shift + F1'''.

Category window is a configurable window, where you can insert shortcuts to entities/types which you want to insert into scene/level.

=== Resource tree ===
Show '''Resource tree''' dockable window using '''View > Resource tree''' or using '''Ctrl + F4'''.

With this window you can see all the [[resource]]s which are available.

=== Recent objects ===
Show '''Recent objects''' dockable window using '''View > Recent objects'''.

With this window you can see recent types you have used.

=== Modules ===
Show '''Modules ''' dockable window using '''View > Modules'''.

With this window you can modify Module properties which affects various things in editor / engine.

=== Error list ===
Show '''Error list''' dockable window using '''View > Error list'''.

This window shows errors, warnings and info messages generated by editor and engine. Very usefull tool for debugging what's wrong.

=== Reference list ===
Show '''Reference list''' dockable window using '''View > Reference list'''.

When selecting some type or instance you can see '''ReferenceString''' property in the '''Property Window''' and by clicking it with mouse right button and selecting '''Show Reference list''' from the context menu, you can print type's or instance's reference list into this window.

== Basic controls in editor ==

=== Moving camera ===
* WASD - Move camera
* Shift + WASD - Move camera faster
* Right mouse button and drag - Rotate the view

You can also press any of the axes on the editor gizmo on the right upper corner. Pressing on the axis changes the camera rotation to coincide with that axis.

[[File:Gizmo.png]]

=== Object selection ===
* Left mouse button - Select object
* Alt + Left mouse button - Select object behind another object (You may need to click multiple times to select the desired object)
* Shift + Left mouse button - Select multiple objects
* Ctrl + Left mouse button and drag - Box select, select objects in area (if you are selecting a vast amount of objects at once it can be a good idea to de-select View->Tree Update Enabled so the procedure will be faster, but do remember to re-select it after, otherwise you won't be able to operate the object properties)

=== Tool selection ===
* 1 - Move tool
* 2 - Rotate tool
* 3 - Scale tool
* 4 - Area tool
* 6 - Scale specific side tool

=== Copying and pasting ===
* Ctrl + C - Copy selected object(s)
* Ctrl + X - Cut selected object(s)
* Ctrl + V - Paste copied object(s)
* Ctrl + Shift + V - Paste copied object(s) onto the same coordinates they were copied from
* To duplicate an object, hold Shift and move object from one of the arrows while having move tool selected
* You can copy & paste items between separate levels too

=== Undo and Redo ===
* Ctrl + Z - Undo
* Ctrl + Y - Redo

=== Other useful buttons ===
* Space bar - Toggle between Global, Local and Screenspace transform and rotation
* K - Allows you to see lights through collisions
* J - Makes the lights stay the same size no matter how far you are from them
* Ctrl + T replaces selected instance in the scene with the type selected in type tree
* L - Hides lights
* G - Hides lights and all objects that don't have the VisibleInGame on
* P - Selecting an instance within a scene and pressing P Locates selected instance in the type tree
* Ctrl + G - Hides grid
* Control + Left click on a layer hides it.

=== Editing objects ===
Click an object you want to edit in the level. Three arrow or circles should appear depending on what tool you have selected. Use these arrows/circles to move, rotate and scale the object on X, Y and Z axis.
'''Note: You can select objects only from currently selected layer. Change layer by clicking Def., Col., 1, 2... from the tool bar or with Alt + 9, 0, 1, 2, ...'''

[[File:layers.png]]

It's also possible to choose objects on any layer if you want to. Go to Selection -> Selection filter locking and untap the '''Allow selection on active layer only'''.
Just make sure that you keep objects on their dedicated layers if you decide to use this.

=== Editing object properties ===
To edit an object's properties you need to open up the '''Object Properties''' dockable window via '''View > Object Properties''' and then selecting the Object you want to Edit.

=== Adding objects ===
Objects can be added from Type tree window. You can open it from '''View > Type tree'''. Use the Search field to find the objects you are looking for. Most of the time objects you want to use are located under '''TypeRoot/InstanceBase/Entity'''. Also remember to deselect any selected objects in Type tree before searching again.

Finding the right object from the type tree can be quite tricky if you don't know the exact name of the object. A good way to start is to copy them from existing maps.

When inserting objects, you can press and hold Shift and/or Ctrl. Holding Shift attempts to snap the object next to another object, when you move the object above an object already on the scene. Holding Ctrl snaps the movement of the object to the grid.

=== Testing map in editor and saving ===
To test your changes in editor press green play button (F5) to start the level or blue play button (Ctrl+F5) to start from camera position.

To return to editor from play mode, press the blue stop button (Shift+F5).

[[File:play_buttons.png]]

=== Some tips about the type tree ===
TypeRoot -> InstanceBase -> Entity -> ObjectEntity -> object You will find all the objects here

TypeRoot -> InstanceBase -> Entity -> LightEntity You will find all the lights here

Finding items in type tree can be a little bit tricky at times as some tiny problems may occur. When you search for something that has multiple types under it they might not show for some reason.
For example if you search for RockCollisionHelper in the type tree it might only show the RockCollisionHelper instead of all it's variations like BookRockCollisionHelper etc. This can be fixed by either
searching again by typing the desired thing in the search bar or manually clicking the tree to find it.
Also after using one object and then trying to find another object in the type tree, make sure to check the object you used isn't active anymore. Otherwise the Search bar won't search anything.
You can just click anywhere in the empty part of the map to make sure you don't have any object active.

=== Other useful tips ===

Tools -> Options -> properties -> Order Properties In Property Grid to get properties in property window ordered alphabetically

Tools -> Options -> Tool -> Selection highlight self illumination enabled to get rid of the blue highlight when selecting objects

The collisions have VisibleInGame on in this map so that you can see them when you play. It's good to turn them of after you have addded art on them so that you can take a better look at the art. You can make the collisions invisible by choosing the collision, going into its properties and tapping VisibleInGame off from the ModelComponent.

'''How to get FBX assets from the library''':
Type tree has all the assets (https://wiki.frozenbyte.com/index.php/Level_art_task#Type_tree), choose TypeRoot > InstanceBase > Entity > ObjectEntity > object. Component base has the same listing but they can’t be accessed, so make sure you choose InstanceBase and not ComponentBase. Click an asset on the list and move cursor to viewport, and the assets should appear on the cursor. Type tree also has a search function but it has known issues and won’t always work, so you need to be prepared to access files manually as described above. Remove the search word if you want to see all assets and not only limited results.

Resource tree only shows all assets already in the level, it can’t be used to access new ones.

== Lighting in editor ==
[[File:Trine3_lights.gif|thumb|A gif showing the effects of different types of lights on the scene.|480px]]
This page lists the most important LightEntities found in the editor and sheds some light (no pun intented) on their usage. There's a lot of general information about lighting in 3d games and related topics in the internet and elsewhere, so the interested reader is encouraged to do some independent searching for more in-depth discussion. Don't be discouraged by the large number of different properties that the LightEntities might have, most of them work with their default values.

What follows is a general overview of the different light entities you can find in the editor. In addition to general discussion, there are some examples of how each entity should be used.

=== AmbientLightEntity ===
Ambient lights are used in Trine 3 (and in games in general) to emulate the real world phenomenon of [https://en.wikipedia.org/wiki/Radiative_transfer radiative transfer] (energy transfer in the form of electromagnetic radiation, e.g. light). After photons are emitted, they are scattered, absorbed and re-emitted multiple times before finally reaching the viewer. This is one of the reasons why in nature there are no completely sharp or black shadows and that it's hard to find a completely dark place during daytime.

'''AmbientLightEntity''' is most often used as a global ambient light to set the base tone of the scene. If both color components are identical, they will create the effect of a uniformly lit scene. AmbientLightEntity can also be used as a directional light of sorts, if the Color2 component is a darker shade than Color1 component, as it is by default. This still mimics the behaviour of radiative transfer (absorption, emission, scattering), since AmbientLightEntity can't create shadows.

=== DirectionalLightEntity ===
[[File:Directional.png|thumb|DirectionalLightEntity causing an orthographic projection of shadows.]]
[[File:Directional_sunset_on_off.gif|thumb|A DirectionalLightEntity used in Pontius's tutorial for "sunset effect".]]
Directional lights are lights that emulate a light source that is infinitely wide and infinitely far, thus "emitting" light rays that are precisely parallel to each other. On Earth, direct sunlight can be approximated as parallel rays of light, and thus directional lights are used in Trine 3 to emulate sunlight and the sharp shadows caused by it. Another common use for directional lighting is a so-called skylight.

On an overcast day when no direct sunlight reaches the ground, objects are still clearly visible and lit. This is due to the light scattering from particles and water droplets in the atmosphere and reaching the ground through the clouds. The same phenomenon causes the sky to look blue during daylight and to be bright and colourful at all. If there was no atmosphere, there would be minimal scattering of light, resulting in a very dark sky and extremely harsh direct sunlight (among other, perhaps more lethal things), although the Sun would appear to be smaller in size. This is the physical phenomenon called [https://en.wikipedia.org/wiki/Diffuse_sky_radiation "skylight"], which is emulated in Trine 3 with a shadowless directional light that is perpendicular to the ground level, i.e. pointing straight down.

Although the effects of skylight and ambient light in the real world are based on the same physical principles (radiative transfer), in Trine 3 they aren't the same thing. Ambient light emulates the light that has already reached the ground and is just "bouncing back and forth" between different objects making everything look more or less the same from any viewing angle, whereas skylight is the diffuse light "coming straight down from the sky", making things look lighter and brighter from above rather than from below.

'''DirectionalLightEntity''' is a local directional light which uses an [http://db-in.com/images/projection_example.gif orthographic projection] instead of a perspective one. It's local in the sense that it's borders (field of view and range) can be chosen at will so that the light is projected only to a certain area. Most often DirectionalLightEntity is used as a local skylight for the background objects or to create other local but large-scale lighting conditions, like the appearance of a setting sun, as it was used in the beginning of Pontius's tutorial level.

'''SunDirectionalLightEntity''' is a global type of DirectionalLightEntity. It's range and field of view don't have any effect on it like they do on local directional lights. Like other directional lights SunDirectionalLightEntity casts orthographic shadows, but unlike any other light in the editor (except for AmbientLightEntity) it's position doesn't determine "where the light is coming from". The direction of the light can be changed only by rotating the SunDirectionalLightEntity, because it's thought to be infinitely far away.

=== PointLightEntity ===
[[File:Point.png|thumb|A PointLightEntity doesn't cause shadows.]]
[[File:Alpha_point.png|thumb|Fog and a PointLightEntity with RenderAlphaObjects.]]

Point lights are considered to be minuscule points that radiate isotropic light i.e. light that's the same in all directions. In the real world, only stars other than the Sun are considered point sources of light due to the great distance separating them from Earth. The closest thing to a point light on Earth is a light bulb without a lampshade. Since light bulbs without shades are a quite rare thing to see, point lights aren't a very authentic way to light a scene. The good thing is, they can be used together with other sources of light to create more natural lighting conditions. Point lights are also a very good way to highlight something and to make even small details easy to spot.

'''PointLightEntity''' is Trine 3's basic point light. It's color, intensity and range can be chosen to match the desired situation, whether it's large-scale orange-white light coming from bubbling lava or just a tiny speck of light coming from a glowing pink mushroom. PointLightEntity can also be used to cast light on only alpha objects, that is, objects like fog which don't have a solid frame.

PointLightEntity doesn't cast shadows at all and thus its light isn't blocked by any collisions or models. Be sure to take this into account, when you set the intensity and range of your point lights. Speaking of which, range and intensity can be tweaked with the '''scale tool''': When scaled from the middle of the scale tool's gizmo, both range and intensity are affected. When scaled on the green Y-axis, only intensity is affected, where as red x-axis affects range only. Blue line does nothing.

=== AmbientPointLightEntity ===
[[File:Ambient_point.png|thumb|An AmbientPointLightEntity is a local ambient light.]]
Ambient lights were discussed above and [[#AmbientLightEntity]] was said to be used as a global ambient light to set the tone of the scene. Like local directional lights, there are also local ambient lights. PointLightEntity can be used as a local ambient light by changing the property called '''AmbientFactor'''. When this is 0, the PointLightEntity works as a normal point light, but the closer it is to 1, the more it behaves like a local ambient light. This kind of local ambient light works in the same manner as global ambient lights, except it's range can be chosen at will.

=== PointLightEntity with RenderAlphaObjects ===
PointLightEntities can also be used to light alpha objects, like spiderwebs, fogs, clouds etc. In Trine 3 editor the '''RenderAlphaObjects''' property can be set to turn a PointLightEntity into an "AlphaBlendPointLightEntity".

It's noteworthy, that once '''RenderAlphaObjects''' is on, changing the '''Range''' property isn't anymore enough to change the actual range of the light, also the '''Radius''' property should be changed to the same value under PointLightComponent-->PointLightAreaComponent-->SphereAreaComponent->Radius. This only applies to manual editing of Range and Radius, if the scale tool is used to change the range of the point light, the radius is increased automatically.

=== SpotLightEntity ===
[[File:Spot.png|thumb|A SpotLightEntity and a perspective projection of shadows.]]
[[File:Shadow_quality_4.gif|thumb|SpotLightEntity shadows flickering on and off]]
Spot lights are like directional lights but the light projection is different. The light is projected in a cone and the shadow projection is perspective instead of ortographic. A flashlight is an example of a spot light. Spotlights are usually used in combination with point lights to create more realistic lighting conditions.

'''SpotLightEntity''' is the spot light of Trine 3. It shares many of the properties with DirectionalLightEntity (and SunDirectionalLightEntity), since DirectionalLightComponent is a child type of SpotLightComponent. A SpotLightEntity's range, color, intensity, fov and many other properties can be changed at will to reach the desired lighting conditions. SpotLightEntity has also a property called LinearFade. If it's false, the light attenuation of the spot light is more "natural" and fades faster. If set to true, the intensity of the spot light fades linearly, i.e. it's value decreases like 1.0/distance (instead of 1.0/distance squared).

SpotLightEntities have '''ShadowQuality''' set by default to ShadowQuality4. If there are more than four SpotLightEntities with ShadowQuality4 in view, the shadows will start flickering. The same applies to SpotLightEntities with lower ShadowQuality so that
* 4 x ShadowQuality1 = 1 x ShadowQuality2
* 4 x ShadowQuality2 = 1 x ShadowQuality3 and
* 4 x ShadowQuality3 = 1 x ShadowQuality4

All in all there can be a maximum number of 10 shadow casting SpotLightEntities in view at the same time.

<gallery>
File:Ambient_prop.png|AmbientLightComponent
File:Point_prop.png|PointLightComponent
File:Alpha_point_prop.png|Radius, Range and RenderSolid/AlphaObjects.
File:Spot_prop1.png|SpotLightComponent, DirectionalLightComponent and SunDirectionalLightComponent have the same properties, with slightly different settings.
File:Spot_prop2.png|SpotLightComponent cont.
</gallery>

=== ColorEffectEntity ===
[[File:Coloreffectentity.gif|thumb|Different ColorLookupTextures.]]
'''ColorEffectEntity''' is a scene wide effect that sets the tone of the scene. The '''Exposure''' property can be used to change the exposure of the whole scene, i.e. to make the scene globally darker or lighter. The '''ColorLookupTexture''' property can be used to choose a color look-up table from the ones created for the game in question. These can be found under \data\root\instance_base\entity\texture\color_lookup.

=== Bloom ===
[[File:Bloom_lens_flare.gif|thumb|Lens flare effect of bloom.]]
[[File:Bloom_effect_entity.png|thumb|BloomEntity]]

=== General ===
Bloom is a shader effect used in game engines to emulate imaging artifacts of real-world cameras, like [https://en.wikipedia.org/wiki/Lens_flare lens flare], [https://en.wikipedia.org/wiki/Dynamic_range#Photography finite dynamic range] and [https://en.wikipedia.org/wiki/Airy_disk airy discs] caused by the diffraction of light.

In game engines, bloom effect can be used to create a dream-like visual style or emphasize a magically glowing objects. With the right settings it can also enhance the photorealism of the scene by emulating the above mentioned effects.

=== BloomEntity in the editor ===

BloomEntity (BE) can be found from "InstanceBase/Entity/SceneEntity/BloomEntity". BE is a global effect and it has many properties in it's GlowComponent, but most of these don't need to be touched by the user. The two most important ones are:
* Factor
** Determines the weight of the particular BE, if there are more than one in the scene. Mostly used for animation purposes.
* StreakLength
** Setting this to 0 removes the lens flare effect, which is dependant on the relative direction of the BE.

=== Properties of glowing objects ===

Normal entities can be made to glow, like the collisions used in the pictures. Every entity with a ModelComponent has four properties that determine their behaviour with BE. These are:
* SelfIllumination
** The colour of the self illumination. Like the name says, used for objects that are supposed to be self illuminated, like sun, moon and lamps.
* SelfIlluminationFactor
** The strength of the self illumination. Example values used for different entities are 1000 for sun, 2 for moon and 15 for a bright lamp.
* GlowAmountColor
** The colour of the glow effect. Like self illumination, but this adds a soft halo around the object.
* GlowAmount
** The strength of the glow effect. Values usually around or less than 1.

Usually self illumination and glow are used together to achieve the best result.

<gallery>
File:self_ill.png|Self illumination.
File:Glow.png|Glow.
File:Combined.png|Self illumination and glow combined.
</gallery>

=== Additional Shadows ===
There are 3 kinds of shadows: '''fake_shadow_gradient.fbxmodel''', '''fake_shadow_gradient_radial.fbxmofel''' and '''fake_shadow_solid.fbxmodel'''. The solid one is used to block lights by placing the black area to point towards light source (the other side is invisible).
The other two are used to give walls etc some extra shading.

Some ground art pieces are kinda bumpy and there are times when they might look a little bit funny after lights have been added. This can be fixed by using ShadowBias that can be found on the object's properties and changing it to 0.1. Below will be examples and you can see how big the difference is.

<gallery>
File:Level_art_tutorial_withoutshadowbiasv2.png|Before adding ShadowBias
File:Level_art_tutorial_withshadowbiasv2.png|After adding ShadowBias
</gallery>

=== Fog ===
Fogs can be found in Typeroot -> InstanceBase -> Entity -> ObjectEntity -> object -> atmosphere-> fog

'''CircleFogAreaEntity''' and '''SquareFogAreaEntity''' are used to create atmospheric effects and distance fog. It can be found in the type tree under LightEntity. FogAreaEntities work similiarly to DirectionalLights. Use Scale tool to edit Range, Fov and intensity. In Properties under SpotLightComponent you can adjust Color of the fog and thickness. Change Linear overbrightness to make the fog more or less thick. 1 is really thick and -1 is completely transparent.

Level art task

2021-12-08T08:44:41Z

Tero Tirkkonen: /* How To Use Trine 3 Editor */

[[File:Task1.png|right|thumb|700px|Blocked level art base geometry, guide for the level art assignment]]
[[File:Task3.png|right|thumb|700px|A area and B area]]

= Level Art Assignment =
* Your task is to complete the given collision-blocked map. We are looking for an appealing and coherent end result. Your work doesn't need to be 100% finished, but it should give us an idea of your skills with asset placement, composition and lighting.
* You can, for example, create a level art base that could be continued later by adding more detailed level art elements and assets.
* Feel free to change the level in any way you want to make it more to your liking. For example, you can continue the map and design your own area displaying your talents from blocking to the finished level art.
* You can refer to Trine 3 levels, especially the tutorial levels, for inspiration. It's not forbidden to copy some parts of the Trine 3 levels as long as you blend them with your own unique level.
* We recommend using Trine 4: The Nightmare Prince and Trine 4: Melody of Mystery as visual references as well.
* We can see your potential even from a small area brimmed with polished and high-class art - no need to stress yourself over the amount of material needed. Quality overcomes quantity every time!

== Assignment info ==
* Create an environment using the '''Trine 3 editor'''
* The task should be completed in '''4 weeks'''
* Familiarize yourself with the Trine style level art by reading the necessary '''[[Level Art]] pages'''.
* Once you have finished the task, please return '''the map file''', so we can play your level and see your level art from the player's perspective.
* Record '''a video''' where you run through the level and showcase your work. We might not have enough time to play your level, so consider this video as the most important piece of your assignment and the main reference we use when evaluating your work.
* Add between '''2-8 screenshots''' of your favorite spots on the level.

=== The mandatory task ===
* Note: You must complete the task described here to apply
* The level has two areas: Area A and Area B. Area A comes with already-blocked collision boxes to give you an example of the terrain shapes to use
* Build your level art on top of Area A
* Build the lighting setup as well. Use atmospheric effects, like fog, to make the environment feel more believable.
* Create a strong and well-working base geometry. We're looking for something that is both interesting and visually pleasing. The level should have a clear theme.
* The most important aspects of your work are composition, asset placement and lighting.

=== The optional task ===
* Note: This part is not required to apply, but if you're willing, feel free to do it as well.
* Area B has no shapes, as we'd like to see you creating the base geometry there.
* Area A and Area B can be of the same size, but if you want to build a custom-sized Area B, that's fine as well.
* Please leave the collision box blocked shapes to the collision layer, so we can see the base shapes you've used.

=== You will get bonus points for ===
* Demonstrating your ability to transform your unique ideas to a well-executed level art.
* Using the available game assets creatively
* Polished end result
* Clean and optimal approach to level-building, making it easy for others to continue editing your level.

== General Level Art Workflow Tips ==
* Check out the content of our [[Level Art]] sites to familiarize yourself with our level art process and the basics of level art theory. There's plenty of tips available, too!
* Don't be afraid to hijack our assignment and take it in any direction you want to, as long as it shows off your abilities as a level artist. We want to see your visual level building skills, so show them the way that suits you best.
* You can use any assets in the Editor, but try to keep your level coherent and sensible. On the other hand, don't forget that Trine is a fantasy world where anything is possible.
* Keep the limitations of the real-time 3D in mind when creating the environment and use assets with optimization in mind.
* Keep the collisions on the collision layer and add art on the art layer.
* Pay special attention to the composition, asset placement and lighting, as those are the aspects we're most interested in.
* Start with the big shapes. When they are satisfactory, concentrate on the finer details. Use an iterative approach, building the whole level layer by layer.
* Do not scale the objects too big, causing the texture resolution to suffer. A good rule of thumb is that you can scale an asset 20% bigger or smaller than the original size. You can, of course, break these rules if the final result looks amazing.
* Don't forget the lighting, but carry it along the whole level art process starting from the very beginning. Considering lighting implementation is crucial when placing assets into the scene - and so is adjusting the lighting while progressing with the level art.
* The assets can be used in many ways: Don't let obvious approaches or any assumed purpose restrict your creativity! As long as it looks good, anything is allowed.
* When creating a level for an actual game project, you need always to consider gameplay aspects carefully. In this assignment, however, we're evaluating your artistic eye, so don't worry if your gameplay isn't fine-tuned. For example, it's not crucial to match all the collisions perfectly everywhere.
* Remember to test your level with actual characters and run around in your level. We're looking only at those things that the player can see through the cameras while playing the level.
* To come up with interesting ideas for your environment, we recommend using real-life geography and/or architecture as reference material. For this task, you can also use other games (especially Trineverse games) as references.
* Don't worry too much if using the Editor feels difficult at first. Focus on showcasing your skills at creating believable environmental settings by building appealing shapes and lighting arrangements.
* You'll use the publicly released Trine 3 Editor for this assignment. Our current in-house Editor differs a lot from the Trine 3 version since it has undergone a lot of upgrades and improvements. For example, it has a new renderer with pbr materials and a lot of new assets that are all missing from the Trine 3 Editor.
* If we'll hire you, you'll be trained to use our latest Editor version.
* If you have problems with the Editor, please don't hesitate to contact us.

= How To Use Trine 3 Editor =

This page should have all the basics you need to know to learn how to use the editor. It is a lot of information and work to learn to use a new tool and to build a level so we encourage you to ask in case you run into any problems. Just send us any questions you've got and we'll help you to get back on track! The most basic necessities for any map are CamerasystemPrefab, AmbientLightEntity and ColoreffectEntity, they have been added to the map already. After that come collisions and art assets follow. There are many assets for creating beliveability and atmosphere to the level. Lights and fogs for example are very important when creating the look of the level. Try checking the Trine 3 levels and how these things are done in them, for example how waterfall effects in Amadeus's Beach Tutorial level are built. The tutorial levels are all in one level file vertically placed so for the Amadeus's level you need to travel down quite a bit to get there in the Editor.

How to access the required map file: Collision base map is on its own map file. Go to editor, then File > Open map > Open the editor file location binary/data/mission/[test map name].fbe. The map file isn’t automatically in the editor and you have to add .fbe -file yourself from the location just explained.

== Basic windows in editor ==

=== Object properties ===
Show '''Object Properties''' dockable window using '''View > Object Properties''' or using '''Ctrl + P'''.

With this window you can modify object's properties.

The properties inside components can be set in alphabetical order from the editor settings: Tools > Options > Properties > "Order Properties In Property Grid".

Components and properties can also be [http://wiki/index.php/Search_properties_and_components_in_Object_Properties_window searched] for inside the window.

=== Scene instance tree ===
Show '''Scene instance tree''' dockable window using '''View > Scene instance tree''' or using '''Ctrl + F2'''.

With this window you can see all instances in the scene/level.

=== Type tree ===
Show '''Type tree''' dockable window using '''View > Type tree''' or using '''Ctrl + F3'''.

With this window you can find entites/types which can be inserted into scene/level.
For example all the 3D art assets, lights and fogs can be found here.

=== Category ===
Show '''Category''' dockable window using '''Categories > Category root''' or using '''Ctrl + Shift + F1'''.

Category window is a configurable window, where you can insert shortcuts to entities/types which you want to insert into scene/level.

=== Resource tree ===
Show '''Resource tree''' dockable window using '''View > Resource tree''' or using '''Ctrl + F4'''.

With this window you can see all the [[resource]]s which are available.

=== Recent objects ===
Show '''Recent objects''' dockable window using '''View > Recent objects'''.

With this window you can see recent types you have used.

=== Modules ===
Show '''Modules ''' dockable window using '''View > Modules'''.

With this window you can modify Module properties which affects various things in editor / engine.

=== Error list ===
Show '''Error list''' dockable window using '''View > Error list'''.

This window shows errors, warnings and info messages generated by editor and engine. Very usefull tool for debugging what's wrong.

=== Reference list ===
Show '''Reference list''' dockable window using '''View > Reference list'''.

When selecting some type or instance you can see '''ReferenceString''' property in the '''Property Window''' and by clicking it with mouse right button and selecting '''Show Reference list''' from the context menu, you can print type's or instance's reference list into this window.

== Basic controls in editor ==

=== Moving camera ===
* WASD - Move camera
* Shift + WASD - Move camera faster
* Right mouse button and drag - Rotate the view

You can also press any of the axes on the editor gizmo on the right upper corner. Pressing on the axis changes the camera rotation to coincide with that axis.

[[File:Gizmo.png]]

=== Object selection ===
* Left mouse button - Select object
* Alt + Left mouse button - Select object behind another object (You may need to click multiple times to select the desired object)
* Shift + Left mouse button - Select multiple objects
* Ctrl + Left mouse button and drag - Box select, select objects in area (if you are selecting a vast amount of objects at once it can be a good idea to de-select View->Tree Update Enabled so the procedure will be faster, but do remember to re-select it after, otherwise you won't be able to operate the object properties)

=== Tool selection ===
* 1 - Move tool
* 2 - Rotate tool
* 3 - Scale tool
* 4 - Area tool
* 6 - Scale specific side tool

=== Copying and pasting ===
* Ctrl + C - Copy selected object(s)
* Ctrl + X - Cut selected object(s)
* Ctrl + V - Paste copied object(s)
* Ctrl + Shift + V - Paste copied object(s) onto the same coordinates they were copied from
* To duplicate an object, hold Shift and move object from one of the arrows while having move tool selected
* You can copy & paste items between separate levels too

=== Undo and Redo ===
* Ctrl + Z - Undo
* Ctrl + Y - Redo

=== Other useful buttons ===
* Space bar - Toggle between Global, Local and Screenspace transform and rotation
* K - Allows you to see lights through collisions
* J - Makes the lights stay the same size no matter how far you are from them
* Ctrl + T replaces selected instance in the scene with the type selected in type tree
* L - Hides lights
* G - Hides lights and all objects that don't have the VisibleInGame on
* P - Selecting an instance within a scene and pressing P Locates selected instance in the type tree
* Ctrl + G - Hides grid
* Control + Left click on a layer hides it.

=== Editing objects ===
Click an object you want to edit in the level. Three arrow or circles should appear depending on what tool you have selected. Use these arrows/circles to move, rotate and scale the object on X, Y and Z axis.
'''Note: You can select objects only from currently selected layer. Change layer by clicking Def., Col., 1, 2... from the tool bar or with Alt + 9, 0, 1, 2, ...'''

[[File:layers.png]]

It's also possible to choose objects on any layer if you want to. Go to Selection -> Selection filter locking and untap the '''Allow selection on active layer only'''.
Just make sure that you keep objects on their dedicated layers if you decide to use this.

=== Editing object properties ===
To edit an object's properties you need to open up the '''Object Properties''' dockable window via '''View > Object Properties''' and then selecting the Object you want to Edit.

=== Adding objects ===
Objects can be added from Type tree window. You can open it from '''View > Type tree'''. Use the Search field to find the objects you are looking for. Most of the time objects you want to use are located under '''TypeRoot/InstanceBase/Entity'''. Also remember to deselect any selected objects in Type tree before searching again.

Finding the right object from the type tree can be quite tricky if you don't know the exact name of the object. A good way to start is to copy them from existing maps.

When inserting objects, you can press and hold Shift and/or Ctrl. Holding Shift attempts to snap the object next to another object, when you move the object above an object already on the scene. Holding Ctrl snaps the movement of the object to the grid.

=== Testing map in editor and saving ===
To test your changes in editor press green play button (F5) to start the level or blue play button (Ctrl+F5) to start from camera position.

To return to editor from play mode, press the blue stop button (Shift+F5).

[[File:play_buttons.png]]

=== Some tips about the type tree ===
TypeRoot -> InstanceBase -> Entity -> ObjectEntity -> object You will find all the objects here

TypeRoot -> InstanceBase -> Entity -> LightEntity You will find all the lights here

Finding items in type tree can be a little bit tricky at times as some tiny problems may occur. When you search for something that has multiple types under it they might not show for some reason.
For example if you search for RockCollisionHelper in the type tree it might only show the RockCollisionHelper instead of all it's variations like BookRockCollisionHelper etc. This can be fixed by either
searching again by typing the desired thing in the search bar or manually clicking the tree to find it.
Also after using one object and then trying to find another object in the type tree, make sure to check the object you used isn't active anymore. Otherwise the Search bar won't search anything.
You can just click anywhere in the empty part of the map to make sure you don't have any object active.

=== Other useful tips ===

Tools -> Options -> properties -> Order Properties In Property Grid to get properties in property window ordered alphabetically

Tools -> Options -> Tool -> Selection highlight self illumination enabled to get rid of the blue highlight when selecting objects

The collisions have VisibleInGame on in this map so that you can see them when you play. It's good to turn them of after you have addded art on them so that you can take a better look at the art. You can make the collisions invisible by choosing the collision, going into its properties and tapping VisibleInGame off from the ModelComponent.

'''How to get FBX assets from the library''':
Type tree has all the assets (https://wiki.frozenbyte.com/index.php/Level_art_task#Type_tree), choose TypeRoot > InstanceBase > Entity > ObjectEntity > object. Component base has the same listing but they can’t be accessed, so make sure you choose InstanceBase and not ComponentBase. Click an asset on the list and move cursor to viewport, and the assets should appear on the cursor. Type tree also has a search function but it has known issues and won’t always work, so you need to be prepared to access files manually as described above. Remove the search word if you want to see all assets and not only limited results.

Resource tree only shows all assets already in the level, it can’t be used to access new ones.

== Lighting in editor ==
[[File:Trine3_lights.gif|thumb|A gif showing the effects of different types of lights on the scene.|480px]]
This page lists the most important LightEntities found in the editor and sheds some light (no pun intented) on their usage. There's a lot of general information about lighting in 3d games and related topics in the internet and elsewhere, so the interested reader is encouraged to do some independent searching for more in-depth discussion. Don't be discouraged by the large number of different properties that the LightEntities might have, most of them work with their default values.

What follows is a general overview of the different light entities you can find in the editor. In addition to general discussion, there are some examples of how each entity should be used.

=== AmbientLightEntity ===
Ambient lights are used in Trine 3 (and in games in general) to emulate the real world phenomenon of [https://en.wikipedia.org/wiki/Radiative_transfer radiative transfer] (energy transfer in the form of electromagnetic radiation, e.g. light). After photons are emitted, they are scattered, absorbed and re-emitted multiple times before finally reaching the viewer. This is one of the reasons why in nature there are no completely sharp or black shadows and that it's hard to find a completely dark place during daytime.

'''AmbientLightEntity''' is most often used as a global ambient light to set the base tone of the scene. If both color components are identical, they will create the effect of a uniformly lit scene. AmbientLightEntity can also be used as a directional light of sorts, if the Color2 component is a darker shade than Color1 component, as it is by default. This still mimics the behaviour of radiative transfer (absorption, emission, scattering), since AmbientLightEntity can't create shadows.

=== DirectionalLightEntity ===
[[File:Directional.png|thumb|DirectionalLightEntity causing an orthographic projection of shadows.]]
[[File:Directional_sunset_on_off.gif|thumb|A DirectionalLightEntity used in Pontius's tutorial for "sunset effect".]]
Directional lights are lights that emulate a light source that is infinitely wide and infinitely far, thus "emitting" light rays that are precisely parallel to each other. On Earth, direct sunlight can be approximated as parallel rays of light, and thus directional lights are used in Trine 3 to emulate sunlight and the sharp shadows caused by it. Another common use for directional lighting is a so-called skylight.

On an overcast day when no direct sunlight reaches the ground, objects are still clearly visible and lit. This is due to the light scattering from particles and water droplets in the atmosphere and reaching the ground through the clouds. The same phenomenon causes the sky to look blue during daylight and to be bright and colourful at all. If there was no atmosphere, there would be minimal scattering of light, resulting in a very dark sky and extremely harsh direct sunlight (among other, perhaps more lethal things), although the Sun would appear to be smaller in size. This is the physical phenomenon called [https://en.wikipedia.org/wiki/Diffuse_sky_radiation "skylight"], which is emulated in Trine 3 with a shadowless directional light that is perpendicular to the ground level, i.e. pointing straight down.

Although the effects of skylight and ambient light in the real world are based on the same physical principles (radiative transfer), in Trine 3 they aren't the same thing. Ambient light emulates the light that has already reached the ground and is just "bouncing back and forth" between different objects making everything look more or less the same from any viewing angle, whereas skylight is the diffuse light "coming straight down from the sky", making things look lighter and brighter from above rather than from below.

'''DirectionalLightEntity''' is a local directional light which uses an [http://db-in.com/images/projection_example.gif orthographic projection] instead of a perspective one. It's local in the sense that it's borders (field of view and range) can be chosen at will so that the light is projected only to a certain area. Most often DirectionalLightEntity is used as a local skylight for the background objects or to create other local but large-scale lighting conditions, like the appearance of a setting sun, as it was used in the beginning of Pontius's tutorial level.

'''SunDirectionalLightEntity''' is a global type of DirectionalLightEntity. It's range and field of view don't have any effect on it like they do on local directional lights. Like other directional lights SunDirectionalLightEntity casts orthographic shadows, but unlike any other light in the editor (except for AmbientLightEntity) it's position doesn't determine "where the light is coming from". The direction of the light can be changed only by rotating the SunDirectionalLightEntity, because it's thought to be infinitely far away.

=== PointLightEntity ===
[[File:Point.png|thumb|A PointLightEntity doesn't cause shadows.]]
[[File:Alpha_point.png|thumb|Fog and a PointLightEntity with RenderAlphaObjects.]]

Point lights are considered to be minuscule points that radiate isotropic light i.e. light that's the same in all directions. In the real world, only stars other than the Sun are considered point sources of light due to the great distance separating them from Earth. The closest thing to a point light on Earth is a light bulb without a lampshade. Since light bulbs without shades are a quite rare thing to see, point lights aren't a very authentic way to light a scene. The good thing is, they can be used together with other sources of light to create more natural lighting conditions. Point lights are also a very good way to highlight something and to make even small details easy to spot.

'''PointLightEntity''' is Trine 3's basic point light. It's color, intensity and range can be chosen to match the desired situation, whether it's large-scale orange-white light coming from bubbling lava or just a tiny speck of light coming from a glowing pink mushroom. PointLightEntity can also be used to cast light on only alpha objects, that is, objects like fog which don't have a solid frame.

PointLightEntity doesn't cast shadows at all and thus its light isn't blocked by any collisions or models. Be sure to take this into account, when you set the intensity and range of your point lights. Speaking of which, range and intensity can be tweaked with the '''scale tool''': When scaled from the middle of the scale tool's gizmo, both range and intensity are affected. When scaled on the green Y-axis, only intensity is affected, where as red x-axis affects range only. Blue line does nothing.

=== AmbientPointLightEntity ===
[[File:Ambient_point.png|thumb|An AmbientPointLightEntity is a local ambient light.]]
Ambient lights were discussed above and [[#AmbientLightEntity]] was said to be used as a global ambient light to set the tone of the scene. Like local directional lights, there are also local ambient lights. PointLightEntity can be used as a local ambient light by changing the property called '''AmbientFactor'''. When this is 0, the PointLightEntity works as a normal point light, but the closer it is to 1, the more it behaves like a local ambient light. This kind of local ambient light works in the same manner as global ambient lights, except it's range can be chosen at will.

=== PointLightEntity with RenderAlphaObjects ===
PointLightEntities can also be used to light alpha objects, like spiderwebs, fogs, clouds etc. In Trine 3 editor the '''RenderAlphaObjects''' property can be set to turn a PointLightEntity into an "AlphaBlendPointLightEntity".

It's noteworthy, that once '''RenderAlphaObjects''' is on, changing the '''Range''' property isn't anymore enough to change the actual range of the light, also the '''Radius''' property should be changed to the same value under PointLightComponent-->PointLightAreaComponent-->SphereAreaComponent->Radius. This only applies to manual editing of Range and Radius, if the scale tool is used to change the range of the point light, the radius is increased automatically.

=== SpotLightEntity ===
[[File:Spot.png|thumb|A SpotLightEntity and a perspective projection of shadows.]]
[[File:Shadow_quality_4.gif|thumb|SpotLightEntity shadows flickering on and off]]
Spot lights are like directional lights but the light projection is different. The light is projected in a cone and the shadow projection is perspective instead of ortographic. A flashlight is an example of a spot light. Spotlights are usually used in combination with point lights to create more realistic lighting conditions.

'''SpotLightEntity''' is the spot light of Trine 3. It shares many of the properties with DirectionalLightEntity (and SunDirectionalLightEntity), since DirectionalLightComponent is a child type of SpotLightComponent. A SpotLightEntity's range, color, intensity, fov and many other properties can be changed at will to reach the desired lighting conditions. SpotLightEntity has also a property called LinearFade. If it's false, the light attenuation of the spot light is more "natural" and fades faster. If set to true, the intensity of the spot light fades linearly, i.e. it's value decreases like 1.0/distance (instead of 1.0/distance squared).

SpotLightEntities have '''ShadowQuality''' set by default to ShadowQuality4. If there are more than four SpotLightEntities with ShadowQuality4 in view, the shadows will start flickering. The same applies to SpotLightEntities with lower ShadowQuality so that
* 4 x ShadowQuality1 = 1 x ShadowQuality2
* 4 x ShadowQuality2 = 1 x ShadowQuality3 and
* 4 x ShadowQuality3 = 1 x ShadowQuality4

All in all there can be a maximum number of 10 shadow casting SpotLightEntities in view at the same time.

<gallery>
File:Ambient_prop.png|AmbientLightComponent
File:Point_prop.png|PointLightComponent
File:Alpha_point_prop.png|Radius, Range and RenderSolid/AlphaObjects.
File:Spot_prop1.png|SpotLightComponent, DirectionalLightComponent and SunDirectionalLightComponent have the same properties, with slightly different settings.
File:Spot_prop2.png|SpotLightComponent cont.
</gallery>

=== ColorEffectEntity ===
[[File:Coloreffectentity.gif|thumb|Different ColorLookupTextures.]]
'''ColorEffectEntity''' is a scene wide effect that sets the tone of the scene. The '''Exposure''' property can be used to change the exposure of the whole scene, i.e. to make the scene globally darker or lighter. The '''ColorLookupTexture''' property can be used to choose a color look-up table from the ones created for the game in question. These can be found under \data\root\instance_base\entity\texture\color_lookup.

=== Bloom ===
[[File:Bloom_lens_flare.gif|thumb|Lens flare effect of bloom.]]
[[File:Bloom_effect_entity.png|thumb|BloomEntity]]

=== General ===
Bloom is a shader effect used in game engines to emulate imaging artifacts of real-world cameras, like [https://en.wikipedia.org/wiki/Lens_flare lens flare], [https://en.wikipedia.org/wiki/Dynamic_range#Photography finite dynamic range] and [https://en.wikipedia.org/wiki/Airy_disk airy discs] caused by the diffraction of light.

In game engines, bloom effect can be used to create a dream-like visual style or emphasize a magically glowing objects. With the right settings it can also enhance the photorealism of the scene by emulating the above mentioned effects.

=== BloomEntity in the editor ===

BloomEntity (BE) can be found from "InstanceBase/Entity/SceneEntity/BloomEntity". BE is a global effect and it has many properties in it's GlowComponent, but most of these don't need to be touched by the user. The two most important ones are:
* Factor
** Determines the weight of the particular BE, if there are more than one in the scene. Mostly used for animation purposes.
* StreakLength
** Setting this to 0 removes the lens flare effect, which is dependant on the relative direction of the BE.

=== Properties of glowing objects ===

Normal entities can be made to glow, like the collisions used in the pictures. Every entity with a ModelComponent has four properties that determine their behaviour with BE. These are:
* SelfIllumination
** The colour of the self illumination. Like the name says, used for objects that are supposed to be self illuminated, like sun, moon and lamps.
* SelfIlluminationFactor
** The strength of the self illumination. Example values used for different entities are 1000 for sun, 2 for moon and 15 for a bright lamp.
* GlowAmountColor
** The colour of the glow effect. Like self illumination, but this adds a soft halo around the object.
* GlowAmount
** The strength of the glow effect. Values usually around or less than 1.

Usually self illumination and glow are used together to achieve the best result.

<gallery>
File:self_ill.png|Self illumination.
File:Glow.png|Glow.
File:Combined.png|Self illumination and glow combined.
</gallery>

=== Additional Shadows ===
There are 3 kinds of shadows: '''fake_shadow_gradient.fbxmodel''', '''fake_shadow_gradient_radial.fbxmofel''' and '''fake_shadow_solid.fbxmodel'''. The solid one is used to block lights by placing the black area to point towards light source (the other side is invisible).
The other two are used to give walls etc some extra shading.

Some ground art pieces are kinda bumpy and there are times when they might look a little bit funny after lights have been added. This can be fixed by using ShadowBias that can be found on the object's properties and changing it to 0.1. Below will be examples and you can see how big the difference is.

<gallery>
File:Level_art_tutorial_withoutshadowbiasv2.png|Before adding ShadowBias
File:Level_art_tutorial_withshadowbiasv2.png|After adding ShadowBias
</gallery>

=== Fog ===
Fogs can be found in Typeroot -> InstanceBase -> Entity -> ObjectEntity -> object -> atmosphere-> fog

'''CircleFogAreaEntity''' and '''SquareFogAreaEntity''' are used to create atmospheric effects and distance fog. It can be found in the type tree under LightEntity. FogAreaEntities work similiarly to DirectionalLights. Use Scale tool to edit Range, Fov and intensity. In Properties under SpotLightComponent you can adjust Color of the fog and thickness. Change Linear overbrightness to make the fog more or less thick. 1 is really thick and -1 is completely transparent.

Level art task

2021-12-08T08:42:41Z

Tero Tirkkonen: /* Other useful tips */

[[File:Task1.png|right|thumb|700px|Blocked level art base geometry, guide for the level art assignment]]
[[File:Task3.png|right|thumb|700px|A area and B area]]

= Level Art Assignment =
* Your task is to complete the given collision-blocked map. We are looking for an appealing and coherent end result. Your work doesn't need to be 100% finished, but it should give us an idea of your skills with asset placement, composition and lighting.
* You can, for example, create a level art base that could be continued later by adding more detailed level art elements and assets.
* Feel free to change the level in any way you want to make it more to your liking. For example, you can continue the map and design your own area displaying your talents from blocking to the finished level art.
* You can refer to Trine 3 levels, especially the tutorial levels, for inspiration. It's not forbidden to copy some parts of the Trine 3 levels as long as you blend them with your own unique level.
* We recommend using Trine 4: The Nightmare Prince and Trine 4: Melody of Mystery as visual references as well.
* We can see your potential even from a small area brimmed with polished and high-class art - no need to stress yourself over the amount of material needed. Quality overcomes quantity every time!

== Assignment info ==
* Create an environment using the '''Trine 3 editor'''
* The task should be completed in '''4 weeks'''
* Familiarize yourself with the Trine style level art by reading the necessary '''[[Level Art]] pages'''.
* Once you have finished the task, please return '''the map file''', so we can play your level and see your level art from the player's perspective.
* Record '''a video''' where you run through the level and showcase your work. We might not have enough time to play your level, so consider this video as the most important piece of your assignment and the main reference we use when evaluating your work.
* Add between '''2-8 screenshots''' of your favorite spots on the level.

=== The mandatory task ===
* Note: You must complete the task described here to apply
* The level has two areas: Area A and Area B. Area A comes with already-blocked collision boxes to give you an example of the terrain shapes to use
* Build your level art on top of Area A
* Build the lighting setup as well. Use atmospheric effects, like fog, to make the environment feel more believable.
* Create a strong and well-working base geometry. We're looking for something that is both interesting and visually pleasing. The level should have a clear theme.
* The most important aspects of your work are composition, asset placement and lighting.

=== The optional task ===
* Note: This part is not required to apply, but if you're willing, feel free to do it as well.
* Area B has no shapes, as we'd like to see you creating the base geometry there.
* Area A and Area B can be of the same size, but if you want to build a custom-sized Area B, that's fine as well.
* Please leave the collision box blocked shapes to the collision layer, so we can see the base shapes you've used.

=== You will get bonus points for ===
* Demonstrating your ability to transform your unique ideas to a well-executed level art.
* Using the available game assets creatively
* Polished end result
* Clean and optimal approach to level-building, making it easy for others to continue editing your level.

== General Level Art Workflow Tips ==
* Check out the content of our [[Level Art]] sites to familiarize yourself with our level art process and the basics of level art theory. There's plenty of tips available, too!
* Don't be afraid to hijack our assignment and take it in any direction you want to, as long as it shows off your abilities as a level artist. We want to see your visual level building skills, so show them the way that suits you best.
* You can use any assets in the Editor, but try to keep your level coherent and sensible. On the other hand, don't forget that Trine is a fantasy world where anything is possible.
* Keep the limitations of the real-time 3D in mind when creating the environment and use assets with optimization in mind.
* Keep the collisions on the collision layer and add art on the art layer.
* Pay special attention to the composition, asset placement and lighting, as those are the aspects we're most interested in.
* Start with the big shapes. When they are satisfactory, concentrate on the finer details. Use an iterative approach, building the whole level layer by layer.
* Do not scale the objects too big, causing the texture resolution to suffer. A good rule of thumb is that you can scale an asset 20% bigger or smaller than the original size. You can, of course, break these rules if the final result looks amazing.
* Don't forget the lighting, but carry it along the whole level art process starting from the very beginning. Considering lighting implementation is crucial when placing assets into the scene - and so is adjusting the lighting while progressing with the level art.
* The assets can be used in many ways: Don't let obvious approaches or any assumed purpose restrict your creativity! As long as it looks good, anything is allowed.
* When creating a level for an actual game project, you need always to consider gameplay aspects carefully. In this assignment, however, we're evaluating your artistic eye, so don't worry if your gameplay isn't fine-tuned. For example, it's not crucial to match all the collisions perfectly everywhere.
* Remember to test your level with actual characters and run around in your level. We're looking only at those things that the player can see through the cameras while playing the level.
* To come up with interesting ideas for your environment, we recommend using real-life geography and/or architecture as reference material. For this task, you can also use other games (especially Trineverse games) as references.
* Don't worry too much if using the Editor feels difficult at first. Focus on showcasing your skills at creating believable environmental settings by building appealing shapes and lighting arrangements.
* You'll use the publicly released Trine 3 Editor for this assignment. Our current in-house Editor differs a lot from the Trine 3 version since it has undergone a lot of upgrades and improvements. For example, it has a new renderer with pbr materials and a lot of new assets that are all missing from the Trine 3 Editor.
* If we'll hire you, you'll be trained to use our latest Editor version.
* If you have problems with the Editor, please don't hesitate to contact us.

= How To Use Trine 3 Editor =

This page should have all the basics you need to know to learn how to use the editor. It is a lot of information and work to learn to use a new tool and to build a level so we encourage you to ask in case you run into any problems. Just send us any questions you've got and we'll help you to get back on track! The most basic necessities for any map are CamerasystemPrefab, AmbientLightEntity and ColoreffectEntity, they have been added to the map already. After that come collisions and art assets follow. There are many assets for creating beliveability and atmosphere to the level. Lights and fogs for example are very important when creating the look of the level. Try checking the Trine 3 levels and how these things are done in them, for example how waterfall effects in Amadeus's Beach Tutorial level are built. The tutorial levels are all in one level file vertically placed so for the Amadeus's level you need to travel down quite a bit to get there in the Editor.

== Basic windows in editor ==

=== Object properties ===
Show '''Object Properties''' dockable window using '''View > Object Properties''' or using '''Ctrl + P'''.

With this window you can modify object's properties.

The properties inside components can be set in alphabetical order from the editor settings: Tools > Options > Properties > "Order Properties In Property Grid".

Components and properties can also be [http://wiki/index.php/Search_properties_and_components_in_Object_Properties_window searched] for inside the window.

=== Scene instance tree ===
Show '''Scene instance tree''' dockable window using '''View > Scene instance tree''' or using '''Ctrl + F2'''.

With this window you can see all instances in the scene/level.

=== Type tree ===
Show '''Type tree''' dockable window using '''View > Type tree''' or using '''Ctrl + F3'''.

With this window you can find entites/types which can be inserted into scene/level.
For example all the 3D art assets, lights and fogs can be found here.

=== Category ===
Show '''Category''' dockable window using '''Categories > Category root''' or using '''Ctrl + Shift + F1'''.

Category window is a configurable window, where you can insert shortcuts to entities/types which you want to insert into scene/level.

=== Resource tree ===
Show '''Resource tree''' dockable window using '''View > Resource tree''' or using '''Ctrl + F4'''.

With this window you can see all the [[resource]]s which are available.

=== Recent objects ===
Show '''Recent objects''' dockable window using '''View > Recent objects'''.

With this window you can see recent types you have used.

=== Modules ===
Show '''Modules ''' dockable window using '''View > Modules'''.

With this window you can modify Module properties which affects various things in editor / engine.

=== Error list ===
Show '''Error list''' dockable window using '''View > Error list'''.

This window shows errors, warnings and info messages generated by editor and engine. Very usefull tool for debugging what's wrong.

=== Reference list ===
Show '''Reference list''' dockable window using '''View > Reference list'''.

When selecting some type or instance you can see '''ReferenceString''' property in the '''Property Window''' and by clicking it with mouse right button and selecting '''Show Reference list''' from the context menu, you can print type's or instance's reference list into this window.

== Basic controls in editor ==

=== Moving camera ===
* WASD - Move camera
* Shift + WASD - Move camera faster
* Right mouse button and drag - Rotate the view

You can also press any of the axes on the editor gizmo on the right upper corner. Pressing on the axis changes the camera rotation to coincide with that axis.

[[File:Gizmo.png]]

=== Object selection ===
* Left mouse button - Select object
* Alt + Left mouse button - Select object behind another object (You may need to click multiple times to select the desired object)
* Shift + Left mouse button - Select multiple objects
* Ctrl + Left mouse button and drag - Box select, select objects in area (if you are selecting a vast amount of objects at once it can be a good idea to de-select View->Tree Update Enabled so the procedure will be faster, but do remember to re-select it after, otherwise you won't be able to operate the object properties)

=== Tool selection ===
* 1 - Move tool
* 2 - Rotate tool
* 3 - Scale tool
* 4 - Area tool
* 6 - Scale specific side tool

=== Copying and pasting ===
* Ctrl + C - Copy selected object(s)
* Ctrl + X - Cut selected object(s)
* Ctrl + V - Paste copied object(s)
* Ctrl + Shift + V - Paste copied object(s) onto the same coordinates they were copied from
* To duplicate an object, hold Shift and move object from one of the arrows while having move tool selected
* You can copy & paste items between separate levels too

=== Undo and Redo ===
* Ctrl + Z - Undo
* Ctrl + Y - Redo

=== Other useful buttons ===
* Space bar - Toggle between Global, Local and Screenspace transform and rotation
* K - Allows you to see lights through collisions
* J - Makes the lights stay the same size no matter how far you are from them
* Ctrl + T replaces selected instance in the scene with the type selected in type tree
* L - Hides lights
* G - Hides lights and all objects that don't have the VisibleInGame on
* P - Selecting an instance within a scene and pressing P Locates selected instance in the type tree
* Ctrl + G - Hides grid
* Control + Left click on a layer hides it.

=== Editing objects ===
Click an object you want to edit in the level. Three arrow or circles should appear depending on what tool you have selected. Use these arrows/circles to move, rotate and scale the object on X, Y and Z axis.
'''Note: You can select objects only from currently selected layer. Change layer by clicking Def., Col., 1, 2... from the tool bar or with Alt + 9, 0, 1, 2, ...'''

[[File:layers.png]]

It's also possible to choose objects on any layer if you want to. Go to Selection -> Selection filter locking and untap the '''Allow selection on active layer only'''.
Just make sure that you keep objects on their dedicated layers if you decide to use this.

=== Editing object properties ===
To edit an object's properties you need to open up the '''Object Properties''' dockable window via '''View > Object Properties''' and then selecting the Object you want to Edit.

=== Adding objects ===
Objects can be added from Type tree window. You can open it from '''View > Type tree'''. Use the Search field to find the objects you are looking for. Most of the time objects you want to use are located under '''TypeRoot/InstanceBase/Entity'''. Also remember to deselect any selected objects in Type tree before searching again.

Finding the right object from the type tree can be quite tricky if you don't know the exact name of the object. A good way to start is to copy them from existing maps.

When inserting objects, you can press and hold Shift and/or Ctrl. Holding Shift attempts to snap the object next to another object, when you move the object above an object already on the scene. Holding Ctrl snaps the movement of the object to the grid.

=== Testing map in editor and saving ===
To test your changes in editor press green play button (F5) to start the level or blue play button (Ctrl+F5) to start from camera position.

To return to editor from play mode, press the blue stop button (Shift+F5).

[[File:play_buttons.png]]

=== Some tips about the type tree ===
TypeRoot -> InstanceBase -> Entity -> ObjectEntity -> object You will find all the objects here

TypeRoot -> InstanceBase -> Entity -> LightEntity You will find all the lights here

Finding items in type tree can be a little bit tricky at times as some tiny problems may occur. When you search for something that has multiple types under it they might not show for some reason.
For example if you search for RockCollisionHelper in the type tree it might only show the RockCollisionHelper instead of all it's variations like BookRockCollisionHelper etc. This can be fixed by either
searching again by typing the desired thing in the search bar or manually clicking the tree to find it.
Also after using one object and then trying to find another object in the type tree, make sure to check the object you used isn't active anymore. Otherwise the Search bar won't search anything.
You can just click anywhere in the empty part of the map to make sure you don't have any object active.

=== Other useful tips ===

Tools -> Options -> properties -> Order Properties In Property Grid to get properties in property window ordered alphabetically

Tools -> Options -> Tool -> Selection highlight self illumination enabled to get rid of the blue highlight when selecting objects

The collisions have VisibleInGame on in this map so that you can see them when you play. It's good to turn them of after you have addded art on them so that you can take a better look at the art. You can make the collisions invisible by choosing the collision, going into its properties and tapping VisibleInGame off from the ModelComponent.

'''How to get FBX assets from the library''':
Type tree has all the assets (https://wiki.frozenbyte.com/index.php/Level_art_task#Type_tree), choose TypeRoot > InstanceBase > Entity > ObjectEntity > object. Component base has the same listing but they can’t be accessed, so make sure you choose InstanceBase and not ComponentBase. Click an asset on the list and move cursor to viewport, and the assets should appear on the cursor. Type tree also has a search function but it has known issues and won’t always work, so you need to be prepared to access files manually as described above. Remove the search word if you want to see all assets and not only limited results.

Resource tree only shows all assets already in the level, it can’t be used to access new ones.

== Lighting in editor ==
[[File:Trine3_lights.gif|thumb|A gif showing the effects of different types of lights on the scene.|480px]]
This page lists the most important LightEntities found in the editor and sheds some light (no pun intented) on their usage. There's a lot of general information about lighting in 3d games and related topics in the internet and elsewhere, so the interested reader is encouraged to do some independent searching for more in-depth discussion. Don't be discouraged by the large number of different properties that the LightEntities might have, most of them work with their default values.

What follows is a general overview of the different light entities you can find in the editor. In addition to general discussion, there are some examples of how each entity should be used.

=== AmbientLightEntity ===
Ambient lights are used in Trine 3 (and in games in general) to emulate the real world phenomenon of [https://en.wikipedia.org/wiki/Radiative_transfer radiative transfer] (energy transfer in the form of electromagnetic radiation, e.g. light). After photons are emitted, they are scattered, absorbed and re-emitted multiple times before finally reaching the viewer. This is one of the reasons why in nature there are no completely sharp or black shadows and that it's hard to find a completely dark place during daytime.

'''AmbientLightEntity''' is most often used as a global ambient light to set the base tone of the scene. If both color components are identical, they will create the effect of a uniformly lit scene. AmbientLightEntity can also be used as a directional light of sorts, if the Color2 component is a darker shade than Color1 component, as it is by default. This still mimics the behaviour of radiative transfer (absorption, emission, scattering), since AmbientLightEntity can't create shadows.

=== DirectionalLightEntity ===
[[File:Directional.png|thumb|DirectionalLightEntity causing an orthographic projection of shadows.]]
[[File:Directional_sunset_on_off.gif|thumb|A DirectionalLightEntity used in Pontius's tutorial for "sunset effect".]]
Directional lights are lights that emulate a light source that is infinitely wide and infinitely far, thus "emitting" light rays that are precisely parallel to each other. On Earth, direct sunlight can be approximated as parallel rays of light, and thus directional lights are used in Trine 3 to emulate sunlight and the sharp shadows caused by it. Another common use for directional lighting is a so-called skylight.

On an overcast day when no direct sunlight reaches the ground, objects are still clearly visible and lit. This is due to the light scattering from particles and water droplets in the atmosphere and reaching the ground through the clouds. The same phenomenon causes the sky to look blue during daylight and to be bright and colourful at all. If there was no atmosphere, there would be minimal scattering of light, resulting in a very dark sky and extremely harsh direct sunlight (among other, perhaps more lethal things), although the Sun would appear to be smaller in size. This is the physical phenomenon called [https://en.wikipedia.org/wiki/Diffuse_sky_radiation "skylight"], which is emulated in Trine 3 with a shadowless directional light that is perpendicular to the ground level, i.e. pointing straight down.

Although the effects of skylight and ambient light in the real world are based on the same physical principles (radiative transfer), in Trine 3 they aren't the same thing. Ambient light emulates the light that has already reached the ground and is just "bouncing back and forth" between different objects making everything look more or less the same from any viewing angle, whereas skylight is the diffuse light "coming straight down from the sky", making things look lighter and brighter from above rather than from below.

'''DirectionalLightEntity''' is a local directional light which uses an [http://db-in.com/images/projection_example.gif orthographic projection] instead of a perspective one. It's local in the sense that it's borders (field of view and range) can be chosen at will so that the light is projected only to a certain area. Most often DirectionalLightEntity is used as a local skylight for the background objects or to create other local but large-scale lighting conditions, like the appearance of a setting sun, as it was used in the beginning of Pontius's tutorial level.

'''SunDirectionalLightEntity''' is a global type of DirectionalLightEntity. It's range and field of view don't have any effect on it like they do on local directional lights. Like other directional lights SunDirectionalLightEntity casts orthographic shadows, but unlike any other light in the editor (except for AmbientLightEntity) it's position doesn't determine "where the light is coming from". The direction of the light can be changed only by rotating the SunDirectionalLightEntity, because it's thought to be infinitely far away.

=== PointLightEntity ===
[[File:Point.png|thumb|A PointLightEntity doesn't cause shadows.]]
[[File:Alpha_point.png|thumb|Fog and a PointLightEntity with RenderAlphaObjects.]]

Point lights are considered to be minuscule points that radiate isotropic light i.e. light that's the same in all directions. In the real world, only stars other than the Sun are considered point sources of light due to the great distance separating them from Earth. The closest thing to a point light on Earth is a light bulb without a lampshade. Since light bulbs without shades are a quite rare thing to see, point lights aren't a very authentic way to light a scene. The good thing is, they can be used together with other sources of light to create more natural lighting conditions. Point lights are also a very good way to highlight something and to make even small details easy to spot.

'''PointLightEntity''' is Trine 3's basic point light. It's color, intensity and range can be chosen to match the desired situation, whether it's large-scale orange-white light coming from bubbling lava or just a tiny speck of light coming from a glowing pink mushroom. PointLightEntity can also be used to cast light on only alpha objects, that is, objects like fog which don't have a solid frame.

PointLightEntity doesn't cast shadows at all and thus its light isn't blocked by any collisions or models. Be sure to take this into account, when you set the intensity and range of your point lights. Speaking of which, range and intensity can be tweaked with the '''scale tool''': When scaled from the middle of the scale tool's gizmo, both range and intensity are affected. When scaled on the green Y-axis, only intensity is affected, where as red x-axis affects range only. Blue line does nothing.

=== AmbientPointLightEntity ===
[[File:Ambient_point.png|thumb|An AmbientPointLightEntity is a local ambient light.]]
Ambient lights were discussed above and [[#AmbientLightEntity]] was said to be used as a global ambient light to set the tone of the scene. Like local directional lights, there are also local ambient lights. PointLightEntity can be used as a local ambient light by changing the property called '''AmbientFactor'''. When this is 0, the PointLightEntity works as a normal point light, but the closer it is to 1, the more it behaves like a local ambient light. This kind of local ambient light works in the same manner as global ambient lights, except it's range can be chosen at will.

=== PointLightEntity with RenderAlphaObjects ===
PointLightEntities can also be used to light alpha objects, like spiderwebs, fogs, clouds etc. In Trine 3 editor the '''RenderAlphaObjects''' property can be set to turn a PointLightEntity into an "AlphaBlendPointLightEntity".

It's noteworthy, that once '''RenderAlphaObjects''' is on, changing the '''Range''' property isn't anymore enough to change the actual range of the light, also the '''Radius''' property should be changed to the same value under PointLightComponent-->PointLightAreaComponent-->SphereAreaComponent->Radius. This only applies to manual editing of Range and Radius, if the scale tool is used to change the range of the point light, the radius is increased automatically.

=== SpotLightEntity ===
[[File:Spot.png|thumb|A SpotLightEntity and a perspective projection of shadows.]]
[[File:Shadow_quality_4.gif|thumb|SpotLightEntity shadows flickering on and off]]
Spot lights are like directional lights but the light projection is different. The light is projected in a cone and the shadow projection is perspective instead of ortographic. A flashlight is an example of a spot light. Spotlights are usually used in combination with point lights to create more realistic lighting conditions.

'''SpotLightEntity''' is the spot light of Trine 3. It shares many of the properties with DirectionalLightEntity (and SunDirectionalLightEntity), since DirectionalLightComponent is a child type of SpotLightComponent. A SpotLightEntity's range, color, intensity, fov and many other properties can be changed at will to reach the desired lighting conditions. SpotLightEntity has also a property called LinearFade. If it's false, the light attenuation of the spot light is more "natural" and fades faster. If set to true, the intensity of the spot light fades linearly, i.e. it's value decreases like 1.0/distance (instead of 1.0/distance squared).

SpotLightEntities have '''ShadowQuality''' set by default to ShadowQuality4. If there are more than four SpotLightEntities with ShadowQuality4 in view, the shadows will start flickering. The same applies to SpotLightEntities with lower ShadowQuality so that
* 4 x ShadowQuality1 = 1 x ShadowQuality2
* 4 x ShadowQuality2 = 1 x ShadowQuality3 and
* 4 x ShadowQuality3 = 1 x ShadowQuality4

All in all there can be a maximum number of 10 shadow casting SpotLightEntities in view at the same time.

<gallery>
File:Ambient_prop.png|AmbientLightComponent
File:Point_prop.png|PointLightComponent
File:Alpha_point_prop.png|Radius, Range and RenderSolid/AlphaObjects.
File:Spot_prop1.png|SpotLightComponent, DirectionalLightComponent and SunDirectionalLightComponent have the same properties, with slightly different settings.
File:Spot_prop2.png|SpotLightComponent cont.
</gallery>

=== ColorEffectEntity ===
[[File:Coloreffectentity.gif|thumb|Different ColorLookupTextures.]]
'''ColorEffectEntity''' is a scene wide effect that sets the tone of the scene. The '''Exposure''' property can be used to change the exposure of the whole scene, i.e. to make the scene globally darker or lighter. The '''ColorLookupTexture''' property can be used to choose a color look-up table from the ones created for the game in question. These can be found under \data\root\instance_base\entity\texture\color_lookup.

=== Bloom ===
[[File:Bloom_lens_flare.gif|thumb|Lens flare effect of bloom.]]
[[File:Bloom_effect_entity.png|thumb|BloomEntity]]

=== General ===
Bloom is a shader effect used in game engines to emulate imaging artifacts of real-world cameras, like [https://en.wikipedia.org/wiki/Lens_flare lens flare], [https://en.wikipedia.org/wiki/Dynamic_range#Photography finite dynamic range] and [https://en.wikipedia.org/wiki/Airy_disk airy discs] caused by the diffraction of light.

In game engines, bloom effect can be used to create a dream-like visual style or emphasize a magically glowing objects. With the right settings it can also enhance the photorealism of the scene by emulating the above mentioned effects.

=== BloomEntity in the editor ===

BloomEntity (BE) can be found from "InstanceBase/Entity/SceneEntity/BloomEntity". BE is a global effect and it has many properties in it's GlowComponent, but most of these don't need to be touched by the user. The two most important ones are:
* Factor
** Determines the weight of the particular BE, if there are more than one in the scene. Mostly used for animation purposes.
* StreakLength
** Setting this to 0 removes the lens flare effect, which is dependant on the relative direction of the BE.

=== Properties of glowing objects ===

Normal entities can be made to glow, like the collisions used in the pictures. Every entity with a ModelComponent has four properties that determine their behaviour with BE. These are:
* SelfIllumination
** The colour of the self illumination. Like the name says, used for objects that are supposed to be self illuminated, like sun, moon and lamps.
* SelfIlluminationFactor
** The strength of the self illumination. Example values used for different entities are 1000 for sun, 2 for moon and 15 for a bright lamp.
* GlowAmountColor
** The colour of the glow effect. Like self illumination, but this adds a soft halo around the object.
* GlowAmount
** The strength of the glow effect. Values usually around or less than 1.

Usually self illumination and glow are used together to achieve the best result.

<gallery>
File:self_ill.png|Self illumination.
File:Glow.png|Glow.
File:Combined.png|Self illumination and glow combined.
</gallery>

=== Additional Shadows ===
There are 3 kinds of shadows: '''fake_shadow_gradient.fbxmodel''', '''fake_shadow_gradient_radial.fbxmofel''' and '''fake_shadow_solid.fbxmodel'''. The solid one is used to block lights by placing the black area to point towards light source (the other side is invisible).
The other two are used to give walls etc some extra shading.

Some ground art pieces are kinda bumpy and there are times when they might look a little bit funny after lights have been added. This can be fixed by using ShadowBias that can be found on the object's properties and changing it to 0.1. Below will be examples and you can see how big the difference is.

<gallery>
File:Level_art_tutorial_withoutshadowbiasv2.png|Before adding ShadowBias
File:Level_art_tutorial_withshadowbiasv2.png|After adding ShadowBias
</gallery>

=== Fog ===
Fogs can be found in Typeroot -> InstanceBase -> Entity -> ObjectEntity -> object -> atmosphere-> fog

'''CircleFogAreaEntity''' and '''SquareFogAreaEntity''' are used to create atmospheric effects and distance fog. It can be found in the type tree under LightEntity. FogAreaEntities work similiarly to DirectionalLights. Use Scale tool to edit Range, Fov and intensity. In Properties under SpotLightComponent you can adjust Color of the fog and thickness. Change Linear overbrightness to make the fog more or less thick. 1 is really thick and -1 is completely transparent.

Main Page

2021-11-24T12:00:39Z

Tero Tirkkonen:

<strong>Welcome to the Frozenbyte public wiki!</strong>

This wiki provides information and documentation about Frozenbyte and the tools we use to create games and levels. If you have any questions or want something to be added to the wiki, note that you can also [http://www.frozenbyte.com/contact/ contact] Frozenbyte directly.

==3D Asset Workflow Teaching Materials==

* [[3D_Asset_Workflow|3D Asset Workflow]]
** [[3D Asset Workflow: Concepting]]
** [[3D Asset Workflow: Sculpting]]
** [[3D Asset Workflow: Retopo and UVs]]
** [[Modo]]
** [[3D Asset Workflow: Baking and Texturing]]
** [[3D Asset Workflow: Exporting to Editor]]
** [[3D Asset Workflow: Decals and Alpha planes]]
** [[3D Asset Workflow: Collisions and Breakable objects]]
** [[3D Asset Workflow: Billboards]]

==Level Art Teaching Materials==

* [[Level Art]]
** [[Level Art: Color and Lighting]]
** [[Level Art: Composition]]
** [[Level Art: Environmental Storytelling]]
** [[Level Art: Ideas for New Levels]]
** [[Level Art: Level Art Related Gameplay Issues]]
** [[Level Art: The Level Art Phases]]

==Editor Tutorials==

This wiki features multiple editor tutorials that introduce you to Frozenbyte editor. This section is for useful links about that.

*[[Shadwen_Editor_Tutorial|Shadwen Editor Tutorial]]
* More to come!

Level Art: The Level Art Phases

2021-11-23T14:49:53Z

Tero Tirkkonen: /* Detailing */

{{:Level Art}} 

= The Level Art Phases =
'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

* The level art process in a nutshell:
** 1) Reference and Research
** 2) Preassembly
** 3) Base Art Blocking
** 4) Detailing
** 5) Polishing & Optimizing
** + Feedback. The level artist receives feedback during the whole level art process.

* Communication is important. Talk with AD, asset artists, other level artists and designers. These conversations should happen often; constant communication is needed throughout the whole level art process.
* Base art is the most important part of the level art process. If the base art is lacking, nothing works - no matter how many pretty details you stamp over it.
* The level art work is done iteratively, keeping the state of the art coherent throughout the whole level constantly. In other words, unfinished areas with bare collisions and areas with finished, detailed level art shouldn't co-exist within the same level.
* The whole level should stay as playable as possible at all times. If your art assets (even the temporary ones) result in hindering or preventing the level from being played, you shouldn't use them.

== Level Art Scheduling ==
* The time needed for the level art process is usually allocated as follows: The Base art takes 60%-70%, detailing 20%-30% and polishing 10%-20% of the time.
* Ideally, the time required to build a level from scratch to finish is roughly '''3 months (about 60 workdays)'''. It leaves enough time to commit the base art and polishes properly and tackle any surprise work that may emerge.
* If in a hurry, a level can be built as quickly as in '''2 months (about 40 workdays)'''. There's enough time to commit the base art and polishes adequately, but there's no room for errors or any surprises.
* There are multiple factors that can affect the level building duration, for example:
** The quality of the base art work (or any other art phase work, of course, but since the base art is the most important, fixing and fine-tuning it will take the longest)
** Changes in the level design schedules
** Sudden problems unrelated to the level artist/art team
** 3D assets missing/pending
** Changes in the gameplay design, requiring level art modifications
** Co-workers (designers, for example) needing to work on a level at a crucial time
** Sick leaves and personnel changes
** Unexpected and surprising issues

== Level Art Process Steps ==
# Before level art process starts: Familiarizing yourself with the '''references''' available and '''researching''' the topic
# Before level art process starts: '''level meetings''' with AD, 3D art lead and the level artists and designers that are/will be working on the level
# '''Preassembly''': No access to the actual map file yet, building the level art arrangements and asking for '''feedback from the AD'''
# '''Base art''': '''Preliminary lighting''' setup
# Base art: Blocking the level art, building a strong and working base that supports the gameplay, covering all the collisions - keeping it simple!
# Base art: '''Camera fix list''': adjusting the cameras to function as good as possible (considering both the gameplay and art), consulting designers
# Base art: '''AD's check''' and writing a fix list
# Base art: '''Fix list round''' where the base art is improved according to AD's feedback
# Base art: '''Lighting adjusting'''
# '''Detailing''': Adding details on the base art
# Detailing: '''AD's check''' and writing a fix list
# Detailing: '''Fix list round''' where the level art is improved according to AD's feedback
# '''Polish and optimizing''': Optimizing, adjusting lighting and fine-tuning level art until the time runs out. Multiple people can add more fix requests to the fix list when the content lock is approaching.

=== Example Art Schedule for One Level ===
* The timeframe for building levels is 65 workdays per level
* '''Some tasks can be done simultaneously''', including base art checks, camera fixes and lighting polishes. An example: Camera set-up can be pre-built for a different scene and then copied to the final level after the lighting polishes have been finished.
* You can keep editing the level during any AD's check since AD won't be saving anything.
* There are times when you can't access the level due to a co-worker editing it, but you can create a duplicate of the level and continue your work there. When the level file is available again, just copy and paste your work from the duplicate to the original level.
* When unable to access a certain level, you can also start working on another level.

* Colors explained:
** <span style="font-size:14px; color: #ea9b99"> '''Level artist'''</span> (Responsible of this level)
** <span style="font-size:14px; color: #a3d5a3"> '''Camera artist'''</span>
** <span style="font-size:14px; color: #d9b887"> '''Lighting artist'''</span> (Optional, there could be none or several level artists responsible of the lighting as a whole)
** <span style="font-size:14px; color: #bac0ec"> '''Art Director'''</span>

{| class="wikitable"
|-
! 20 days
! 2 days
! 4 days
! 20 days
! 3 days
! 10 days
! ?? days
! 5 days
! 1 day
! ?? days
|-

|-
|style="background-color:#feaeac"| Base art || || style="background-color:#ebc793"|Lighting polishing || style="background-color:#feaeac"| Base art fix and detailing || style="background-color:#ebc793"|Lighting polishing ||style="background-color:#feaeac"| Details fix || Wait for puzzle versions,<br>work on another level|| style="background-color:#feaeac"| Puzzle versions art || style="background-color:#feaeac"| Coop playtrough with level artists ||style="background-color:#feaeac"| Final polish
|-
| || ||style="background-color:#bef1be"|Camera fix|| || || || || || ||
|-
| ||style="background-color:#c9cfff"|Camera check||style="background-color:#c9cfff"|Base art check|| || style="background-color:#c9cfff"|Details check|| || || || ||style="background-color:#c9cfff"|Random checks
|-

|}

== Research and Reference ==
* All the developers need to work towards a common goal, and it's everyone's responsibility to keep that goal in mind.
* To help everyone to share the same vision and understand the project as a whole, there are tools available:
* When hopping aboard a new project, go through the reference materials to familiarize yourself with the overall vision, goals and tone of the project. Refer to these materials regularly during the project.
* If you're a level artist, study the basics of [[Level Art: Environmental Storytelling|Environmental Storytelling]].

=== Script ===
* Read the whole script at the beginning of the project.
* When beginning the level art process for a new level, go back to the script and read again the section describing that level.
* You should re-read (parts of) the script every now and then to make sure all the details and ideas are reflected in your level art.

=== Wiki and Concept Art ===
* When assigned to a new level, go through the wiki page for that level - and keep editing and reading the page during the level art work.

<gallery heights=350px mode="packed">
File:level_concept_examples_01.png|A level art wiki site contains all the concept art related to the level, maps, color and shape plans etc.
File:level_concept_examples_02.png|You want to study all the available materials carefully to get the big picture. After that, feel free to search for more reference images online.
</gallery>

== Preassembly ==
* Preassembly isn't usually scheduled, allowing the level artist to do it whenever there's time.
* Preassembly means working on the level art before you can access the actual collision-blocked map file with all the puzzles and design. The goal is to eliminate any idle waiting time.
* During the preassembly face, you should familiarize yourself with the level theme and assets without distractions.
* The most important preassembly work is creating a solid library of level art arrangements. Take your time and choose the arrangements that best suit the level: some assets in the library might be scrapped but most of them should end up in the final product.
* Use the preassembly time to try out your ideas. It's a perfect time to play around and experiment without paying any attention to the level geometry restrictions of the real level.
* You can quickly build rooms, backgrounds, focal point arrangements, gameplay platforms etc. without worrying where to place them exactly.
* Since preassembly creations are not integrated with the actual game collisions, it's much easier to edit them if something doesn't feel right.

=== How to Preassemble ===
* Gather a bunch of ideas by reading the script, familiarizing yourself with the level wiki site, browsing through the new level assets and possibly searching online reference images.
* With a head full of ideas, start building level art arrangements for the level. Begin with the necessary must-have objects needed in the level and create more as you go.
* While creating the preassembled arrangements, you'll probably start developing some kind of an idea concerning the structure of the level.
* Every level should have a focal point area in the beginning and in the end. Figuring out how those areas are executed is a great place to start.
* It's easiest to start with story areas described in the script, areas with existing concepts and/or areas you have a strong vision in mind for already.
* Be careful not to add too many details, as the detailing phase happens only after the preassembled arrangements are placed in the actual level map and the base art is satisfactory.
* Once you're happy with an arrangement, you can store it under the null (the null object in Editor) for easier handling.

=== Possible Pitfalls ===
* While it allows you to experiment freely with the level, there are some issues you may encounter during the preassembly phase:
* '''Incoherent and disjointed level flow''': The flow of the level needs to be coherent from the start to finish. Be careful when arranging separate pre-made blocks of art together and pay special attention to "in-between" transition areas. Keep the big picture in mind.
* '''Detached feel''': Copying the preassembled arrangements to an actual level may result in a feeling of not belonging. The pieces might look and feel like a separate backdrop floating behind the 2D game area (that's actually what they are, in fact, but they shouldn't feel like that). When adding your arrangements, integrate them seamlessly into the gameplay area.
* '''Under-optimization''': A seemingly small piece of extra geometry is multiplied rapidly when the arrangements are duplicated. To avoid repetition and clumsiness, optimize the use of your preassembled arrangements.
* '''Too many details''': The preassembly phase is followed by a base art phase. If the preassembled content is detailed and complex, it'll make the base art phase overly complicated and will slow the progress down.

<gallery heights=350px mode="packed">
File:level_art_preassembly_architecture_examples.jpg| Preassembled arrangements for the Trine 4 DLC Cornelius's Dream level
File:level_art_preassembly_organic_examples.jpg| Preassembled arrangements for the Trine 4 DLC Rudolfus's Dream level
</gallery>

== Base art ==
'''The first on the foremost purpose of level art is to support the gameplay and bring out the important game objects as well as possible.''' A visually pleasing game is an important goal on its own, but the level art must always submit to the gameplay. When the base art phase is over, there should be a fully playable level with both art and the gameplay functioning and complimenting each other.

'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

=== Cover and Match All the Collisions ===
* Once a designer is finished with a level, it's handed to a level artist. It's time for the base art phase.
* Base art phase is scheduled - it's important to fill the level with art as soon as possible.
* During the base art round, art elements are added to a level for the first time. Everything is built on top of the base art, so it's very important to get it right.
* Base art phase includes '''covering all the visible collisions'''.
** Note: If you match the collision areas and art carefully during the base at phase, it'll save a lot of time and the need to fix them later.
** Go through all the areas the player can interact with and check the collisions - remember not to consider only the characters but also the wizard's levitating objects.
** Pay attention to smaller things as well, like floating rope targets. The aim is to cover and support all gameplay elements with art so that the game can be played and enjoyed after the base art phase.
** Go through the level from start to finish. Play the level yourself with a character and make sure the collisions work as intended (AKA characters aren't floating or walking inside assets and characters or levitation objects won't get stuck on invisible collisions).

=== Focus on the Big Picture ===
* During the phase art base, '''do not add small details'''. If the base geometry goes through changes and level art needs to be altered, additional art details slow down the process a lot: checking the level, doing paint-overs and fixing the base level art is really difficult if there are a lot of details.
* After the art blocking phase '''the level should look and feel "complete", serving as a solid base to add things later on.'''
* Even if you must work with placeholder 3D assets, try to match the '''proportions''' from the start.
* Don't spend too much time creating intricate, highly detailed placeholder areas. Rather use temporary structures, instead, or, if you must, leave the area empty while waiting for assets.
* Divide your work into steps, to avoid spending all your time on a single finalized scene and neglecting other areas. Focus on '''a single run throughout the whole level'''.
* A safe place to start are the walls, ground, floor and other environmental elements making up the big objects.
* '''The backgrounds''' are an important part of the base art. They play a huge role in creating the big shapes and the visual flow.
* When working with outside locations, don't forget the sky - or you're missing out on a big part of the screen. Remember to add the clouds and weather elements etc. They are a very important part of the level's general flow.

<gallery heights=400px mode="packed">
File:base_art_and_detail_art_01.jpg| A great example of the base art done right: A simple setting, providing a great base to build on and add details. Also easy to modify, if needed.
File:base_art_and_detail_art_02.jpg| The base art looks good, though the door collision is yet uncovered. Allowing the unique gameplay asset (the snowball instructions in the background) collisions to go untouched is ok in this scene, as they will be replaced with new assets later.
File:base_art_and_detail_art_03.jpg| A good base art is simple enough - when the whole set could be changed, one shouldn't waste too much time with the base art.
File:base_art_and_detail_art_04.jpg| The base art is too detailed here - if there are any changes to the level geometry, a lot of work has been done in vain.
</gallery>

=== Basic art principles are present from the start ===
* [[Level Art: Composition]] The composition and flow guide the player through the level. Tip: Select the right materials for the shapes, and never use assets scaled too large, unless you can hide them well.
* [[Level Art: Color and Lighting]] Color and lighting can be used to guide the player as well. Tip: Use the values and contrasts so that the important things pop out and unimportant things blend in. Invite the player towards their intended path with lights and use darker tones for those parts of the screen the player is not supposed to stumble into.

=== Don't Let the Collisions Restrict You When it's Not Necessary ===
* The collisions are implemented by level designers - while they pay attention to art details as well, their job is designing the game, not making art.
* Never edit the collisions or gameplay objects without consulting the designers first - but don't be afraid to ask about the matter. Have a conversation with the designer about the changes you wish to make, and if they agree, proceed.
* The gameplay area is a narrow 2D plane, the width of it being only about 2 metres. The collision rules, for example, are applied only inside those two-meter borders. Your job is to blend the gameplay area into the surrounding 3D scene and to make it a believable part of the world (as opposed to an artificial, detached lane).
* As long as your foreground or background items don't distract the player from the important gameplay things, feel free to experiment and go wild.
* It's not necessary for the background and foreground areas surrounding the gameplay area to follow the general shape of it. On the contrary, they should be used to create depth and hide the fact that the actual game happens in a narrow, straight line.

=== Requesting New Pieces to 3D Asset Sets ===
* Level artist uses the 3D asset sets created by 3D artists to build levels - and figure out simultaneously how the various asset pieces work.
* Don't hesitate to give feedback to 3D artists and/or request art from them. Both you and the 3D artist benefit when useful and visually satisfying asset sets are created.
* The 3D artists create the assets and don't really build levels with them. To make full use of all assets and connect them together, it's likely you'll need to ask for more parts.
* If you need more asset pieces created, compile a list of your needs during the base art base and deliver it to the 3D art lead.
* For example, you might ask for more differently sized pieces to a wall set, if [[Level_Art:_Composition#Problems_created_by_scaling_3D_models_too_much|scaling the size of the old ones up]] or [[Level_Art:_Composition#Non-uniform_scaling|non-uniformly]] will result in the visual quality suffering.
** Note: It's fine to use the too-much-up-scaled or non-uniformly-scaled versions of the pieces for the first version of your base art. Request the new 3D pieces by the end of the base art phase and replace the old assets with new ones later.
** Tip: If possible, it's better to gather a list detailing all your needs than to ask for a new 3D set piece every day.
** Tip: When building temporary structures from currently available assets, write down their measurements and describe the shape that you want the new assets to be. Pass your notes along with your asset order list to the 3D artist who can use them as a reference.

=== Prioritize the focal point areas ===
* Start with the focal point areas (beginning, ending, story areas, special art areas etc.) and plan the rest of the base art around those scenes.
* The level start and end areas are usually focal point areas, as we want the first and last thing the players see to look extra nice.
* Not every single frame can be a focal point one, but there should be more general areas between instead. By alternating the various scene types it's easier to avoid player exhaustion, create rhythm and emphasize the special areas.
* Since the game project is on the clock, it's best to schedule and plan carefully before the actual work.
* 2D angled games (like Trine) face issues with matching the organic art to the straight collisions. To avoid that, you might feel tempted to create natural rock formations with perfectly straight 90-degree angles. Try keeping the rock formation as natural as possible, instead, while strictly following the gameplay collision areas and rules (the foreground and background area are not tied by the gameplay area rules). If a straight/90-degree surface must be included, you can use man-made constructions (brick, wood) rather than pursuing the "natural" rock look.

==== Focal points ====
* Focal points are very delicately planned and beautifully built areas inside the level.
* They can be impressive and unique hero assets or just small asset arrangements built out of ordinary assets (nicely composed and made look perfect for the specific camera angle).
* Most of the level should consist of the "basic environment"; focal points are located here and there to spike interest.
* You can also use carefully crafted small lighting scenarios as points of interest, like a warm ray of light emerging from a hole in the cave wall, illuminating some mushrooms/rocks/etc.
* In Trine games you should place the focal points between the puzzle areas. Scenes containing puzzles should be clear of any distractions, allowing the players to fully focus on solving the puzzle.
** The puzzle areas shouldn't look boring, either, but it's a good practice to build the various areas of the level to highlight their function.
* If there's not enough space for an important focal point area in the game, talk to the designer. Usually, they are willing to add the needed space to the level.
* Reference images are especially important when building focal point areas, so study and search for new images!
* Even if two levels share a theme, each level should have a unique feeling of its own.
* There should be something special and visually memorable in each level: A point that evokes feelings and makes the level remarkable. For example, a shark swimming by, a unique geological formation or the oldest classic - a breathtaking scenery point.

<gallery heights=200px mode="packed">
File:Trine 4 screenshot 17 1080p.png| A striking focal point features a unique wizard face sculpture asset specifically made for this spot.
File:Trine 4 screenshot 44 1080p.png| The dragon skull on the background, its strong silhouette against the sky, is an eye-catcher and a remarkable focal point.
File:Trine 4 screenshot 38 1080p.png| The statue on the left is highlighted with golden "god rays". The cave is full of angular forms, making the statue stand out.
File:Trine 4 screenshot 43 1080p.png| The bear statue adds a mysterious focal point to the more traditional forest scenery.
File:Trine 4 screenshot 40 1080p.png| Frozen dragon skeleton is framed with the diagonal "god rays" from the top and diagonal icicles from the bottom.
File:Trine 4 screenshot 25.png| The fiery planet draws eyes towards it. The shiny celestial body is surrounded by curved shapes emphasizing it even more.
File:Trine 4 toby's dream screenshot 02.png| The curved branch silhouette is a simple, yet effective focal point. The flow of the scene supports it nicely.

</gallery>

== Detailing ==
* When the detailing phase is reached, it's a race against the clock to get all the levels finished on time, thus making the detailing phase a tightly scheduled one.
* The level is already filled with functioning and pleasing visuals. Details are added for plausibility reasons, and to pique visual curiosity, to create depth and to add to the level's visual charm.
* The level base is optimized during the detailing phase to make sure there isn't any excess geometry left.
* Pay attention to the consistency of your art in a single level and of the whole game: there shouldn't be some areas filled with details while some are completely empty.
* Always iterate gradually. It's tempting to fill one area from top to the bottom with detailed and finished art - and then move on to the next one, but you might end up running out of time and ruining the coherent feel of the level.
* [[Level Art: Environmental Storytelling|Environmental storytelling]] should guide your work while detailing.
* The level design might change during the detailing phase, forcing you to consider and adjust your level art accordingly.
* When the detailing phase is over, each level of the game should be "good enough". The sooner the levels reach that state, the better.
* In theory, once the detailing phase ends, each level should be ready to ship (if, for some imaginary reason, there were no time or resources for any polishing). That means art is coherent and of good quality, supporting the gameplay. There shouldn't be any major visual issues. In reality, the Trine levels are always polished and fine-tuned.

== Polishing ==
* Usually not a scheduled phase, as the levels entering this stage have reached the "good enough" standard mentioned earlier.
* The remaining time (until the content lock day) is spent fine-tuning everything as much as possible.
* Polishing is done last to ensure the overall quality of all levels. Each level should reach the "good enough" state before any polishing on any level happens.
** Note: If you have gaps in your schedule during the earlier level art phases (while waiting for access to a certain level, for example) it's ok to do some polishing work as well.
* The Trine game levels are polished until the last possible moment, and none of the levels is considered "final" until the game launch day.
* Even when polishing you need to consider the general art quality and aim for coherence throughout the game: some levels can't look more polished than the others.
* New 3D assets might appear during the later stages of the project, and they are distributed evenly among the levels.
* Polishing phase entails minor detail fixes and also bigger base art level fixes. The development is a constant flux: some brilliant ideas come up late and some previously functioning concepts are abandoned during the later phases.
* While it's not recommended to implement any radical changes during the polishing phase, don't be afraid to speak up (no matter how close the deadline is), especially if your idea would elevate the quality of the whole level.

=== Polishing a Level Originally Created by Another Artist ===

* Polishing can be done by any of the level artists, no matter who originally created the base art and detailed art.
* It's beneficial for all the level artists to work on all the levels. That helps to keep the levels fresh and coherent and ensures the full potential of the art team is used.
* Nevertheless, some things should be considered when polishing a level made by another level artist:
** The artist responsible for a level's base/detail art might feel some degree of mental ownership of the level. Every other artist is encouraged, however, to suggest their ideas and execute changes. Nobody owns the level or the level art.
**However, the original artist has the best understanding of the level, granting them the chance to participate in the process and to voice their opinions and thoughts.
**The AD has the final say on which art version will be used, but they base their decisions on listening and reasoning, making sure each team member gets their voice heard. While the AD has the best grasp of levels as a whole, the level artist knows their level best.

* '''First, discuss with your AD and the original level artist'''
** Get a permission to start with the polishing work from your team lead.
** If you plan on executing radical changes, talk with the artist responsible for the base and detail art.
** The level might feature, for example, story-related elements that affect the level art. The original level artist can brief you about special details.
** Tip: Before making any changes, read the level art wiki site to understand the level.

* '''Smaller detail polish directly to the level, bigger base art polish to a copy of the level'''
** When you polish smaller details, not tampering with the base art radically, save your work to the actual level.
** When planning to make big changes, try them out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Keep the level of details coherent'''
** After reaching the "good enough" state, level art shouldn't revert back to any of the previous art stages even temporarily.
** When planning to make big changes or stripping a part of the level bare of the detailed level art, try the changes out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Before & after screenshots'''
* Take before/after screenshots of the changes
** If the changes are small, use the actual level
** With bigger changes, use a copy of the actual level
* Take screenshots before and after using the same camera positions.
* You need to be able to pinpoint the location and the exact nature of the changes.
*Tip: You can always return to the original version of the level to take the screenshots.

* '''Feedback'''
** When making larger changes: Show the changes made to the (copy of) level and the before/after screenshots to your AD and the original level artist. Discuss with them about the changes.
** When making smaller changes: Show the before/after screenshots to your AD to receive feedback, and fix the level art accordingly.

* '''Replacing old with new'''
** If the changes are approved by the AD, they can be commited to the actual level.

3D Asset Workflow

2021-11-23T14:45:01Z

Tero Tirkkonen:

This is a series of Wiki pages related to the 3D asset creating process at Frozenbyte. With these guidelines you should be able to create a game asset from an idea to a textured game model or at least get the needed information on what you should research and practice in order to achieve that. The information on these sites is created and collected by our 3D artists and these methods are used daily here at Frozenbyte. The wiki pages also include links to external sources we’ve found to be useful. The wiki page is a transformed version of our internal guidelines with some of the most top-secret bits edited out. There is also a similar collection of Wiki pages related to the Trine style [[Level Art]].

* '''If you can't find some useful info here, please find it out elsewhere and add the info here in the proper section'''
* Please keep things organized and '''use similar format as the existing material''' here is already using
* '''Images and videos are super helpful''', so those are very much encouraged
* If the info is related to the general 3D asset workflow, add it to [[3D Asset Workflow]] page. If it's Modo specific, add it to the [[Modo]] page
* '''The info should be in one place and linked''' into another place, no copy & paste duplicates across several pages

= 3D Workflow steps =
At Frozenbyte the 3D artists will usually take care of all of these steps when creating 3D assets. The 3D artist gets to design the asset from the concept to the final asset that is available in our own in-house game editor. Then the level artists will use the assets to create levels.

# '''The idea''' - a mental image to work towards is formed when discussing with the art director, thinking about the story, and looking at reference images. This part might require communicating with different team members, for example designers, the script writer and/or other artists.
# '''The concept''' - once the idea is clear some kind of concept is made. It can be a rough drawing or a sculpt or a photo bash. The point is to visualize the basic idea, so that the AD can approve it, and you can continue working on it further. With a concept everybody has some kind of idea what the end result will be. The concept can be a very rough scribble as long as the general idea is communicated.
# '''High-poly mesh, or sculpt''' - the detailed and performance heavy version of the mesh. It's not used in the game, but it's used to bake texture maps that are seen on the low-poly mesh in game. Like in all the work phases, it's good to first sculpt a rough version of each piece and get a confirmation from the AD that everything seems to be going as desired. Then it's time to sculpt the details.
# '''"Trash version" of the low-poly mesh, if the mesh is going to be animated''' - when making characters for example, it's good to give the animators a very crude low-poly version of the mesh. This can be done when all the proportions of the mesh are somewhat finished, but there is not detailing yet. This way the animators can point out possible problems early on, when they start rigging. ''Note that this step is obsolete if the mesh is NOT going to the animators''.
# '''Low-poly mesh''' - a less dense and engine-friendly approximation of the high-poly model. This model will end up in the game. It's important to have the optimal amount of geometry (polygons), not too little so that the mesh is too angular, but not too much so that the mesh is needlessly performance heavy. The silhouette is what counts.
# '''UV-mapping''' - creating the texture coordinates for the low-poly mesh, so that the textures are in the correct place on the model and in the correct resolution.
# '''Baking and texturing''' - transferring details from the high-poly model to create a surface material for the low-poly model. Adding all the materials and colors on the model.
# '''Export & import to editor''' - preparing the low-poly model (fbx) and the final texture maps (tga) and importing them to editor with correct naming, adding your new models to the asset gallery.
# '''Adjusting in editor''' - further configuration in the editor, for example back light, self-illumination, etc.

=== Additional Tips Along the Creating Process ===
* '''The scale''' of the final model is important to get right as early as possible. '''Always have a game character model as a scale reference''' from the very start when you start sculpting.
** '''The scale has to be considered every step of the way''': sculpting, detailing, how dense and detailed the low poly mesh should be, and in texturing.
** In some cases it can be a bit hard to see the real scale of things outside the editor game view so '''a temporary version of the asset can be imported to editor to check the scale''' before it's finished. It's better to do this than to use days to finalize the asset and then notice it's in the wrong scale.
** How to nail the right scale: [http://www.neilblevins.com/cg_education/details_make_big/details_make_big.htm Using Details To Make Something Look Big By Neil Blevins].
* Some general art fundamentals tips that are useful for any game artist:
**See Neil Blevins : <i>[http://www.neilblevins.com/cg_education/cg_education.htm Theory And Techniques.]</i>
**See EmptyEasel.com : <i>[http://emptyeasel.com/2008/11/18/avoiding-tangents-9-visual-blunders-every-artist-should-watch-out-for/ Avoiding Tangents: 9 Visual Blunders Every Artist Should Watch Out For.]</i>
**See Itcy Animation : <i>[http://www.itchy-animation.co.uk/tutorials/light01.htm LIGHT - a detailed tutorial.]</i>
**See Drawabox : <i>[http://drawabox.com/ Draw a Box: An exercise based approach to learning the fundamentals of drawing.]</i>
**See FZDSCHOOL : <i>[https://www.youtube.com/channel/UCbdyjrrJAjDIACjCsjAGFAA FZD School of Design - One Year Makes a Difference.]</i>
**See Mark Brown : <i>[https://www.youtube.com/user/McBacon1337/videos Game Maker's TOOLKIT.]</i>
**See Sam Nielson : <i>[https://www.youtube.com/watch?v=iemcI0t096I Environment Lecture Part 1.]</i>
**See Sam Nielson : <i>[https://www.youtube.com/watch?v=FeUL-5wfj0U Atmosphere 1.]</i>
**See Gnomon : <i>[https://www.youtube.com/watch?v=FeUL-5wfj0U The Art of Environment Storytelling for Video Games - Part One.]</i>

= Concepting =
* [[3D Asset Workflow: Concepting]]
[[File:Electric wizard concept resized.png|600px]]

=Sculpting=
* [[3D Asset Workflow: Sculpting]]
[[File:Owl sculpt.jpg|600px]]

=Retopo and UVs=
* [[3D Asset Workflow: Retopo and UVs]]
* [[Modo]]
[[File:Owl lowpoly.jpg|600px]]

= Baking and Texturing =
* [[3D Asset Workflow: Baking and Texturing]]
[[File:Electric wizard Base Color.png|400px]]
[[File:Electric wizard Normal DirectX.png|400px]]

=Exporting Assets to Editor=
* [[3D Asset Workflow: Exporting to Editor]]
[[File:Owl idle1.gif]]
[[File:Electric wizard color variations.jpg|525px]]

= Other Possible Phases =

== Decals and Alpha planes ==
* [[3D Asset Workflow: Decals and Alpha planes]]
[[File:LeafCoverageMeshes05.jpg|600px]]

== Collisions and Breakable objects ==
* [[3D Asset Workflow: Collisions and Breakable objects]]
[[File:General assets.jpg|600px]]

== 3D Asset Workflow: Billboards ==
* [[3D Asset Workflow: Billboards]]
[[File:Billboard vs model.png|600px]]

3D Asset Workflow

2021-11-23T14:44:05Z

Tero Tirkkonen:

This is a series of Wiki pages related to the 3D asset creating process at Frozenbyte. With these guidelines you should be able to create a game asset from an idea to a textured game model or at least get the needed information on what you should research and practice in order to achieve that. The information on these sites is created and collected by our 3D artists and these methods are used daily here at Frozenbyte. The wiki pages also include links to external sources we’ve found to be useful. The wiki page is a transformed version of our internal guidelines with some of the most top-secret bits edited out. There is also a similar collection of Wiki pages related to the Trine style Level Art.

* '''If you can't find some useful info here, please find it out elsewhere and add the info here in the proper section'''
* Please keep things organized and '''use similar format as the existing material''' here is already using
* '''Images and videos are super helpful''', so those are very much encouraged
* If the info is related to the general 3D asset workflow, add it to [[3D Asset Workflow]] page. If it's Modo specific, add it to the [[Modo]] page
* '''The info should be in one place and linked''' into another place, no copy & paste duplicates across several pages

= 3D Workflow steps =
At Frozenbyte the 3D artists will usually take care of all of these steps when creating 3D assets. The 3D artist gets to design the asset from the concept to the final asset that is available in our own in-house game editor. Then the level artists will use the assets to create levels.

# '''The idea''' - a mental image to work towards is formed when discussing with the art director, thinking about the story, and looking at reference images. This part might require communicating with different team members, for example designers, the script writer and/or other artists.
# '''The concept''' - once the idea is clear some kind of concept is made. It can be a rough drawing or a sculpt or a photo bash. The point is to visualize the basic idea, so that the AD can approve it, and you can continue working on it further. With a concept everybody has some kind of idea what the end result will be. The concept can be a very rough scribble as long as the general idea is communicated.
# '''High-poly mesh, or sculpt''' - the detailed and performance heavy version of the mesh. It's not used in the game, but it's used to bake texture maps that are seen on the low-poly mesh in game. Like in all the work phases, it's good to first sculpt a rough version of each piece and get a confirmation from the AD that everything seems to be going as desired. Then it's time to sculpt the details.
# '''"Trash version" of the low-poly mesh, if the mesh is going to be animated''' - when making characters for example, it's good to give the animators a very crude low-poly version of the mesh. This can be done when all the proportions of the mesh are somewhat finished, but there is not detailing yet. This way the animators can point out possible problems early on, when they start rigging. ''Note that this step is obsolete if the mesh is NOT going to the animators''.
# '''Low-poly mesh''' - a less dense and engine-friendly approximation of the high-poly model. This model will end up in the game. It's important to have the optimal amount of geometry (polygons), not too little so that the mesh is too angular, but not too much so that the mesh is needlessly performance heavy. The silhouette is what counts.
# '''UV-mapping''' - creating the texture coordinates for the low-poly mesh, so that the textures are in the correct place on the model and in the correct resolution.
# '''Baking and texturing''' - transferring details from the high-poly model to create a surface material for the low-poly model. Adding all the materials and colors on the model.
# '''Export & import to editor''' - preparing the low-poly model (fbx) and the final texture maps (tga) and importing them to editor with correct naming, adding your new models to the asset gallery.
# '''Adjusting in editor''' - further configuration in the editor, for example back light, self-illumination, etc.

=== Additional Tips Along the Creating Process ===
* '''The scale''' of the final model is important to get right as early as possible. '''Always have a game character model as a scale reference''' from the very start when you start sculpting.
** '''The scale has to be considered every step of the way''': sculpting, detailing, how dense and detailed the low poly mesh should be, and in texturing.
** In some cases it can be a bit hard to see the real scale of things outside the editor game view so '''a temporary version of the asset can be imported to editor to check the scale''' before it's finished. It's better to do this than to use days to finalize the asset and then notice it's in the wrong scale.
** How to nail the right scale: [http://www.neilblevins.com/cg_education/details_make_big/details_make_big.htm Using Details To Make Something Look Big By Neil Blevins].
* Some general art fundamentals tips that are useful for any game artist:
**See Neil Blevins : <i>[http://www.neilblevins.com/cg_education/cg_education.htm Theory And Techniques.]</i>
**See EmptyEasel.com : <i>[http://emptyeasel.com/2008/11/18/avoiding-tangents-9-visual-blunders-every-artist-should-watch-out-for/ Avoiding Tangents: 9 Visual Blunders Every Artist Should Watch Out For.]</i>
**See Itcy Animation : <i>[http://www.itchy-animation.co.uk/tutorials/light01.htm LIGHT - a detailed tutorial.]</i>
**See Drawabox : <i>[http://drawabox.com/ Draw a Box: An exercise based approach to learning the fundamentals of drawing.]</i>
**See FZDSCHOOL : <i>[https://www.youtube.com/channel/UCbdyjrrJAjDIACjCsjAGFAA FZD School of Design - One Year Makes a Difference.]</i>
**See Mark Brown : <i>[https://www.youtube.com/user/McBacon1337/videos Game Maker's TOOLKIT.]</i>
**See Sam Nielson : <i>[https://www.youtube.com/watch?v=iemcI0t096I Environment Lecture Part 1.]</i>
**See Sam Nielson : <i>[https://www.youtube.com/watch?v=FeUL-5wfj0U Atmosphere 1.]</i>
**See Gnomon : <i>[https://www.youtube.com/watch?v=FeUL-5wfj0U The Art of Environment Storytelling for Video Games - Part One.]</i>

= Concepting =
* [[3D Asset Workflow: Concepting]]
[[File:Electric wizard concept resized.png|600px]]

=Sculpting=
* [[3D Asset Workflow: Sculpting]]
[[File:Owl sculpt.jpg|600px]]

=Retopo and UVs=
* [[3D Asset Workflow: Retopo and UVs]]
* [[Modo]]
[[File:Owl lowpoly.jpg|600px]]

= Baking and Texturing =
* [[3D Asset Workflow: Baking and Texturing]]
[[File:Electric wizard Base Color.png|400px]]
[[File:Electric wizard Normal DirectX.png|400px]]

=Exporting Assets to Editor=
* [[3D Asset Workflow: Exporting to Editor]]
[[File:Owl idle1.gif]]
[[File:Electric wizard color variations.jpg|525px]]

= Other Possible Phases =

== Decals and Alpha planes ==
* [[3D Asset Workflow: Decals and Alpha planes]]
[[File:LeafCoverageMeshes05.jpg|600px]]

== Collisions and Breakable objects ==
* [[3D Asset Workflow: Collisions and Breakable objects]]
[[File:General assets.jpg|600px]]

== 3D Asset Workflow: Billboards ==
* [[3D Asset Workflow: Billboards]]
[[File:Billboard vs model.png|600px]]

Level Art

2021-11-23T14:43:13Z

Tero Tirkkonen:

This is a series of Wiki pages related to the process of creating level art for Frozenbyte's Trine projects. With these guidelines, you should be able to create a level starting from a simple idea and ending with a finished product - or at least recognize the skills, practices and information needed in the process. The materials included in this Wiki are collected by our AD with the help of level artists and level designers. The methods described are used daily here at Frozenbyte. There is also a similar collection of Wiki pages related to the Trine style [[3D Asset Workflow]]

* '''If you can't find some useful info here, please find it out elsewhere, and add the info here in the proper section'''
* Please keep things organized and '''use similar format as the existing material'''
* '''Images and videos are super helpful'''
* '''The info should be in one place and linked or transcluded''' into another place, no copy & paste duplicates across several pages

<onlyinclude>
<div style="float:right; width:40%; padding-left: 20px;">
'''Related sites'''
* [[Level Art]]
* [[Level Art: Color and Lighting]]
* [[Level Art: Composition]]
* [[Level Art: Environmental Storytelling]]
* [[Level Art: Ideas for New Levels]]
* [[Level Art: Level Art Related Gameplay Issues]]
* [[Level Art: The Level Art Phases]]

</div>
</onlyinclude>

== Level art workflow steps ==
[[File:level_art_wiki_header_banner_process.jpg]]
* Level artists create the visible game environment built on the collision block base created by designers.
* Level artists work with the Frozenbyte in-house engine and editor.

<br>
# '''The Idea''' - a mental image to work towards. The Idea is shaped and refined by reading the script, exploring the concept art and level wiki site and communicating with different team members like the AD, designers, the scriptwriter and/or other artists.
#* '''Outline meeting''' can occur before the design work has even started, gathering all the people working on a level to plan and discuss.
#* ''' Collecting reference''' includes researching the topic by searching inspirational reference images. Pinterest, for example, is a good online source for reference images.
#* ''' Level collision base meeting ''' takes place before the level art phase begins. The AD, level artists, designers and other related people working on the level are involved.
#* '''Preassembly''' can happen when a designer works on a level file, making it impossible for a level artist to access the same level. The artist can build level art arrangements to a separate file, requesting feedback from the AD during the preassembly.
# '''Base art''' - The Base art phase includes establishing a preliminary lighting setup, blocking the level art and building a strong and working base supporting the gameplay. Base art should be kept simple, concentrating only on the big forms and covering all the bare collisions.
#* '''AD's camera check''', done in collaboration with the designers, is followed by a camera fix list. It guides to adjust the cameras so that their positions are optimal for both the gameplay and art.
#* '''AD's base art check''' results in a fix list that may include paint-overs advising on how to improve the base art.
#* '''Base art fix round''' includes optimizing the camera positions and improving base art according to the feedback of the AD.
#* '''Lighting adjustments'''
# '''Detailing''' - Once the base art meets the requirements, details are added.
#* '''AD's details check''' results in a fix list that may include paint-overs advising on how to improve the level art.
#* '''Details art fix list round''' has the artist improving the level art based on the AD's feedback.
# '''Polish''' - Polishing happens at the end of the project when there's spare time. It consists of improving the level art by, for example, adding new 3D assets, documenting significant changes with before and after screenshots and consulting the AD.
#* '''Polish and optimizing''' includes general level art polishes, lighting adjustments and optimizing things.
#* '''Playing the game''': should be a daily level artist routine. Only by playing the levels you can evaluate the quality of the level art and make sure the level art supports the gameplay as much as possible. The level artists should play the game together in co-op, as well, to observe level art in a multiplayer mode and share ideas. <br>

=== Things to consider ===
* Working with the level art is '''an iterative process''': Art is created layer by layer, starting from the crude, bigger forms and ending with the detailed, final art.
* The aim is to keep the whole level at '''a consistent state at all times''' and only add finer details once the big forms are satisfactory.
* Level art is a process of continuous development. Nothing is final after the first round, and sometimes whole level areas might be reworked entirely. Large, creative projects always involve some degree of adjustments and alterations, but there are several reasons why level art can be subjected to a change:
**'''All the assets might not be available''' during the initial level art work, forcing the level artist to use temporary assets. They need to be replaced with new ones later, which can be time-consuming.
**'''The design can change''', also affecting the level art.
**'''A new and better visual idea for a scene might emerge''' at any point during the development.
**'''Technical changes''' sometimes require level art reworking.

=== Additional tips about the creating process ===
* '''Play the game''' It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game!
**The level artist's responsibility is to ensure that the level art supports the gameplay in each part of the level.
**The player can only see what the in-game cameras are showing, making play testing the level even more important.
*It's essential to get '''the scale''' of the environment right as early as possible. '''Always have a game character model as a scale reference''' when you start blocking the level art.
** Generally, the assets in the background of a level tend to look smaller than you might expect, and you might have to scale up those assets slightly to make them look better in the game. Commonly, in-game assets are bulkier and larger than their real-life counterparts since that helps them stand out in the game. However, you should be careful when scaling assets, as the texel density (texture resolution) and geometry get easily incoherent.
** How to nail the right scale: [http://www.neilblevins.com/art_lessons/details_make_big/details_make_big.htm Using Details To Make Something Look Big By Neil Blevins]
* ''' Flexible level art work'''
**Sometimes you might be in a hurry to finish the level art, but the design is unfinished, leaving you unable to work on the level file.
** In a situation like this, it's best to communicate with the designer to determine whether some areas of the level are already finished. You can create a copy of the level to start your level design work, and when the design is complete, just copy and paste the level art to the actual level.

* ''' Links for learning'''
<div class="toccolours mw-collapsible mw-collapsed" style="background-color: #e6f2ff; border-width:2px; border-radius:10px; margin: 5px;">
Some general art fundamentals tips that are useful for any game artist:
<div class="mw-collapsible-content">

'''Lighting'''
* [http://gurneyjourney.blogspot.com/search/label/Color%20and%20Light%20Book Color theory: James Gurney's blog]
* [http://www.itchy-animation.co.uk/tutorials/light01.htm Lighting Fundamentals for Artists]
* [https://www.youtube.com/watch?v=MVafJfV5xhI Nathan Fowkes 'Better Options for Color Vibrance' ]

'''Composition'''
* [http://www.neilblevins.com/art_lessons/areas_of_visual_rest/areas_of_visual_rest.htm Neil Blevis: Areas Of Visual Detail, Areas Of Visual Rest]
* [http://www.neilblevins.com/art_lessons/clumping/clumping.htm Neil Blevis: Clumping and Grouping]
* [http://www.neilblevins.com/art_lessons/compositional_weight/compositional_weight.htm Neil Blevis: Compositional Weight]
* [http://www.neilblevins.com/art_lessons/composition_contrasts/composition_contrasts.htm Neil Blevis: Contrasts In Composition]
* [http://www.neilblevins.com/art_lessons/foreground_midground_background/foreground_midground_background.htm Neil Blevis: Foreground, Midground, Background]
* [http://www.neilblevins.com/art_lessons/layers_of_light_and_dark/layers_of_light_and_dark.htm Neil Blevis: Layers Of Light And Dark]
* [http://www.neilblevins.com/art_lessons/primary_secondary_and_tertiary_shapes/primary_secondary_and_tertiary_shapes.htm Neil Blevis: Primary, Secondary and Tertiary Shapes]
* [http://www.neilblevins.com/art_lessons/details_make_big/details_make_big.htm Neil Blevis: Using Details To Make Something Look Big]
* [http://www.neilblevins.com/art_lessons/tangents/tangents.htm Neil Blevis: What is a Tangent? And How To Solve Them]

* [https://www.deviantart.com/lulie/art/The-Secret-to-Composition-272036625 The secret to composition]
* [https://twitter.com/eyecager Composition tips etc by Amber Blade Jones]
* [https://www.youtube.com/watch?v=qMH_J_vcoqE&feature=youtu.be&list=PLa1F2ddGya_9XER0wnFS6Mgnp3T-hgSZO Gleb Alexandrov's presentation about balance and composition of elements in creating appealing works]
* [https://youtu.be/GZ99gAb4T0o The Importance of Nothing: Using Negative Space in Level Design]

'''Environmental storytelling'''
* [https://www.youtube.com/watch?v=iemcI0t096I Sam Nielson's lecture about environment design]
* [https://www.youtube.com/watch?v=griCsvvRTQM Sam Nielson's lecture about atmosphere]
* [https://youtu.be/FeUL-5wfj0U?t=3m29s The Art of Environment Storytelling for Video Games GNOMON]
* [https://vimeo.com/165693758 Mike Hill's lecture about Spielberg's Subtext]

'''General creative development'''
* [http://www.neilblevins.com/art_lessons/art_lessons.htm Neil Blevis: Various art tips]
* [https://www.youtube.com/channel/UCbdyjrrJAjDIACjCsjAGFAA Feng Zhu design school videos. All kinds of stuff about painting/design/color etc.]
* [http://wiki.polycount.com/wiki/Polycount Polycount wiki. Basically everything you need to know about game art is found here]
* [https://www.youtube.com/user/McBacon1337/videos Game Maker's Toolkit. Interesting and well-made videos about game mechanics in different games by Mike Brown.]

</div>
</div>

= Building a Level =
== Ideas for New Levels ==
[[Level Art: Ideas for New Levels]]<br>
[[File:level_art_wiki_header_banner_ideas_for_new_levels.jpg|800px]]

== The Level Art Phases ==
[[Level Art: The Level Art Phases]]<br>
[[File:level_art_wiki_header_banner_level_art_phases.jpg|800px]]

== Environmental Storytelling ==
[[Level Art: Environmental Storytelling]]<br>
[[File:level_art_wiki_header_banner_environmental_storytelling.jpg|800px]]

== Level Art Related Gameplay Issues ==
[[Level Art: Level Art Related Gameplay Issues]]<br>
[[File:level_art_wiki_header_banner_gameplay_issues.jpg|800px]]

= Level Art Fundamentals =

== Composition ==
[[Level Art: Composition]]<br>
[[File:level_art_wiki_header_banner_composition.jpg|800px]]

== Color and Lighting ==
[[Level Art: Color and Lighting]]<br>
[[File:level_art_wiki_header_banner_color_and_lighting.jpg|800px]]

File:Trine level art composition guide.jpg

2021-11-23T14:42:02Z

Tero Tirkkonen: Tero Tirkkonen uploaded a new version of File:Trine level art composition guide.jpg

File uploaded with MsUpload

File:Trine level art composition guide.jpg

2021-11-23T14:41:30Z

Tero Tirkkonen: File uploaded with MsUpload

File uploaded with MsUpload

File:Trine level art composition guide general tips.jpg

2021-11-23T14:41:07Z

Tero Tirkkonen: File uploaded with MsUpload

File uploaded with MsUpload

File:1500px-Trine level art composition guide general tips.jpg

2021-11-23T14:36:36Z

Tero Tirkkonen: File uploaded with MsUpload

File uploaded with MsUpload

File:1500px-Trine level art composition guide.jpg

2021-11-23T14:36:36Z

Tero Tirkkonen: File uploaded with MsUpload

File uploaded with MsUpload

Level Art: The Level Art Phases

2021-11-23T14:34:36Z

Tero Tirkkonen: /* Requesting New Pieces to 3D Asset Sets */

{{:Level Art}} 

= The Level Art Phases =
'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

* The level art process in a nutshell:
** 1) Reference and Research
** 2) Preassembly
** 3) Base Art Blocking
** 4) Detailing
** 5) Polishing & Optimizing
** + Feedback. The level artist receives feedback during the whole level art process.

* Communication is important. Talk with AD, asset artists, other level artists and designers. These conversations should happen often; constant communication is needed throughout the whole level art process.
* Base art is the most important part of the level art process. If the base art is lacking, nothing works - no matter how many pretty details you stamp over it.
* The level art work is done iteratively, keeping the state of the art coherent throughout the whole level constantly. In other words, unfinished areas with bare collisions and areas with finished, detailed level art shouldn't co-exist within the same level.
* The whole level should stay as playable as possible at all times. If your art assets (even the temporary ones) result in hindering or preventing the level from being played, you shouldn't use them.

== Level Art Scheduling ==
* The time needed for the level art process is usually allocated as follows: The Base art takes 60%-70%, detailing 20%-30% and polishing 10%-20% of the time.
* Ideally, the time required to build a level from scratch to finish is roughly '''3 months (about 60 workdays)'''. It leaves enough time to commit the base art and polishes properly and tackle any surprise work that may emerge.
* If in a hurry, a level can be built as quickly as in '''2 months (about 40 workdays)'''. There's enough time to commit the base art and polishes adequately, but there's no room for errors or any surprises.
* There are multiple factors that can affect the level building duration, for example:
** The quality of the base art work (or any other art phase work, of course, but since the base art is the most important, fixing and fine-tuning it will take the longest)
** Changes in the level design schedules
** Sudden problems unrelated to the level artist/art team
** 3D assets missing/pending
** Changes in the gameplay design, requiring level art modifications
** Co-workers (designers, for example) needing to work on a level at a crucial time
** Sick leaves and personnel changes
** Unexpected and surprising issues

== Level Art Process Steps ==
# Before level art process starts: Familiarizing yourself with the '''references''' available and '''researching''' the topic
# Before level art process starts: '''level meetings''' with AD, 3D art lead and the level artists and designers that are/will be working on the level
# '''Preassembly''': No access to the actual map file yet, building the level art arrangements and asking for '''feedback from the AD'''
# '''Base art''': '''Preliminary lighting''' setup
# Base art: Blocking the level art, building a strong and working base that supports the gameplay, covering all the collisions - keeping it simple!
# Base art: '''Camera fix list''': adjusting the cameras to function as good as possible (considering both the gameplay and art), consulting designers
# Base art: '''AD's check''' and writing a fix list
# Base art: '''Fix list round''' where the base art is improved according to AD's feedback
# Base art: '''Lighting adjusting'''
# '''Detailing''': Adding details on the base art
# Detailing: '''AD's check''' and writing a fix list
# Detailing: '''Fix list round''' where the level art is improved according to AD's feedback
# '''Polish and optimizing''': Optimizing, adjusting lighting and fine-tuning level art until the time runs out. Multiple people can add more fix requests to the fix list when the content lock is approaching.

=== Example Art Schedule for One Level ===
* The timeframe for building levels is 65 workdays per level
* '''Some tasks can be done simultaneously''', including base art checks, camera fixes and lighting polishes. An example: Camera set-up can be pre-built for a different scene and then copied to the final level after the lighting polishes have been finished.
* You can keep editing the level during any AD's check since AD won't be saving anything.
* There are times when you can't access the level due to a co-worker editing it, but you can create a duplicate of the level and continue your work there. When the level file is available again, just copy and paste your work from the duplicate to the original level.
* When unable to access a certain level, you can also start working on another level.

* Colors explained:
** <span style="font-size:14px; color: #ea9b99"> '''Level artist'''</span> (Responsible of this level)
** <span style="font-size:14px; color: #a3d5a3"> '''Camera artist'''</span>
** <span style="font-size:14px; color: #d9b887"> '''Lighting artist'''</span> (Optional, there could be none or several level artists responsible of the lighting as a whole)
** <span style="font-size:14px; color: #bac0ec"> '''Art Director'''</span>

{| class="wikitable"
|-
! 20 days
! 2 days
! 4 days
! 20 days
! 3 days
! 10 days
! ?? days
! 5 days
! 1 day
! ?? days
|-

|-
|style="background-color:#feaeac"| Base art || || style="background-color:#ebc793"|Lighting polishing || style="background-color:#feaeac"| Base art fix and detailing || style="background-color:#ebc793"|Lighting polishing ||style="background-color:#feaeac"| Details fix || Wait for puzzle versions,<br>work on another level|| style="background-color:#feaeac"| Puzzle versions art || style="background-color:#feaeac"| Coop playtrough with level artists ||style="background-color:#feaeac"| Final polish
|-
| || ||style="background-color:#bef1be"|Camera fix|| || || || || || ||
|-
| ||style="background-color:#c9cfff"|Camera check||style="background-color:#c9cfff"|Base art check|| || style="background-color:#c9cfff"|Details check|| || || || ||style="background-color:#c9cfff"|Random checks
|-

|}

== Research and Reference ==
* All the developers need to work towards a common goal, and it's everyone's responsibility to keep that goal in mind.
* To help everyone to share the same vision and understand the project as a whole, there are tools available:
* When hopping aboard a new project, go through the reference materials to familiarize yourself with the overall vision, goals and tone of the project. Refer to these materials regularly during the project.
* If you're a level artist, study the basics of [[Level Art: Environmental Storytelling|Environmental Storytelling]].

=== Script ===
* Read the whole script at the beginning of the project.
* When beginning the level art process for a new level, go back to the script and read again the section describing that level.
* You should re-read (parts of) the script every now and then to make sure all the details and ideas are reflected in your level art.

=== Wiki and Concept Art ===
* When assigned to a new level, go through the wiki page for that level - and keep editing and reading the page during the level art work.

<gallery heights=350px mode="packed">
File:level_concept_examples_01.png|A level art wiki site contains all the concept art related to the level, maps, color and shape plans etc.
File:level_concept_examples_02.png|You want to study all the available materials carefully to get the big picture. After that, feel free to search for more reference images online.
</gallery>

== Preassembly ==
* Preassembly isn't usually scheduled, allowing the level artist to do it whenever there's time.
* Preassembly means working on the level art before you can access the actual collision-blocked map file with all the puzzles and design. The goal is to eliminate any idle waiting time.
* During the preassembly face, you should familiarize yourself with the level theme and assets without distractions.
* The most important preassembly work is creating a solid library of level art arrangements. Take your time and choose the arrangements that best suit the level: some assets in the library might be scrapped but most of them should end up in the final product.
* Use the preassembly time to try out your ideas. It's a perfect time to play around and experiment without paying any attention to the level geometry restrictions of the real level.
* You can quickly build rooms, backgrounds, focal point arrangements, gameplay platforms etc. without worrying where to place them exactly.
* Since preassembly creations are not integrated with the actual game collisions, it's much easier to edit them if something doesn't feel right.

=== How to Preassemble ===
* Gather a bunch of ideas by reading the script, familiarizing yourself with the level wiki site, browsing through the new level assets and possibly searching online reference images.
* With a head full of ideas, start building level art arrangements for the level. Begin with the necessary must-have objects needed in the level and create more as you go.
* While creating the preassembled arrangements, you'll probably start developing some kind of an idea concerning the structure of the level.
* Every level should have a focal point area in the beginning and in the end. Figuring out how those areas are executed is a great place to start.
* It's easiest to start with story areas described in the script, areas with existing concepts and/or areas you have a strong vision in mind for already.
* Be careful not to add too many details, as the detailing phase happens only after the preassembled arrangements are placed in the actual level map and the base art is satisfactory.
* Once you're happy with an arrangement, you can store it under the null (the null object in Editor) for easier handling.

=== Possible Pitfalls ===
* While it allows you to experiment freely with the level, there are some issues you may encounter during the preassembly phase:
* '''Incoherent and disjointed level flow''': The flow of the level needs to be coherent from the start to finish. Be careful when arranging separate pre-made blocks of art together and pay special attention to "in-between" transition areas. Keep the big picture in mind.
* '''Detached feel''': Copying the preassembled arrangements to an actual level may result in a feeling of not belonging. The pieces might look and feel like a separate backdrop floating behind the 2D game area (that's actually what they are, in fact, but they shouldn't feel like that). When adding your arrangements, integrate them seamlessly into the gameplay area.
* '''Under-optimization''': A seemingly small piece of extra geometry is multiplied rapidly when the arrangements are duplicated. To avoid repetition and clumsiness, optimize the use of your preassembled arrangements.
* '''Too many details''': The preassembly phase is followed by a base art phase. If the preassembled content is detailed and complex, it'll make the base art phase overly complicated and will slow the progress down.

<gallery heights=350px mode="packed">
File:level_art_preassembly_architecture_examples.jpg| Preassembled arrangements for the Trine 4 DLC Cornelius's Dream level
File:level_art_preassembly_organic_examples.jpg| Preassembled arrangements for the Trine 4 DLC Rudolfus's Dream level
</gallery>

== Base art ==
'''The first on the foremost purpose of level art is to support the gameplay and bring out the important game objects as well as possible.''' A visually pleasing game is an important goal on its own, but the level art must always submit to the gameplay. When the base art phase is over, there should be a fully playable level with both art and the gameplay functioning and complimenting each other.

'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

=== Cover and Match All the Collisions ===
* Once a designer is finished with a level, it's handed to a level artist. It's time for the base art phase.
* Base art phase is scheduled - it's important to fill the level with art as soon as possible.
* During the base art round, art elements are added to a level for the first time. Everything is built on top of the base art, so it's very important to get it right.
* Base art phase includes '''covering all the visible collisions'''.
** Note: If you match the collision areas and art carefully during the base at phase, it'll save a lot of time and the need to fix them later.
** Go through all the areas the player can interact with and check the collisions - remember not to consider only the characters but also the wizard's levitating objects.
** Pay attention to smaller things as well, like floating rope targets. The aim is to cover and support all gameplay elements with art so that the game can be played and enjoyed after the base art phase.
** Go through the level from start to finish. Play the level yourself with a character and make sure the collisions work as intended (AKA characters aren't floating or walking inside assets and characters or levitation objects won't get stuck on invisible collisions).

=== Focus on the Big Picture ===
* During the phase art base, '''do not add small details'''. If the base geometry goes through changes and level art needs to be altered, additional art details slow down the process a lot: checking the level, doing paint-overs and fixing the base level art is really difficult if there are a lot of details.
* After the art blocking phase '''the level should look and feel "complete", serving as a solid base to add things later on.'''
* Even if you must work with placeholder 3D assets, try to match the '''proportions''' from the start.
* Don't spend too much time creating intricate, highly detailed placeholder areas. Rather use temporary structures, instead, or, if you must, leave the area empty while waiting for assets.
* Divide your work into steps, to avoid spending all your time on a single finalized scene and neglecting other areas. Focus on '''a single run throughout the whole level'''.
* A safe place to start are the walls, ground, floor and other environmental elements making up the big objects.
* '''The backgrounds''' are an important part of the base art. They play a huge role in creating the big shapes and the visual flow.
* When working with outside locations, don't forget the sky - or you're missing out on a big part of the screen. Remember to add the clouds and weather elements etc. They are a very important part of the level's general flow.

<gallery heights=400px mode="packed">
File:base_art_and_detail_art_01.jpg| A great example of the base art done right: A simple setting, providing a great base to build on and add details. Also easy to modify, if needed.
File:base_art_and_detail_art_02.jpg| The base art looks good, though the door collision is yet uncovered. Allowing the unique gameplay asset (the snowball instructions in the background) collisions to go untouched is ok in this scene, as they will be replaced with new assets later.
File:base_art_and_detail_art_03.jpg| A good base art is simple enough - when the whole set could be changed, one shouldn't waste too much time with the base art.
File:base_art_and_detail_art_04.jpg| The base art is too detailed here - if there are any changes to the level geometry, a lot of work has been done in vain.
</gallery>

=== Basic art principles are present from the start ===
* [[Level Art: Composition]] The composition and flow guide the player through the level. Tip: Select the right materials for the shapes, and never use assets scaled too large, unless you can hide them well.
* [[Level Art: Color and Lighting]] Color and lighting can be used to guide the player as well. Tip: Use the values and contrasts so that the important things pop out and unimportant things blend in. Invite the player towards their intended path with lights and use darker tones for those parts of the screen the player is not supposed to stumble into.

=== Don't Let the Collisions Restrict You When it's Not Necessary ===
* The collisions are implemented by level designers - while they pay attention to art details as well, their job is designing the game, not making art.
* Never edit the collisions or gameplay objects without consulting the designers first - but don't be afraid to ask about the matter. Have a conversation with the designer about the changes you wish to make, and if they agree, proceed.
* The gameplay area is a narrow 2D plane, the width of it being only about 2 metres. The collision rules, for example, are applied only inside those two-meter borders. Your job is to blend the gameplay area into the surrounding 3D scene and to make it a believable part of the world (as opposed to an artificial, detached lane).
* As long as your foreground or background items don't distract the player from the important gameplay things, feel free to experiment and go wild.
* It's not necessary for the background and foreground areas surrounding the gameplay area to follow the general shape of it. On the contrary, they should be used to create depth and hide the fact that the actual game happens in a narrow, straight line.

=== Requesting New Pieces to 3D Asset Sets ===
* Level artist uses the 3D asset sets created by 3D artists to build levels - and figure out simultaneously how the various asset pieces work.
* Don't hesitate to give feedback to 3D artists and/or request art from them. Both you and the 3D artist benefit when useful and visually satisfying asset sets are created.
* The 3D artists create the assets and don't really build levels with them. To make full use of all assets and connect them together, it's likely you'll need to ask for more parts.
* If you need more asset pieces created, compile a list of your needs during the base art base and deliver it to the 3D art lead.
* For example, you might ask for more differently sized pieces to a wall set, if [[Level_Art:_Composition#Problems_created_by_scaling_3D_models_too_much|scaling the size of the old ones up]] or [[Level_Art:_Composition#Non-uniform_scaling|non-uniformly]] will result in the visual quality suffering.
** Note: It's fine to use the too-much-up-scaled or non-uniformly-scaled versions of the pieces for the first version of your base art. Request the new 3D pieces by the end of the base art phase and replace the old assets with new ones later.
** Tip: If possible, it's better to gather a list detailing all your needs than to ask for a new 3D set piece every day.
** Tip: When building temporary structures from currently available assets, write down their measurements and describe the shape that you want the new assets to be. Pass your notes along with your asset order list to the 3D artist who can use them as a reference.

=== Prioritize the focal point areas ===
* Start with the focal point areas (beginning, ending, story areas, special art areas etc.) and plan the rest of the base art around those scenes.
* The level start and end areas are usually focal point areas, as we want the first and last thing the players see to look extra nice.
* Not every single frame can be a focal point one, but there should be more general areas between instead. By alternating the various scene types it's easier to avoid player exhaustion, create rhythm and emphasize the special areas.
* Since the game project is on the clock, it's best to schedule and plan carefully before the actual work.
* 2D angled games (like Trine) face issues with matching the organic art to the straight collisions. To avoid that, you might feel tempted to create natural rock formations with perfectly straight 90-degree angles. Try keeping the rock formation as natural as possible, instead, while strictly following the gameplay collision areas and rules (the foreground and background area are not tied by the gameplay area rules). If a straight/90-degree surface must be included, you can use man-made constructions (brick, wood) rather than pursuing the "natural" rock look.

==== Focal points ====
* Focal points are very delicately planned and beautifully built areas inside the level.
* They can be impressive and unique hero assets or just small asset arrangements built out of ordinary assets (nicely composed and made look perfect for the specific camera angle).
* Most of the level should consist of the "basic environment"; focal points are located here and there to spike interest.
* You can also use carefully crafted small lighting scenarios as points of interest, like a warm ray of light emerging from a hole in the cave wall, illuminating some mushrooms/rocks/etc.
* In Trine games you should place the focal points between the puzzle areas. Scenes containing puzzles should be clear of any distractions, allowing the players to fully focus on solving the puzzle.
** The puzzle areas shouldn't look boring, either, but it's a good practice to build the various areas of the level to highlight their function.
* If there's not enough space for an important focal point area in the game, talk to the designer. Usually, they are willing to add the needed space to the level.
* Reference images are especially important when building focal point areas, so study and search for new images!
* Even if two levels share a theme, each level should have a unique feeling of its own.
* There should be something special and visually memorable in each level: A point that evokes feelings and makes the level remarkable. For example, a shark swimming by, a unique geological formation or the oldest classic - a breathtaking scenery point.

<gallery heights=200px mode="packed">
File:Trine 4 screenshot 17 1080p.png| A striking focal point features a unique wizard face sculpture asset specifically made for this spot.
File:Trine 4 screenshot 44 1080p.png| The dragon skull on the background, its strong silhouette against the sky, is an eye-catcher and a remarkable focal point.
File:Trine 4 screenshot 38 1080p.png| The statue on the left is highlighted with golden "god rays". The cave is full of angular forms, making the statue stand out.
File:Trine 4 screenshot 43 1080p.png| The bear statue adds a mysterious focal point to the more traditional forest scenery.
File:Trine 4 screenshot 40 1080p.png| Frozen dragon skeleton is framed with the diagonal "god rays" from the top and diagonal icicles from the bottom.
File:Trine 4 screenshot 25.png| The fiery planet draws eyes towards it. The shiny celestial body is surrounded by curved shapes emphasizing it even more.
File:Trine 4 toby's dream screenshot 02.png| The curved branch silhouette is a simple, yet effective focal point. The flow of the scene supports it nicely.

</gallery>

== Detailing ==
* When the detailing phase is reached, it's a race against the clock to get all the levels finished on time, thus making the detailing phase a tightly scheduled one.
* The level is already filled with functioning and pleasing visuals. Details are added for plausibility reasons, and to pique visual curiosity, to create depth and to add to the level's visual charm.
* The level base is optimized during the detailing phase to make sure there isn't any excess geometry left.
* Pay attention to the consistency of your art in a single level and of the whole game: there shouldn't be some areas filled with details while some are completely empty.
* Always iterate gradually. It's tempting to fill one area from top to the bottom with detailed and finished art - and then move on to the next one, but you might end up running out of time and ruining the coherent feel of the level.
* [[Public Level Art: Environmental Storytelling|Environmental storytelling]] should guide your work while detailing.
* The level design might change during the detailing phase, forcing you to consider and adjust your level art accordingly.
* When the detailing phase is over, each level of the game should be "good enough". The sooner the levels reach that state, the better.
* In theory, once the detailing phase ends, each level should be ready to ship (if, for some imaginary reason, there were no time or resources for any polishing). That means art is coherent and of good quality, supporting the gameplay. There shouldn't be any major visual issues. In reality, the Trine levels are always polished and fine-tuned.

== Polishing ==
* Usually not a scheduled phase, as the levels entering this stage have reached the "good enough" standard mentioned earlier.
* The remaining time (until the content lock day) is spent fine-tuning everything as much as possible.
* Polishing is done last to ensure the overall quality of all levels. Each level should reach the "good enough" state before any polishing on any level happens.
** Note: If you have gaps in your schedule during the earlier level art phases (while waiting for access to a certain level, for example) it's ok to do some polishing work as well.
* The Trine game levels are polished until the last possible moment, and none of the levels is considered "final" until the game launch day.
* Even when polishing you need to consider the general art quality and aim for coherence throughout the game: some levels can't look more polished than the others.
* New 3D assets might appear during the later stages of the project, and they are distributed evenly among the levels.
* Polishing phase entails minor detail fixes and also bigger base art level fixes. The development is a constant flux: some brilliant ideas come up late and some previously functioning concepts are abandoned during the later phases.
* While it's not recommended to implement any radical changes during the polishing phase, don't be afraid to speak up (no matter how close the deadline is), especially if your idea would elevate the quality of the whole level.

=== Polishing a Level Originally Created by Another Artist ===

* Polishing can be done by any of the level artists, no matter who originally created the base art and detailed art.
* It's beneficial for all the level artists to work on all the levels. That helps to keep the levels fresh and coherent and ensures the full potential of the art team is used.
* Nevertheless, some things should be considered when polishing a level made by another level artist:
** The artist responsible for a level's base/detail art might feel some degree of mental ownership of the level. Every other artist is encouraged, however, to suggest their ideas and execute changes. Nobody owns the level or the level art.
**However, the original artist has the best understanding of the level, granting them the chance to participate in the process and to voice their opinions and thoughts.
**The AD has the final say on which art version will be used, but they base their decisions on listening and reasoning, making sure each team member gets their voice heard. While the AD has the best grasp of levels as a whole, the level artist knows their level best.

* '''First, discuss with your AD and the original level artist'''
** Get a permission to start with the polishing work from your team lead.
** If you plan on executing radical changes, talk with the artist responsible for the base and detail art.
** The level might feature, for example, story-related elements that affect the level art. The original level artist can brief you about special details.
** Tip: Before making any changes, read the level art wiki site to understand the level.

* '''Smaller detail polish directly to the level, bigger base art polish to a copy of the level'''
** When you polish smaller details, not tampering with the base art radically, save your work to the actual level.
** When planning to make big changes, try them out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Keep the level of details coherent'''
** After reaching the "good enough" state, level art shouldn't revert back to any of the previous art stages even temporarily.
** When planning to make big changes or stripping a part of the level bare of the detailed level art, try the changes out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Before & after screenshots'''
* Take before/after screenshots of the changes
** If the changes are small, use the actual level
** With bigger changes, use a copy of the actual level
* Take screenshots before and after using the same camera positions.
* You need to be able to pinpoint the location and the exact nature of the changes.
*Tip: You can always return to the original version of the level to take the screenshots.

* '''Feedback'''
** When making larger changes: Show the changes made to the (copy of) level and the before/after screenshots to your AD and the original level artist. Discuss with them about the changes.
** When making smaller changes: Show the before/after screenshots to your AD to receive feedback, and fix the level art accordingly.

* '''Replacing old with new'''
** If the changes are approved by the AD, they can be commited to the actual level.

Level Art: The Level Art Phases

2021-11-23T14:34:10Z

Tero Tirkkonen: /* Research and Reference */

{{:Level Art}} 

= The Level Art Phases =
'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

* The level art process in a nutshell:
** 1) Reference and Research
** 2) Preassembly
** 3) Base Art Blocking
** 4) Detailing
** 5) Polishing & Optimizing
** + Feedback. The level artist receives feedback during the whole level art process.

* Communication is important. Talk with AD, asset artists, other level artists and designers. These conversations should happen often; constant communication is needed throughout the whole level art process.
* Base art is the most important part of the level art process. If the base art is lacking, nothing works - no matter how many pretty details you stamp over it.
* The level art work is done iteratively, keeping the state of the art coherent throughout the whole level constantly. In other words, unfinished areas with bare collisions and areas with finished, detailed level art shouldn't co-exist within the same level.
* The whole level should stay as playable as possible at all times. If your art assets (even the temporary ones) result in hindering or preventing the level from being played, you shouldn't use them.

== Level Art Scheduling ==
* The time needed for the level art process is usually allocated as follows: The Base art takes 60%-70%, detailing 20%-30% and polishing 10%-20% of the time.
* Ideally, the time required to build a level from scratch to finish is roughly '''3 months (about 60 workdays)'''. It leaves enough time to commit the base art and polishes properly and tackle any surprise work that may emerge.
* If in a hurry, a level can be built as quickly as in '''2 months (about 40 workdays)'''. There's enough time to commit the base art and polishes adequately, but there's no room for errors or any surprises.
* There are multiple factors that can affect the level building duration, for example:
** The quality of the base art work (or any other art phase work, of course, but since the base art is the most important, fixing and fine-tuning it will take the longest)
** Changes in the level design schedules
** Sudden problems unrelated to the level artist/art team
** 3D assets missing/pending
** Changes in the gameplay design, requiring level art modifications
** Co-workers (designers, for example) needing to work on a level at a crucial time
** Sick leaves and personnel changes
** Unexpected and surprising issues

== Level Art Process Steps ==
# Before level art process starts: Familiarizing yourself with the '''references''' available and '''researching''' the topic
# Before level art process starts: '''level meetings''' with AD, 3D art lead and the level artists and designers that are/will be working on the level
# '''Preassembly''': No access to the actual map file yet, building the level art arrangements and asking for '''feedback from the AD'''
# '''Base art''': '''Preliminary lighting''' setup
# Base art: Blocking the level art, building a strong and working base that supports the gameplay, covering all the collisions - keeping it simple!
# Base art: '''Camera fix list''': adjusting the cameras to function as good as possible (considering both the gameplay and art), consulting designers
# Base art: '''AD's check''' and writing a fix list
# Base art: '''Fix list round''' where the base art is improved according to AD's feedback
# Base art: '''Lighting adjusting'''
# '''Detailing''': Adding details on the base art
# Detailing: '''AD's check''' and writing a fix list
# Detailing: '''Fix list round''' where the level art is improved according to AD's feedback
# '''Polish and optimizing''': Optimizing, adjusting lighting and fine-tuning level art until the time runs out. Multiple people can add more fix requests to the fix list when the content lock is approaching.

=== Example Art Schedule for One Level ===
* The timeframe for building levels is 65 workdays per level
* '''Some tasks can be done simultaneously''', including base art checks, camera fixes and lighting polishes. An example: Camera set-up can be pre-built for a different scene and then copied to the final level after the lighting polishes have been finished.
* You can keep editing the level during any AD's check since AD won't be saving anything.
* There are times when you can't access the level due to a co-worker editing it, but you can create a duplicate of the level and continue your work there. When the level file is available again, just copy and paste your work from the duplicate to the original level.
* When unable to access a certain level, you can also start working on another level.

* Colors explained:
** <span style="font-size:14px; color: #ea9b99"> '''Level artist'''</span> (Responsible of this level)
** <span style="font-size:14px; color: #a3d5a3"> '''Camera artist'''</span>
** <span style="font-size:14px; color: #d9b887"> '''Lighting artist'''</span> (Optional, there could be none or several level artists responsible of the lighting as a whole)
** <span style="font-size:14px; color: #bac0ec"> '''Art Director'''</span>

{| class="wikitable"
|-
! 20 days
! 2 days
! 4 days
! 20 days
! 3 days
! 10 days
! ?? days
! 5 days
! 1 day
! ?? days
|-

|-
|style="background-color:#feaeac"| Base art || || style="background-color:#ebc793"|Lighting polishing || style="background-color:#feaeac"| Base art fix and detailing || style="background-color:#ebc793"|Lighting polishing ||style="background-color:#feaeac"| Details fix || Wait for puzzle versions,<br>work on another level|| style="background-color:#feaeac"| Puzzle versions art || style="background-color:#feaeac"| Coop playtrough with level artists ||style="background-color:#feaeac"| Final polish
|-
| || ||style="background-color:#bef1be"|Camera fix|| || || || || || ||
|-
| ||style="background-color:#c9cfff"|Camera check||style="background-color:#c9cfff"|Base art check|| || style="background-color:#c9cfff"|Details check|| || || || ||style="background-color:#c9cfff"|Random checks
|-

|}

== Research and Reference ==
* All the developers need to work towards a common goal, and it's everyone's responsibility to keep that goal in mind.
* To help everyone to share the same vision and understand the project as a whole, there are tools available:
* When hopping aboard a new project, go through the reference materials to familiarize yourself with the overall vision, goals and tone of the project. Refer to these materials regularly during the project.
* If you're a level artist, study the basics of [[Level Art: Environmental Storytelling|Environmental Storytelling]].

=== Script ===
* Read the whole script at the beginning of the project.
* When beginning the level art process for a new level, go back to the script and read again the section describing that level.
* You should re-read (parts of) the script every now and then to make sure all the details and ideas are reflected in your level art.

=== Wiki and Concept Art ===
* When assigned to a new level, go through the wiki page for that level - and keep editing and reading the page during the level art work.

<gallery heights=350px mode="packed">
File:level_concept_examples_01.png|A level art wiki site contains all the concept art related to the level, maps, color and shape plans etc.
File:level_concept_examples_02.png|You want to study all the available materials carefully to get the big picture. After that, feel free to search for more reference images online.
</gallery>

== Preassembly ==
* Preassembly isn't usually scheduled, allowing the level artist to do it whenever there's time.
* Preassembly means working on the level art before you can access the actual collision-blocked map file with all the puzzles and design. The goal is to eliminate any idle waiting time.
* During the preassembly face, you should familiarize yourself with the level theme and assets without distractions.
* The most important preassembly work is creating a solid library of level art arrangements. Take your time and choose the arrangements that best suit the level: some assets in the library might be scrapped but most of them should end up in the final product.
* Use the preassembly time to try out your ideas. It's a perfect time to play around and experiment without paying any attention to the level geometry restrictions of the real level.
* You can quickly build rooms, backgrounds, focal point arrangements, gameplay platforms etc. without worrying where to place them exactly.
* Since preassembly creations are not integrated with the actual game collisions, it's much easier to edit them if something doesn't feel right.

=== How to Preassemble ===
* Gather a bunch of ideas by reading the script, familiarizing yourself with the level wiki site, browsing through the new level assets and possibly searching online reference images.
* With a head full of ideas, start building level art arrangements for the level. Begin with the necessary must-have objects needed in the level and create more as you go.
* While creating the preassembled arrangements, you'll probably start developing some kind of an idea concerning the structure of the level.
* Every level should have a focal point area in the beginning and in the end. Figuring out how those areas are executed is a great place to start.
* It's easiest to start with story areas described in the script, areas with existing concepts and/or areas you have a strong vision in mind for already.
* Be careful not to add too many details, as the detailing phase happens only after the preassembled arrangements are placed in the actual level map and the base art is satisfactory.
* Once you're happy with an arrangement, you can store it under the null (the null object in Editor) for easier handling.

=== Possible Pitfalls ===
* While it allows you to experiment freely with the level, there are some issues you may encounter during the preassembly phase:
* '''Incoherent and disjointed level flow''': The flow of the level needs to be coherent from the start to finish. Be careful when arranging separate pre-made blocks of art together and pay special attention to "in-between" transition areas. Keep the big picture in mind.
* '''Detached feel''': Copying the preassembled arrangements to an actual level may result in a feeling of not belonging. The pieces might look and feel like a separate backdrop floating behind the 2D game area (that's actually what they are, in fact, but they shouldn't feel like that). When adding your arrangements, integrate them seamlessly into the gameplay area.
* '''Under-optimization''': A seemingly small piece of extra geometry is multiplied rapidly when the arrangements are duplicated. To avoid repetition and clumsiness, optimize the use of your preassembled arrangements.
* '''Too many details''': The preassembly phase is followed by a base art phase. If the preassembled content is detailed and complex, it'll make the base art phase overly complicated and will slow the progress down.

<gallery heights=350px mode="packed">
File:level_art_preassembly_architecture_examples.jpg| Preassembled arrangements for the Trine 4 DLC Cornelius's Dream level
File:level_art_preassembly_organic_examples.jpg| Preassembled arrangements for the Trine 4 DLC Rudolfus's Dream level
</gallery>

== Base art ==
'''The first on the foremost purpose of level art is to support the gameplay and bring out the important game objects as well as possible.''' A visually pleasing game is an important goal on its own, but the level art must always submit to the gameplay. When the base art phase is over, there should be a fully playable level with both art and the gameplay functioning and complimenting each other.

'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

=== Cover and Match All the Collisions ===
* Once a designer is finished with a level, it's handed to a level artist. It's time for the base art phase.
* Base art phase is scheduled - it's important to fill the level with art as soon as possible.
* During the base art round, art elements are added to a level for the first time. Everything is built on top of the base art, so it's very important to get it right.
* Base art phase includes '''covering all the visible collisions'''.
** Note: If you match the collision areas and art carefully during the base at phase, it'll save a lot of time and the need to fix them later.
** Go through all the areas the player can interact with and check the collisions - remember not to consider only the characters but also the wizard's levitating objects.
** Pay attention to smaller things as well, like floating rope targets. The aim is to cover and support all gameplay elements with art so that the game can be played and enjoyed after the base art phase.
** Go through the level from start to finish. Play the level yourself with a character and make sure the collisions work as intended (AKA characters aren't floating or walking inside assets and characters or levitation objects won't get stuck on invisible collisions).

=== Focus on the Big Picture ===
* During the phase art base, '''do not add small details'''. If the base geometry goes through changes and level art needs to be altered, additional art details slow down the process a lot: checking the level, doing paint-overs and fixing the base level art is really difficult if there are a lot of details.
* After the art blocking phase '''the level should look and feel "complete", serving as a solid base to add things later on.'''
* Even if you must work with placeholder 3D assets, try to match the '''proportions''' from the start.
* Don't spend too much time creating intricate, highly detailed placeholder areas. Rather use temporary structures, instead, or, if you must, leave the area empty while waiting for assets.
* Divide your work into steps, to avoid spending all your time on a single finalized scene and neglecting other areas. Focus on '''a single run throughout the whole level'''.
* A safe place to start are the walls, ground, floor and other environmental elements making up the big objects.
* '''The backgrounds''' are an important part of the base art. They play a huge role in creating the big shapes and the visual flow.
* When working with outside locations, don't forget the sky - or you're missing out on a big part of the screen. Remember to add the clouds and weather elements etc. They are a very important part of the level's general flow.

<gallery heights=400px mode="packed">
File:base_art_and_detail_art_01.jpg| A great example of the base art done right: A simple setting, providing a great base to build on and add details. Also easy to modify, if needed.
File:base_art_and_detail_art_02.jpg| The base art looks good, though the door collision is yet uncovered. Allowing the unique gameplay asset (the snowball instructions in the background) collisions to go untouched is ok in this scene, as they will be replaced with new assets later.
File:base_art_and_detail_art_03.jpg| A good base art is simple enough - when the whole set could be changed, one shouldn't waste too much time with the base art.
File:base_art_and_detail_art_04.jpg| The base art is too detailed here - if there are any changes to the level geometry, a lot of work has been done in vain.
</gallery>

=== Basic art principles are present from the start ===
* [[Level Art: Composition]] The composition and flow guide the player through the level. Tip: Select the right materials for the shapes, and never use assets scaled too large, unless you can hide them well.
* [[Level Art: Color and Lighting]] Color and lighting can be used to guide the player as well. Tip: Use the values and contrasts so that the important things pop out and unimportant things blend in. Invite the player towards their intended path with lights and use darker tones for those parts of the screen the player is not supposed to stumble into.

=== Don't Let the Collisions Restrict You When it's Not Necessary ===
* The collisions are implemented by level designers - while they pay attention to art details as well, their job is designing the game, not making art.
* Never edit the collisions or gameplay objects without consulting the designers first - but don't be afraid to ask about the matter. Have a conversation with the designer about the changes you wish to make, and if they agree, proceed.
* The gameplay area is a narrow 2D plane, the width of it being only about 2 metres. The collision rules, for example, are applied only inside those two-meter borders. Your job is to blend the gameplay area into the surrounding 3D scene and to make it a believable part of the world (as opposed to an artificial, detached lane).
* As long as your foreground or background items don't distract the player from the important gameplay things, feel free to experiment and go wild.
* It's not necessary for the background and foreground areas surrounding the gameplay area to follow the general shape of it. On the contrary, they should be used to create depth and hide the fact that the actual game happens in a narrow, straight line.

=== Requesting New Pieces to 3D Asset Sets ===
* Level artist uses the 3D asset sets created by 3D artists to build levels - and figure out simultaneously how the various asset pieces work.
* Don't hesitate to give feedback to 3D artists and/or request art from them. Both you and the 3D artist benefit when useful and visually satisfying asset sets are created.
* The 3D artists create the assets and don't really build levels with them. To make full use of all assets and connect them together, it's likely you'll need to ask for more parts.
* If you need more asset pieces created, compile a list of your needs during the base art base and deliver it to the 3D art lead.
* For example, you might ask for more differently sized pieces to a wall set, if [[Public Level_Art:_Composition#Problems_created_by_scaling_3D_models_too_much|scaling the size of the old ones up]] or [[Public Level_Art:_Composition#Non-uniform_scaling|non-uniformly]] will result in the visual quality suffering.
** Note: It's fine to use the too-much-up-scaled or non-uniformly-scaled versions of the pieces for the first version of your base art. Request the new 3D pieces by the end of the base art phase and replace the old assets with new ones later.
** Tip: If possible, it's better to gather a list detailing all your needs than to ask for a new 3D set piece every day.
** Tip: When building temporary structures from currently available assets, write down their measurements and describe the shape that you want the new assets to be. Pass your notes along with your asset order list to the 3D artist who can use them as a reference.

=== Prioritize the focal point areas ===
* Start with the focal point areas (beginning, ending, story areas, special art areas etc.) and plan the rest of the base art around those scenes.
* The level start and end areas are usually focal point areas, as we want the first and last thing the players see to look extra nice.
* Not every single frame can be a focal point one, but there should be more general areas between instead. By alternating the various scene types it's easier to avoid player exhaustion, create rhythm and emphasize the special areas.
* Since the game project is on the clock, it's best to schedule and plan carefully before the actual work.
* 2D angled games (like Trine) face issues with matching the organic art to the straight collisions. To avoid that, you might feel tempted to create natural rock formations with perfectly straight 90-degree angles. Try keeping the rock formation as natural as possible, instead, while strictly following the gameplay collision areas and rules (the foreground and background area are not tied by the gameplay area rules). If a straight/90-degree surface must be included, you can use man-made constructions (brick, wood) rather than pursuing the "natural" rock look.

==== Focal points ====
* Focal points are very delicately planned and beautifully built areas inside the level.
* They can be impressive and unique hero assets or just small asset arrangements built out of ordinary assets (nicely composed and made look perfect for the specific camera angle).
* Most of the level should consist of the "basic environment"; focal points are located here and there to spike interest.
* You can also use carefully crafted small lighting scenarios as points of interest, like a warm ray of light emerging from a hole in the cave wall, illuminating some mushrooms/rocks/etc.
* In Trine games you should place the focal points between the puzzle areas. Scenes containing puzzles should be clear of any distractions, allowing the players to fully focus on solving the puzzle.
** The puzzle areas shouldn't look boring, either, but it's a good practice to build the various areas of the level to highlight their function.
* If there's not enough space for an important focal point area in the game, talk to the designer. Usually, they are willing to add the needed space to the level.
* Reference images are especially important when building focal point areas, so study and search for new images!
* Even if two levels share a theme, each level should have a unique feeling of its own.
* There should be something special and visually memorable in each level: A point that evokes feelings and makes the level remarkable. For example, a shark swimming by, a unique geological formation or the oldest classic - a breathtaking scenery point.

<gallery heights=200px mode="packed">
File:Trine 4 screenshot 17 1080p.png| A striking focal point features a unique wizard face sculpture asset specifically made for this spot.
File:Trine 4 screenshot 44 1080p.png| The dragon skull on the background, its strong silhouette against the sky, is an eye-catcher and a remarkable focal point.
File:Trine 4 screenshot 38 1080p.png| The statue on the left is highlighted with golden "god rays". The cave is full of angular forms, making the statue stand out.
File:Trine 4 screenshot 43 1080p.png| The bear statue adds a mysterious focal point to the more traditional forest scenery.
File:Trine 4 screenshot 40 1080p.png| Frozen dragon skeleton is framed with the diagonal "god rays" from the top and diagonal icicles from the bottom.
File:Trine 4 screenshot 25.png| The fiery planet draws eyes towards it. The shiny celestial body is surrounded by curved shapes emphasizing it even more.
File:Trine 4 toby's dream screenshot 02.png| The curved branch silhouette is a simple, yet effective focal point. The flow of the scene supports it nicely.

</gallery>

== Detailing ==
* When the detailing phase is reached, it's a race against the clock to get all the levels finished on time, thus making the detailing phase a tightly scheduled one.
* The level is already filled with functioning and pleasing visuals. Details are added for plausibility reasons, and to pique visual curiosity, to create depth and to add to the level's visual charm.
* The level base is optimized during the detailing phase to make sure there isn't any excess geometry left.
* Pay attention to the consistency of your art in a single level and of the whole game: there shouldn't be some areas filled with details while some are completely empty.
* Always iterate gradually. It's tempting to fill one area from top to the bottom with detailed and finished art - and then move on to the next one, but you might end up running out of time and ruining the coherent feel of the level.
* [[Public Level Art: Environmental Storytelling|Environmental storytelling]] should guide your work while detailing.
* The level design might change during the detailing phase, forcing you to consider and adjust your level art accordingly.
* When the detailing phase is over, each level of the game should be "good enough". The sooner the levels reach that state, the better.
* In theory, once the detailing phase ends, each level should be ready to ship (if, for some imaginary reason, there were no time or resources for any polishing). That means art is coherent and of good quality, supporting the gameplay. There shouldn't be any major visual issues. In reality, the Trine levels are always polished and fine-tuned.

== Polishing ==
* Usually not a scheduled phase, as the levels entering this stage have reached the "good enough" standard mentioned earlier.
* The remaining time (until the content lock day) is spent fine-tuning everything as much as possible.
* Polishing is done last to ensure the overall quality of all levels. Each level should reach the "good enough" state before any polishing on any level happens.
** Note: If you have gaps in your schedule during the earlier level art phases (while waiting for access to a certain level, for example) it's ok to do some polishing work as well.
* The Trine game levels are polished until the last possible moment, and none of the levels is considered "final" until the game launch day.
* Even when polishing you need to consider the general art quality and aim for coherence throughout the game: some levels can't look more polished than the others.
* New 3D assets might appear during the later stages of the project, and they are distributed evenly among the levels.
* Polishing phase entails minor detail fixes and also bigger base art level fixes. The development is a constant flux: some brilliant ideas come up late and some previously functioning concepts are abandoned during the later phases.
* While it's not recommended to implement any radical changes during the polishing phase, don't be afraid to speak up (no matter how close the deadline is), especially if your idea would elevate the quality of the whole level.

=== Polishing a Level Originally Created by Another Artist ===

* Polishing can be done by any of the level artists, no matter who originally created the base art and detailed art.
* It's beneficial for all the level artists to work on all the levels. That helps to keep the levels fresh and coherent and ensures the full potential of the art team is used.
* Nevertheless, some things should be considered when polishing a level made by another level artist:
** The artist responsible for a level's base/detail art might feel some degree of mental ownership of the level. Every other artist is encouraged, however, to suggest their ideas and execute changes. Nobody owns the level or the level art.
**However, the original artist has the best understanding of the level, granting them the chance to participate in the process and to voice their opinions and thoughts.
**The AD has the final say on which art version will be used, but they base their decisions on listening and reasoning, making sure each team member gets their voice heard. While the AD has the best grasp of levels as a whole, the level artist knows their level best.

* '''First, discuss with your AD and the original level artist'''
** Get a permission to start with the polishing work from your team lead.
** If you plan on executing radical changes, talk with the artist responsible for the base and detail art.
** The level might feature, for example, story-related elements that affect the level art. The original level artist can brief you about special details.
** Tip: Before making any changes, read the level art wiki site to understand the level.

* '''Smaller detail polish directly to the level, bigger base art polish to a copy of the level'''
** When you polish smaller details, not tampering with the base art radically, save your work to the actual level.
** When planning to make big changes, try them out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Keep the level of details coherent'''
** After reaching the "good enough" state, level art shouldn't revert back to any of the previous art stages even temporarily.
** When planning to make big changes or stripping a part of the level bare of the detailed level art, try the changes out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Before & after screenshots'''
* Take before/after screenshots of the changes
** If the changes are small, use the actual level
** With bigger changes, use a copy of the actual level
* Take screenshots before and after using the same camera positions.
* You need to be able to pinpoint the location and the exact nature of the changes.
*Tip: You can always return to the original version of the level to take the screenshots.

* '''Feedback'''
** When making larger changes: Show the changes made to the (copy of) level and the before/after screenshots to your AD and the original level artist. Discuss with them about the changes.
** When making smaller changes: Show the before/after screenshots to your AD to receive feedback, and fix the level art accordingly.

* '''Replacing old with new'''
** If the changes are approved by the AD, they can be commited to the actual level.

Level Art: Color and Lighting

2021-11-23T14:32:28Z

Tero Tirkkonen: /* Color is a combination of value, hue and saturation */

{{:Level Art}} 

= Color is a combination of value, hue and saturation =
* Color is made of three things: '''VALUE, HUE''' and '''SATURATION'''
* Color is always relative and the context determines how colors are interpreted
* The most important aspect of color is the value of color, meaning the darkness or lightness of a color. This attribute will be seen even clearer if the image is turned into a grayscale mode
* Hue means the actual color, for example the hue of the color can be red, yellow, blue, orange, green, purple and anything between those
* The hue can be cold or warm, so there can be warm or cool temperature for the hue. This, as everything with colors, is always relative and depends on the other colors around the color in question. Colors always exist in some environment that affects them
* A hue can look warm next to a cooler hue or cool next to a warmer hue. A value can look darker next to a lighter value and lighter next to a darker value, and this is true for saturation too
* Saturation determines how vibrant the color is. A very saturated color is vibrant and desaturated color is muted and closer to gray
* Lighting and colors are always tied together. When designing a lighting, first determine what you want to achieve with the color choices and keep your intention in mind while building the lighting
* It's best to always think about the contrast. Where do you want to add contrast and guide the eye to look at using value, hue and saturation? And where do you want to keep attention away from with low contrast? Usually the answer is simply that we want to guide the player to the right direction and highlight important gameplay objects while fading the irrelevant things to the background. For transition areas between the puzzles we might also want to create beautiful visual focal points where the attention is completely directed at the art.
* We never want to create confusion or frustration by guiding the player to an area with nothing in there: For example by making an area that is difficult to reach look like there is an entrance to a secret and cause the player struggle to get there only to realize there's nothing in there after all.
* Here: [[Level_Art:_Level_Art_Related_Gameplay_Issues#Distracting_Level_Art|Level Art Related Gameplay Issues: Distracting Level Art]], are several examples of the issues dysfunctional colors and lighting can create for the player

[[File:color_wheel_hue_saturation_value.jpg|350px]]

== Gamut masking ==
* Gamut masking can be used to determine a color palette for a scene
* [https://www.youtube.com/watch?v=qfE4E5goEIc James Gurney: Gamut Masking]
* KGamut is a software that can be used to check the gamut mask of an image
* With KGamut you can for example compare the gamut mask of your level art screenshot with a gamut mask of a reference image to get closer to the reference image's lighting
* [http://cr10blog.blogspot.fi/2013/02/kgamut.html KGamut: a digital gamut mapping tool for Windows]
* [http://gurneyjourney.blogspot.fi/2013/02/digital-gamut-mapping-tool-for-windows.html KGamut info]
[[File:Kgamut beach 01 wide gamut.jpg |500px ]]
[[File:Kgamut beach 01 limited gamut.jpg |500px ]]

= Value =
With values you can create contrast or unity by using '''light and dark''' colors
* Some vocabulary:
** '''Value''' = the darkness/lightness, can be most clearly seen in a greyscale image but is present in a full color image as well
** '''Contrast''' = Relative difference between different values in an image. For example: there is a big (the biggest possible in fact) contrast between black and white and less contrast between gray and white
** '''Noise''' = small details with strong contrast that create visually noisy feeling
* With values (as well as other aspects of color) it is crucial to remember everything is relative! A value can look bright or dark depending on what value it is compared to
* When simplified, each image is just a bunch of different value blobs arranged into a composition
* The relative difference in the values between these blobs can be used to make things blend in or pop out
* To make things pop out doesn't always mean to make them super bright, because this won't work in a bright environment as everything else is bright as well. It's all relative to the surroundings so it's all about values and contrasts in each different context.
* If the difference between the values is big, then there is contrast which means that those things stand out more
* If the difference between values is small then there is no contrast and the things don't stand out but blend in instead
* Adjusting values in level art can be achieved with lighting, fog or albedo color or all of these
* In games we can guide the player's eye where we want, for example to concentrate on beautiful visual details or to important gameplay objects. At the same time we don't want the player to concentrate on irrelevant things.
* Irrelevant/background objects/areas should blend in
* Important objects/areas that need to be highlighted have to pop out by either being a dark object on a bright background or vice versa, simple as that!
* If the important object is surrounded by noisy irrelevant visuals it will be lost in the visual noise. So it's good to have clear surroundings for these important objects. That way the contrast can be controlled and adjusted to highlight the important objects and blend in the irrelevant things.

[[File:Visual noise contrast theory.jpg|400px]]
* A) The same level of detail and contrast everywhere creates a noisy feeling and it's hard to figure out where the focus should be
* B) Less detail and contrast in the environment and a higher level of detail and contrast in one area makes it much easier to decide where to focus

== How to check the true values of an image in Photoshop ==
* It's not as easy to see the different values and their relations while the image is in full color as the different hues and saturation can complicate things a lot
* It is crucial for any artist to be able to check the values of an image and the best way to do this is to look at the image in a grayscale mode
* The areas with most contrast between different values are the areas the eye catches first in an image
* If an image doesn't look good and clear in grayscale, it will not work in color mode either
* You might think that the hue/saturation adjustment or some other Photoshop grayscale adjustment works just fine but actually they don't

* To see the true values of an image in Photoshop use the proof color setup
** Select View -> Proof Setup -> Custom...
** "Device to Simulate: Dot Grain 20%", "Render Intent: Relative Colorimetric", "Black Point Compensation" checked
** Now you can switch between the basic color mode and the true greyscale mode to check the true values colors using CTRL+Y any time
** You can for example check a screenshot's values in Photoshop with this method when designing the lighting and colors or trying to find out how to make the scene clearer
[[File:True values.jpg|800px]]

== Guiding the player with values ==
* Simplify how you see forms and value. Everything you see is just blobs of value, it really isn't more complicated than that.
* It's either light or dark. A light colored thing pops out on a dark background, but blends in into a light background
* This is true for anything, any theme, foreground, gameplay area and background, for landscapes as well as characters
* What is the area with the most contrast in the scene? Is that where we want the player to look? If not, then the contrast is in the wrong place.
* Does the important thing lack contrast and blend in? Create contrast: if the thing is bright in value, put dark around it, if the thing is dark value, put bright around it.
* How to make the route clear? Guide the player with the values, have darker areas on the edges where the player is not supposed to go. Make sure the right path is clear and pops out.
* Pay attention to values and contrasts and use them to make important things pop out and unimportant things blend in

<gallery heights=400px mode="packed">
File:Owls dream overpaint 01.jpg| The gameplay route is same material and value as the background so it's hard to see the gameplay route
File:Cornelius dream overpaint 06.png| The background has noise so important things aren't highlighted enough and they are lost in the background
File:Gislans dream overpaint 11.png| The values are flat so they don't guide the player to the right direction
File:airy_fairy_overpaint_78.png| The values are random noise so they don't guide the player to the right direction

</gallery>

== Bring out the important gameplay objects with values ==
* Examples of situations where the gameplay area and objects aren't visible enough due to the value issues
<gallery heights=400px mode="packed">
File:Cornelius dream overpaint 04.png| The important gameplay items aren't clear as the values don't bring them out enough
File:Rudolfus dream overpaint 03.jpg|The spikes, the platforms and the gameplay area poles don't stand out enough. It could also be made clearer that the level doesn't continue to the left here.
File:Rudolfus dream overpaint 04.jpg|The chest and the gameplay area poles don't stand out enough. The background structures make the scene less clear.
File:Rudolfus dream overpaint 05.jpg|The lever, the platforms and the gameplay area poles don't stand out enough
</gallery>

== Create depth with values ==
* With values and contrasts you can create a sense of depth to a scene. Adding depth will make the general feeling less flat.
* A simple rule of thumb is that the closer a thing is, the more contrast it has and the further away it is the less contrast it has
* This is because of the atmosphere, the further away a thing is the more air with all sorts of dust particles, moisture etc. there is in between and they'll create "fog" that makes things blend together more and more the further they are. This fog can have its own hue too depending on the colors of the scene. For example if the sky is blue things get bluer the further away they are in the background.
* This is a powerful tool to create depth and separate the different layers of depth: foreground (can be several layers), game area and background (can be several layers) in the scene
* It's a common problem in level art that some things on the background appear as if they were on the gameplay area and this can be helped with clear levels of depth
[[File:Level art guide values and depth.jpg|1200px]]

= Hue =
With hues you can create contrast or unity by using '''warm and cool''' colors
* The understanding of the contrast between warm and cool hues is a great tool when building the color scheme of a scene
* For example The color of the light can be warm orange while the color of the shadows is cool blue, this creates an appealing contrast between the light and shadow areas
* The hues of the sunlight will change depending of the time of the day and also different seasons throughout the year affect the colors as well as the humidity or cleanliness of the air
* Do use real life as a reference for creating different lighting scenarios. Even though Trine world is a fantasy world we want to stick to believable real lighting scenarios that people recognize.
* We can take real world lighting and emphasize and exaggerate it, but everything should start from a deep understanding of realistic lighting
* Different light sources have different hues in them, normal fire has orange tones but different magical elements can turn lights into all the different hues. Magical mushrooms or crystals for example can glow in any hue!

[[File:color_theory_hue_temperature.jpg|1300px]]

== Hues Indicating Emotions ==
* For example many movies use a certain color to communicate a certain mood, you can observe this yourself though often it's done in a quite subtle way
* The different hues of colors can be used to create different types of mood and to communicate a certain emotion visually
* Any color can be chosen to communicate any mood as long as the colors chosen for the specific moods stay consistent throughout the game
* There are certain hues that tend to be used for certain moods more often depending on the cultural environment so using those stereotypes as is or turned on their head can be ways to use hues to indicate moods
* Here is just one example how the hues could work consistently supporting the mood and emotions of the story
[[File:Environment_design_colors_and_emotions_example.png|400px]]

== Examples of using hues to determine the mood ==
<gallery heights=200px mode="packed">
File:Trine 4 screenshot 01 1080p.png| Light pastel colors to establish a calm environment
File:Trine 4 screenshot 02 1080p.png| Warm and welcoming feeling with yellows and oranges
File:Trine 4 screenshot 06 1080p.png| A warm and cozy color scheme for the friendly Badger's home den
File:Trine 4 screenshot 05 1080p.png| Lush green calming environment
File:Trine 4 screenshot 39 1080p.png| This environment is meant to be uninviting and menacing so pale cool greenish blue hues are used to achieve that atmosphere
File:Trine 4 screenshot 20 1080p.png| Menacing mysterious feeling created with purple tones
File:Trine 4 screenshot 23 1080p.png| Calm and more friendly mysterious feeling created with blue tones

</gallery>

= Saturation =
With saturation you can create contrast or unity by using '''vibrant and muted''' colors

* Saturation means the purity of the hue
* With maximum saturation the color is purest and most vibrant and with less saturation the color turns more towards gray
* Just like with values and hue you can also use saturation to guide the eye of the player
* In a desaturated environment a saturated spot will grab your attention
* Trine series is known for its colorful environments but being colorful doesn't mean that every color has to be at the maximum saturation
* If everything is very saturated it can become visually overwhelming quickly so generally it's good to be mindful when deciding which areas should have a lot of saturation
* The saturation can also be explored using gamut masks mentioned earlier in this article

Level art task

2021-11-23T14:31:29Z

Tero Tirkkonen: /* General Level Art Workflow Tips */

[[File:Task1.png|right|thumb|700px|Blocked level art base geometry, guide for the level art assignment]]
[[File:Task3.png|right|thumb|700px|A area and B area]]

= Level Art Assignment =
* Your task is to complete the given collision-blocked map. We are looking for an appealing and coherent end result. Your work doesn't need to be 100% finished, but it should give us an idea of your skills with asset placement, composition and lighting.
* You can, for example, create a level art base that could be continued later by adding more detailed level art elements and assets.
* Feel free to change the level in any way you want to make it more to your liking. For example, you can continue the map and design your own area displaying your talents from blocking to the finished level art.
* You can refer to Trine 3 levels, especially the tutorial levels, for inspiration. It's not forbidden to copy some parts of the Trine 3 levels as long as you blend them with your own unique level.
* We recommend using Trine 4: The Nightmare Prince and Trine 4: Melody of Mystery as visual references as well.
* We can see your potential even from a small area brimmed with polished and high-class art - no need to stress yourself over the amount of material needed. Quality overcomes quantity every time!

== Assignment info ==
* Create an environment using the '''Trine 3 editor'''
* The task should be completed in '''4 weeks'''
* Familiarize yourself with the Trine style level art by reading the necessary '''[[Level Art]] pages'''.
* Once you have finished the task, please return '''the map file''', so we can play your level and see your level art from the player's perspective.
* Record '''a video''' where you run through the level and showcase your work. We might not have enough time to play your level, so consider this video as the most important piece of your assignment and the main reference we use when evaluating your work.
* Add between '''2-8 screenshots''' of your favorite spots on the level.

=== The mandatory task ===
* Note: You must complete the task described here to apply
* The level has two areas: Area A and Area B. Area A comes with already-blocked collision boxes to give you an example of the terrain shapes to use
* Build your level art on top of Area A
* Build the lighting setup as well. Use atmospheric effects, like fog, to make the environment feel more believable.
* Create a strong and well-working base geometry. We're looking for something that is both interesting and visually pleasing. The level should have a clear theme.
* The most important aspects of your work are composition, asset placement and lighting.

=== The optional task ===
* Note: This part is not required to apply, but if you're willing, feel free to do it as well.
* Area B has no shapes, as we'd like to see you creating the base geometry there.
* Area A and Area B can be of the same size, but if you want to build a custom-sized Area B, that's fine as well.
* Please leave the collision box blocked shapes to the collision layer, so we can see the base shapes you've used.

=== You will get bonus points for ===
* Demonstrating your ability to transform your unique ideas to a well-executed level art.
* Using the available game assets creatively
* Polished end result
* Clean and optimal approach to level-building, making it easy for others to continue editing your level.

== General Level Art Workflow Tips ==
* Check out the content of our [[Level Art]] sites to familiarize yourself with our level art process and the basics of level art theory. There's plenty of tips available, too!
* Don't be afraid to hijack our assignment and take it in any direction you want to, as long as it shows off your abilities as a level artist. We want to see your visual level building skills, so show them the way that suits you best.
* You can use any assets in the Editor, but try to keep your level coherent and sensible. On the other hand, don't forget that Trine is a fantasy world where anything is possible.
* Keep the limitations of the real-time 3D in mind when creating the environment and use assets with optimization in mind.
* Keep the collisions on the collision layer and add art on the art layer.
* Pay special attention to the composition, asset placement and lighting, as those are the aspects we're most interested in.
* Start with the big shapes. When they are satisfactory, concentrate on the finer details. Use an iterative approach, building the whole level layer by layer.
* Do not scale the objects too big, causing the texture resolution to suffer. A good rule of thumb is that you can scale an asset 20% bigger or smaller than the original size. You can, of course, break these rules if the final result looks amazing.
* Don't forget the lighting, but carry it along the whole level art process starting from the very beginning. Considering lighting implementation is crucial when placing assets into the scene - and so is adjusting the lighting while progressing with the level art.
* The assets can be used in many ways: Don't let obvious approaches or any assumed purpose restrict your creativity! As long as it looks good, anything is allowed.
* When creating a level for an actual game project, you need always to consider gameplay aspects carefully. In this assignment, however, we're evaluating your artistic eye, so don't worry if your gameplay isn't fine-tuned. For example, it's not crucial to match all the collisions perfectly everywhere.
* Remember to test your level with actual characters and run around in your level. We're looking only at those things that the player can see through the cameras while playing the level.
* To come up with interesting ideas for your environment, we recommend using real-life geography and/or architecture as reference material. For this task, you can also use other games (especially Trineverse games) as references.
* Don't worry too much if using the Editor feels difficult at first. Focus on showcasing your skills at creating believable environmental settings by building appealing shapes and lighting arrangements.
* You'll use the publicly released Trine 3 Editor for this assignment. Our current in-house Editor differs a lot from the Trine 3 version since it has undergone a lot of upgrades and improvements. For example, it has a new renderer with pbr materials and a lot of new assets that are all missing from the Trine 3 Editor.
* If we'll hire you, you'll be trained to use our latest Editor version.
* If you have problems with the Editor, please don't hesitate to contact us.

= How To Use Trine 3 Editor =

This page should have all the basics you need to know to learn how to use the editor. It is a lot of information and work to learn to use a new tool and to build a level so we encourage you to ask in case you run into any problems. Just send us any questions you've got and we'll help you to get back on track! The most basic necessities for any map are CamerasystemPrefab, AmbientLightEntity and ColoreffectEntity, they have been added to the map already. After that come collisions and art assets follow. There are many assets for creating beliveability and atmosphere to the level. Lights and fogs for example are very important when creating the look of the level. Try checking the Trine 3 levels and how these things are done in them, for example how waterfall effects in Amadeus's Beach Tutorial level are built. The tutorial levels are all in one level file vertically placed so for the Amadeus's level you need to travel down quite a bit to get there in the Editor.

== Basic windows in editor ==

=== Object properties ===
Show '''Object Properties''' dockable window using '''View > Object Properties''' or using '''Ctrl + P'''.

With this window you can modify object's properties.

The properties inside components can be set in alphabetical order from the editor settings: Tools > Options > Properties > "Order Properties In Property Grid".

Components and properties can also be [http://wiki/index.php/Search_properties_and_components_in_Object_Properties_window searched] for inside the window.

=== Scene instance tree ===
Show '''Scene instance tree''' dockable window using '''View > Scene instance tree''' or using '''Ctrl + F2'''.

With this window you can see all instances in the scene/level.

=== Type tree ===
Show '''Type tree''' dockable window using '''View > Type tree''' or using '''Ctrl + F3'''.

With this window you can find entites/types which can be inserted into scene/level.
For example all the 3D art assets, lights and fogs can be found here.

=== Category ===
Show '''Category''' dockable window using '''Categories > Category root''' or using '''Ctrl + Shift + F1'''.

Category window is a configurable window, where you can insert shortcuts to entities/types which you want to insert into scene/level.

=== Resource tree ===
Show '''Resource tree''' dockable window using '''View > Resource tree''' or using '''Ctrl + F4'''.

With this window you can see all the [[resource]]s which are available.

=== Recent objects ===
Show '''Recent objects''' dockable window using '''View > Recent objects'''.

With this window you can see recent types you have used.

=== Modules ===
Show '''Modules ''' dockable window using '''View > Modules'''.

With this window you can modify Module properties which affects various things in editor / engine.

=== Error list ===
Show '''Error list''' dockable window using '''View > Error list'''.

This window shows errors, warnings and info messages generated by editor and engine. Very usefull tool for debugging what's wrong.

=== Reference list ===
Show '''Reference list''' dockable window using '''View > Reference list'''.

When selecting some type or instance you can see '''ReferenceString''' property in the '''Property Window''' and by clicking it with mouse right button and selecting '''Show Reference list''' from the context menu, you can print type's or instance's reference list into this window.

== Basic controls in editor ==

=== Moving camera ===
* WASD - Move camera
* Shift + WASD - Move camera faster
* Right mouse button and drag - Rotate the view

You can also press any of the axes on the editor gizmo on the right upper corner. Pressing on the axis changes the camera rotation to coincide with that axis.

[[File:Gizmo.png]]

=== Object selection ===
* Left mouse button - Select object
* Alt + Left mouse button - Select object behind another object (You may need to click multiple times to select the desired object)
* Shift + Left mouse button - Select multiple objects
* Ctrl + Left mouse button and drag - Box select, select objects in area (if you are selecting a vast amount of objects at once it can be a good idea to de-select View->Tree Update Enabled so the procedure will be faster, but do remember to re-select it after, otherwise you won't be able to operate the object properties)

=== Tool selection ===
* 1 - Move tool
* 2 - Rotate tool
* 3 - Scale tool
* 4 - Area tool
* 6 - Scale specific side tool

=== Copying and pasting ===
* Ctrl + C - Copy selected object(s)
* Ctrl + X - Cut selected object(s)
* Ctrl + V - Paste copied object(s)
* Ctrl + Shift + V - Paste copied object(s) onto the same coordinates they were copied from
* To duplicate an object, hold Shift and move object from one of the arrows while having move tool selected
* You can copy & paste items between separate levels too

=== Undo and Redo ===
* Ctrl + Z - Undo
* Ctrl + Y - Redo

=== Other useful buttons ===
* Space bar - Toggle between Global, Local and Screenspace transform and rotation
* K - Allows you to see lights through collisions
* J - Makes the lights stay the same size no matter how far you are from them
* Ctrl + T replaces selected instance in the scene with the type selected in type tree
* L - Hides lights
* G - Hides lights and all objects that don't have the VisibleInGame on
* P - Selecting an instance within a scene and pressing P Locates selected instance in the type tree
* Ctrl + G - Hides grid
* Control + Left click on a layer hides it.

=== Editing objects ===
Click an object you want to edit in the level. Three arrow or circles should appear depending on what tool you have selected. Use these arrows/circles to move, rotate and scale the object on X, Y and Z axis.
'''Note: You can select objects only from currently selected layer. Change layer by clicking Def., Col., 1, 2... from the tool bar or with Alt + 9, 0, 1, 2, ...'''

[[File:layers.png]]

It's also possible to choose objects on any layer if you want to. Go to Selection -> Selection filter locking and untap the '''Allow selection on active layer only'''.
Just make sure that you keep objects on their dedicated layers if you decide to use this.

=== Editing object properties ===
To edit an object's properties you need to open up the '''Object Properties''' dockable window via '''View > Object Properties''' and then selecting the Object you want to Edit.

=== Adding objects ===
Objects can be added from Type tree window. You can open it from '''View > Type tree'''. Use the Search field to find the objects you are looking for. Most of the time objects you want to use are located under '''TypeRoot/InstanceBase/Entity'''. Also remember to deselect any selected objects in Type tree before searching again.

Finding the right object from the type tree can be quite tricky if you don't know the exact name of the object. A good way to start is to copy them from existing maps.

When inserting objects, you can press and hold Shift and/or Ctrl. Holding Shift attempts to snap the object next to another object, when you move the object above an object already on the scene. Holding Ctrl snaps the movement of the object to the grid.

=== Testing map in editor and saving ===
To test your changes in editor press green play button (F5) to start the level or blue play button (Ctrl+F5) to start from camera position.

To return to editor from play mode, press the blue stop button (Shift+F5).

[[File:play_buttons.png]]

=== Some tips about the type tree ===
TypeRoot -> InstanceBase -> Entity -> ObjectEntity -> object You will find all the objects here

TypeRoot -> InstanceBase -> Entity -> LightEntity You will find all the lights here

Finding items in type tree can be a little bit tricky at times as some tiny problems may occur. When you search for something that has multiple types under it they might not show for some reason.
For example if you search for RockCollisionHelper in the type tree it might only show the RockCollisionHelper instead of all it's variations like BookRockCollisionHelper etc. This can be fixed by either
searching again by typing the desired thing in the search bar or manually clicking the tree to find it.
Also after using one object and then trying to find another object in the type tree, make sure to check the object you used isn't active anymore. Otherwise the Search bar won't search anything.
You can just click anywhere in the empty part of the map to make sure you don't have any object active.

=== Other useful tips ===

Tools -> Options -> properties -> Order Properties In Property Grid to get properties in property window ordered alphabetically

Tools -> Options -> Tool -> Selection highlight self illumination enabled to get rid of the blue highlight when selecting objects

The collisions have VisibleInGame on in this map so that you can see them when you play. It's good to turn them of after you have addded art on them so that you can take a better look at the art. You can make the collisions invisible by choosing the collision, going into its properties and tapping VisibleInGame off from the ModelComponent.

== Lighting in editor ==
[[File:Trine3_lights.gif|thumb|A gif showing the effects of different types of lights on the scene.|480px]]
This page lists the most important LightEntities found in the editor and sheds some light (no pun intented) on their usage. There's a lot of general information about lighting in 3d games and related topics in the internet and elsewhere, so the interested reader is encouraged to do some independent searching for more in-depth discussion. Don't be discouraged by the large number of different properties that the LightEntities might have, most of them work with their default values.

What follows is a general overview of the different light entities you can find in the editor. In addition to general discussion, there are some examples of how each entity should be used.

=== AmbientLightEntity ===
Ambient lights are used in Trine 3 (and in games in general) to emulate the real world phenomenon of [https://en.wikipedia.org/wiki/Radiative_transfer radiative transfer] (energy transfer in the form of electromagnetic radiation, e.g. light). After photons are emitted, they are scattered, absorbed and re-emitted multiple times before finally reaching the viewer. This is one of the reasons why in nature there are no completely sharp or black shadows and that it's hard to find a completely dark place during daytime.

'''AmbientLightEntity''' is most often used as a global ambient light to set the base tone of the scene. If both color components are identical, they will create the effect of a uniformly lit scene. AmbientLightEntity can also be used as a directional light of sorts, if the Color2 component is a darker shade than Color1 component, as it is by default. This still mimics the behaviour of radiative transfer (absorption, emission, scattering), since AmbientLightEntity can't create shadows.

=== DirectionalLightEntity ===
[[File:Directional.png|thumb|DirectionalLightEntity causing an orthographic projection of shadows.]]
[[File:Directional_sunset_on_off.gif|thumb|A DirectionalLightEntity used in Pontius's tutorial for "sunset effect".]]
Directional lights are lights that emulate a light source that is infinitely wide and infinitely far, thus "emitting" light rays that are precisely parallel to each other. On Earth, direct sunlight can be approximated as parallel rays of light, and thus directional lights are used in Trine 3 to emulate sunlight and the sharp shadows caused by it. Another common use for directional lighting is a so-called skylight.

On an overcast day when no direct sunlight reaches the ground, objects are still clearly visible and lit. This is due to the light scattering from particles and water droplets in the atmosphere and reaching the ground through the clouds. The same phenomenon causes the sky to look blue during daylight and to be bright and colourful at all. If there was no atmosphere, there would be minimal scattering of light, resulting in a very dark sky and extremely harsh direct sunlight (among other, perhaps more lethal things), although the Sun would appear to be smaller in size. This is the physical phenomenon called [https://en.wikipedia.org/wiki/Diffuse_sky_radiation "skylight"], which is emulated in Trine 3 with a shadowless directional light that is perpendicular to the ground level, i.e. pointing straight down.

Although the effects of skylight and ambient light in the real world are based on the same physical principles (radiative transfer), in Trine 3 they aren't the same thing. Ambient light emulates the light that has already reached the ground and is just "bouncing back and forth" between different objects making everything look more or less the same from any viewing angle, whereas skylight is the diffuse light "coming straight down from the sky", making things look lighter and brighter from above rather than from below.

'''DirectionalLightEntity''' is a local directional light which uses an [http://db-in.com/images/projection_example.gif orthographic projection] instead of a perspective one. It's local in the sense that it's borders (field of view and range) can be chosen at will so that the light is projected only to a certain area. Most often DirectionalLightEntity is used as a local skylight for the background objects or to create other local but large-scale lighting conditions, like the appearance of a setting sun, as it was used in the beginning of Pontius's tutorial level.

'''SunDirectionalLightEntity''' is a global type of DirectionalLightEntity. It's range and field of view don't have any effect on it like they do on local directional lights. Like other directional lights SunDirectionalLightEntity casts orthographic shadows, but unlike any other light in the editor (except for AmbientLightEntity) it's position doesn't determine "where the light is coming from". The direction of the light can be changed only by rotating the SunDirectionalLightEntity, because it's thought to be infinitely far away.

=== PointLightEntity ===
[[File:Point.png|thumb|A PointLightEntity doesn't cause shadows.]]
[[File:Alpha_point.png|thumb|Fog and a PointLightEntity with RenderAlphaObjects.]]

Point lights are considered to be minuscule points that radiate isotropic light i.e. light that's the same in all directions. In the real world, only stars other than the Sun are considered point sources of light due to the great distance separating them from Earth. The closest thing to a point light on Earth is a light bulb without a lampshade. Since light bulbs without shades are a quite rare thing to see, point lights aren't a very authentic way to light a scene. The good thing is, they can be used together with other sources of light to create more natural lighting conditions. Point lights are also a very good way to highlight something and to make even small details easy to spot.

'''PointLightEntity''' is Trine 3's basic point light. It's color, intensity and range can be chosen to match the desired situation, whether it's large-scale orange-white light coming from bubbling lava or just a tiny speck of light coming from a glowing pink mushroom. PointLightEntity can also be used to cast light on only alpha objects, that is, objects like fog which don't have a solid frame.

PointLightEntity doesn't cast shadows at all and thus its light isn't blocked by any collisions or models. Be sure to take this into account, when you set the intensity and range of your point lights. Speaking of which, range and intensity can be tweaked with the '''scale tool''': When scaled from the middle of the scale tool's gizmo, both range and intensity are affected. When scaled on the green Y-axis, only intensity is affected, where as red x-axis affects range only. Blue line does nothing.

=== AmbientPointLightEntity ===
[[File:Ambient_point.png|thumb|An AmbientPointLightEntity is a local ambient light.]]
Ambient lights were discussed above and [[#AmbientLightEntity]] was said to be used as a global ambient light to set the tone of the scene. Like local directional lights, there are also local ambient lights. PointLightEntity can be used as a local ambient light by changing the property called '''AmbientFactor'''. When this is 0, the PointLightEntity works as a normal point light, but the closer it is to 1, the more it behaves like a local ambient light. This kind of local ambient light works in the same manner as global ambient lights, except it's range can be chosen at will.

=== PointLightEntity with RenderAlphaObjects ===
PointLightEntities can also be used to light alpha objects, like spiderwebs, fogs, clouds etc. In Trine 3 editor the '''RenderAlphaObjects''' property can be set to turn a PointLightEntity into an "AlphaBlendPointLightEntity".

It's noteworthy, that once '''RenderAlphaObjects''' is on, changing the '''Range''' property isn't anymore enough to change the actual range of the light, also the '''Radius''' property should be changed to the same value under PointLightComponent-->PointLightAreaComponent-->SphereAreaComponent->Radius. This only applies to manual editing of Range and Radius, if the scale tool is used to change the range of the point light, the radius is increased automatically.

=== SpotLightEntity ===
[[File:Spot.png|thumb|A SpotLightEntity and a perspective projection of shadows.]]
[[File:Shadow_quality_4.gif|thumb|SpotLightEntity shadows flickering on and off]]
Spot lights are like directional lights but the light projection is different. The light is projected in a cone and the shadow projection is perspective instead of ortographic. A flashlight is an example of a spot light. Spotlights are usually used in combination with point lights to create more realistic lighting conditions.

'''SpotLightEntity''' is the spot light of Trine 3. It shares many of the properties with DirectionalLightEntity (and SunDirectionalLightEntity), since DirectionalLightComponent is a child type of SpotLightComponent. A SpotLightEntity's range, color, intensity, fov and many other properties can be changed at will to reach the desired lighting conditions. SpotLightEntity has also a property called LinearFade. If it's false, the light attenuation of the spot light is more "natural" and fades faster. If set to true, the intensity of the spot light fades linearly, i.e. it's value decreases like 1.0/distance (instead of 1.0/distance squared).

SpotLightEntities have '''ShadowQuality''' set by default to ShadowQuality4. If there are more than four SpotLightEntities with ShadowQuality4 in view, the shadows will start flickering. The same applies to SpotLightEntities with lower ShadowQuality so that
* 4 x ShadowQuality1 = 1 x ShadowQuality2
* 4 x ShadowQuality2 = 1 x ShadowQuality3 and
* 4 x ShadowQuality3 = 1 x ShadowQuality4

All in all there can be a maximum number of 10 shadow casting SpotLightEntities in view at the same time.

<gallery>
File:Ambient_prop.png|AmbientLightComponent
File:Point_prop.png|PointLightComponent
File:Alpha_point_prop.png|Radius, Range and RenderSolid/AlphaObjects.
File:Spot_prop1.png|SpotLightComponent, DirectionalLightComponent and SunDirectionalLightComponent have the same properties, with slightly different settings.
File:Spot_prop2.png|SpotLightComponent cont.
</gallery>

=== ColorEffectEntity ===
[[File:Coloreffectentity.gif|thumb|Different ColorLookupTextures.]]
'''ColorEffectEntity''' is a scene wide effect that sets the tone of the scene. The '''Exposure''' property can be used to change the exposure of the whole scene, i.e. to make the scene globally darker or lighter. The '''ColorLookupTexture''' property can be used to choose a color look-up table from the ones created for the game in question. These can be found under \data\root\instance_base\entity\texture\color_lookup.

=== Bloom ===
[[File:Bloom_lens_flare.gif|thumb|Lens flare effect of bloom.]]
[[File:Bloom_effect_entity.png|thumb|BloomEntity]]

=== General ===
Bloom is a shader effect used in game engines to emulate imaging artifacts of real-world cameras, like [https://en.wikipedia.org/wiki/Lens_flare lens flare], [https://en.wikipedia.org/wiki/Dynamic_range#Photography finite dynamic range] and [https://en.wikipedia.org/wiki/Airy_disk airy discs] caused by the diffraction of light.

In game engines, bloom effect can be used to create a dream-like visual style or emphasize a magically glowing objects. With the right settings it can also enhance the photorealism of the scene by emulating the above mentioned effects.

=== BloomEntity in the editor ===

BloomEntity (BE) can be found from "InstanceBase/Entity/SceneEntity/BloomEntity". BE is a global effect and it has many properties in it's GlowComponent, but most of these don't need to be touched by the user. The two most important ones are:
* Factor
** Determines the weight of the particular BE, if there are more than one in the scene. Mostly used for animation purposes.
* StreakLength
** Setting this to 0 removes the lens flare effect, which is dependant on the relative direction of the BE.

=== Properties of glowing objects ===

Normal entities can be made to glow, like the collisions used in the pictures. Every entity with a ModelComponent has four properties that determine their behaviour with BE. These are:
* SelfIllumination
** The colour of the self illumination. Like the name says, used for objects that are supposed to be self illuminated, like sun, moon and lamps.
* SelfIlluminationFactor
** The strength of the self illumination. Example values used for different entities are 1000 for sun, 2 for moon and 15 for a bright lamp.
* GlowAmountColor
** The colour of the glow effect. Like self illumination, but this adds a soft halo around the object.
* GlowAmount
** The strength of the glow effect. Values usually around or less than 1.

Usually self illumination and glow are used together to achieve the best result.

<gallery>
File:self_ill.png|Self illumination.
File:Glow.png|Glow.
File:Combined.png|Self illumination and glow combined.
</gallery>

=== Additional Shadows ===
There are 3 kinds of shadows: '''fake_shadow_gradient.fbxmodel''', '''fake_shadow_gradient_radial.fbxmofel''' and '''fake_shadow_solid.fbxmodel'''. The solid one is used to block lights by placing the black area to point towards light source (the other side is invisible).
The other two are used to give walls etc some extra shading.

Some ground art pieces are kinda bumpy and there are times when they might look a little bit funny after lights have been added. This can be fixed by using ShadowBias that can be found on the object's properties and changing it to 0.1. Below will be examples and you can see how big the difference is.

<gallery>
File:Level_art_tutorial_withoutshadowbiasv2.png|Before adding ShadowBias
File:Level_art_tutorial_withshadowbiasv2.png|After adding ShadowBias
</gallery>

=== Fog ===
Fogs can be found in Typeroot -> InstanceBase -> Entity -> ObjectEntity -> object -> atmosphere-> fog

'''CircleFogAreaEntity''' and '''SquareFogAreaEntity''' are used to create atmospheric effects and distance fog. It can be found in the type tree under LightEntity. FogAreaEntities work similiarly to DirectionalLights. Use Scale tool to edit Range, Fov and intensity. In Properties under SpotLightComponent you can adjust Color of the fog and thickness. Change Linear overbrightness to make the fog more or less thick. 1 is really thick and -1 is completely transparent.

Level art task

2021-11-23T14:31:14Z

Tero Tirkkonen: /* Assignment info */

[[File:Task1.png|right|thumb|700px|Blocked level art base geometry, guide for the level art assignment]]
[[File:Task3.png|right|thumb|700px|A area and B area]]

= Level Art Assignment =
* Your task is to complete the given collision-blocked map. We are looking for an appealing and coherent end result. Your work doesn't need to be 100% finished, but it should give us an idea of your skills with asset placement, composition and lighting.
* You can, for example, create a level art base that could be continued later by adding more detailed level art elements and assets.
* Feel free to change the level in any way you want to make it more to your liking. For example, you can continue the map and design your own area displaying your talents from blocking to the finished level art.
* You can refer to Trine 3 levels, especially the tutorial levels, for inspiration. It's not forbidden to copy some parts of the Trine 3 levels as long as you blend them with your own unique level.
* We recommend using Trine 4: The Nightmare Prince and Trine 4: Melody of Mystery as visual references as well.
* We can see your potential even from a small area brimmed with polished and high-class art - no need to stress yourself over the amount of material needed. Quality overcomes quantity every time!

== Assignment info ==
* Create an environment using the '''Trine 3 editor'''
* The task should be completed in '''4 weeks'''
* Familiarize yourself with the Trine style level art by reading the necessary '''[[Level Art]] pages'''.
* Once you have finished the task, please return '''the map file''', so we can play your level and see your level art from the player's perspective.
* Record '''a video''' where you run through the level and showcase your work. We might not have enough time to play your level, so consider this video as the most important piece of your assignment and the main reference we use when evaluating your work.
* Add between '''2-8 screenshots''' of your favorite spots on the level.

=== The mandatory task ===
* Note: You must complete the task described here to apply
* The level has two areas: Area A and Area B. Area A comes with already-blocked collision boxes to give you an example of the terrain shapes to use
* Build your level art on top of Area A
* Build the lighting setup as well. Use atmospheric effects, like fog, to make the environment feel more believable.
* Create a strong and well-working base geometry. We're looking for something that is both interesting and visually pleasing. The level should have a clear theme.
* The most important aspects of your work are composition, asset placement and lighting.

=== The optional task ===
* Note: This part is not required to apply, but if you're willing, feel free to do it as well.
* Area B has no shapes, as we'd like to see you creating the base geometry there.
* Area A and Area B can be of the same size, but if you want to build a custom-sized Area B, that's fine as well.
* Please leave the collision box blocked shapes to the collision layer, so we can see the base shapes you've used.

=== You will get bonus points for ===
* Demonstrating your ability to transform your unique ideas to a well-executed level art.
* Using the available game assets creatively
* Polished end result
* Clean and optimal approach to level-building, making it easy for others to continue editing your level.

== General Level Art Workflow Tips ==
* Check out the content of our [[Public Level Art]] sites to familiarize yourself with our level art process and the basics of level art theory. There's plenty of tips available, too!
* Don't be afraid to hijack our assignment and take it in any direction you want to, as long as it shows off your abilities as a level artist. We want to see your visual level building skills, so show them the way that suits you best.
* You can use any assets in the Editor, but try to keep your level coherent and sensible. On the other hand, don't forget that Trine is a fantasy world where anything is possible.
* Keep the limitations of the real-time 3D in mind when creating the environment and use assets with optimization in mind.
* Keep the collisions on the collision layer and add art on the art layer.
* Pay special attention to the composition, asset placement and lighting, as those are the aspects we're most interested in.
* Start with the big shapes. When they are satisfactory, concentrate on the finer details. Use an iterative approach, building the whole level layer by layer.
* Do not scale the objects too big, causing the texture resolution to suffer. A good rule of thumb is that you can scale an asset 20% bigger or smaller than the original size. You can, of course, break these rules if the final result looks amazing.
* Don't forget the lighting, but carry it along the whole level art process starting from the very beginning. Considering lighting implementation is crucial when placing assets into the scene - and so is adjusting the lighting while progressing with the level art.
* The assets can be used in many ways: Don't let obvious approaches or any assumed purpose restrict your creativity! As long as it looks good, anything is allowed.
* When creating a level for an actual game project, you need always to consider gameplay aspects carefully. In this assignment, however, we're evaluating your artistic eye, so don't worry if your gameplay isn't fine-tuned. For example, it's not crucial to match all the collisions perfectly everywhere.
* Remember to test your level with actual characters and run around in your level. We're looking only at those things that the player can see through the cameras while playing the level.
* To come up with interesting ideas for your environment, we recommend using real-life geography and/or architecture as reference material. For this task, you can also use other games (especially Trineverse games) as references.
* Don't worry too much if using the Editor feels difficult at first. Focus on showcasing your skills at creating believable environmental settings by building appealing shapes and lighting arrangements.
* You'll use the publicly released Trine 3 Editor for this assignment. Our current in-house Editor differs a lot from the Trine 3 version since it has undergone a lot of upgrades and improvements. For example, it has a new renderer with pbr materials and a lot of new assets that are all missing from the Trine 3 Editor.
* If we'll hire you, you'll be trained to use our latest Editor version.
* If you have problems with the Editor, please don't hesitate to contact us.

= How To Use Trine 3 Editor =

This page should have all the basics you need to know to learn how to use the editor. It is a lot of information and work to learn to use a new tool and to build a level so we encourage you to ask in case you run into any problems. Just send us any questions you've got and we'll help you to get back on track! The most basic necessities for any map are CamerasystemPrefab, AmbientLightEntity and ColoreffectEntity, they have been added to the map already. After that come collisions and art assets follow. There are many assets for creating beliveability and atmosphere to the level. Lights and fogs for example are very important when creating the look of the level. Try checking the Trine 3 levels and how these things are done in them, for example how waterfall effects in Amadeus's Beach Tutorial level are built. The tutorial levels are all in one level file vertically placed so for the Amadeus's level you need to travel down quite a bit to get there in the Editor.

== Basic windows in editor ==

=== Object properties ===
Show '''Object Properties''' dockable window using '''View > Object Properties''' or using '''Ctrl + P'''.

With this window you can modify object's properties.

The properties inside components can be set in alphabetical order from the editor settings: Tools > Options > Properties > "Order Properties In Property Grid".

Components and properties can also be [http://wiki/index.php/Search_properties_and_components_in_Object_Properties_window searched] for inside the window.

=== Scene instance tree ===
Show '''Scene instance tree''' dockable window using '''View > Scene instance tree''' or using '''Ctrl + F2'''.

With this window you can see all instances in the scene/level.

=== Type tree ===
Show '''Type tree''' dockable window using '''View > Type tree''' or using '''Ctrl + F3'''.

With this window you can find entites/types which can be inserted into scene/level.
For example all the 3D art assets, lights and fogs can be found here.

=== Category ===
Show '''Category''' dockable window using '''Categories > Category root''' or using '''Ctrl + Shift + F1'''.

Category window is a configurable window, where you can insert shortcuts to entities/types which you want to insert into scene/level.

=== Resource tree ===
Show '''Resource tree''' dockable window using '''View > Resource tree''' or using '''Ctrl + F4'''.

With this window you can see all the [[resource]]s which are available.

=== Recent objects ===
Show '''Recent objects''' dockable window using '''View > Recent objects'''.

With this window you can see recent types you have used.

=== Modules ===
Show '''Modules ''' dockable window using '''View > Modules'''.

With this window you can modify Module properties which affects various things in editor / engine.

=== Error list ===
Show '''Error list''' dockable window using '''View > Error list'''.

This window shows errors, warnings and info messages generated by editor and engine. Very usefull tool for debugging what's wrong.

=== Reference list ===
Show '''Reference list''' dockable window using '''View > Reference list'''.

When selecting some type or instance you can see '''ReferenceString''' property in the '''Property Window''' and by clicking it with mouse right button and selecting '''Show Reference list''' from the context menu, you can print type's or instance's reference list into this window.

== Basic controls in editor ==

=== Moving camera ===
* WASD - Move camera
* Shift + WASD - Move camera faster
* Right mouse button and drag - Rotate the view

You can also press any of the axes on the editor gizmo on the right upper corner. Pressing on the axis changes the camera rotation to coincide with that axis.

[[File:Gizmo.png]]

=== Object selection ===
* Left mouse button - Select object
* Alt + Left mouse button - Select object behind another object (You may need to click multiple times to select the desired object)
* Shift + Left mouse button - Select multiple objects
* Ctrl + Left mouse button and drag - Box select, select objects in area (if you are selecting a vast amount of objects at once it can be a good idea to de-select View->Tree Update Enabled so the procedure will be faster, but do remember to re-select it after, otherwise you won't be able to operate the object properties)

=== Tool selection ===
* 1 - Move tool
* 2 - Rotate tool
* 3 - Scale tool
* 4 - Area tool
* 6 - Scale specific side tool

=== Copying and pasting ===
* Ctrl + C - Copy selected object(s)
* Ctrl + X - Cut selected object(s)
* Ctrl + V - Paste copied object(s)
* Ctrl + Shift + V - Paste copied object(s) onto the same coordinates they were copied from
* To duplicate an object, hold Shift and move object from one of the arrows while having move tool selected
* You can copy & paste items between separate levels too

=== Undo and Redo ===
* Ctrl + Z - Undo
* Ctrl + Y - Redo

=== Other useful buttons ===
* Space bar - Toggle between Global, Local and Screenspace transform and rotation
* K - Allows you to see lights through collisions
* J - Makes the lights stay the same size no matter how far you are from them
* Ctrl + T replaces selected instance in the scene with the type selected in type tree
* L - Hides lights
* G - Hides lights and all objects that don't have the VisibleInGame on
* P - Selecting an instance within a scene and pressing P Locates selected instance in the type tree
* Ctrl + G - Hides grid
* Control + Left click on a layer hides it.

=== Editing objects ===
Click an object you want to edit in the level. Three arrow or circles should appear depending on what tool you have selected. Use these arrows/circles to move, rotate and scale the object on X, Y and Z axis.
'''Note: You can select objects only from currently selected layer. Change layer by clicking Def., Col., 1, 2... from the tool bar or with Alt + 9, 0, 1, 2, ...'''

[[File:layers.png]]

It's also possible to choose objects on any layer if you want to. Go to Selection -> Selection filter locking and untap the '''Allow selection on active layer only'''.
Just make sure that you keep objects on their dedicated layers if you decide to use this.

=== Editing object properties ===
To edit an object's properties you need to open up the '''Object Properties''' dockable window via '''View > Object Properties''' and then selecting the Object you want to Edit.

=== Adding objects ===
Objects can be added from Type tree window. You can open it from '''View > Type tree'''. Use the Search field to find the objects you are looking for. Most of the time objects you want to use are located under '''TypeRoot/InstanceBase/Entity'''. Also remember to deselect any selected objects in Type tree before searching again.

Finding the right object from the type tree can be quite tricky if you don't know the exact name of the object. A good way to start is to copy them from existing maps.

When inserting objects, you can press and hold Shift and/or Ctrl. Holding Shift attempts to snap the object next to another object, when you move the object above an object already on the scene. Holding Ctrl snaps the movement of the object to the grid.

=== Testing map in editor and saving ===
To test your changes in editor press green play button (F5) to start the level or blue play button (Ctrl+F5) to start from camera position.

To return to editor from play mode, press the blue stop button (Shift+F5).

[[File:play_buttons.png]]

=== Some tips about the type tree ===
TypeRoot -> InstanceBase -> Entity -> ObjectEntity -> object You will find all the objects here

TypeRoot -> InstanceBase -> Entity -> LightEntity You will find all the lights here

Finding items in type tree can be a little bit tricky at times as some tiny problems may occur. When you search for something that has multiple types under it they might not show for some reason.
For example if you search for RockCollisionHelper in the type tree it might only show the RockCollisionHelper instead of all it's variations like BookRockCollisionHelper etc. This can be fixed by either
searching again by typing the desired thing in the search bar or manually clicking the tree to find it.
Also after using one object and then trying to find another object in the type tree, make sure to check the object you used isn't active anymore. Otherwise the Search bar won't search anything.
You can just click anywhere in the empty part of the map to make sure you don't have any object active.

=== Other useful tips ===

Tools -> Options -> properties -> Order Properties In Property Grid to get properties in property window ordered alphabetically

Tools -> Options -> Tool -> Selection highlight self illumination enabled to get rid of the blue highlight when selecting objects

The collisions have VisibleInGame on in this map so that you can see them when you play. It's good to turn them of after you have addded art on them so that you can take a better look at the art. You can make the collisions invisible by choosing the collision, going into its properties and tapping VisibleInGame off from the ModelComponent.

== Lighting in editor ==
[[File:Trine3_lights.gif|thumb|A gif showing the effects of different types of lights on the scene.|480px]]
This page lists the most important LightEntities found in the editor and sheds some light (no pun intented) on their usage. There's a lot of general information about lighting in 3d games and related topics in the internet and elsewhere, so the interested reader is encouraged to do some independent searching for more in-depth discussion. Don't be discouraged by the large number of different properties that the LightEntities might have, most of them work with their default values.

What follows is a general overview of the different light entities you can find in the editor. In addition to general discussion, there are some examples of how each entity should be used.

=== AmbientLightEntity ===
Ambient lights are used in Trine 3 (and in games in general) to emulate the real world phenomenon of [https://en.wikipedia.org/wiki/Radiative_transfer radiative transfer] (energy transfer in the form of electromagnetic radiation, e.g. light). After photons are emitted, they are scattered, absorbed and re-emitted multiple times before finally reaching the viewer. This is one of the reasons why in nature there are no completely sharp or black shadows and that it's hard to find a completely dark place during daytime.

'''AmbientLightEntity''' is most often used as a global ambient light to set the base tone of the scene. If both color components are identical, they will create the effect of a uniformly lit scene. AmbientLightEntity can also be used as a directional light of sorts, if the Color2 component is a darker shade than Color1 component, as it is by default. This still mimics the behaviour of radiative transfer (absorption, emission, scattering), since AmbientLightEntity can't create shadows.

=== DirectionalLightEntity ===
[[File:Directional.png|thumb|DirectionalLightEntity causing an orthographic projection of shadows.]]
[[File:Directional_sunset_on_off.gif|thumb|A DirectionalLightEntity used in Pontius's tutorial for "sunset effect".]]
Directional lights are lights that emulate a light source that is infinitely wide and infinitely far, thus "emitting" light rays that are precisely parallel to each other. On Earth, direct sunlight can be approximated as parallel rays of light, and thus directional lights are used in Trine 3 to emulate sunlight and the sharp shadows caused by it. Another common use for directional lighting is a so-called skylight.

On an overcast day when no direct sunlight reaches the ground, objects are still clearly visible and lit. This is due to the light scattering from particles and water droplets in the atmosphere and reaching the ground through the clouds. The same phenomenon causes the sky to look blue during daylight and to be bright and colourful at all. If there was no atmosphere, there would be minimal scattering of light, resulting in a very dark sky and extremely harsh direct sunlight (among other, perhaps more lethal things), although the Sun would appear to be smaller in size. This is the physical phenomenon called [https://en.wikipedia.org/wiki/Diffuse_sky_radiation "skylight"], which is emulated in Trine 3 with a shadowless directional light that is perpendicular to the ground level, i.e. pointing straight down.

Although the effects of skylight and ambient light in the real world are based on the same physical principles (radiative transfer), in Trine 3 they aren't the same thing. Ambient light emulates the light that has already reached the ground and is just "bouncing back and forth" between different objects making everything look more or less the same from any viewing angle, whereas skylight is the diffuse light "coming straight down from the sky", making things look lighter and brighter from above rather than from below.

'''DirectionalLightEntity''' is a local directional light which uses an [http://db-in.com/images/projection_example.gif orthographic projection] instead of a perspective one. It's local in the sense that it's borders (field of view and range) can be chosen at will so that the light is projected only to a certain area. Most often DirectionalLightEntity is used as a local skylight for the background objects or to create other local but large-scale lighting conditions, like the appearance of a setting sun, as it was used in the beginning of Pontius's tutorial level.

'''SunDirectionalLightEntity''' is a global type of DirectionalLightEntity. It's range and field of view don't have any effect on it like they do on local directional lights. Like other directional lights SunDirectionalLightEntity casts orthographic shadows, but unlike any other light in the editor (except for AmbientLightEntity) it's position doesn't determine "where the light is coming from". The direction of the light can be changed only by rotating the SunDirectionalLightEntity, because it's thought to be infinitely far away.

=== PointLightEntity ===
[[File:Point.png|thumb|A PointLightEntity doesn't cause shadows.]]
[[File:Alpha_point.png|thumb|Fog and a PointLightEntity with RenderAlphaObjects.]]

Point lights are considered to be minuscule points that radiate isotropic light i.e. light that's the same in all directions. In the real world, only stars other than the Sun are considered point sources of light due to the great distance separating them from Earth. The closest thing to a point light on Earth is a light bulb without a lampshade. Since light bulbs without shades are a quite rare thing to see, point lights aren't a very authentic way to light a scene. The good thing is, they can be used together with other sources of light to create more natural lighting conditions. Point lights are also a very good way to highlight something and to make even small details easy to spot.

'''PointLightEntity''' is Trine 3's basic point light. It's color, intensity and range can be chosen to match the desired situation, whether it's large-scale orange-white light coming from bubbling lava or just a tiny speck of light coming from a glowing pink mushroom. PointLightEntity can also be used to cast light on only alpha objects, that is, objects like fog which don't have a solid frame.

PointLightEntity doesn't cast shadows at all and thus its light isn't blocked by any collisions or models. Be sure to take this into account, when you set the intensity and range of your point lights. Speaking of which, range and intensity can be tweaked with the '''scale tool''': When scaled from the middle of the scale tool's gizmo, both range and intensity are affected. When scaled on the green Y-axis, only intensity is affected, where as red x-axis affects range only. Blue line does nothing.

=== AmbientPointLightEntity ===
[[File:Ambient_point.png|thumb|An AmbientPointLightEntity is a local ambient light.]]
Ambient lights were discussed above and [[#AmbientLightEntity]] was said to be used as a global ambient light to set the tone of the scene. Like local directional lights, there are also local ambient lights. PointLightEntity can be used as a local ambient light by changing the property called '''AmbientFactor'''. When this is 0, the PointLightEntity works as a normal point light, but the closer it is to 1, the more it behaves like a local ambient light. This kind of local ambient light works in the same manner as global ambient lights, except it's range can be chosen at will.

=== PointLightEntity with RenderAlphaObjects ===
PointLightEntities can also be used to light alpha objects, like spiderwebs, fogs, clouds etc. In Trine 3 editor the '''RenderAlphaObjects''' property can be set to turn a PointLightEntity into an "AlphaBlendPointLightEntity".

It's noteworthy, that once '''RenderAlphaObjects''' is on, changing the '''Range''' property isn't anymore enough to change the actual range of the light, also the '''Radius''' property should be changed to the same value under PointLightComponent-->PointLightAreaComponent-->SphereAreaComponent->Radius. This only applies to manual editing of Range and Radius, if the scale tool is used to change the range of the point light, the radius is increased automatically.

=== SpotLightEntity ===
[[File:Spot.png|thumb|A SpotLightEntity and a perspective projection of shadows.]]
[[File:Shadow_quality_4.gif|thumb|SpotLightEntity shadows flickering on and off]]
Spot lights are like directional lights but the light projection is different. The light is projected in a cone and the shadow projection is perspective instead of ortographic. A flashlight is an example of a spot light. Spotlights are usually used in combination with point lights to create more realistic lighting conditions.

'''SpotLightEntity''' is the spot light of Trine 3. It shares many of the properties with DirectionalLightEntity (and SunDirectionalLightEntity), since DirectionalLightComponent is a child type of SpotLightComponent. A SpotLightEntity's range, color, intensity, fov and many other properties can be changed at will to reach the desired lighting conditions. SpotLightEntity has also a property called LinearFade. If it's false, the light attenuation of the spot light is more "natural" and fades faster. If set to true, the intensity of the spot light fades linearly, i.e. it's value decreases like 1.0/distance (instead of 1.0/distance squared).

SpotLightEntities have '''ShadowQuality''' set by default to ShadowQuality4. If there are more than four SpotLightEntities with ShadowQuality4 in view, the shadows will start flickering. The same applies to SpotLightEntities with lower ShadowQuality so that
* 4 x ShadowQuality1 = 1 x ShadowQuality2
* 4 x ShadowQuality2 = 1 x ShadowQuality3 and
* 4 x ShadowQuality3 = 1 x ShadowQuality4

All in all there can be a maximum number of 10 shadow casting SpotLightEntities in view at the same time.

<gallery>
File:Ambient_prop.png|AmbientLightComponent
File:Point_prop.png|PointLightComponent
File:Alpha_point_prop.png|Radius, Range and RenderSolid/AlphaObjects.
File:Spot_prop1.png|SpotLightComponent, DirectionalLightComponent and SunDirectionalLightComponent have the same properties, with slightly different settings.
File:Spot_prop2.png|SpotLightComponent cont.
</gallery>

=== ColorEffectEntity ===
[[File:Coloreffectentity.gif|thumb|Different ColorLookupTextures.]]
'''ColorEffectEntity''' is a scene wide effect that sets the tone of the scene. The '''Exposure''' property can be used to change the exposure of the whole scene, i.e. to make the scene globally darker or lighter. The '''ColorLookupTexture''' property can be used to choose a color look-up table from the ones created for the game in question. These can be found under \data\root\instance_base\entity\texture\color_lookup.

=== Bloom ===
[[File:Bloom_lens_flare.gif|thumb|Lens flare effect of bloom.]]
[[File:Bloom_effect_entity.png|thumb|BloomEntity]]

=== General ===
Bloom is a shader effect used in game engines to emulate imaging artifacts of real-world cameras, like [https://en.wikipedia.org/wiki/Lens_flare lens flare], [https://en.wikipedia.org/wiki/Dynamic_range#Photography finite dynamic range] and [https://en.wikipedia.org/wiki/Airy_disk airy discs] caused by the diffraction of light.

In game engines, bloom effect can be used to create a dream-like visual style or emphasize a magically glowing objects. With the right settings it can also enhance the photorealism of the scene by emulating the above mentioned effects.

=== BloomEntity in the editor ===

BloomEntity (BE) can be found from "InstanceBase/Entity/SceneEntity/BloomEntity". BE is a global effect and it has many properties in it's GlowComponent, but most of these don't need to be touched by the user. The two most important ones are:
* Factor
** Determines the weight of the particular BE, if there are more than one in the scene. Mostly used for animation purposes.
* StreakLength
** Setting this to 0 removes the lens flare effect, which is dependant on the relative direction of the BE.

=== Properties of glowing objects ===

Normal entities can be made to glow, like the collisions used in the pictures. Every entity with a ModelComponent has four properties that determine their behaviour with BE. These are:
* SelfIllumination
** The colour of the self illumination. Like the name says, used for objects that are supposed to be self illuminated, like sun, moon and lamps.
* SelfIlluminationFactor
** The strength of the self illumination. Example values used for different entities are 1000 for sun, 2 for moon and 15 for a bright lamp.
* GlowAmountColor
** The colour of the glow effect. Like self illumination, but this adds a soft halo around the object.
* GlowAmount
** The strength of the glow effect. Values usually around or less than 1.

Usually self illumination and glow are used together to achieve the best result.

<gallery>
File:self_ill.png|Self illumination.
File:Glow.png|Glow.
File:Combined.png|Self illumination and glow combined.
</gallery>

=== Additional Shadows ===
There are 3 kinds of shadows: '''fake_shadow_gradient.fbxmodel''', '''fake_shadow_gradient_radial.fbxmofel''' and '''fake_shadow_solid.fbxmodel'''. The solid one is used to block lights by placing the black area to point towards light source (the other side is invisible).
The other two are used to give walls etc some extra shading.

Some ground art pieces are kinda bumpy and there are times when they might look a little bit funny after lights have been added. This can be fixed by using ShadowBias that can be found on the object's properties and changing it to 0.1. Below will be examples and you can see how big the difference is.

<gallery>
File:Level_art_tutorial_withoutshadowbiasv2.png|Before adding ShadowBias
File:Level_art_tutorial_withshadowbiasv2.png|After adding ShadowBias
</gallery>

=== Fog ===
Fogs can be found in Typeroot -> InstanceBase -> Entity -> ObjectEntity -> object -> atmosphere-> fog

'''CircleFogAreaEntity''' and '''SquareFogAreaEntity''' are used to create atmospheric effects and distance fog. It can be found in the type tree under LightEntity. FogAreaEntities work similiarly to DirectionalLights. Use Scale tool to edit Range, Fov and intensity. In Properties under SpotLightComponent you can adjust Color of the fog and thickness. Change Linear overbrightness to make the fog more or less thick. 1 is really thick and -1 is completely transparent.

Level Art: The Level Art Phases

2021-11-23T14:30:56Z

Tero Tirkkonen:

{{:Level Art}} 

= The Level Art Phases =
'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

* The level art process in a nutshell:
** 1) Reference and Research
** 2) Preassembly
** 3) Base Art Blocking
** 4) Detailing
** 5) Polishing & Optimizing
** + Feedback. The level artist receives feedback during the whole level art process.

* Communication is important. Talk with AD, asset artists, other level artists and designers. These conversations should happen often; constant communication is needed throughout the whole level art process.
* Base art is the most important part of the level art process. If the base art is lacking, nothing works - no matter how many pretty details you stamp over it.
* The level art work is done iteratively, keeping the state of the art coherent throughout the whole level constantly. In other words, unfinished areas with bare collisions and areas with finished, detailed level art shouldn't co-exist within the same level.
* The whole level should stay as playable as possible at all times. If your art assets (even the temporary ones) result in hindering or preventing the level from being played, you shouldn't use them.

== Level Art Scheduling ==
* The time needed for the level art process is usually allocated as follows: The Base art takes 60%-70%, detailing 20%-30% and polishing 10%-20% of the time.
* Ideally, the time required to build a level from scratch to finish is roughly '''3 months (about 60 workdays)'''. It leaves enough time to commit the base art and polishes properly and tackle any surprise work that may emerge.
* If in a hurry, a level can be built as quickly as in '''2 months (about 40 workdays)'''. There's enough time to commit the base art and polishes adequately, but there's no room for errors or any surprises.
* There are multiple factors that can affect the level building duration, for example:
** The quality of the base art work (or any other art phase work, of course, but since the base art is the most important, fixing and fine-tuning it will take the longest)
** Changes in the level design schedules
** Sudden problems unrelated to the level artist/art team
** 3D assets missing/pending
** Changes in the gameplay design, requiring level art modifications
** Co-workers (designers, for example) needing to work on a level at a crucial time
** Sick leaves and personnel changes
** Unexpected and surprising issues

== Level Art Process Steps ==
# Before level art process starts: Familiarizing yourself with the '''references''' available and '''researching''' the topic
# Before level art process starts: '''level meetings''' with AD, 3D art lead and the level artists and designers that are/will be working on the level
# '''Preassembly''': No access to the actual map file yet, building the level art arrangements and asking for '''feedback from the AD'''
# '''Base art''': '''Preliminary lighting''' setup
# Base art: Blocking the level art, building a strong and working base that supports the gameplay, covering all the collisions - keeping it simple!
# Base art: '''Camera fix list''': adjusting the cameras to function as good as possible (considering both the gameplay and art), consulting designers
# Base art: '''AD's check''' and writing a fix list
# Base art: '''Fix list round''' where the base art is improved according to AD's feedback
# Base art: '''Lighting adjusting'''
# '''Detailing''': Adding details on the base art
# Detailing: '''AD's check''' and writing a fix list
# Detailing: '''Fix list round''' where the level art is improved according to AD's feedback
# '''Polish and optimizing''': Optimizing, adjusting lighting and fine-tuning level art until the time runs out. Multiple people can add more fix requests to the fix list when the content lock is approaching.

=== Example Art Schedule for One Level ===
* The timeframe for building levels is 65 workdays per level
* '''Some tasks can be done simultaneously''', including base art checks, camera fixes and lighting polishes. An example: Camera set-up can be pre-built for a different scene and then copied to the final level after the lighting polishes have been finished.
* You can keep editing the level during any AD's check since AD won't be saving anything.
* There are times when you can't access the level due to a co-worker editing it, but you can create a duplicate of the level and continue your work there. When the level file is available again, just copy and paste your work from the duplicate to the original level.
* When unable to access a certain level, you can also start working on another level.

* Colors explained:
** <span style="font-size:14px; color: #ea9b99"> '''Level artist'''</span> (Responsible of this level)
** <span style="font-size:14px; color: #a3d5a3"> '''Camera artist'''</span>
** <span style="font-size:14px; color: #d9b887"> '''Lighting artist'''</span> (Optional, there could be none or several level artists responsible of the lighting as a whole)
** <span style="font-size:14px; color: #bac0ec"> '''Art Director'''</span>

{| class="wikitable"
|-
! 20 days
! 2 days
! 4 days
! 20 days
! 3 days
! 10 days
! ?? days
! 5 days
! 1 day
! ?? days
|-

|-
|style="background-color:#feaeac"| Base art || || style="background-color:#ebc793"|Lighting polishing || style="background-color:#feaeac"| Base art fix and detailing || style="background-color:#ebc793"|Lighting polishing ||style="background-color:#feaeac"| Details fix || Wait for puzzle versions,<br>work on another level|| style="background-color:#feaeac"| Puzzle versions art || style="background-color:#feaeac"| Coop playtrough with level artists ||style="background-color:#feaeac"| Final polish
|-
| || ||style="background-color:#bef1be"|Camera fix|| || || || || || ||
|-
| ||style="background-color:#c9cfff"|Camera check||style="background-color:#c9cfff"|Base art check|| || style="background-color:#c9cfff"|Details check|| || || || ||style="background-color:#c9cfff"|Random checks
|-

|}

== Research and Reference ==
* All the developers need to work towards a common goal, and it's everyone's responsibility to keep that goal in mind.
* To help everyone to share the same vision and understand the project as a whole, there are tools available:
* When hopping aboard a new project, go through the reference materials to familiarize yourself with the overall vision, goals and tone of the project. Refer to these materials regularly during the project.
* If you're a level artist, study the basics of [[Public Level Art: Environmental Storytelling|Environmental Storytelling]].

=== Script ===
* Read the whole script at the beginning of the project.
* When beginning the level art process for a new level, go back to the script and read again the section describing that level.
* You should re-read (parts of) the script every now and then to make sure all the details and ideas are reflected in your level art.

=== Wiki and Concept Art ===
* When assigned to a new level, go through the wiki page for that level - and keep editing and reading the page during the level art work.

<gallery heights=350px mode="packed">
File:level_concept_examples_01.png|A level art wiki site contains all the concept art related to the level, maps, color and shape plans etc.
File:level_concept_examples_02.png|You want to study all the available materials carefully to get the big picture. After that, feel free to search for more reference images online.
</gallery>

== Preassembly ==
* Preassembly isn't usually scheduled, allowing the level artist to do it whenever there's time.
* Preassembly means working on the level art before you can access the actual collision-blocked map file with all the puzzles and design. The goal is to eliminate any idle waiting time.
* During the preassembly face, you should familiarize yourself with the level theme and assets without distractions.
* The most important preassembly work is creating a solid library of level art arrangements. Take your time and choose the arrangements that best suit the level: some assets in the library might be scrapped but most of them should end up in the final product.
* Use the preassembly time to try out your ideas. It's a perfect time to play around and experiment without paying any attention to the level geometry restrictions of the real level.
* You can quickly build rooms, backgrounds, focal point arrangements, gameplay platforms etc. without worrying where to place them exactly.
* Since preassembly creations are not integrated with the actual game collisions, it's much easier to edit them if something doesn't feel right.

=== How to Preassemble ===
* Gather a bunch of ideas by reading the script, familiarizing yourself with the level wiki site, browsing through the new level assets and possibly searching online reference images.
* With a head full of ideas, start building level art arrangements for the level. Begin with the necessary must-have objects needed in the level and create more as you go.
* While creating the preassembled arrangements, you'll probably start developing some kind of an idea concerning the structure of the level.
* Every level should have a focal point area in the beginning and in the end. Figuring out how those areas are executed is a great place to start.
* It's easiest to start with story areas described in the script, areas with existing concepts and/or areas you have a strong vision in mind for already.
* Be careful not to add too many details, as the detailing phase happens only after the preassembled arrangements are placed in the actual level map and the base art is satisfactory.
* Once you're happy with an arrangement, you can store it under the null (the null object in Editor) for easier handling.

=== Possible Pitfalls ===
* While it allows you to experiment freely with the level, there are some issues you may encounter during the preassembly phase:
* '''Incoherent and disjointed level flow''': The flow of the level needs to be coherent from the start to finish. Be careful when arranging separate pre-made blocks of art together and pay special attention to "in-between" transition areas. Keep the big picture in mind.
* '''Detached feel''': Copying the preassembled arrangements to an actual level may result in a feeling of not belonging. The pieces might look and feel like a separate backdrop floating behind the 2D game area (that's actually what they are, in fact, but they shouldn't feel like that). When adding your arrangements, integrate them seamlessly into the gameplay area.
* '''Under-optimization''': A seemingly small piece of extra geometry is multiplied rapidly when the arrangements are duplicated. To avoid repetition and clumsiness, optimize the use of your preassembled arrangements.
* '''Too many details''': The preassembly phase is followed by a base art phase. If the preassembled content is detailed and complex, it'll make the base art phase overly complicated and will slow the progress down.

<gallery heights=350px mode="packed">
File:level_art_preassembly_architecture_examples.jpg| Preassembled arrangements for the Trine 4 DLC Cornelius's Dream level
File:level_art_preassembly_organic_examples.jpg| Preassembled arrangements for the Trine 4 DLC Rudolfus's Dream level
</gallery>

== Base art ==
'''The first on the foremost purpose of level art is to support the gameplay and bring out the important game objects as well as possible.''' A visually pleasing game is an important goal on its own, but the level art must always submit to the gameplay. When the base art phase is over, there should be a fully playable level with both art and the gameplay functioning and complimenting each other.

'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

=== Cover and Match All the Collisions ===
* Once a designer is finished with a level, it's handed to a level artist. It's time for the base art phase.
* Base art phase is scheduled - it's important to fill the level with art as soon as possible.
* During the base art round, art elements are added to a level for the first time. Everything is built on top of the base art, so it's very important to get it right.
* Base art phase includes '''covering all the visible collisions'''.
** Note: If you match the collision areas and art carefully during the base at phase, it'll save a lot of time and the need to fix them later.
** Go through all the areas the player can interact with and check the collisions - remember not to consider only the characters but also the wizard's levitating objects.
** Pay attention to smaller things as well, like floating rope targets. The aim is to cover and support all gameplay elements with art so that the game can be played and enjoyed after the base art phase.
** Go through the level from start to finish. Play the level yourself with a character and make sure the collisions work as intended (AKA characters aren't floating or walking inside assets and characters or levitation objects won't get stuck on invisible collisions).

=== Focus on the Big Picture ===
* During the phase art base, '''do not add small details'''. If the base geometry goes through changes and level art needs to be altered, additional art details slow down the process a lot: checking the level, doing paint-overs and fixing the base level art is really difficult if there are a lot of details.
* After the art blocking phase '''the level should look and feel "complete", serving as a solid base to add things later on.'''
* Even if you must work with placeholder 3D assets, try to match the '''proportions''' from the start.
* Don't spend too much time creating intricate, highly detailed placeholder areas. Rather use temporary structures, instead, or, if you must, leave the area empty while waiting for assets.
* Divide your work into steps, to avoid spending all your time on a single finalized scene and neglecting other areas. Focus on '''a single run throughout the whole level'''.
* A safe place to start are the walls, ground, floor and other environmental elements making up the big objects.
* '''The backgrounds''' are an important part of the base art. They play a huge role in creating the big shapes and the visual flow.
* When working with outside locations, don't forget the sky - or you're missing out on a big part of the screen. Remember to add the clouds and weather elements etc. They are a very important part of the level's general flow.

<gallery heights=400px mode="packed">
File:base_art_and_detail_art_01.jpg| A great example of the base art done right: A simple setting, providing a great base to build on and add details. Also easy to modify, if needed.
File:base_art_and_detail_art_02.jpg| The base art looks good, though the door collision is yet uncovered. Allowing the unique gameplay asset (the snowball instructions in the background) collisions to go untouched is ok in this scene, as they will be replaced with new assets later.
File:base_art_and_detail_art_03.jpg| A good base art is simple enough - when the whole set could be changed, one shouldn't waste too much time with the base art.
File:base_art_and_detail_art_04.jpg| The base art is too detailed here - if there are any changes to the level geometry, a lot of work has been done in vain.
</gallery>

=== Basic art principles are present from the start ===
* [[Level Art: Composition]] The composition and flow guide the player through the level. Tip: Select the right materials for the shapes, and never use assets scaled too large, unless you can hide them well.
* [[Level Art: Color and Lighting]] Color and lighting can be used to guide the player as well. Tip: Use the values and contrasts so that the important things pop out and unimportant things blend in. Invite the player towards their intended path with lights and use darker tones for those parts of the screen the player is not supposed to stumble into.

=== Don't Let the Collisions Restrict You When it's Not Necessary ===
* The collisions are implemented by level designers - while they pay attention to art details as well, their job is designing the game, not making art.
* Never edit the collisions or gameplay objects without consulting the designers first - but don't be afraid to ask about the matter. Have a conversation with the designer about the changes you wish to make, and if they agree, proceed.
* The gameplay area is a narrow 2D plane, the width of it being only about 2 metres. The collision rules, for example, are applied only inside those two-meter borders. Your job is to blend the gameplay area into the surrounding 3D scene and to make it a believable part of the world (as opposed to an artificial, detached lane).
* As long as your foreground or background items don't distract the player from the important gameplay things, feel free to experiment and go wild.
* It's not necessary for the background and foreground areas surrounding the gameplay area to follow the general shape of it. On the contrary, they should be used to create depth and hide the fact that the actual game happens in a narrow, straight line.

=== Requesting New Pieces to 3D Asset Sets ===
* Level artist uses the 3D asset sets created by 3D artists to build levels - and figure out simultaneously how the various asset pieces work.
* Don't hesitate to give feedback to 3D artists and/or request art from them. Both you and the 3D artist benefit when useful and visually satisfying asset sets are created.
* The 3D artists create the assets and don't really build levels with them. To make full use of all assets and connect them together, it's likely you'll need to ask for more parts.
* If you need more asset pieces created, compile a list of your needs during the base art base and deliver it to the 3D art lead.
* For example, you might ask for more differently sized pieces to a wall set, if [[Public Level_Art:_Composition#Problems_created_by_scaling_3D_models_too_much|scaling the size of the old ones up]] or [[Public Level_Art:_Composition#Non-uniform_scaling|non-uniformly]] will result in the visual quality suffering.
** Note: It's fine to use the too-much-up-scaled or non-uniformly-scaled versions of the pieces for the first version of your base art. Request the new 3D pieces by the end of the base art phase and replace the old assets with new ones later.
** Tip: If possible, it's better to gather a list detailing all your needs than to ask for a new 3D set piece every day.
** Tip: When building temporary structures from currently available assets, write down their measurements and describe the shape that you want the new assets to be. Pass your notes along with your asset order list to the 3D artist who can use them as a reference.

=== Prioritize the focal point areas ===
* Start with the focal point areas (beginning, ending, story areas, special art areas etc.) and plan the rest of the base art around those scenes.
* The level start and end areas are usually focal point areas, as we want the first and last thing the players see to look extra nice.
* Not every single frame can be a focal point one, but there should be more general areas between instead. By alternating the various scene types it's easier to avoid player exhaustion, create rhythm and emphasize the special areas.
* Since the game project is on the clock, it's best to schedule and plan carefully before the actual work.
* 2D angled games (like Trine) face issues with matching the organic art to the straight collisions. To avoid that, you might feel tempted to create natural rock formations with perfectly straight 90-degree angles. Try keeping the rock formation as natural as possible, instead, while strictly following the gameplay collision areas and rules (the foreground and background area are not tied by the gameplay area rules). If a straight/90-degree surface must be included, you can use man-made constructions (brick, wood) rather than pursuing the "natural" rock look.

==== Focal points ====
* Focal points are very delicately planned and beautifully built areas inside the level.
* They can be impressive and unique hero assets or just small asset arrangements built out of ordinary assets (nicely composed and made look perfect for the specific camera angle).
* Most of the level should consist of the "basic environment"; focal points are located here and there to spike interest.
* You can also use carefully crafted small lighting scenarios as points of interest, like a warm ray of light emerging from a hole in the cave wall, illuminating some mushrooms/rocks/etc.
* In Trine games you should place the focal points between the puzzle areas. Scenes containing puzzles should be clear of any distractions, allowing the players to fully focus on solving the puzzle.
** The puzzle areas shouldn't look boring, either, but it's a good practice to build the various areas of the level to highlight their function.
* If there's not enough space for an important focal point area in the game, talk to the designer. Usually, they are willing to add the needed space to the level.
* Reference images are especially important when building focal point areas, so study and search for new images!
* Even if two levels share a theme, each level should have a unique feeling of its own.
* There should be something special and visually memorable in each level: A point that evokes feelings and makes the level remarkable. For example, a shark swimming by, a unique geological formation or the oldest classic - a breathtaking scenery point.

<gallery heights=200px mode="packed">
File:Trine 4 screenshot 17 1080p.png| A striking focal point features a unique wizard face sculpture asset specifically made for this spot.
File:Trine 4 screenshot 44 1080p.png| The dragon skull on the background, its strong silhouette against the sky, is an eye-catcher and a remarkable focal point.
File:Trine 4 screenshot 38 1080p.png| The statue on the left is highlighted with golden "god rays". The cave is full of angular forms, making the statue stand out.
File:Trine 4 screenshot 43 1080p.png| The bear statue adds a mysterious focal point to the more traditional forest scenery.
File:Trine 4 screenshot 40 1080p.png| Frozen dragon skeleton is framed with the diagonal "god rays" from the top and diagonal icicles from the bottom.
File:Trine 4 screenshot 25.png| The fiery planet draws eyes towards it. The shiny celestial body is surrounded by curved shapes emphasizing it even more.
File:Trine 4 toby's dream screenshot 02.png| The curved branch silhouette is a simple, yet effective focal point. The flow of the scene supports it nicely.

</gallery>

== Detailing ==
* When the detailing phase is reached, it's a race against the clock to get all the levels finished on time, thus making the detailing phase a tightly scheduled one.
* The level is already filled with functioning and pleasing visuals. Details are added for plausibility reasons, and to pique visual curiosity, to create depth and to add to the level's visual charm.
* The level base is optimized during the detailing phase to make sure there isn't any excess geometry left.
* Pay attention to the consistency of your art in a single level and of the whole game: there shouldn't be some areas filled with details while some are completely empty.
* Always iterate gradually. It's tempting to fill one area from top to the bottom with detailed and finished art - and then move on to the next one, but you might end up running out of time and ruining the coherent feel of the level.
* [[Public Level Art: Environmental Storytelling|Environmental storytelling]] should guide your work while detailing.
* The level design might change during the detailing phase, forcing you to consider and adjust your level art accordingly.
* When the detailing phase is over, each level of the game should be "good enough". The sooner the levels reach that state, the better.
* In theory, once the detailing phase ends, each level should be ready to ship (if, for some imaginary reason, there were no time or resources for any polishing). That means art is coherent and of good quality, supporting the gameplay. There shouldn't be any major visual issues. In reality, the Trine levels are always polished and fine-tuned.

== Polishing ==
* Usually not a scheduled phase, as the levels entering this stage have reached the "good enough" standard mentioned earlier.
* The remaining time (until the content lock day) is spent fine-tuning everything as much as possible.
* Polishing is done last to ensure the overall quality of all levels. Each level should reach the "good enough" state before any polishing on any level happens.
** Note: If you have gaps in your schedule during the earlier level art phases (while waiting for access to a certain level, for example) it's ok to do some polishing work as well.
* The Trine game levels are polished until the last possible moment, and none of the levels is considered "final" until the game launch day.
* Even when polishing you need to consider the general art quality and aim for coherence throughout the game: some levels can't look more polished than the others.
* New 3D assets might appear during the later stages of the project, and they are distributed evenly among the levels.
* Polishing phase entails minor detail fixes and also bigger base art level fixes. The development is a constant flux: some brilliant ideas come up late and some previously functioning concepts are abandoned during the later phases.
* While it's not recommended to implement any radical changes during the polishing phase, don't be afraid to speak up (no matter how close the deadline is), especially if your idea would elevate the quality of the whole level.

=== Polishing a Level Originally Created by Another Artist ===

* Polishing can be done by any of the level artists, no matter who originally created the base art and detailed art.
* It's beneficial for all the level artists to work on all the levels. That helps to keep the levels fresh and coherent and ensures the full potential of the art team is used.
* Nevertheless, some things should be considered when polishing a level made by another level artist:
** The artist responsible for a level's base/detail art might feel some degree of mental ownership of the level. Every other artist is encouraged, however, to suggest their ideas and execute changes. Nobody owns the level or the level art.
**However, the original artist has the best understanding of the level, granting them the chance to participate in the process and to voice their opinions and thoughts.
**The AD has the final say on which art version will be used, but they base their decisions on listening and reasoning, making sure each team member gets their voice heard. While the AD has the best grasp of levels as a whole, the level artist knows their level best.

* '''First, discuss with your AD and the original level artist'''
** Get a permission to start with the polishing work from your team lead.
** If you plan on executing radical changes, talk with the artist responsible for the base and detail art.
** The level might feature, for example, story-related elements that affect the level art. The original level artist can brief you about special details.
** Tip: Before making any changes, read the level art wiki site to understand the level.

* '''Smaller detail polish directly to the level, bigger base art polish to a copy of the level'''
** When you polish smaller details, not tampering with the base art radically, save your work to the actual level.
** When planning to make big changes, try them out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Keep the level of details coherent'''
** After reaching the "good enough" state, level art shouldn't revert back to any of the previous art stages even temporarily.
** When planning to make big changes or stripping a part of the level bare of the detailed level art, try the changes out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Before & after screenshots'''
* Take before/after screenshots of the changes
** If the changes are small, use the actual level
** With bigger changes, use a copy of the actual level
* Take screenshots before and after using the same camera positions.
* You need to be able to pinpoint the location and the exact nature of the changes.
*Tip: You can always return to the original version of the level to take the screenshots.

* '''Feedback'''
** When making larger changes: Show the changes made to the (copy of) level and the before/after screenshots to your AD and the original level artist. Discuss with them about the changes.
** When making smaller changes: Show the before/after screenshots to your AD to receive feedback, and fix the level art accordingly.

* '''Replacing old with new'''
** If the changes are approved by the AD, they can be commited to the actual level.

Level Art: The Level Art Phases

2021-11-23T14:30:31Z

Tero Tirkkonen: /* Basic art principles are present from the start */

{{:Level Art}} 

= The Level Art Phases =
'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

* The level art process in a nutshell:
** 1) Reference and Research
** 2) Preassembly
** 3) Base Art Blocking
** 4) Detailing
** 5) Polishing & Optimizing
** + Feedback. The level artist receives feedback during the whole level art process.

* Communication is important. Talk with AD, asset artists, other level artists and designers. These conversations should happen often; constant communication is needed throughout the whole level art process.
* Base art is the most important part of the level art process. If the base art is lacking, nothing works - no matter how many pretty details you stamp over it.
* The level art work is done iteratively, keeping the state of the art coherent throughout the whole level constantly. In other words, unfinished areas with bare collisions and areas with finished, detailed level art shouldn't co-exist within the same level.
* The whole level should stay as playable as possible at all times. If your art assets (even the temporary ones) result in hindering or preventing the level from being played, you shouldn't use them.

== Level Art Scheduling ==
* The time needed for the level art process is usually allocated as follows: The Base art takes 60%-70%, detailing 20%-30% and polishing 10%-20% of the time.
* Ideally, the time required to build a level from scratch to finish is roughly '''3 months (about 60 workdays)'''. It leaves enough time to commit the base art and polishes properly and tackle any surprise work that may emerge.
* If in a hurry, a level can be built as quickly as in '''2 months (about 40 workdays)'''. There's enough time to commit the base art and polishes adequately, but there's no room for errors or any surprises.
* There are multiple factors that can affect the level building duration, for example:
** The quality of the base art work (or any other art phase work, of course, but since the base art is the most important, fixing and fine-tuning it will take the longest)
** Changes in the level design schedules
** Sudden problems unrelated to the level artist/art team
** 3D assets missing/pending
** Changes in the gameplay design, requiring level art modifications
** Co-workers (designers, for example) needing to work on a level at a crucial time
** Sick leaves and personnel changes
** Unexpected and surprising issues

== Level Art Process Steps ==
# Before level art process starts: Familiarizing yourself with the '''references''' available and '''researching''' the topic
# Before level art process starts: '''level meetings''' with AD, 3D art lead and the level artists and designers that are/will be working on the level
# '''Preassembly''': No access to the actual map file yet, building the level art arrangements and asking for '''feedback from the AD'''
# '''Base art''': '''Preliminary lighting''' setup
# Base art: Blocking the level art, building a strong and working base that supports the gameplay, covering all the collisions - keeping it simple!
# Base art: '''Camera fix list''': adjusting the cameras to function as good as possible (considering both the gameplay and art), consulting designers
# Base art: '''AD's check''' and writing a fix list
# Base art: '''Fix list round''' where the base art is improved according to AD's feedback
# Base art: '''Lighting adjusting'''
# '''Detailing''': Adding details on the base art
# Detailing: '''AD's check''' and writing a fix list
# Detailing: '''Fix list round''' where the level art is improved according to AD's feedback
# '''Polish and optimizing''': Optimizing, adjusting lighting and fine-tuning level art until the time runs out. Multiple people can add more fix requests to the fix list when the content lock is approaching.

=== Example Art Schedule for One Level ===
* The timeframe for building levels is 65 workdays per level
* '''Some tasks can be done simultaneously''', including base art checks, camera fixes and lighting polishes. An example: Camera set-up can be pre-built for a different scene and then copied to the final level after the lighting polishes have been finished.
* You can keep editing the level during any AD's check since AD won't be saving anything.
* There are times when you can't access the level due to a co-worker editing it, but you can create a duplicate of the level and continue your work there. When the level file is available again, just copy and paste your work from the duplicate to the original level.
* When unable to access a certain level, you can also start working on another level.

* Colors explained:
** <span style="font-size:14px; color: #ea9b99"> '''Level artist'''</span> (Responsible of this level)
** <span style="font-size:14px; color: #a3d5a3"> '''Camera artist'''</span>
** <span style="font-size:14px; color: #d9b887"> '''Lighting artist'''</span> (Optional, there could be none or several level artists responsible of the lighting as a whole)
** <span style="font-size:14px; color: #bac0ec"> '''Art Director'''</span>

{| class="wikitable"
|-
! 20 days
! 2 days
! 4 days
! 20 days
! 3 days
! 10 days
! ?? days
! 5 days
! 1 day
! ?? days
|-

|-
|style="background-color:#feaeac"| Base art || || style="background-color:#ebc793"|Lighting polishing || style="background-color:#feaeac"| Base art fix and detailing || style="background-color:#ebc793"|Lighting polishing ||style="background-color:#feaeac"| Details fix || Wait for puzzle versions,<br>work on another level|| style="background-color:#feaeac"| Puzzle versions art || style="background-color:#feaeac"| Coop playtrough with level artists ||style="background-color:#feaeac"| Final polish
|-
| || ||style="background-color:#bef1be"|Camera fix|| || || || || || ||
|-
| ||style="background-color:#c9cfff"|Camera check||style="background-color:#c9cfff"|Base art check|| || style="background-color:#c9cfff"|Details check|| || || || ||style="background-color:#c9cfff"|Random checks
|-

|}

== Research and Reference ==
* All the developers need to work towards a common goal, and it's everyone's responsibility to keep that goal in mind.
* To help everyone to share the same vision and understand the project as a whole, there are tools available:
* When hopping aboard a new project, go through the reference materials to familiarize yourself with the overall vision, goals and tone of the project. Refer to these materials regularly during the project.
* If you're a level artist, study the basics of [[Public Level Art: Environmental Storytelling|Environmental Storytelling]].

=== Script ===
* Read the whole script at the beginning of the project.
* When beginning the level art process for a new level, go back to the script and read again the section describing that level.
* You should re-read (parts of) the script every now and then to make sure all the details and ideas are reflected in your level art.

=== Wiki and Concept Art ===
* When assigned to a new level, go through the wiki page for that level - and keep editing and reading the page during the level art work.

<gallery heights=350px mode="packed">
File:level_concept_examples_01.png|A level art wiki site contains all the concept art related to the level, maps, color and shape plans etc.
File:level_concept_examples_02.png|You want to study all the available materials carefully to get the big picture. After that, feel free to search for more reference images online.
</gallery>

== Preassembly ==
* Preassembly isn't usually scheduled, allowing the level artist to do it whenever there's time.
* Preassembly means working on the level art before you can access the actual collision-blocked map file with all the puzzles and design. The goal is to eliminate any idle waiting time.
* During the preassembly face, you should familiarize yourself with the level theme and assets without distractions.
* The most important preassembly work is creating a solid library of level art arrangements. Take your time and choose the arrangements that best suit the level: some assets in the library might be scrapped but most of them should end up in the final product.
* Use the preassembly time to try out your ideas. It's a perfect time to play around and experiment without paying any attention to the level geometry restrictions of the real level.
* You can quickly build rooms, backgrounds, focal point arrangements, gameplay platforms etc. without worrying where to place them exactly.
* Since preassembly creations are not integrated with the actual game collisions, it's much easier to edit them if something doesn't feel right.

=== How to Preassemble ===
* Gather a bunch of ideas by reading the script, familiarizing yourself with the level wiki site, browsing through the new level assets and possibly searching online reference images.
* With a head full of ideas, start building level art arrangements for the level. Begin with the necessary must-have objects needed in the level and create more as you go.
* While creating the preassembled arrangements, you'll probably start developing some kind of an idea concerning the structure of the level.
* Every level should have a focal point area in the beginning and in the end. Figuring out how those areas are executed is a great place to start.
* It's easiest to start with story areas described in the script, areas with existing concepts and/or areas you have a strong vision in mind for already.
* Be careful not to add too many details, as the detailing phase happens only after the preassembled arrangements are placed in the actual level map and the base art is satisfactory.
* Once you're happy with an arrangement, you can store it under the null (the null object in Editor) for easier handling.

=== Possible Pitfalls ===
* While it allows you to experiment freely with the level, there are some issues you may encounter during the preassembly phase:
* '''Incoherent and disjointed level flow''': The flow of the level needs to be coherent from the start to finish. Be careful when arranging separate pre-made blocks of art together and pay special attention to "in-between" transition areas. Keep the big picture in mind.
* '''Detached feel''': Copying the preassembled arrangements to an actual level may result in a feeling of not belonging. The pieces might look and feel like a separate backdrop floating behind the 2D game area (that's actually what they are, in fact, but they shouldn't feel like that). When adding your arrangements, integrate them seamlessly into the gameplay area.
* '''Under-optimization''': A seemingly small piece of extra geometry is multiplied rapidly when the arrangements are duplicated. To avoid repetition and clumsiness, optimize the use of your preassembled arrangements.
* '''Too many details''': The preassembly phase is followed by a base art phase. If the preassembled content is detailed and complex, it'll make the base art phase overly complicated and will slow the progress down.

<gallery heights=350px mode="packed">
File:level_art_preassembly_architecture_examples.jpg| Preassembled arrangements for the Trine 4 DLC Cornelius's Dream level
File:level_art_preassembly_organic_examples.jpg| Preassembled arrangements for the Trine 4 DLC Rudolfus's Dream level
</gallery>

== Base art ==
'''The first on the foremost purpose of level art is to support the gameplay and bring out the important game objects as well as possible.''' A visually pleasing game is an important goal on its own, but the level art must always submit to the gameplay. When the base art phase is over, there should be a fully playable level with both art and the gameplay functioning and complimenting each other.

'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

=== Cover and Match All the Collisions ===
* Once a designer is finished with a level, it's handed to a level artist. It's time for the base art phase.
* Base art phase is scheduled - it's important to fill the level with art as soon as possible.
* During the base art round, art elements are added to a level for the first time. Everything is built on top of the base art, so it's very important to get it right.
* Base art phase includes '''covering all the visible collisions'''.
** Note: If you match the collision areas and art carefully during the base at phase, it'll save a lot of time and the need to fix them later.
** Go through all the areas the player can interact with and check the collisions - remember not to consider only the characters but also the wizard's levitating objects.
** Pay attention to smaller things as well, like floating rope targets. The aim is to cover and support all gameplay elements with art so that the game can be played and enjoyed after the base art phase.
** Go through the level from start to finish. Play the level yourself with a character and make sure the collisions work as intended (AKA characters aren't floating or walking inside assets and characters or levitation objects won't get stuck on invisible collisions).

=== Focus on the Big Picture ===
* During the phase art base, '''do not add small details'''. If the base geometry goes through changes and level art needs to be altered, additional art details slow down the process a lot: checking the level, doing paint-overs and fixing the base level art is really difficult if there are a lot of details.
* After the art blocking phase '''the level should look and feel "complete", serving as a solid base to add things later on.'''
* Even if you must work with placeholder 3D assets, try to match the '''proportions''' from the start.
* Don't spend too much time creating intricate, highly detailed placeholder areas. Rather use temporary structures, instead, or, if you must, leave the area empty while waiting for assets.
* Divide your work into steps, to avoid spending all your time on a single finalized scene and neglecting other areas. Focus on '''a single run throughout the whole level'''.
* A safe place to start are the walls, ground, floor and other environmental elements making up the big objects.
* '''The backgrounds''' are an important part of the base art. They play a huge role in creating the big shapes and the visual flow.
* When working with outside locations, don't forget the sky - or you're missing out on a big part of the screen. Remember to add the clouds and weather elements etc. They are a very important part of the level's general flow.

<gallery heights=400px mode="packed">
File:base_art_and_detail_art_01.jpg| A great example of the base art done right: A simple setting, providing a great base to build on and add details. Also easy to modify, if needed.
File:base_art_and_detail_art_02.jpg| The base art looks good, though the door collision is yet uncovered. Allowing the unique gameplay asset (the snowball instructions in the background) collisions to go untouched is ok in this scene, as they will be replaced with new assets later.
File:base_art_and_detail_art_03.jpg| A good base art is simple enough - when the whole set could be changed, one shouldn't waste too much time with the base art.
File:base_art_and_detail_art_04.jpg| The base art is too detailed here - if there are any changes to the level geometry, a lot of work has been done in vain.
</gallery>

=== Basic art principles are present from the start ===
* [[Level Art: Composition]] The composition and flow guide the player through the level. Tip: Select the right materials for the shapes, and never use assets scaled too large, unless you can hide them well.
* [[Level Art: Color and Lighting]] Color and lighting can be used to guide the player as well. Tip: Use the values and contrasts so that the important things pop out and unimportant things blend in. Invite the player towards their intended path with lights and use darker tones for those parts of the screen the player is not supposed to stumble into.

=== Don't Let the Collisions Restrict You When it's Not Necessary ===
* The collisions are implemented by level designers - while they pay attention to art details as well, their job is designing the game, not making art.
* Never edit the collisions or gameplay objects without consulting the designers first - but don't be afraid to ask about the matter. Have a conversation with the designer about the changes you wish to make, and if they agree, proceed.
* The gameplay area is a narrow 2D plane, the width of it being only about 2 metres. The collision rules, for example, are applied only inside those two-meter borders. Your job is to blend the gameplay area into the surrounding 3D scene and to make it a believable part of the world (as opposed to an artificial, detached lane).
* As long as your foreground or background items don't distract the player from the important gameplay things, feel free to experiment and go wild.
* It's not necessary for the background and foreground areas surrounding the gameplay area to follow the general shape of it. On the contrary, they should be used to create depth and hide the fact that the actual game happens in a narrow, straight line.

=== Requesting New Pieces to 3D Asset Sets ===
* Level artist uses the 3D asset sets created by 3D artists to build levels - and figure out simultaneously how the various asset pieces work.
* Don't hesitate to give feedback to 3D artists and/or request art from them. Both you and the 3D artist benefit when useful and visually satisfying asset sets are created.
* The 3D artists create the assets and don't really build levels with them. To make full use of all assets and connect them together, it's likely you'll need to ask for more parts.
* If you need more asset pieces created, compile a list of your needs during the base art base and deliver it to the 3D art lead.
* For example, you might ask for more differently sized pieces to a wall set, if [[Public Level_Art:_Composition#Problems_created_by_scaling_3D_models_too_much|scaling the size of the old ones up]] or [[Public Level_Art:_Composition#Non-uniform_scaling|non-uniformly]] will result in the visual quality suffering.
** Note: It's fine to use the too-much-up-scaled or non-uniformly-scaled versions of the pieces for the first version of your base art. Request the new 3D pieces by the end of the base art phase and replace the old assets with new ones later.
** Tip: If possible, it's better to gather a list detailing all your needs than to ask for a new 3D set piece every day.
** Tip: When building temporary structures from currently available assets, write down their measurements and describe the shape that you want the new assets to be. Pass your notes along with your asset order list to the 3D artist who can use them as a reference.

=== Prioritize the focal point areas ===
* Start with the focal point areas (beginning, ending, story areas, special art areas etc.) and plan the rest of the base art around those scenes.
* The level start and end areas are usually focal point areas, as we want the first and last thing the players see to look extra nice.
* Not every single frame can be a focal point one, but there should be more general areas between instead. By alternating the various scene types it's easier to avoid player exhaustion, create rhythm and emphasize the special areas.
* Since the game project is on the clock, it's best to schedule and plan carefully before the actual work.
* 2D angled games (like Trine) face issues with matching the organic art to the straight collisions. To avoid that, you might feel tempted to create natural rock formations with perfectly straight 90-degree angles. Try keeping the rock formation as natural as possible, instead, while strictly following the gameplay collision areas and rules (the foreground and background area are not tied by the gameplay area rules). If a straight/90-degree surface must be included, you can use man-made constructions (brick, wood) rather than pursuing the "natural" rock look.

==== Focal points ====
* Focal points are very delicately planned and beautifully built areas inside the level.
* They can be impressive and unique hero assets or just small asset arrangements built out of ordinary assets (nicely composed and made look perfect for the specific camera angle).
* Most of the level should consist of the "basic environment"; focal points are located here and there to spike interest.
* You can also use carefully crafted small lighting scenarios as points of interest, like a warm ray of light emerging from a hole in the cave wall, illuminating some mushrooms/rocks/etc.
* In Trine games you should place the focal points between the puzzle areas. Scenes containing puzzles should be clear of any distractions, allowing the players to fully focus on solving the puzzle.
** The puzzle areas shouldn't look boring, either, but it's a good practice to build the various areas of the level to highlight their function.
* If there's not enough space for an important focal point area in the game, talk to the designer. Usually, they are willing to add the needed space to the level.
* Reference images are especially important when building focal point areas, so study and search for new images!
* Even if two levels share a theme, each level should have a unique feeling of its own.
* There should be something special and visually memorable in each level: A point that evokes feelings and makes the level remarkable. For example, a shark swimming by, a unique geological formation or the oldest classic - a breathtaking scenery point.

<gallery heights=200px mode="packed">
File:Trine 4 screenshot 17 1080p.png| A striking focal point features a unique wizard face sculpture asset specifically made for this spot.
File:Trine 4 screenshot 44 1080p.png| The dragon skull on the background, its strong silhouette against the sky, is an eye-catcher and a remarkable focal point.
File:Trine 4 screenshot 38 1080p.png| The statue on the left is highlighted with golden "god rays". The cave is full of angular forms, making the statue stand out.
File:Trine 4 screenshot 43 1080p.png| The bear statue adds a mysterious focal point to the more traditional forest scenery.
File:Trine 4 screenshot 40 1080p.png| Frozen dragon skeleton is framed with the diagonal "god rays" from the top and diagonal icicles from the bottom.
File:Trine 4 screenshot 25.png| The fiery planet draws eyes towards it. The shiny celestial body is surrounded by curved shapes emphasizing it even more.
File:Trine 4 toby's dream screenshot 02.png| The curved branch silhouette is a simple, yet effective focal point. The flow of the scene supports it nicely.

</gallery>

== Detailing ==
* When the detailing phase is reached, it's a race against the clock to get all the levels finished on time, thus making the detailing phase a tightly scheduled one.
* The level is already filled with functioning and pleasing visuals. Details are added for plausibility reasons, and to pique visual curiosity, to create depth and to add to the level's visual charm.
* The level base is optimized during the detailing phase to make sure there isn't any excess geometry left.
* Pay attention to the consistency of your art in a single level and of the whole game: there shouldn't be some areas filled with details while some are completely empty.
* Always iterate gradually. It's tempting to fill one area from top to the bottom with detailed and finished art - and then move on to the next one, but you might end up running out of time and ruining the coherent feel of the level.
* [[Public Level Art: Environmental Storytelling|Environmental storytelling]] should guide your work while detailing.
* The level design might change during the detailing phase, forcing you to consider and adjust your level art accordingly.
* When the detailing phase is over, each level of the game should be "good enough". The sooner the levels reach that state, the better.
* In theory, once the detailing phase ends, each level should be ready to ship (if, for some imaginary reason, there were no time or resources for any polishing). That means art is coherent and of good quality, supporting the gameplay. There shouldn't be any major visual issues. In reality, the Trine levels are always polished and fine-tuned.

== Polishing ==
* Usually not a scheduled phase, as the levels entering this stage have reached the "good enough" standard mentioned earlier.
* The remaining time (until the content lock day) is spent fine-tuning everything as much as possible.
* Polishing is done last to ensure the overall quality of all levels. Each level should reach the "good enough" state before any polishing on any level happens.
** Note: If you have gaps in your schedule during the earlier level art phases (while waiting for access to a certain level, for example) it's ok to do some polishing work as well.
* The Trine game levels are polished until the last possible moment, and none of the levels is considered "final" until the game launch day.
* Even when polishing you need to consider the general art quality and aim for coherence throughout the game: some levels can't look more polished than the others.
* New 3D assets might appear during the later stages of the project, and they are distributed evenly among the levels.
* Polishing phase entails minor detail fixes and also bigger base art level fixes. The development is a constant flux: some brilliant ideas come up late and some previously functioning concepts are abandoned during the later phases.
* While it's not recommended to implement any radical changes during the polishing phase, don't be afraid to speak up (no matter how close the deadline is), especially if your idea would elevate the quality of the whole level.

=== Polishing a Level Originally Created by Another Artist ===

* Polishing can be done by any of the level artists, no matter who originally created the base art and detailed art.
* It's beneficial for all the level artists to work on all the levels. That helps to keep the levels fresh and coherent and ensures the full potential of the art team is used.
* Nevertheless, some things should be considered when polishing a level made by another level artist:
** The artist responsible for a level's base/detail art might feel some degree of mental ownership of the level. Every other artist is encouraged, however, to suggest their ideas and execute changes. Nobody owns the level or the level art.
**However, the original artist has the best understanding of the level, granting them the chance to participate in the process and to voice their opinions and thoughts.
**The AD has the final say on which art version will be used, but they base their decisions on listening and reasoning, making sure each team member gets their voice heard. While the AD has the best grasp of levels as a whole, the level artist knows their level best.

* '''First, discuss with your AD and the original level artist'''
** Get a permission to start with the polishing work from your team lead.
** If you plan on executing radical changes, talk with the artist responsible for the base and detail art.
** The level might feature, for example, story-related elements that affect the level art. The original level artist can brief you about special details.
** Tip: Before making any changes, read the level art wiki site to understand the level.

* '''Smaller detail polish directly to the level, bigger base art polish to a copy of the level'''
** When you polish smaller details, not tampering with the base art radically, save your work to the actual level.
** When planning to make big changes, try them out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Keep the level of details coherent'''
** After reaching the "good enough" state, level art shouldn't revert back to any of the previous art stages even temporarily.
** When planning to make big changes or stripping a part of the level bare of the detailed level art, try the changes out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Before & after screenshots'''
* Take before/after screenshots of the changes
** If the changes are small, use the actual level
** With bigger changes, use a copy of the actual level
* Take screenshots before and after using the same camera positions.
* You need to be able to pinpoint the location and the exact nature of the changes.
*Tip: You can always return to the original version of the level to take the screenshots.

* '''Feedback'''
** When making larger changes: Show the changes made to the (copy of) level and the before/after screenshots to your AD and the original level artist. Discuss with them about the changes.
** When making smaller changes: Show the before/after screenshots to your AD to receive feedback, and fix the level art accordingly.

* '''Replacing old with new'''
** If the changes are approved by the AD, they can be commited to the actual level.

[[Category:Art]] [[Category:Art|Trine 4 Level Art]] [[Category:Trine 4 Art|Level Art]] [[Category:Level Art|Trine 4 Level Art]] [[Category:Trine 4 Level Art]]
[[Category:Level Art|Building a Level]]

Level Art: Level Art Related Gameplay Issues

2021-11-23T14:30:04Z

Tero Tirkkonen:

{{:Level Art}} 

= Level Art Should Support Gameplay =
* The purpose of the Level Art is to make the game beautiful - and also support the gameplay.
* This section of the Wiki contains general guidelines on how to avoid creating misleading level art causing gameplay issues.
* In the examples below, the level art obfuscates and misguides the player in both obvious and more subtle ways.
* The examples below are for educational purposes only - some of the cases are fictional and constructed to showcase level art issues. Some are from the early stages of development and do not represent the finalized product.
* Level artists should frequently '''play the level or scene''' they are working on. That helps to spot any gameplay issues the level art may cause. It's impossible to notice some errors while using the free Editor view only - that's not what the players see - so it's essential to play the game.

= Art Hides Something Important =
* Don't place the foreground art carelessly so that it covers something important, like puzzle elements or a ledge requiring the player to see exactly where the character is.
* The Player character should always be visible, so be mindful of your foreground art. For example, the camera should be adjusted so that the doorways in the gameplay area never hide the player character completely.
* Sometimes level art is intentionally used to hide gameplay elements, like XP and secret areas. On the other hand, if an item is essential for the player's progression, it should always be fully visible and in plain sight.
* The composition of the scene should emphasize important gameplay elements. Draw the player's eye towards things relevant to the gameplay.

<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_The_Dream_29.1.2019_hidden_button_1.jpg|The button needed to open the door is hidden behind the foreground visuals, namely the handrail. While the player might spot the button eventually, they are left confused and annoyed.
File:Trine 4 art vs gameplay visibility issue 30.1.2019.jpg|The player needs to levitate a wizard's box through a hole in the right. The branches and leaves obstruct the view too much, making the conveniently box-sized hole hard to see.
File:Trine 4 foreground art blocks the view 30.1.2019.jpg|The entrance to a secret cave remains a little too secretive due to a thick rock asset blocking the visibility.
File:Trine_4_Dream_10.2.2019_armchairs.jpg|There are too many assets and elements in front of the camera and blocking the view. The buttons on the ground are not visible enough.
File:Trine_4_Dream_10.2.2019_camera_blocked.jpg|Level art elements are placed confusingly, blocking the view. The player will likely run to their death before realizing there's a pit.
File:Trine_4_Nightmare_13.3.2019_bushes.jpg|The bushes are hiding a part of a ledge, likely causing the player to fall and die.
File:Trine_4_Nightmare_13.3.2019_moving_platform.jpg|The platform going down is hidden inside the floor, leaving the player confused and guessing where to go.
File:Trine_4_Thorny_14.4.2019_hidden_ledge.jpg|Covering a ledge with a flower vase may result in an unintentional falling down.
File:Fairy_forest_art_issue_3_player_hidden.jpg|While the airflow elevator is a fantastic element, the level art prevents the player from seeing their character for a (too) long time.
File:Trine_4_Nightmare_13.3.2019_leap_of_faith.jpg|While the intended progression route is simple enough to understand, proceeding requires a leap of faith, which might make some players uneasy. Solutions like this should be avoided.
File:Trine_4_Amadeus_13.4.2019_confusing_art.jpg|The rails at the right-side end of the seesaw plank are broken. It's hard to pinpoint where the platform area ends.
</gallery>

== Art Hides Something Important in Multiplayer ==
* Because the camera angles are often wider in multiplayer modes, you should be extra careful when placing the foreground elements.
* Typically, all players should always be in the same view.
* Vertical scenes are the most challenging to implement: When one player climbs up on a platform, they should be as visible as another player at the very bottom of the scene.

<gallery widths=500px heights=500px mode="nolines">
File:coop-07_the_dream-foreground_art_issue_01.jpg|Image A: The character standing on a balcony (higher area) is almost entirely obscured by the foreground artwork. See Image B to see how this was fixed.
File:coop-07_the_dream-foreground_art_issue_fix_01.jpg|Image B: Almost the entire balcony was removed to help the player to notice the character.
File:coop-07_the_dream-foreground_art_wide_angle_issue_01.jpg|Image C: When using very wide multiplayer camera angles, even the relatively small foreground assets can obscure the player characters. See Image D to see how this was fixed.
File:coop-07_the_dream-foreground_art_wide_angle_issue_fixed_01.jpg|Image D: The foreground area was moved very close to the playable area.
File:coop-07_the_dream-foreground_art_wide_angle_issue_fixed_02.jpg|All the fixes applied must work with both multiplayer and single-player camera angles. For example, multiplayer situations where the camera is moved closer to the player character might be tricky with the single-player mode.
File:coop-07_the_dream-foreground_art_tri_seesaw_issue_00.jpg|Image E: A vertical progression path and a wide camera angle aren't a good match, making it really hard to see the characters. See Image F to see how this was fixed.
File:coop-07_the_dream-foreground_art_tri_seesaw_issue_01.jpg|Image F: The foreground art was moved very close to the playable area to make the characters more visible.
</gallery>

== Fading Environment Objects in Trine ==
*The environment objects should be faded only when they're used as secrets.
*If something is faded out upon entering an area, it should be faded back in when the secret area is left.
*The fading effect should not be used, for example, to a wall facing the camera during a standard progression route.
*As the video shows, exceptions can be made, but only after setting up the cameras so that the character can't remain standing in the doorway.
*The situation depicted in the video showcases how the cameras and level art work together to create the desired effect. The camera doesn't go through the wall, but the level artist can plant a window on the camera's path. The player should feel safe when jumping to the unknown, so you might want to include another door or a window in the scene's foreground to show that the path continues to the other side.
[[File:no_fade_foreground_wall.mp4|550px]]
*Enable UseNoisedVisibility on modelcomponent of the object being faded to make the fading effect smooth and avoid flickering like shown on the video.
[[File:fade_bug.mp4|550px]]

= Collision Mismatches =
* The level art should always match collisions as closely as possible.
* If the collision is smaller than the art asset, the characters or levitated objects will clip through the art when interacting with the collision point.
* If the collision is bigger than the art asset, the characters or levitated objects will float in the air when interacting with the collision point.
* If the collision in a particular area is intended to be sharp, try to avoid round and edged art.
* Pay particularly close attention to the edges that are ledge-grabbable.
<gallery widths=500px heights=500px mode="nolines">
File:Trine 4 round edge art ledgegrab 30.1.2019.jpg|If you're struggling to create a 90-degree ledge with stone assets, try replacing them with a man-made structure instead.
File:Fairy forest art issue 12 clipping.jpg|The player characters aren't the only gameplay elements affected by the collision mismatches; they are also problematic for dynamic objects.
File:Trine_4_Amadeus_13.4.2019_invisible_and_inside.jpg|The Player character shouldn't be able to move inside the snowman art - also, the character seems to collide with an invisible collision on the left.
File:Trine_4_Rocky_Heath_14.4.2019_missing_collision.jpg|The centrepieces of these rotating puzzle elements are missing their collisions.
</gallery>

= Distracting Level Art =
* When a game combines a 2D gameplay with a 3D environment, it can be hard to differentiate the background items from the gameplay area. If the player doesn't have a clear understanding of the gameplay area, they get easily frustrated.
* At all times, the player should be able to differentiate the gameplay area from background and foreground areas.
* If the critical gameplay elements are lost amidst the background art, it'll disturb the smooth flow of the playing experience.
* The level geometry should be free from any confusing elements and easy enough to grasp with a single glance.
* Tip: Try to distance yourself from your work by shrinking the level to a very small size (you can use screenshots, for example) or take a step back and squint your eyes. If you can't instantly recognize the general shape of the level, there's probably something wrong with the visuals.
* You can learn more about fixing and (preferably) avoiding gameplay-related level art issues by studying [[Level_Art:_Color_and_Lighting#Value|the importance of values and contrast]]

<gallery widths=500px heights=500px mode="nolines">
File:Fairy forest art issue 11 confusing room.jpg| Since the gameplay area is unclear and lacks any guidance signs, the player wouldn't probably know where to go.
File:Trine_4_Mountains_10.2.2019_backgroundstuff.jpg| The background art is too close to the gameplay area, making it hard to differentiate the two. The art in the background draws the player's attention, whereas it should emphasize the actual gameplay area.
File:Trine_4_Dream_10.2.2019_dreamfog.jpg|There are so many decorative background objects in the scene that it's hard to understand which items are in the gameplay area and meant to double as platforms.
File:Trine_4_Dream_10.2.2019_toggle_button.jpg|Did you notice there is a vertical button located in the bottom left area? The art assets in the scene are hugging all the attention, making it hard to spot the actual gameplay elements.
File:Trine_4_issue_1_24.9.2019.jpg|It's difficult to see the spikes amidst all the other level art elements. Make sure to boost the visibility of the critical gameplay assets with the correct values and contrast.
File:Trine_4_Hedge_Maze_spikes_visibility.jpg|The spikes around the button on the top right corner should be clearly visible, as they are an essential part of the gameplay.
File:Trine_4_Nightmare_13.3.2019_floor_magnet.jpg|It's easy enough to mistake the circular magnetic area for a part of the floor.
File:Trine_4_Nightmare_13.3.2019_plank.jpg|The two circular magnetic plates on the wheel are hard to see - or understand their significance as gameplay elements. The middle part of the wheel draws attention instead. Don't use the same colour for decorative pieces and gameplay elements.
File:Trine_4_Amadeus_13.4.2019_effect.jpg|A bright yellow effect to signal a landing area for levitation objects was tested. However, the effect was easy enough to misinterpret to represent a collectable, a hidden door, a levitation object - to name but a few - rendering it more confusing than helpful.
File:Fairy forest art issue 6 secret w many issues.jpg|Even the very preliminary base art should always be created with the gameplay in mind.
File:Trine 4 background vs play area 30.1.2019.jpg|It's hard to tell where the gameplay area starts or stops. The confusion is caused by a mixture of unclear lighting and vague rock assets littered around the area.
File:Trine 4 background vs play area example 2 30.1.2019.jpg| The values selected are not in line with varying depth levels, resulting in a perplexing gameplay area. The background appears to be blending into the gameplay area.
</gallery>

= Gameplay Route Issues =
* If the player's intended progress route isn't clear enough, it's good to check the level art of the area.
* Level art may mislead the player into thinking that a route is safe, dangerous or somehow blocked when it actually isn't.
* The player should always know where to go and what's happening. To achieve that, the main path should always be obvious and easy to follow.
* If more than visual fixes are needed to highlight the main route, talk with the designer responsible for the level.
* Avoid planting hidden or obstructed entrances along the main path. The entries to hidden or secret areas should always be visually less tempting than the main path.

<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_Nightmare_13.3.2019_rock_pillar.jpg|The horizontal stone pillar seen through the magnetic field is problematic: It's too close to the play area, making it hard to differentiate from the platforms and the magnetic field itself.
File:Trine_4_Birch_16.3.2019_flower_light_3.jpg|Some of the large leaves depicted are gameplay elements, and some are purely decorative. The risk of a mix-up is evident.
File:Trine_4_Rocky_Heath_14.4.2019_background_art.jpg|While the hatch upwards has been opened and it's clear to proceed, the decorative crate art makes it hard to understand.
File:Trine_4_issue_2_24.9.2019.jpg|The gameplay elements should always stand out and direct the player. The large leaves are in the gameplay area and meant to act as platforms - while the branch underneath them is not. The player has no way of telling which platforms are safe. The tree branch should remain hidden in the shadows, preferably with a layer of fog camouflaging it more.

File:Trine_4_Nightmare_13.3.2019_rock_ledges.jpg|The rock ledges in the foreground are too close to the gameplay area and easy to mistake as gameplay elements.
File:Trine_4_Nightmare_13.3.2019_rotating_wheel.jpg|Especially with the camera set-up featured here, the player might assume the foreground structure near the bottom is a part of the gameplay area (while it's not).
File:Trine_4_Moonlit_14.4.2019_seesaw_asset.jpg| It's hard to say which parts of the bird-shaped platform asset, if any, are located in the gameplay area. Possible fixes include adjusting the lighting or editing the asset textures to highlight the gameplay platforms and making other parts of the asset less visible.

File:Trine_4_The_Dream_29.1.2019_hidden_door.jpg|The secret area on the top right corner looks like the main route, and the actual main route below it appears to be a secret passage with the bookshelf covering it.
File:Trine_4_Nightmare_13.3.2019_rock_ledges.jpg|The player should head downwards but is more likely tempted to progress to the right. Replacing the right side ledge with a solid wall could fix the problem. One should also pay attention to the warm light shining from the right - why invite the player to a place they can not go to?

</gallery>

= Fire Through vs Non-fire Through =
* It's wise to reserve iron bars, gratings and other gameplay area assets with holes in them to be used with fire-through collisions only.
* If the asset isn't supposed to pass the ammunition through, it should look solid.
<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_Hedge_Maze_non_fire_through_hatches.jpg| The player is tempted to try and shoot an arrow through the hatches - to no avail. While the actual solution to the puzzle requires the player to use the ice arrows to freeze one of the platforms, the level art should help them to understand how the bow and arrow can be utilized here.
File:Trine_4_Hedge_Maze_non_fire_through_t_platform.jpg| This platform doesn't look solid enough to be frozen with an ice arrow either.
</gallery>

= False Promise of Gameplay Function =
* Avoid planting permanently closed doors on the gameplay area since players will want to open them. Doors leading to background areas are more acceptable.
* If the player can't go to a particular area, that area shouldn't look accessible.

<gallery widths=500px heights=500px mode="nolines">

File:Fairy_forest_art_issue_7_invisible_wall.jpg| The opening on the left appears to be an entrance somewhere. Level art shouldn't invite the player to a place they can not enter.
File:Trine_4_The_Dream_29.1.2019_hidden_door.jpg|The bottom left door looks like an entrance to a secret room while it's just a decoration. Also, earlier during the level, the player could levitate a painting from the wall to reveal a stash of XP collectables. The painting on this scene, however, is just a decoration and can not be levitated. Inconsistencies can be extremely frustrating, and when faced with a situation like this, it's best to leave decorative assets, like paintings, outside the gameplay area completely.
File:Fairy forest art issue 15 fake secret.jpg|In the blue-toned surroundings, bright, warm lights will surely attract attention, while the actual gameplay element (the breakable wall near the lights) remains in the dark.
File:Fairy forest art issue 10 fake gameplay objects.jpg|If there's a ladder in the gameplay area, the player will want to climb it, no matter if the character actually can. It isn't enjoyable to bump into obvious gameplay elements - and be unable to use them. You should leave unique-looking but functionless gameplay objects out of the gameplay area and insert them sparingly in the background. Level art should always support the possible gameplay elements.
</gallery>

= Misleading Level Art =
== Fake Ledgegrabs ==
*Some art assets might look like ledge grab poles while they aren't. Be very careful not to place misleading art objects in areas that include actual ledge grab surfaces and objects.
*For example, it's not a good idea to set thin horizontal poles and real ledge-grabbable surfaces next to each other.
*Avoid sharp edges in spots where ledge-grabbing is not possible.
*Be extra careful when working on levels with detailed architecture: Visually distinct horizontal support beams, borders, and such can easily mix up with ledge grabs.
*Examples of structures that are easily confused as ledge grabs::
<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_The_Dream_29.1.2019_fake_ledgegrab.jpg|The wall geometry near the portal falsely suggests the player can ledge grab.
File:Trine_4_Nightmare_13.3.2019_fake_ledgegrab.jpg|The curved part of the right side ledge seems ledge-grabbable, while the actual ledge grab area slightly above it does not.
File:Trine_4_Nightmare_13.3.2019_rock_ledges.jpg|The rock ledges in the foreground are too close to the gameplay area and easily mistaken as grabbable.
</gallery>

== Fake Poles ==
* The poles have a very specific gameplay function: they are used to block objects so that the player can pass through.
* Avoid placing any non-gameplay poles on or too near the gameplay area.
<gallery widths=500px heights=500px mode="nolines">
File:Fairy forest art issue 8 art poles.jpg| There are two kinds of poles featured in the gameplay area: The vertical ones don't restrict the movement of dynamic objects, while the horizontal ones do. The horizontal poles have a gameplay function - they are needed to block the player from moving dynamic objects past them. However, the vertical poles are not gameplay objects and shouldn't be placed in the gameplay area at all.
</gallery>

== Fake Breakable Walls ==
* Breakable wall assets are meant to be used only when constructing breakable walls, not for anything else.
* Those art assets that look like breakable wall assets shouldn't be used for decorative purposes.
* No large wall chunks or any other noticeable debris should remain after the player has destroyed the wall. The player should know when the wall has been completely shattered and that there's nothing more to break.
* Trine 4 featured breakable crystal walls and used small crystal shards to indicate the moment the wall was destroyed. The right size and look for the crystals was found by tinkering with the contrast in size, saturation and value of the "decorative" crystal bits. The smaller crystal pieces blend into the background (at least more than the larger wall chunks).

<gallery widths=500px heights=500px mode="nolines">
File:Fairy forest art issue 9 fake crystal wall.jpg|Trine 4 crystal walls are always coloured purple to avoid mixing up the breakable walls with regular, non-breakable structures. A very similar-looking asset is likely to confuse the player, as seen here with the purple object. The level artist should never use interactive gameplay object assets (or even assets that look like them) as decorative assets.
File:Trine 4 Badger 23.2.2019 crystals.jpg| It's unclear whether there's still crystal pieces left to shatter or not. The "leftover" pieces should have their own distinct visual look that differs clearly from the breakable wall asset. You could try, for example, using a less covering, dull and desaturated colour that blends into the background for the small bits, while the actual breakable chunks are brighter and contrasted, standing out.
</gallery>

== Fake Gameplay Objects ==
* You shouldn't use gameplay assets for decorative purposes inside the gameplay area or in the immediate vicinity of it (background/foreground). The player must know which objects can they interact with.
* The dynamic gameplay assets should be kept separate from the decorative (non-interactive) level art assets, visually setting the two apart.
* Don't create similar-looking assets that sometimes function as dynamic gameplay assets and sometimes can't be interacted with.

<gallery widths=500px heights=500px mode="nolines">
File:Fairy forest art issue 10 fake gameplay objects.jpg
</gallery>

== Fake XP ==
* No other game art assets should look even remotely similar to the experience collectables.
<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_Hedge_Maze_fake_xp_flower.jpg|The flower buds in the foreground share their colouring with the XP collectables. The shape and size are also very similar.
</gallery>

== Fake Ropetarget Rings ==
* Avoid placing small, camera-facing rings near the gameplay area. Players will have a hard time differentiating them from rope targets.
[[File:Trine Art example confusing rings.mp4|550px]]

= Plausibility issues in 2.5D =
* When making a 2,5 D game, the level art plausibility concerns are usually focused on immersion and worldbuilding.
* However, sensible environmental planning benefits the gameplay as well. If the surroundings provide enough guidance and feel plausible, it reduces the risk of the player getting frustrated and blaming the gameplay for it.

== Platformer logic vs normal logic in Trine ==
* "Platformer logic" refers here to the concept of abandoning all the 3D tools and solutions in favour and because of the 2D gameplay. Platformer logic can be applied to many Trine art and gameplay design decisions.
* Since Trine is attempting to co-pilot a believable 3D approach on the side, platformer logic isn't always the best solution for all the problems.
* Mixing 3D and 2D can lead the player to various frustrating situations. These situations can be made more acceptable with carefully chosen level art:
** For example, wallhead scenarios often force the player to a potentially dangerous 2D route and face to face with the fire-spitting wallheads (while the player might feel the 3D approach should allow them to avoid the danger by simply choosing another path). Level artists, however, can make the other possible routes look less appealing or not available, thus justifying the "platformer logic".
**Doors, on the other hand, should be placed in spots where using them is the only sensible solution. If there's a heavy door at the end of a puzzle chamber and a huge hole in the stone wall next to it, you can't blame the player for wanting to jump through the hole and then getting frustrated when the 2D perspective gameplay stops them.
**Level art should leave the player satisfied for choosing the right path ( = the path that forwards the gameplay) even when the right path doesn't seem to be the most logical one.

[[File:scrshot_wallhead_rocky.png|500px]]

== Visual support for platforms and mechanisms ==
* You should consider the mass, weight and working mechanisms of the art object you're creating. Without proper support and volume to mirror the object's real-life properties, using it might feel unrealistic and not satisfying.
* This approach will also help in conveying the gameplay mechanisms to the player: A flimsy-looking support structure hints to the player that the platform might tip over. If the support structure looks strong, the player feels safer using it.

<gallery widths=500px heights=500px mode="nolines">
File:scrshot_bog_stickplatform.png
File:scrshot_throny_lift.png
</gallery>

== Path of least resistance should be on the 2D plane ==
* The Trine heroes like facing challenges, but most players will choose a more manageable path over the hard one.
* Generally, selecting the path with the least obstacles/resistance feels better. The player's gaze tends to turn naturally towards the route that feels safer and more sensible.
* It's your responsibility as a level artist to ensure that the 2D plane/route should always feel like the most logical one.
* Sometimes, especially with puzzle elements, the 2D gameplay might feel frustrating and arduous. The level art should soften the blow as much as possible and reaffirm the player's route.
* For example, solving a puzzle to open a door might feel annoying if there are plenty of possible 3D art asset solutions dangling nearby and the player is unable to use them due to the 2D gameplay.
* The most efficient path doesn't always get chosen: A fun 2D platforming route can be much more tempting than a staircase in the background.
* Venturing into the unknown is considered unpleasant, and the player might feel uncomfortable selecting an obscure background path. However, figuring out how to open the door to the unknown is exciting.
* A ledge invites the player to reach for it in the hopes of ledge-grabbing (instead of aiming for a platform with no ledge).
* Make sure the play area is the most tempting path for the player to take (instead of the other possible routes seen in the scene) and plan both the visual and geometrical routes accordingly.
* Make sure that the game play area has a clear contrast and that the player's intended path is prioritized visually.

== Examples of possible issues ==
* See below for example scenes where the player might feel like the 2D plane/route isn't the best or the most alluring way to continue
<gallery widths=500px heights=500px mode="nolines">
File:scrshot_birch_blockedpath.png
File:scrshot_lakes_goaround.png
File:scrshot_lakes_spikes.png
File:scrshot_moonlit_door.png
File:scrshot_mountains_glide.png
File:scrshot_mountains_wildcanyon.png
File:scrshot_thorny_goaround.png
File:scrshot_thorny_shrubbery.png
File:scrshot_dream_balcony.png
File:Trine_4_Amadeus_13.4.2019_blocks.jpg|It seems that the player could easily just walk in the foreground without actually solving the puzzle.
</gallery>

== Examples of non-problematic solutions or issues succesfully averted ==
* Here are some examples showing how the play area / 2D plane seems like plausible and the most satisfying way to go, while other route options seem illogical or un-tempting
<gallery widths=500px heights=500px mode="nolines">
File:scrshot_blueberry_log.png
File:scrshot_moonlit_mushroompit.png
File:scrshot_mountains_door.png
File:scrshot_fairy_plankplatforming.png
</gallery>

Level Art: Level Art Related Gameplay Issues

2021-11-23T14:27:16Z

Tero Tirkkonen: /* Distracting Level Art */

Level Art: Ideas for New Levels

2021-11-23T14:26:57Z

Tero Tirkkonen:

{{:Level Art}} 
* How to get visual ideas to kickstart a new level?
* All Trine levels have their own theme, but there is a lot of variation and different areas inside levels as well
* Searching for ideas, inspiration and reference images is always beneficial when determining the themes for the level you are working on
* Creating mood boards and collecting a reference image library will help you during the creative process
* Reference images are super important in the process of forming a clear vision of the level you want to create
* Sure, you can come up with cool stuff off the top of your head, but why not use the fantastic resources available to get even better results?

= Idea & Concept Process =
* The lead artist will combine preliminary references for different level themes that indicate what kind of mood and theme are wanted
* The concept artist might make some kind of concept art to further flesh out the ideas. However these concepts are often quite vague and focus more on the big general picture, so the level artist needs to come up with most of the details
* Once the level artist starts working on the level they should go through the materials already available internally: The script, level wiki site, concepts and existing reference images
* Communicating with the AD/art lead and designers, the writer and possibly with the 3D artists is important
* Consider all the materials and start thinking about how the level could look like
* Based on the existing materials, search for your own reference images online and save the best ones to the shared level reference image folders
* Use the best ideas from your reference images and your imagination and combine everything in your unique level. Don't directly copy and paste stuff from reference images, but add your own touch.
* You can go back to the reference images at any point during the level art process.
* You might even forget some great ideas along the way, so refreshing your brain by returning to the reference once in a while is a good practice.
* If you feel stuck with a scene at any point when creating the level, you can just find a reference image or two with cool-looking ideas and try utilizing them in your design.
* The level art process is an iterative process. There is no need to get everything placed perfectly from the get-go, as that's very seldom how our creative processes work. The process takes a lot of experimenting, trial and error.
* In some cases it might be best to rework a scene completely to find something better.

<gallery widths=400px heights=400px mode="nolines">

File:Lakes and rivers preview.png
File:WIP_RiversAndLakes_concept_220817_v2.png
File:LakesAndRivers rocks concept 160817.png
File:WIP Lakes concept levelStructure 110518.png

</gallery>

= Where to Get the Best References =
* You can find ideas everywhere, from '''movies''', '''documentaries''' or even your '''daily bus trips''' to work
* '''Look around you''', study the formations of nature, geography and architecture with a level artist's point of view!
* There are tons of photo and art references online but don't forget you can also do some '''fieldwork''' yourself and take your own reference photos. When stumbling into an interesting location in your real life, don't forget to take in the place with all your senses, this you can't do with online materials.
* '''[https://www.pinterest.com Pinterest]''' is an excellent reference image site. You'll get a bunch of related images for each good reference image, and it's easy to end up with an impressive amount of open tabs brimming with reference ideas. The only downside is that you have to be logged in to use the site, which can be annoying, but still worth it.
* '''[https://www.artstation.com/ Artstation]''' is another absolutely inspiring site for ideas. It's full of amazing art. Of course, with other people's art, it's very important to not copy stuff directly, but that should go without saying when using any reference. Make it your own!

== Something to consider when using references ==
* Reference images from online are never a perfect representation of what is wanted for the final asset/level/product.
* For example, if the AD offers some reference images, they are meant to flesh out the general idea and point you in the right direction, but never to be copied directly.
* This can be a bit tricky sometimes, as everybody will probably pick out different things from the same reference image.
* If we used already existing reference material as it is, there would be no need for concept art, nor as much space for our own imagination or creativity. Most likely the end result wouldn't be very coherent and unique either.
* Consider reference images as vague pointers and concepts, rather than pieces designed specifically for Trine games.
* Trine games are meant to be unique-looking - that needs original ideas, so it's never good practice to copy anything straight from a reference image.
* It's an important skill to know how to use the reference creatively to support your own imagination instead of letting the reference determine everything for you.

[[File:trine_4_lakes_and_rivers_reference_photos_by_charlotta_tiuri.jpg|800px]]

Level Art: Environmental Storytelling

2021-11-23T14:26:46Z

Tero Tirkkonen:

{{:Level Art}} 

= What is Environmental Storytelling? =

* An environment is an imagined space where the player moves inside.
* Even though the environment is virtual, it creates boundaries and limitations for the player and guides them through using tools such as lighting and art.
* As the player moves around in the virtual world and passes through the different rooms and scenes, they're given context through carefully placed props and objects.
* Every asset in a scene has a purpose, every character is placed there for a reason and every piece of background art has a history.
* Environmental details mirror and expand the lore of the world, offer additional information about locations or characters, and deepen the player's understanding of the story.
* In other words, the player's view of the world and understanding of the narrative is shaped by where they find themselves in that world.
* The rich environmental details supported by the narrative and supporting the narrative help the player see the game world as one whole (even when it's separated in levels like in Trine).
* To achieve immersion careful planning and much work are needed: placing all props carefully, designing NPC looks and locations to reflect their personalities, occupations and residence, creating areas where the mood and the atmosphere complement each other - essentially, making all the elements of the game work together.
* Once the immersion is achieved, everything seems in place, and all things belong. The player can't help but to feel that things make sense, however curious or outlandish the various elements might be.
* In an immersive game, barriers in the environment need to make sense within the game world - to the point that players will never even question why they can't get past an obstacle.

= How does Environmental Storytelling work? =
* It's a mixture of direct references and more vague things.
* When inserting an apparent story reference, you should always consult the writer to ensure the environmental storytelling aligns with the screenplay.
* Environmental storytelling works better the more freedom the player has. Trine is usually focused on linear exploration, but that doesn't mean it can't benefit from environmental storytelling.
* Each and every scene is distinctive while at the same time retaining the style of the level, both design- and art-wise.
* This makes it easier for the player to build a mental map of the level and imagine how things work outside their immediate view.
* When building the levels, you don't need to think about making them more realistic, but simply remember how Trine's fictional world works and use it as a springboard.
* Things that don't make sense in real life could make perfect sense in Trine's land of fantasy.
* The exploration process wheels more organic when a player receives the expository information through their eyes and ears and via the world itself (as opposed to just listening and reading it from text boxes, dialogues or cutscenes).
* When the story is perceived through observation, the narration is reinforced. The game world feels more believable and alive to the player.

== Examples of Environmental Storytelling ==
* How environmental storytelling translates to both the environment itself and into gameplay:

<gallery widths=500px heights=500px mode="nolines">
File:ES_astral_nightmare.png|
</gallery>
* This scene set in The Astral Nightmare is a good example of successful environmental storytelling.
* On one side are the wizards, scared and angry. On the other side, there's the true form of The Nightmare Prince.
* Even though the player hasn't met the Nightmare Prince, they have a clear idea of what the wizards were like towards Selius. The scene also foreshadows what will happen later, namely the Selius transformation during the game finale.
* It serves as a sort of an Easter egg for those people playing the game a second time.
* The visuals connect nicely to the main narrative, showing us Astral Academy (Selius's personal purgatory) and the main character

<gallery widths=500px heights=500px mode="nolines">
File:9P_elves_hotpools.png|
</gallery>
* Elves have never been mentioned in the Trineverse, but this level has statues depicting them.
* Players noticing the statues and other remains of the elvish culture learn more about the Trineverse world & can immerse themselves in the world.
* The elven statues aren't connected to the main narrative itself, since the elves play no role in it. Their "presence" in the environment, however, helps to develop and expand the world and lore.

<gallery widths=500px heights=500px mode="nolines">
File:T4_selius_nightmares_es.jpg|
</gallery>
* This scene shows a family portrait of the Heatherwood family, but it's been ruined by one of Selius's Nightmares.
* A book found later in the level reveals that Selius was bullied by his brothers. Players probably see the painting in a new light, especially since the part of the painting depicting Selius's brothers is badly damaged.

== Environmental Storytelling and Design ==

* It's crucial to communicate constantly with the designers. When creating level art, the gameplay and design aspects need to be considered. Sometimes it means trying to match far-out and crazy gameplay ideas to the overall visuals as seamlessly as possible.
* Due to Trine's 2.5D nature, players don't have a lot of freedom deciding where to go and what to interact with. It's the level artist's job to make sure that the only route the players can take feels like the obvious and tempting choice and not a forced necessity.
* That's been achieved by making the background and foreground areas (where the players can not move) seem uninviting, too hard to navigate, or outright dangerous.
* It's also very important to add art assets to puzzle elements to tie them together with the surroundings and the level.

[[File:T4_enchanted_vines_es.mp4|550px]]
* Here's how the environmental storytelling translates to the gameplay: instead of having a wooden gate the slides to the side, a strong grip of the enchanted vines has been chosen to break the stone wall.
* This doesn't seem out of place in the context of the level and makes both the story and the gameplay more coherent.

<gallery widths=500px heights=500px mode="nolines">
File:T4_seal_es_example.jpg|
</gallery>
* The Seal in T4 is a fantastic example of the art, story and gameplay blending together.
* It appears throughout the whole lake level and helps the heroes. In return, the heroes assist The Seal. Later, it's mentioned by Elodea when we meet her.
* All pieces are connected and work beautifully together, giving the Seal a greater purpose in the game world (rather than being just a bouncy gameplay prop).

= In Conclusion =

* Environmental storytelling is a great way to make the game's story more interesting.
* As there is a whole Trineverse world featured in several games, it's important to make the games feel connected, even if each entry to the series is a stand-alone game.
* The players are already familiar with the world and its characters, so adding emotional impact will make them even more immersed in the game world.
* With future projects, we can revisit the old Trineverse locations, creating a wonderful sense of nostalgia (art, music, feel), while keeping things new and fresh.

Level Art: Composition

2021-11-23T14:26:28Z

Tero Tirkkonen:

{{:Level Art}} 

= Composition and Forms =
* Composition means the arrangement of shapes and forms in a scene, so to put it simply composition is just arranging different value shapes in a picture
* The composition should of course look nice but also guide the player to the right direction and support the gameplay
* The gameplay area in 2.5 style Trine games is quite narrow and the geometry of the gameplay area is mostly determined by the designers
* The the most visual impact within level art is in the background and foreground forms and with those everything is possible as it doesn't affect the gameplay
* As usual with Trine art style, overpowering straight lines and 90-degree angles in the big forms of the levels should be avoided
* The forms of the levels should be flowing in big arches with a clear flow trough the environment
* The aim is to achieve a dynamic and organic end result that guides the eye smoothly across the scenery and towards the direction where the player should be heading
* Break the 2D plane with overlapping elements and flows also leading into the depth (meaning the background)

<br>
[[File:trine_level_art_composition_guide_general_tips.jpg|1000px]]<br>
[[File:trine_level_art_composition_guide.jpg|1000px]]

== Base collisions have to support both gameplay and art ==
* Level artists can't edit the collisions made by designers without discussing with them first but sometimes they need to be edited in order to make the level art work properly
* Here is an example of a spot that worked for gameplay but didn't work at all for the art. The whole idea was to have a wide open scenery and without artist intervening this would have ended up looking crammed and the feeling of space wouldn't have been achieved
[[File:Nightmare 20190225 improvement needing spots 55-56.png|500px]] Final result -> [[File:Trine 4 screenshot 25.png|500px]]
* Here is another example of how important it is that the artists are proactive with the base art changes to get the best out of the collision base, sometimes you just have to do big changes to make it work! Before the statue head was placed on the background of a puzzle and there was not enough space for this important focal point, so the end part of the level was moved to create space here and make this part work. The puzzle area was moved to the right so it comes after the statue.
[[File:Nightmare 20190225 improvement needing spots 50.png|500px]] Final result -> [[File:Trine 4 screenshot 17 1080p.png|500px]]

== The right materials for the specific shapes ==
* Things don't always need to be realistic but they should be believable in the context of the world they exist in
* Pay attention to the materials you use for different areas for a believable result
* Heavy stone/rock/brick elements need enough support visually
* Big and heavy rock elements look even heavier floating on top of the player. Unless it's a cave these should be replaced with lighter structures like tree foliage
* Use different materials to differentiate areas, if the floor and walls are rock, use for example wooden materials for the gameplay related pillars so they stand out better
* Avoid 90 degree angles when possible
* Of course the level design is often blocky and unnatural looking to perfectly match with the level art theme, but there are ways to fool the eye and add organic feeling while maintaining the collision forms necessary for the gameplay
* Don't make weird rock shapes, in nature rocks can't be narrow flat walls nor 90 degree angled structures (or if they can that still isn't what we aim for)
* For very unnatural and even shapes use something '''man made''' looking, like bricks or change the material completely and use wooden structures etc.
* '''Only the gameplay area needs to follow the collisions exactly''' so you can have more organic shapes all around to smooth down some unnatural shapes on the gameplay area
* In most cases you can also use '''vegetation''' to make things more organic by kind of hiding the angular collision shapes under it
* Artist should never edit the collision without '''consulting the designers first''', but in some cases editing is needed as some forms might not matter so much to the gameplay while they could be changed for the better from the art point of view. Still, always discuss with the designer first

<gallery widths=400px heights=400px mode="nolines">

File:Rudolfus dream overpaint 03.jpg|It's hard to see the gameplay area poles as they are the same material as everything else around them. Also wooden material feels more natural for the long narrow shape.
File:Gislans dream overpaint 14.png|An example of unnatural rock shapes that have been smoothed out with man made structures and vegetation in the overpaint
File:Gislans dream overpaint 04.png|In this case the big structure on the top area works much better as vegetation instead of the heavy rock material as it doesn't have enough visual support to make sense as a rock material
File:Gislans dream overpaint 17.png|An example of an unnatural narrow rock wall that would work much better as a wooden wall for example
</gallery>

= Flow =

* Generally the level beginnings and level endings should have this type of composition to guide the player to the right direction visually
* The composition is formed from all the assets and value blobs on the screen, so it should work as a whole and not just for individual separate objects
[[File:level_beginning_composition.png|1000px]]
* Think about the big shapes as just shapes in the first blocking phases. The shapes include everything visible, not only ground and assets on the ground, but also far away background objects like mountains and sky with clouds etc.
[[File:Level art composition guide direction and flow.jpg|1000px]]
* Here is a screenshot and an overpaint based on it from the Trine 4 Rocky Heath level. It's the beginning of the level so it should look exciting and guide the player to start the level. Now it seems like any general view from the level. The beginning and ending of a level should always be special and a focal point area to mark the beginning and ending.
* [[File:Rocky heath level art fixes 01.png|500px]] [[File:Rocky heath level art fixes 01 flow.png|500px]]
* [[File:Rocky heath level art fixes 02.png|500px]] [[File:Rocky heath level art fixes 02 flow.png|500px]]
* [[File:Rocky heath level art fixes 03.png|500px]] [[File:Rocky heath level art fixes 03 flow.png|500px]]

== Gameplay area 2D plane ==
* We want to create a feeling of real world with depth and hide the fact that the whole game is actually just a narrow 2D plane and one straight road from left to right
* Only the collisions on the narrow gameplay affect gameplay, everywhere else (which is a much larger area) anything that art wants can be done! Of course everything should still support the gameplay as well as possible.
* Let's not let the design's collision blocks limit our creativity and possibility to make the level more organic and flowing
* Sometimes art can follow the 2D plane and it works but usually we want to break it and create an illusion of a vast world that is more than just the 2m wide gameplay path
* Problems that can occur when we don't question the original collisions:
** Highlighting the 2D plane where it's not needed: adding a road/houses/walls exactly aligned with the 2D plane
** Having obstacles or structures only 2m wide, so they do cover the gameplay area but look like a staged obstacle course that you could just walk past if the artificial 2D gameplay restriction wasn't present
** Adding necessary art to the gameplay area while leaving the background separate, which can work, but usually it's best to tie the different levels of depth together, blurring the line between the background, foreground and gameplay area
** Leaving the foreground empty or not paying the same amount of attention to the scene as a whole but just getting the "necessary" things filled

<gallery heights=400px mode="packed">

File:adding_depth_to_2D_game_3.jpg | Visually separate background and everything aligned with the 2D plane
File:adding_depth_to_2D_game_4.jpg | Everything aligned with the gameplay area makes the scene feel flat
File:adding_depth_to_2D_game_5.jpg | In the level ending area it's often a nice looking trick to make the road bend into the depth
File:adding_depth_to_2D_game_1.jpg| Examples of adding depth with roads that break the 2D plane
File:adding_depth_to_2D_game_2.jpg| Even though most of the structure will not be visible it helps to think the scene as a 3D building instead of the 2m wide 2D area
</gallery>

=== Too long straight walls perpendicular to the 2D plane ===
* Another 2D plane related thing is when long walls continue to the foreground, they can seem too long and too close to the camera so they should be avoided and instead curved walls etc. should be used
<gallery widths=400px heights=400px mode="nolines">
File:2D_perpendicular_walls_issue_2.jpg| An example of how to fix the too long 2D perpendicular walls
File:2D_perpendicular_walls_issue_3.jpg| The issue explained in more detail
File:2D_perpendicular_walls_issue_1.jpg| Another example of how to fix the too long 2D perpendicular walls
File:2D_perpendicular_walls_issue_4.jpg| Also a gap like this has a similar issue as the wall has: too long straight 2D perpendicular shape. Doorways and windows or organic "holes" are a much better option. There should also be some gaps (window/broken areas etc) where the camera moves trough so that it doesn't go through the wall.
</gallery>

= Variation =
* It's important to have variation and contrasts in the shapes in all kinds of environments
* Especially with natural environments you should make sure to get the organic feeling across
* Areas that continue in a similar pattern for too long feel unnatural, monotonous and boring
* The rhythm of the area should not be repeating itself
* This principle can be used for terrain shapes, light and asset placement, everything really!

<gallery widths=600px heights=600px mode="nolines">
File:Rythym tundra 01 03.jpg|too similar and repeating shapes, too straight lines
File:Rythym tundra 01 04.jpg|more variation in shapes and sizes, breaking the straight lines
File:Gislans dream overpaint 39.jpg|Too perfect circular shape with just small detail to break it, adding unevenness and having also mid sized shapes helps to make it more organic and interesting

</gallery>

== Avoid Repetition ==

* This applies to pretty much everything: textures, asset design (silhouette of the asset, details of the asset), level art etc.
* In Trine the aim is to avoid repetition. For example wall tiles are not just simple tiling of same shape, instead individual tiles vary in shape and orientation
* Repetition might mean for example detail placement and size variation on the object
* Placing objects in a "grid" looks repetitive, but scattering objects seemingly randomly can look repetitive too, if the objects are still placed about a same distance of each other and the objects are approximately same shape and size
* Have primary, secondary, and tertiary shapes meaning that primary shapes stand out most and can be immediately noticed on the first glance, followed by secondary and tertiary shapes
* Have large, medium, and small shapes. Have variety to the size of shapes in each of the three categories.
* Make sure these details are placed somewhat chaotically to avoid obvious patterns
* And make sure there are areas with lots of details, and areas of almost no details. Empty areas are as important as detailed areas in the big picture!
* [http://www.neilblevins.com/art_lessons/composition_contrasts/composition_contrasts.htm Neil Blevins: Contrasts In Composition]

[[File:Repetition.jpg]]

= Scale and Proportions =
* [http://www.neilblevins.com/art_lessons/details_make_big/details_make_big.htm Neil Blevins: Using Details To Make Something Look Big]
* To avoid problems with scale use the characters as size reference at all times and see how an environment looks in game by playing and observing it often
* In levels it's important that the scale of objects compared to the characters makes sense and everything is consistent and logical
* Game worlds often have problems with scale, things might look too big or too small and that breaks the believability of the world, making the game feel substandard
* Generally you should trust your eye, and if something looks off, fix it. If something works even though it's scaled a lot, it's okay
* Basically everything is allowed as long as it looks good and optimal enough for the performance, but scale can sometimes be hard to get right, so here are some clear tips for that
* If an existing asset looks low quality (for example has a low texture detail) think carefully how to use it properly. It might be okay to place in an area where texture details are not that visible anyways. Otherwise ask the 3D art department for a possibility of getting a new asset.

== Scaling assets ==
* It's generally okay to scale any 3D asset up or down 20% of its original scale (you can see if the asset has been scaled or is in its original scale from the model component "Scale VC3(1, 1, 1)". If the scale has been modified it is something else than 1)
* If you are planning to scale more, you should consider carefully whether there will be problems with too much detail or too little detail in the geometry or the textures of the model
* If an asset is scaled up, the texture will become more low-quality. When an asset is scaled down, it can become too detailed or high-quality compared to the other assets around it

== Problems created by scaling 3D models too much ==
* Scaling an asset too much is relative to the case
* If an asset is for example far away in the background, surrounded by fog or dark, it might be ok to scale up a lot, but the silhouette and textures should still look good for it to work in the context
* When you scale an asset in editor its polycount and texture resolution won't magically follow along
* Assets are made in a specific texel density (basically the texture resolution) and it will only work nicely in the original scale of the asset. The more it's scaled the worse and less consistent with the other 3D models it'll look
* Texel density information:
** [[Modo#Texel density Toolkit|Public Modo Texel density Toolkit]]
** [[3D Asset Workflow: Retopo and UVs#Optimizing the UVs|Public 3D Asset Workflow: Retopo and UVs Optimizing the UVs]]

=== Scaling up too much ===
* The texture resolution of the asset may end up being too low and blurry, and thus not cohesive with the rest of the assets in the same scene
* For the PC version of a game the scaled up asset's textures might look okay, but for example for a console version, where all the texture images might automatically be downsized, the textures can end up looking really pixelated, as everything has a lower resolution
* The polycount of the asset will not match the scale of the asset any longer and the asset starts to look more low-poly and angular
* A 3D asset is made with a specific polycount so that it has enough polygons to look smooth and nice in its intended size. A too large polycount isn't optimal either as that could affect performance
* The more the asset is scaled up, the worse and more low-poly and blocky its silhouette will look
* Even if a scaled asset's texture looks okay in the far away background, its silhouette can reveal it's been scaled

=== Scaling down too much ===
* The optimization will suffer as there will be way too many polygons, which will affect performance
* When a big asset is scaled to very small, the texture size will become too large compared to the scale
* The texture resolution may look too sharp and not coherent with the rest of the assets in the same scene

[[File:Level art guide scale 3d model texel density.png |700px]]

== Non-uniform scaling ==
* Non-uniform scaling is usually a big no-no, but there are some cases where it can be a better option than uniform scaling
* Non-uniform scaling means that when scaling the object the X, Y and Z axes will not stay the same. For example X:1, Y:1, Z:2, so the object will lose its original proportions and become stretched
* Things that should never be scaled in a non-uniform way: Round shapes, object’s geometry or texture having more than one directions, textures with patterns or images that don’t work stretched.
* If an asset has a clear direction and no specific (for example circular) shapes on its texture it might be okay to scale it along that direction
* Example case: If you need a slightly wider platform but uniform scaling will result in an asset looking too big. In this case the non-uniform scaling is not noticeable, even though the asset is stretched, and it can be seen in the UV visualization
* However, if the object's geometry has more than one direction, or small patterns in it (for example circular shapes), the non-uniform scaling doesn’t work

[[File:Level art guide non uniform scale 3d model texel density.png|1300px]]

Level Art: Color and Lighting

2021-11-23T14:25:07Z

Tero Tirkkonen:

{{:Level Art}} 

= Color is a combination of value, hue and saturation =
* Color is made of three things: '''VALUE, HUE''' and '''SATURATION'''
* Color is always relative and the context determines how colors are interpreted
* The most important aspect of color is the value of color, meaning the darkness or lightness of a color. This attribute will be seen even clearer if the image is turned into a grayscale mode
* Hue means the actual color, for example the hue of the color can be red, yellow, blue, orange, green, purple and anything between those
* The hue can be cold or warm, so there can be warm or cool temperature for the hue. This, as everything with colors, is always relative and depends on the other colors around the color in question. Colors always exist in some environment that affects them
* A hue can look warm next to a cooler hue or cool next to a warmer hue. A value can look darker next to a lighter value and lighter next to a darker value, and this is true for saturation too
* Saturation determines how vibrant the color is. A very saturated color is vibrant and desaturated color is muted and closer to gray
* Lighting and colors are always tied together. When designing a lighting, first determine what you want to achieve with the color choices and keep your intention in mind while building the lighting
* It's best to always think about the contrast. Where do you want to add contrast and guide the eye to look at using value, hue and saturation? And where do you want to keep attention away from with low contrast? Usually the answer is simply that we want to guide the player to the right direction and highlight important gameplay objects while fading the irrelevant things to the background. For transition areas between the puzzles we might also want to create beautiful visual focal points where the attention is completely directed at the art.
* We never want to create confusion or frustration by guiding the player to an area with nothing in there: For example by making an area that is difficult to reach look like there is an entrance to a secret and cause the player struggle to get there only to realize there's nothing in there after all.
* Here: [[Public Level_Art:_Level_Art_Related_Gameplay_Issues#Distracting_Level_Art|Level Art Related Gameplay Issues: Distracting Level Art]], are several examples of the issues dysfunctional colors and lighting can create for the player

[[File:color_wheel_hue_saturation_value.jpg|350px]]

== Gamut masking ==
* Gamut masking can be used to determine a color palette for a scene
* [https://www.youtube.com/watch?v=qfE4E5goEIc James Gurney: Gamut Masking]
* KGamut is a software that can be used to check the gamut mask of an image
* With KGamut you can for example compare the gamut mask of your level art screenshot with a gamut mask of a reference image to get closer to the reference image's lighting
* [http://cr10blog.blogspot.fi/2013/02/kgamut.html KGamut: a digital gamut mapping tool for Windows]
* [http://gurneyjourney.blogspot.fi/2013/02/digital-gamut-mapping-tool-for-windows.html KGamut info]
[[File:Kgamut beach 01 wide gamut.jpg |500px ]]
[[File:Kgamut beach 01 limited gamut.jpg |500px ]]

= Value =
With values you can create contrast or unity by using '''light and dark''' colors
* Some vocabulary:
** '''Value''' = the darkness/lightness, can be most clearly seen in a greyscale image but is present in a full color image as well
** '''Contrast''' = Relative difference between different values in an image. For example: there is a big (the biggest possible in fact) contrast between black and white and less contrast between gray and white
** '''Noise''' = small details with strong contrast that create visually noisy feeling
* With values (as well as other aspects of color) it is crucial to remember everything is relative! A value can look bright or dark depending on what value it is compared to
* When simplified, each image is just a bunch of different value blobs arranged into a composition
* The relative difference in the values between these blobs can be used to make things blend in or pop out
* To make things pop out doesn't always mean to make them super bright, because this won't work in a bright environment as everything else is bright as well. It's all relative to the surroundings so it's all about values and contrasts in each different context.
* If the difference between the values is big, then there is contrast which means that those things stand out more
* If the difference between values is small then there is no contrast and the things don't stand out but blend in instead
* Adjusting values in level art can be achieved with lighting, fog or albedo color or all of these
* In games we can guide the player's eye where we want, for example to concentrate on beautiful visual details or to important gameplay objects. At the same time we don't want the player to concentrate on irrelevant things.
* Irrelevant/background objects/areas should blend in
* Important objects/areas that need to be highlighted have to pop out by either being a dark object on a bright background or vice versa, simple as that!
* If the important object is surrounded by noisy irrelevant visuals it will be lost in the visual noise. So it's good to have clear surroundings for these important objects. That way the contrast can be controlled and adjusted to highlight the important objects and blend in the irrelevant things.

[[File:Visual noise contrast theory.jpg|400px]]
* A) The same level of detail and contrast everywhere creates a noisy feeling and it's hard to figure out where the focus should be
* B) Less detail and contrast in the environment and a higher level of detail and contrast in one area makes it much easier to decide where to focus

== How to check the true values of an image in Photoshop ==
* It's not as easy to see the different values and their relations while the image is in full color as the different hues and saturation can complicate things a lot
* It is crucial for any artist to be able to check the values of an image and the best way to do this is to look at the image in a grayscale mode
* The areas with most contrast between different values are the areas the eye catches first in an image
* If an image doesn't look good and clear in grayscale, it will not work in color mode either
* You might think that the hue/saturation adjustment or some other Photoshop grayscale adjustment works just fine but actually they don't

* To see the true values of an image in Photoshop use the proof color setup
** Select View -> Proof Setup -> Custom...
** "Device to Simulate: Dot Grain 20%", "Render Intent: Relative Colorimetric", "Black Point Compensation" checked
** Now you can switch between the basic color mode and the true greyscale mode to check the true values colors using CTRL+Y any time
** You can for example check a screenshot's values in Photoshop with this method when designing the lighting and colors or trying to find out how to make the scene clearer
[[File:True values.jpg|800px]]

== Guiding the player with values ==
* Simplify how you see forms and value. Everything you see is just blobs of value, it really isn't more complicated than that.
* It's either light or dark. A light colored thing pops out on a dark background, but blends in into a light background
* This is true for anything, any theme, foreground, gameplay area and background, for landscapes as well as characters
* What is the area with the most contrast in the scene? Is that where we want the player to look? If not, then the contrast is in the wrong place.
* Does the important thing lack contrast and blend in? Create contrast: if the thing is bright in value, put dark around it, if the thing is dark value, put bright around it.
* How to make the route clear? Guide the player with the values, have darker areas on the edges where the player is not supposed to go. Make sure the right path is clear and pops out.
* Pay attention to values and contrasts and use them to make important things pop out and unimportant things blend in

<gallery heights=400px mode="packed">
File:Owls dream overpaint 01.jpg| The gameplay route is same material and value as the background so it's hard to see the gameplay route
File:Cornelius dream overpaint 06.png| The background has noise so important things aren't highlighted enough and they are lost in the background
File:Gislans dream overpaint 11.png| The values are flat so they don't guide the player to the right direction
File:airy_fairy_overpaint_78.png| The values are random noise so they don't guide the player to the right direction

</gallery>

== Bring out the important gameplay objects with values ==
* Examples of situations where the gameplay area and objects aren't visible enough due to the value issues
<gallery heights=400px mode="packed">
File:Cornelius dream overpaint 04.png| The important gameplay items aren't clear as the values don't bring them out enough
File:Rudolfus dream overpaint 03.jpg|The spikes, the platforms and the gameplay area poles don't stand out enough. It could also be made clearer that the level doesn't continue to the left here.
File:Rudolfus dream overpaint 04.jpg|The chest and the gameplay area poles don't stand out enough. The background structures make the scene less clear.
File:Rudolfus dream overpaint 05.jpg|The lever, the platforms and the gameplay area poles don't stand out enough
</gallery>

== Create depth with values ==
* With values and contrasts you can create a sense of depth to a scene. Adding depth will make the general feeling less flat.
* A simple rule of thumb is that the closer a thing is, the more contrast it has and the further away it is the less contrast it has
* This is because of the atmosphere, the further away a thing is the more air with all sorts of dust particles, moisture etc. there is in between and they'll create "fog" that makes things blend together more and more the further they are. This fog can have its own hue too depending on the colors of the scene. For example if the sky is blue things get bluer the further away they are in the background.
* This is a powerful tool to create depth and separate the different layers of depth: foreground (can be several layers), game area and background (can be several layers) in the scene
* It's a common problem in level art that some things on the background appear as if they were on the gameplay area and this can be helped with clear levels of depth
[[File:Level art guide values and depth.jpg|1200px]]

= Hue =
With hues you can create contrast or unity by using '''warm and cool''' colors
* The understanding of the contrast between warm and cool hues is a great tool when building the color scheme of a scene
* For example The color of the light can be warm orange while the color of the shadows is cool blue, this creates an appealing contrast between the light and shadow areas
* The hues of the sunlight will change depending of the time of the day and also different seasons throughout the year affect the colors as well as the humidity or cleanliness of the air
* Do use real life as a reference for creating different lighting scenarios. Even though Trine world is a fantasy world we want to stick to believable real lighting scenarios that people recognize.
* We can take real world lighting and emphasize and exaggerate it, but everything should start from a deep understanding of realistic lighting
* Different light sources have different hues in them, normal fire has orange tones but different magical elements can turn lights into all the different hues. Magical mushrooms or crystals for example can glow in any hue!

[[File:color_theory_hue_temperature.jpg|1300px]]

== Hues Indicating Emotions ==
* For example many movies use a certain color to communicate a certain mood, you can observe this yourself though often it's done in a quite subtle way
* The different hues of colors can be used to create different types of mood and to communicate a certain emotion visually
* Any color can be chosen to communicate any mood as long as the colors chosen for the specific moods stay consistent throughout the game
* There are certain hues that tend to be used for certain moods more often depending on the cultural environment so using those stereotypes as is or turned on their head can be ways to use hues to indicate moods
* Here is just one example how the hues could work consistently supporting the mood and emotions of the story
[[File:Environment_design_colors_and_emotions_example.png|400px]]

== Examples of using hues to determine the mood ==
<gallery heights=200px mode="packed">
File:Trine 4 screenshot 01 1080p.png| Light pastel colors to establish a calm environment
File:Trine 4 screenshot 02 1080p.png| Warm and welcoming feeling with yellows and oranges
File:Trine 4 screenshot 06 1080p.png| A warm and cozy color scheme for the friendly Badger's home den
File:Trine 4 screenshot 05 1080p.png| Lush green calming environment
File:Trine 4 screenshot 39 1080p.png| This environment is meant to be uninviting and menacing so pale cool greenish blue hues are used to achieve that atmosphere
File:Trine 4 screenshot 20 1080p.png| Menacing mysterious feeling created with purple tones
File:Trine 4 screenshot 23 1080p.png| Calm and more friendly mysterious feeling created with blue tones

</gallery>

= Saturation =
With saturation you can create contrast or unity by using '''vibrant and muted''' colors

* Saturation means the purity of the hue
* With maximum saturation the color is purest and most vibrant and with less saturation the color turns more towards gray
* Just like with values and hue you can also use saturation to guide the eye of the player
* In a desaturated environment a saturated spot will grab your attention
* Trine series is known for its colorful environments but being colorful doesn't mean that every color has to be at the maximum saturation
* If everything is very saturated it can become visually overwhelming quickly so generally it's good to be mindful when deciding which areas should have a lot of saturation
* The saturation can also be explored using gamut masks mentioned earlier in this article

Level Art

2021-11-23T14:24:30Z

Tero Tirkkonen:

<onlyinclude>
<div style="float:right; width:40%; padding-left: 20px;">
'''Related sites'''
* [[Level Art]]
* [[Level Art: Color and Lighting]]
* [[Level Art: Composition]]
* [[Level Art: Environmental Storytelling]]
* [[Level Art: Ideas for New Levels]]
* [[Level Art: Level Art Related Gameplay Issues]]
* [[Level Art: The Level Art Phases]]

</div>
</onlyinclude>

== Level art workflow steps ==
[[File:level_art_wiki_header_banner_process.jpg]]
* Level artists create the visible game environment built on the collision block base created by designers.
* Level artists work with the Frozenbyte in-house engine and editor.

<br>
# '''The Idea''' - a mental image to work towards. The Idea is shaped and refined by reading the script, exploring the concept art and level wiki site and communicating with different team members like the AD, designers, the scriptwriter and/or other artists.
#* '''Outline meeting''' can occur before the design work has even started, gathering all the people working on a level to plan and discuss.
#* ''' Collecting reference''' includes researching the topic by searching inspirational reference images. Pinterest, for example, is a good online source for reference images.
#* ''' Level collision base meeting ''' takes place before the level art phase begins. The AD, level artists, designers and other related people working on the level are involved.
#* '''Preassembly''' can happen when a designer works on a level file, making it impossible for a level artist to access the same level. The artist can build level art arrangements to a separate file, requesting feedback from the AD during the preassembly.
# '''Base art''' - The Base art phase includes establishing a preliminary lighting setup, blocking the level art and building a strong and working base supporting the gameplay. Base art should be kept simple, concentrating only on the big forms and covering all the bare collisions.
#* '''AD's camera check''', done in collaboration with the designers, is followed by a camera fix list. It guides to adjust the cameras so that their positions are optimal for both the gameplay and art.
#* '''AD's base art check''' results in a fix list that may include paint-overs advising on how to improve the base art.
#* '''Base art fix round''' includes optimizing the camera positions and improving base art according to the feedback of the AD.
#* '''Lighting adjustments'''
# '''Detailing''' - Once the base art meets the requirements, details are added.
#* '''AD's details check''' results in a fix list that may include paint-overs advising on how to improve the level art.
#* '''Details art fix list round''' has the artist improving the level art based on the AD's feedback.
# '''Polish''' - Polishing happens at the end of the project when there's spare time. It consists of improving the level art by, for example, adding new 3D assets, documenting significant changes with before and after screenshots and consulting the AD.
#* '''Polish and optimizing''' includes general level art polishes, lighting adjustments and optimizing things.
#* '''Playing the game''': should be a daily level artist routine. Only by playing the levels you can evaluate the quality of the level art and make sure the level art supports the gameplay as much as possible. The level artists should play the game together in co-op, as well, to observe level art in a multiplayer mode and share ideas. <br>

=== Things to consider ===
* Working with the level art is '''an iterative process''': Art is created layer by layer, starting from the crude, bigger forms and ending with the detailed, final art.
* The aim is to keep the whole level at '''a consistent state at all times''' and only add finer details once the big forms are satisfactory.
* Level art is a process of continuous development. Nothing is final after the first round, and sometimes whole level areas might be reworked entirely. Large, creative projects always involve some degree of adjustments and alterations, but there are several reasons why level art can be subjected to a change:
**'''All the assets might not be available''' during the initial level art work, forcing the level artist to use temporary assets. They need to be replaced with new ones later, which can be time-consuming.
**'''The design can change''', also affecting the level art.
**'''A new and better visual idea for a scene might emerge''' at any point during the development.
**'''Technical changes''' sometimes require level art reworking.

=== Additional tips about the creating process ===
* '''Play the game''' It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game!
**The level artist's responsibility is to ensure that the level art supports the gameplay in each part of the level.
**The player can only see what the in-game cameras are showing, making play testing the level even more important.
*It's essential to get '''the scale''' of the environment right as early as possible. '''Always have a game character model as a scale reference''' when you start blocking the level art.
** Generally, the assets in the background of a level tend to look smaller than you might expect, and you might have to scale up those assets slightly to make them look better in the game. Commonly, in-game assets are bulkier and larger than their real-life counterparts since that helps them stand out in the game. However, you should be careful when scaling assets, as the texel density (texture resolution) and geometry get easily incoherent.
** How to nail the right scale: [http://www.neilblevins.com/art_lessons/details_make_big/details_make_big.htm Using Details To Make Something Look Big By Neil Blevins]
* ''' Flexible level art work'''
**Sometimes you might be in a hurry to finish the level art, but the design is unfinished, leaving you unable to work on the level file.
** In a situation like this, it's best to communicate with the designer to determine whether some areas of the level are already finished. You can create a copy of the level to start your level design work, and when the design is complete, just copy and paste the level art to the actual level.

* ''' Links for learning'''
<div class="toccolours mw-collapsible mw-collapsed" style="background-color: #e6f2ff; border-width:2px; border-radius:10px; margin: 5px;">
Some general art fundamentals tips that are useful for any game artist:
<div class="mw-collapsible-content">

'''Lighting'''
* [http://gurneyjourney.blogspot.com/search/label/Color%20and%20Light%20Book Color theory: James Gurney's blog]
* [http://www.itchy-animation.co.uk/tutorials/light01.htm Lighting Fundamentals for Artists]
* [https://www.youtube.com/watch?v=MVafJfV5xhI Nathan Fowkes 'Better Options for Color Vibrance' ]

'''Composition'''
* [http://www.neilblevins.com/art_lessons/areas_of_visual_rest/areas_of_visual_rest.htm Neil Blevis: Areas Of Visual Detail, Areas Of Visual Rest]
* [http://www.neilblevins.com/art_lessons/clumping/clumping.htm Neil Blevis: Clumping and Grouping]
* [http://www.neilblevins.com/art_lessons/compositional_weight/compositional_weight.htm Neil Blevis: Compositional Weight]
* [http://www.neilblevins.com/art_lessons/composition_contrasts/composition_contrasts.htm Neil Blevis: Contrasts In Composition]
* [http://www.neilblevins.com/art_lessons/foreground_midground_background/foreground_midground_background.htm Neil Blevis: Foreground, Midground, Background]
* [http://www.neilblevins.com/art_lessons/layers_of_light_and_dark/layers_of_light_and_dark.htm Neil Blevis: Layers Of Light And Dark]
* [http://www.neilblevins.com/art_lessons/primary_secondary_and_tertiary_shapes/primary_secondary_and_tertiary_shapes.htm Neil Blevis: Primary, Secondary and Tertiary Shapes]
* [http://www.neilblevins.com/art_lessons/details_make_big/details_make_big.htm Neil Blevis: Using Details To Make Something Look Big]
* [http://www.neilblevins.com/art_lessons/tangents/tangents.htm Neil Blevis: What is a Tangent? And How To Solve Them]

* [https://www.deviantart.com/lulie/art/The-Secret-to-Composition-272036625 The secret to composition]
* [https://twitter.com/eyecager Composition tips etc by Amber Blade Jones]
* [https://www.youtube.com/watch?v=qMH_J_vcoqE&feature=youtu.be&list=PLa1F2ddGya_9XER0wnFS6Mgnp3T-hgSZO Gleb Alexandrov's presentation about balance and composition of elements in creating appealing works]
* [https://youtu.be/GZ99gAb4T0o The Importance of Nothing: Using Negative Space in Level Design]

'''Environmental storytelling'''
* [https://www.youtube.com/watch?v=iemcI0t096I Sam Nielson's lecture about environment design]
* [https://www.youtube.com/watch?v=griCsvvRTQM Sam Nielson's lecture about atmosphere]
* [https://youtu.be/FeUL-5wfj0U?t=3m29s The Art of Environment Storytelling for Video Games GNOMON]
* [https://vimeo.com/165693758 Mike Hill's lecture about Spielberg's Subtext]

'''General creative development'''
* [http://www.neilblevins.com/art_lessons/art_lessons.htm Neil Blevis: Various art tips]
* [https://www.youtube.com/channel/UCbdyjrrJAjDIACjCsjAGFAA Feng Zhu design school videos. All kinds of stuff about painting/design/color etc.]
* [http://wiki.polycount.com/wiki/Polycount Polycount wiki. Basically everything you need to know about game art is found here]
* [https://www.youtube.com/user/McBacon1337/videos Game Maker's Toolkit. Interesting and well-made videos about game mechanics in different games by Mike Brown.]

</div>
</div>

= Building a Level =
== Ideas for New Levels ==
[[Level Art: Ideas for New Levels]]<br>
[[File:level_art_wiki_header_banner_ideas_for_new_levels.jpg|800px]]

== The Level Art Phases ==
[[Level Art: The Level Art Phases]]<br>
[[File:level_art_wiki_header_banner_level_art_phases.jpg|800px]]

== Environmental Storytelling ==
[[Level Art: Environmental Storytelling]]<br>
[[File:level_art_wiki_header_banner_environmental_storytelling.jpg|800px]]

== Level Art Related Gameplay Issues ==
[[Level Art: Level Art Related Gameplay Issues]]<br>
[[File:level_art_wiki_header_banner_gameplay_issues.jpg|800px]]

= Level Art Fundamentals =

== Composition ==
[[Level Art: Composition]]<br>
[[File:level_art_wiki_header_banner_composition.jpg|800px]]

== Color and Lighting ==
[[Level Art: Color and Lighting]]<br>
[[File:level_art_wiki_header_banner_color_and_lighting.jpg|800px]]

Level art task

2021-11-23T13:54:00Z

Tero Tirkkonen:

[[File:Task1.png|right|thumb|700px|Blocked level art base geometry, guide for the level art assignment]]
[[File:Task3.png|right|thumb|700px|A area and B area]]

= Level Art Assignment =
* Your task is to complete the given collision-blocked map. We are looking for an appealing and coherent end result. Your work doesn't need to be 100% finished, but it should give us an idea of your skills with asset placement, composition and lighting.
* You can, for example, create a level art base that could be continued later by adding more detailed level art elements and assets.
* Feel free to change the level in any way you want to make it more to your liking. For example, you can continue the map and design your own area displaying your talents from blocking to the finished level art.
* You can refer to Trine 3 levels, especially the tutorial levels, for inspiration. It's not forbidden to copy some parts of the Trine 3 levels as long as you blend them with your own unique level.
* We recommend using Trine 4: The Nightmare Prince and Trine 4: Melody of Mystery as visual references as well.
* We can see your potential even from a small area brimmed with polished and high-class art - no need to stress yourself over the amount of material needed. Quality overcomes quantity every time!

== Assignment info ==
* Create an environment using the '''Trine 3 editor'''
* The task should be completed in '''4 weeks'''
* Familiarize yourself with the Trine style level art by reading the necessary '''[[Public Level Art]] pages'''.
* Once you have finished the task, please return '''the map file''', so we can play your level and see your level art from the player's perspective.
* Record '''a video''' where you run through the level and showcase your work. We might not have enough time to play your level, so consider this video as the most important piece of your assignment and the main reference we use when evaluating your work.
* Add between '''2-8 screenshots''' of your favorite spots on the level.

=== The mandatory task ===
* Note: You must complete the task described here to apply
* The level has two areas: Area A and Area B. Area A comes with already-blocked collision boxes to give you an example of the terrain shapes to use
* Build your level art on top of Area A
* Build the lighting setup as well. Use atmospheric effects, like fog, to make the environment feel more believable.
* Create a strong and well-working base geometry. We're looking for something that is both interesting and visually pleasing. The level should have a clear theme.
* The most important aspects of your work are composition, asset placement and lighting.

=== The optional task ===
* Note: This part is not required to apply, but if you're willing, feel free to do it as well.
* Area B has no shapes, as we'd like to see you creating the base geometry there.
* Area A and Area B can be of the same size, but if you want to build a custom-sized Area B, that's fine as well.
* Please leave the collision box blocked shapes to the collision layer, so we can see the base shapes you've used.

=== You will get bonus points for ===
* Demonstrating your ability to transform your unique ideas to a well-executed level art.
* Using the available game assets creatively
* Polished end result
* Clean and optimal approach to level-building, making it easy for others to continue editing your level.

== General Level Art Workflow Tips ==
* Check out the content of our [[Public Level Art]] sites to familiarize yourself with our level art process and the basics of level art theory. There's plenty of tips available, too!
* Don't be afraid to hijack our assignment and take it in any direction you want to, as long as it shows off your abilities as a level artist. We want to see your visual level building skills, so show them the way that suits you best.
* You can use any assets in the Editor, but try to keep your level coherent and sensible. On the other hand, don't forget that Trine is a fantasy world where anything is possible.
* Keep the limitations of the real-time 3D in mind when creating the environment and use assets with optimization in mind.
* Keep the collisions on the collision layer and add art on the art layer.
* Pay special attention to the composition, asset placement and lighting, as those are the aspects we're most interested in.
* Start with the big shapes. When they are satisfactory, concentrate on the finer details. Use an iterative approach, building the whole level layer by layer.
* Do not scale the objects too big, causing the texture resolution to suffer. A good rule of thumb is that you can scale an asset 20% bigger or smaller than the original size. You can, of course, break these rules if the final result looks amazing.
* Don't forget the lighting, but carry it along the whole level art process starting from the very beginning. Considering lighting implementation is crucial when placing assets into the scene - and so is adjusting the lighting while progressing with the level art.
* The assets can be used in many ways: Don't let obvious approaches or any assumed purpose restrict your creativity! As long as it looks good, anything is allowed.
* When creating a level for an actual game project, you need always to consider gameplay aspects carefully. In this assignment, however, we're evaluating your artistic eye, so don't worry if your gameplay isn't fine-tuned. For example, it's not crucial to match all the collisions perfectly everywhere.
* Remember to test your level with actual characters and run around in your level. We're looking only at those things that the player can see through the cameras while playing the level.
* To come up with interesting ideas for your environment, we recommend using real-life geography and/or architecture as reference material. For this task, you can also use other games (especially Trineverse games) as references.
* Don't worry too much if using the Editor feels difficult at first. Focus on showcasing your skills at creating believable environmental settings by building appealing shapes and lighting arrangements.
* You'll use the publicly released Trine 3 Editor for this assignment. Our current in-house Editor differs a lot from the Trine 3 version since it has undergone a lot of upgrades and improvements. For example, it has a new renderer with pbr materials and a lot of new assets that are all missing from the Trine 3 Editor.
* If we'll hire you, you'll be trained to use our latest Editor version.
* If you have problems with the Editor, please don't hesitate to contact us.

= How To Use Trine 3 Editor =

This page should have all the basics you need to know to learn how to use the editor. It is a lot of information and work to learn to use a new tool and to build a level so we encourage you to ask in case you run into any problems. Just send us any questions you've got and we'll help you to get back on track! The most basic necessities for any map are CamerasystemPrefab, AmbientLightEntity and ColoreffectEntity, they have been added to the map already. After that come collisions and art assets follow. There are many assets for creating beliveability and atmosphere to the level. Lights and fogs for example are very important when creating the look of the level. Try checking the Trine 3 levels and how these things are done in them, for example how waterfall effects in Amadeus's Beach Tutorial level are built. The tutorial levels are all in one level file vertically placed so for the Amadeus's level you need to travel down quite a bit to get there in the Editor.

== Basic windows in editor ==

=== Object properties ===
Show '''Object Properties''' dockable window using '''View > Object Properties''' or using '''Ctrl + P'''.

With this window you can modify object's properties.

The properties inside components can be set in alphabetical order from the editor settings: Tools > Options > Properties > "Order Properties In Property Grid".

Components and properties can also be [http://wiki/index.php/Search_properties_and_components_in_Object_Properties_window searched] for inside the window.

=== Scene instance tree ===
Show '''Scene instance tree''' dockable window using '''View > Scene instance tree''' or using '''Ctrl + F2'''.

With this window you can see all instances in the scene/level.

=== Type tree ===
Show '''Type tree''' dockable window using '''View > Type tree''' or using '''Ctrl + F3'''.

With this window you can find entites/types which can be inserted into scene/level.
For example all the 3D art assets, lights and fogs can be found here.

=== Category ===
Show '''Category''' dockable window using '''Categories > Category root''' or using '''Ctrl + Shift + F1'''.

Category window is a configurable window, where you can insert shortcuts to entities/types which you want to insert into scene/level.

=== Resource tree ===
Show '''Resource tree''' dockable window using '''View > Resource tree''' or using '''Ctrl + F4'''.

With this window you can see all the [[resource]]s which are available.

=== Recent objects ===
Show '''Recent objects''' dockable window using '''View > Recent objects'''.

With this window you can see recent types you have used.

=== Modules ===
Show '''Modules ''' dockable window using '''View > Modules'''.

With this window you can modify Module properties which affects various things in editor / engine.

=== Error list ===
Show '''Error list''' dockable window using '''View > Error list'''.

This window shows errors, warnings and info messages generated by editor and engine. Very usefull tool for debugging what's wrong.

=== Reference list ===
Show '''Reference list''' dockable window using '''View > Reference list'''.

When selecting some type or instance you can see '''ReferenceString''' property in the '''Property Window''' and by clicking it with mouse right button and selecting '''Show Reference list''' from the context menu, you can print type's or instance's reference list into this window.

== Basic controls in editor ==

=== Moving camera ===
* WASD - Move camera
* Shift + WASD - Move camera faster
* Right mouse button and drag - Rotate the view

You can also press any of the axes on the editor gizmo on the right upper corner. Pressing on the axis changes the camera rotation to coincide with that axis.

[[File:Gizmo.png]]

=== Object selection ===
* Left mouse button - Select object
* Alt + Left mouse button - Select object behind another object (You may need to click multiple times to select the desired object)
* Shift + Left mouse button - Select multiple objects
* Ctrl + Left mouse button and drag - Box select, select objects in area (if you are selecting a vast amount of objects at once it can be a good idea to de-select View->Tree Update Enabled so the procedure will be faster, but do remember to re-select it after, otherwise you won't be able to operate the object properties)

=== Tool selection ===
* 1 - Move tool
* 2 - Rotate tool
* 3 - Scale tool
* 4 - Area tool
* 6 - Scale specific side tool

=== Copying and pasting ===
* Ctrl + C - Copy selected object(s)
* Ctrl + X - Cut selected object(s)
* Ctrl + V - Paste copied object(s)
* Ctrl + Shift + V - Paste copied object(s) onto the same coordinates they were copied from
* To duplicate an object, hold Shift and move object from one of the arrows while having move tool selected
* You can copy & paste items between separate levels too

=== Undo and Redo ===
* Ctrl + Z - Undo
* Ctrl + Y - Redo

=== Other useful buttons ===
* Space bar - Toggle between Global, Local and Screenspace transform and rotation
* K - Allows you to see lights through collisions
* J - Makes the lights stay the same size no matter how far you are from them
* Ctrl + T replaces selected instance in the scene with the type selected in type tree
* L - Hides lights
* G - Hides lights and all objects that don't have the VisibleInGame on
* P - Selecting an instance within a scene and pressing P Locates selected instance in the type tree
* Ctrl + G - Hides grid
* Control + Left click on a layer hides it.

=== Editing objects ===
Click an object you want to edit in the level. Three arrow or circles should appear depending on what tool you have selected. Use these arrows/circles to move, rotate and scale the object on X, Y and Z axis.
'''Note: You can select objects only from currently selected layer. Change layer by clicking Def., Col., 1, 2... from the tool bar or with Alt + 9, 0, 1, 2, ...'''

[[File:layers.png]]

It's also possible to choose objects on any layer if you want to. Go to Selection -> Selection filter locking and untap the '''Allow selection on active layer only'''.
Just make sure that you keep objects on their dedicated layers if you decide to use this.

=== Editing object properties ===
To edit an object's properties you need to open up the '''Object Properties''' dockable window via '''View > Object Properties''' and then selecting the Object you want to Edit.

=== Adding objects ===
Objects can be added from Type tree window. You can open it from '''View > Type tree'''. Use the Search field to find the objects you are looking for. Most of the time objects you want to use are located under '''TypeRoot/InstanceBase/Entity'''. Also remember to deselect any selected objects in Type tree before searching again.

Finding the right object from the type tree can be quite tricky if you don't know the exact name of the object. A good way to start is to copy them from existing maps.

When inserting objects, you can press and hold Shift and/or Ctrl. Holding Shift attempts to snap the object next to another object, when you move the object above an object already on the scene. Holding Ctrl snaps the movement of the object to the grid.

=== Testing map in editor and saving ===
To test your changes in editor press green play button (F5) to start the level or blue play button (Ctrl+F5) to start from camera position.

To return to editor from play mode, press the blue stop button (Shift+F5).

[[File:play_buttons.png]]

=== Some tips about the type tree ===
TypeRoot -> InstanceBase -> Entity -> ObjectEntity -> object You will find all the objects here

TypeRoot -> InstanceBase -> Entity -> LightEntity You will find all the lights here

Finding items in type tree can be a little bit tricky at times as some tiny problems may occur. When you search for something that has multiple types under it they might not show for some reason.
For example if you search for RockCollisionHelper in the type tree it might only show the RockCollisionHelper instead of all it's variations like BookRockCollisionHelper etc. This can be fixed by either
searching again by typing the desired thing in the search bar or manually clicking the tree to find it.
Also after using one object and then trying to find another object in the type tree, make sure to check the object you used isn't active anymore. Otherwise the Search bar won't search anything.
You can just click anywhere in the empty part of the map to make sure you don't have any object active.

=== Other useful tips ===

Tools -> Options -> properties -> Order Properties In Property Grid to get properties in property window ordered alphabetically

Tools -> Options -> Tool -> Selection highlight self illumination enabled to get rid of the blue highlight when selecting objects

The collisions have VisibleInGame on in this map so that you can see them when you play. It's good to turn them of after you have addded art on them so that you can take a better look at the art. You can make the collisions invisible by choosing the collision, going into its properties and tapping VisibleInGame off from the ModelComponent.

== Lighting in editor ==
[[File:Trine3_lights.gif|thumb|A gif showing the effects of different types of lights on the scene.|480px]]
This page lists the most important LightEntities found in the editor and sheds some light (no pun intented) on their usage. There's a lot of general information about lighting in 3d games and related topics in the internet and elsewhere, so the interested reader is encouraged to do some independent searching for more in-depth discussion. Don't be discouraged by the large number of different properties that the LightEntities might have, most of them work with their default values.

What follows is a general overview of the different light entities you can find in the editor. In addition to general discussion, there are some examples of how each entity should be used.

=== AmbientLightEntity ===
Ambient lights are used in Trine 3 (and in games in general) to emulate the real world phenomenon of [https://en.wikipedia.org/wiki/Radiative_transfer radiative transfer] (energy transfer in the form of electromagnetic radiation, e.g. light). After photons are emitted, they are scattered, absorbed and re-emitted multiple times before finally reaching the viewer. This is one of the reasons why in nature there are no completely sharp or black shadows and that it's hard to find a completely dark place during daytime.

'''AmbientLightEntity''' is most often used as a global ambient light to set the base tone of the scene. If both color components are identical, they will create the effect of a uniformly lit scene. AmbientLightEntity can also be used as a directional light of sorts, if the Color2 component is a darker shade than Color1 component, as it is by default. This still mimics the behaviour of radiative transfer (absorption, emission, scattering), since AmbientLightEntity can't create shadows.

=== DirectionalLightEntity ===
[[File:Directional.png|thumb|DirectionalLightEntity causing an orthographic projection of shadows.]]
[[File:Directional_sunset_on_off.gif|thumb|A DirectionalLightEntity used in Pontius's tutorial for "sunset effect".]]
Directional lights are lights that emulate a light source that is infinitely wide and infinitely far, thus "emitting" light rays that are precisely parallel to each other. On Earth, direct sunlight can be approximated as parallel rays of light, and thus directional lights are used in Trine 3 to emulate sunlight and the sharp shadows caused by it. Another common use for directional lighting is a so-called skylight.

On an overcast day when no direct sunlight reaches the ground, objects are still clearly visible and lit. This is due to the light scattering from particles and water droplets in the atmosphere and reaching the ground through the clouds. The same phenomenon causes the sky to look blue during daylight and to be bright and colourful at all. If there was no atmosphere, there would be minimal scattering of light, resulting in a very dark sky and extremely harsh direct sunlight (among other, perhaps more lethal things), although the Sun would appear to be smaller in size. This is the physical phenomenon called [https://en.wikipedia.org/wiki/Diffuse_sky_radiation "skylight"], which is emulated in Trine 3 with a shadowless directional light that is perpendicular to the ground level, i.e. pointing straight down.

Although the effects of skylight and ambient light in the real world are based on the same physical principles (radiative transfer), in Trine 3 they aren't the same thing. Ambient light emulates the light that has already reached the ground and is just "bouncing back and forth" between different objects making everything look more or less the same from any viewing angle, whereas skylight is the diffuse light "coming straight down from the sky", making things look lighter and brighter from above rather than from below.

'''DirectionalLightEntity''' is a local directional light which uses an [http://db-in.com/images/projection_example.gif orthographic projection] instead of a perspective one. It's local in the sense that it's borders (field of view and range) can be chosen at will so that the light is projected only to a certain area. Most often DirectionalLightEntity is used as a local skylight for the background objects or to create other local but large-scale lighting conditions, like the appearance of a setting sun, as it was used in the beginning of Pontius's tutorial level.

'''SunDirectionalLightEntity''' is a global type of DirectionalLightEntity. It's range and field of view don't have any effect on it like they do on local directional lights. Like other directional lights SunDirectionalLightEntity casts orthographic shadows, but unlike any other light in the editor (except for AmbientLightEntity) it's position doesn't determine "where the light is coming from". The direction of the light can be changed only by rotating the SunDirectionalLightEntity, because it's thought to be infinitely far away.

=== PointLightEntity ===
[[File:Point.png|thumb|A PointLightEntity doesn't cause shadows.]]
[[File:Alpha_point.png|thumb|Fog and a PointLightEntity with RenderAlphaObjects.]]

Point lights are considered to be minuscule points that radiate isotropic light i.e. light that's the same in all directions. In the real world, only stars other than the Sun are considered point sources of light due to the great distance separating them from Earth. The closest thing to a point light on Earth is a light bulb without a lampshade. Since light bulbs without shades are a quite rare thing to see, point lights aren't a very authentic way to light a scene. The good thing is, they can be used together with other sources of light to create more natural lighting conditions. Point lights are also a very good way to highlight something and to make even small details easy to spot.

'''PointLightEntity''' is Trine 3's basic point light. It's color, intensity and range can be chosen to match the desired situation, whether it's large-scale orange-white light coming from bubbling lava or just a tiny speck of light coming from a glowing pink mushroom. PointLightEntity can also be used to cast light on only alpha objects, that is, objects like fog which don't have a solid frame.

PointLightEntity doesn't cast shadows at all and thus its light isn't blocked by any collisions or models. Be sure to take this into account, when you set the intensity and range of your point lights. Speaking of which, range and intensity can be tweaked with the '''scale tool''': When scaled from the middle of the scale tool's gizmo, both range and intensity are affected. When scaled on the green Y-axis, only intensity is affected, where as red x-axis affects range only. Blue line does nothing.

=== AmbientPointLightEntity ===
[[File:Ambient_point.png|thumb|An AmbientPointLightEntity is a local ambient light.]]
Ambient lights were discussed above and [[#AmbientLightEntity]] was said to be used as a global ambient light to set the tone of the scene. Like local directional lights, there are also local ambient lights. PointLightEntity can be used as a local ambient light by changing the property called '''AmbientFactor'''. When this is 0, the PointLightEntity works as a normal point light, but the closer it is to 1, the more it behaves like a local ambient light. This kind of local ambient light works in the same manner as global ambient lights, except it's range can be chosen at will.

=== PointLightEntity with RenderAlphaObjects ===
PointLightEntities can also be used to light alpha objects, like spiderwebs, fogs, clouds etc. In Trine 3 editor the '''RenderAlphaObjects''' property can be set to turn a PointLightEntity into an "AlphaBlendPointLightEntity".

It's noteworthy, that once '''RenderAlphaObjects''' is on, changing the '''Range''' property isn't anymore enough to change the actual range of the light, also the '''Radius''' property should be changed to the same value under PointLightComponent-->PointLightAreaComponent-->SphereAreaComponent->Radius. This only applies to manual editing of Range and Radius, if the scale tool is used to change the range of the point light, the radius is increased automatically.

=== SpotLightEntity ===
[[File:Spot.png|thumb|A SpotLightEntity and a perspective projection of shadows.]]
[[File:Shadow_quality_4.gif|thumb|SpotLightEntity shadows flickering on and off]]
Spot lights are like directional lights but the light projection is different. The light is projected in a cone and the shadow projection is perspective instead of ortographic. A flashlight is an example of a spot light. Spotlights are usually used in combination with point lights to create more realistic lighting conditions.

'''SpotLightEntity''' is the spot light of Trine 3. It shares many of the properties with DirectionalLightEntity (and SunDirectionalLightEntity), since DirectionalLightComponent is a child type of SpotLightComponent. A SpotLightEntity's range, color, intensity, fov and many other properties can be changed at will to reach the desired lighting conditions. SpotLightEntity has also a property called LinearFade. If it's false, the light attenuation of the spot light is more "natural" and fades faster. If set to true, the intensity of the spot light fades linearly, i.e. it's value decreases like 1.0/distance (instead of 1.0/distance squared).

SpotLightEntities have '''ShadowQuality''' set by default to ShadowQuality4. If there are more than four SpotLightEntities with ShadowQuality4 in view, the shadows will start flickering. The same applies to SpotLightEntities with lower ShadowQuality so that
* 4 x ShadowQuality1 = 1 x ShadowQuality2
* 4 x ShadowQuality2 = 1 x ShadowQuality3 and
* 4 x ShadowQuality3 = 1 x ShadowQuality4

All in all there can be a maximum number of 10 shadow casting SpotLightEntities in view at the same time.

<gallery>
File:Ambient_prop.png|AmbientLightComponent
File:Point_prop.png|PointLightComponent
File:Alpha_point_prop.png|Radius, Range and RenderSolid/AlphaObjects.
File:Spot_prop1.png|SpotLightComponent, DirectionalLightComponent and SunDirectionalLightComponent have the same properties, with slightly different settings.
File:Spot_prop2.png|SpotLightComponent cont.
</gallery>

=== ColorEffectEntity ===
[[File:Coloreffectentity.gif|thumb|Different ColorLookupTextures.]]
'''ColorEffectEntity''' is a scene wide effect that sets the tone of the scene. The '''Exposure''' property can be used to change the exposure of the whole scene, i.e. to make the scene globally darker or lighter. The '''ColorLookupTexture''' property can be used to choose a color look-up table from the ones created for the game in question. These can be found under \data\root\instance_base\entity\texture\color_lookup.

=== Bloom ===
[[File:Bloom_lens_flare.gif|thumb|Lens flare effect of bloom.]]
[[File:Bloom_effect_entity.png|thumb|BloomEntity]]

=== General ===
Bloom is a shader effect used in game engines to emulate imaging artifacts of real-world cameras, like [https://en.wikipedia.org/wiki/Lens_flare lens flare], [https://en.wikipedia.org/wiki/Dynamic_range#Photography finite dynamic range] and [https://en.wikipedia.org/wiki/Airy_disk airy discs] caused by the diffraction of light.

In game engines, bloom effect can be used to create a dream-like visual style or emphasize a magically glowing objects. With the right settings it can also enhance the photorealism of the scene by emulating the above mentioned effects.

=== BloomEntity in the editor ===

BloomEntity (BE) can be found from "InstanceBase/Entity/SceneEntity/BloomEntity". BE is a global effect and it has many properties in it's GlowComponent, but most of these don't need to be touched by the user. The two most important ones are:
* Factor
** Determines the weight of the particular BE, if there are more than one in the scene. Mostly used for animation purposes.
* StreakLength
** Setting this to 0 removes the lens flare effect, which is dependant on the relative direction of the BE.

=== Properties of glowing objects ===

Normal entities can be made to glow, like the collisions used in the pictures. Every entity with a ModelComponent has four properties that determine their behaviour with BE. These are:
* SelfIllumination
** The colour of the self illumination. Like the name says, used for objects that are supposed to be self illuminated, like sun, moon and lamps.
* SelfIlluminationFactor
** The strength of the self illumination. Example values used for different entities are 1000 for sun, 2 for moon and 15 for a bright lamp.
* GlowAmountColor
** The colour of the glow effect. Like self illumination, but this adds a soft halo around the object.
* GlowAmount
** The strength of the glow effect. Values usually around or less than 1.

Usually self illumination and glow are used together to achieve the best result.

<gallery>
File:self_ill.png|Self illumination.
File:Glow.png|Glow.
File:Combined.png|Self illumination and glow combined.
</gallery>

=== Additional Shadows ===
There are 3 kinds of shadows: '''fake_shadow_gradient.fbxmodel''', '''fake_shadow_gradient_radial.fbxmofel''' and '''fake_shadow_solid.fbxmodel'''. The solid one is used to block lights by placing the black area to point towards light source (the other side is invisible).
The other two are used to give walls etc some extra shading.

Some ground art pieces are kinda bumpy and there are times when they might look a little bit funny after lights have been added. This can be fixed by using ShadowBias that can be found on the object's properties and changing it to 0.1. Below will be examples and you can see how big the difference is.

<gallery>
File:Level_art_tutorial_withoutshadowbiasv2.png|Before adding ShadowBias
File:Level_art_tutorial_withshadowbiasv2.png|After adding ShadowBias
</gallery>

=== Fog ===
Fogs can be found in Typeroot -> InstanceBase -> Entity -> ObjectEntity -> object -> atmosphere-> fog

'''CircleFogAreaEntity''' and '''SquareFogAreaEntity''' are used to create atmospheric effects and distance fog. It can be found in the type tree under LightEntity. FogAreaEntities work similiarly to DirectionalLights. Use Scale tool to edit Range, Fov and intensity. In Properties under SpotLightComponent you can adjust Color of the fog and thickness. Change Linear overbrightness to make the fog more or less thick. 1 is really thick and -1 is completely transparent.

Level Art

2021-11-23T13:52:26Z

Tero Tirkkonen: /* Level Art Fundamentals */

Level Art

2021-11-23T13:52:16Z

Tero Tirkkonen: /* Building a Level */

<onlyinclude>
<div style="float:right; width:40%; padding-left: 20px;">
'''Related sites'''
* [[Level Art]]
* [[Level Art: Color and Lighting]]
* [[Level Art: Composition]]
* [[Level Art: Environmental Storytelling]]
* [[Level Art: Ideas for New Levels]]
* [[Level Art: Level Art Related Gameplay Issues]]
* [[Level Art: The Level Art Phases]]

</div>
</onlyinclude>

== Level art workflow steps ==
[[File:level_art_wiki_header_banner_process.jpg]]
* Level artists create the visible game environment built on the collision block base created by designers.
* Level artists work with the Frozenbyte in-house engine and editor.

<br>
# '''The Idea''' - a mental image to work towards. The Idea is shaped and refined by reading the script, exploring the concept art and level wiki site and communicating with different team members like the AD, designers, the scriptwriter and/or other artists.
#* '''Outline meeting''' can occur before the design work has even started, gathering all the people working on a level to plan and discuss.
#* ''' Collecting reference''' includes researching the topic by searching inspirational reference images. Pinterest, for example, is a good online source for reference images.
#* ''' Level collision base meeting ''' takes place before the level art phase begins. The AD, level artists, designers and other related people working on the level are involved.
#* '''Preassembly''' can happen when a designer works on a level file, making it impossible for a level artist to access the same level. The artist can build level art arrangements to a separate file, requesting feedback from the AD during the preassembly.
# '''Base art''' - The Base art phase includes establishing a preliminary lighting setup, blocking the level art and building a strong and working base supporting the gameplay. Base art should be kept simple, concentrating only on the big forms and covering all the bare collisions.
#* '''AD's camera check''', done in collaboration with the designers, is followed by a camera fix list. It guides to adjust the cameras so that their positions are optimal for both the gameplay and art.
#* '''AD's base art check''' results in a fix list that may include paint-overs advising on how to improve the base art.
#* '''Base art fix round''' includes optimizing the camera positions and improving base art according to the feedback of the AD.
#* '''Lighting adjustments'''
# '''Detailing''' - Once the base art meets the requirements, details are added.
#* '''AD's details check''' results in a fix list that may include paint-overs advising on how to improve the level art.
#* '''Details art fix list round''' has the artist improving the level art based on the AD's feedback.
# '''Polish''' - Polishing happens at the end of the project when there's spare time. It consists of improving the level art by, for example, adding new 3D assets, documenting significant changes with before and after screenshots and consulting the AD.
#* '''Polish and optimizing''' includes general level art polishes, lighting adjustments and optimizing things.
#* '''Playing the game''': should be a daily level artist routine. Only by playing the levels you can evaluate the quality of the level art and make sure the level art supports the gameplay as much as possible. The level artists should play the game together in co-op, as well, to observe level art in a multiplayer mode and share ideas. <br>

=== Things to consider ===
* Working with the level art is '''an iterative process''': Art is created layer by layer, starting from the crude, bigger forms and ending with the detailed, final art.
* The aim is to keep the whole level at '''a consistent state at all times''' and only add finer details once the big forms are satisfactory.
* Level art is a process of continuous development. Nothing is final after the first round, and sometimes whole level areas might be reworked entirely. Large, creative projects always involve some degree of adjustments and alterations, but there are several reasons why level art can be subjected to a change:
**'''All the assets might not be available''' during the initial level art work, forcing the level artist to use temporary assets. They need to be replaced with new ones later, which can be time-consuming.
**'''The design can change''', also affecting the level art.
**'''A new and better visual idea for a scene might emerge''' at any point during the development.
**'''Technical changes''' sometimes require level art reworking.

=== Additional tips about the creating process ===
* '''Play the game''' It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game!
**The level artist's responsibility is to ensure that the level art supports the gameplay in each part of the level.
**The player can only see what the in-game cameras are showing, making play testing the level even more important.
*It's essential to get '''the scale''' of the environment right as early as possible. '''Always have a game character model as a scale reference''' when you start blocking the level art.
** Generally, the assets in the background of a level tend to look smaller than you might expect, and you might have to scale up those assets slightly to make them look better in the game. Commonly, in-game assets are bulkier and larger than their real-life counterparts since that helps them stand out in the game. However, you should be careful when scaling assets, as the texel density (texture resolution) and geometry get easily incoherent.
** How to nail the right scale: [http://www.neilblevins.com/art_lessons/details_make_big/details_make_big.htm Using Details To Make Something Look Big By Neil Blevins]
* ''' Flexible level art work'''
**Sometimes you might be in a hurry to finish the level art, but the design is unfinished, leaving you unable to work on the level file.
** In a situation like this, it's best to communicate with the designer to determine whether some areas of the level are already finished. You can create a copy of the level to start your level design work, and when the design is complete, just copy and paste the level art to the actual level.

* ''' Links for learning'''
<div class="toccolours mw-collapsible mw-collapsed" style="background-color: #e6f2ff; border-width:2px; border-radius:10px; margin: 5px;">
Some general art fundamentals tips that are useful for any game artist:
<div class="mw-collapsible-content">

'''Lighting'''
* [http://gurneyjourney.blogspot.com/search/label/Color%20and%20Light%20Book Color theory: James Gurney's blog]
* [http://www.itchy-animation.co.uk/tutorials/light01.htm Lighting Fundamentals for Artists]
* [https://www.youtube.com/watch?v=MVafJfV5xhI Nathan Fowkes 'Better Options for Color Vibrance' ]

'''Composition'''
* [http://www.neilblevins.com/art_lessons/areas_of_visual_rest/areas_of_visual_rest.htm Neil Blevis: Areas Of Visual Detail, Areas Of Visual Rest]
* [http://www.neilblevins.com/art_lessons/clumping/clumping.htm Neil Blevis: Clumping and Grouping]
* [http://www.neilblevins.com/art_lessons/compositional_weight/compositional_weight.htm Neil Blevis: Compositional Weight]
* [http://www.neilblevins.com/art_lessons/composition_contrasts/composition_contrasts.htm Neil Blevis: Contrasts In Composition]
* [http://www.neilblevins.com/art_lessons/foreground_midground_background/foreground_midground_background.htm Neil Blevis: Foreground, Midground, Background]
* [http://www.neilblevins.com/art_lessons/layers_of_light_and_dark/layers_of_light_and_dark.htm Neil Blevis: Layers Of Light And Dark]
* [http://www.neilblevins.com/art_lessons/primary_secondary_and_tertiary_shapes/primary_secondary_and_tertiary_shapes.htm Neil Blevis: Primary, Secondary and Tertiary Shapes]
* [http://www.neilblevins.com/art_lessons/details_make_big/details_make_big.htm Neil Blevis: Using Details To Make Something Look Big]
* [http://www.neilblevins.com/art_lessons/tangents/tangents.htm Neil Blevis: What is a Tangent? And How To Solve Them]

* [https://www.deviantart.com/lulie/art/The-Secret-to-Composition-272036625 The secret to composition]
* [https://twitter.com/eyecager Composition tips etc by Amber Blade Jones]
* [https://www.youtube.com/watch?v=qMH_J_vcoqE&feature=youtu.be&list=PLa1F2ddGya_9XER0wnFS6Mgnp3T-hgSZO Gleb Alexandrov's presentation about balance and composition of elements in creating appealing works]
* [https://youtu.be/GZ99gAb4T0o The Importance of Nothing: Using Negative Space in Level Design]

'''Environmental storytelling'''
* [https://www.youtube.com/watch?v=iemcI0t096I Sam Nielson's lecture about environment design]
* [https://www.youtube.com/watch?v=griCsvvRTQM Sam Nielson's lecture about atmosphere]
* [https://youtu.be/FeUL-5wfj0U?t=3m29s The Art of Environment Storytelling for Video Games GNOMON]
* [https://vimeo.com/165693758 Mike Hill's lecture about Spielberg's Subtext]

'''General creative development'''
* [http://www.neilblevins.com/art_lessons/art_lessons.htm Neil Blevis: Various art tips]
* [https://www.youtube.com/channel/UCbdyjrrJAjDIACjCsjAGFAA Feng Zhu design school videos. All kinds of stuff about painting/design/color etc.]
* [http://wiki.polycount.com/wiki/Polycount Polycount wiki. Basically everything you need to know about game art is found here]
* [https://www.youtube.com/user/McBacon1337/videos Game Maker's Toolkit. Interesting and well-made videos about game mechanics in different games by Mike Brown.]

</div>
</div>

= Building a Level =
== Ideas for New Levels ==
[[Level Art: Ideas for New Levels]]<br>
[[File:level_art_wiki_header_banner_ideas_for_new_levels.jpg|800px]]

== The Level Art Phases ==
[[Level Art: The Level Art Phases]]<br>
[[File:level_art_wiki_header_banner_level_art_phases.jpg|800px]]

== Environmental Storytelling ==
[[Level Art: Environmental Storytelling]]<br>
[[File:level_art_wiki_header_banner_environmental_storytelling.jpg|800px]]

== Level Art Related Gameplay Issues ==
[[Level Art: Level Art Related Gameplay Issues]]<br>
[[File:level_art_wiki_header_banner_gameplay_issues.jpg|800px]]

= Level Art Fundamentals =

== Composition ==
[[Public Level Art: Composition]]<br>
[[File:level_art_wiki_header_banner_composition.jpg|800px]]

== Color and Lighting ==
[[Public Level Art: Color and Lighting]]<br>
[[File:level_art_wiki_header_banner_color_and_lighting.jpg|800px]]

[[Category:Editor|Level Art]] [[Category:Art|Level Art]] [[Category:Level Art|Level Art]]

Level Art: The Level Art Phases

2021-11-23T13:49:51Z

Tero Tirkkonen:

{{:Level Art}} 

= The Level Art Phases =
'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

* The level art process in a nutshell:
** 1) Reference and Research
** 2) Preassembly
** 3) Base Art Blocking
** 4) Detailing
** 5) Polishing & Optimizing
** + Feedback. The level artist receives feedback during the whole level art process.

* Communication is important. Talk with AD, asset artists, other level artists and designers. These conversations should happen often; constant communication is needed throughout the whole level art process.
* Base art is the most important part of the level art process. If the base art is lacking, nothing works - no matter how many pretty details you stamp over it.
* The level art work is done iteratively, keeping the state of the art coherent throughout the whole level constantly. In other words, unfinished areas with bare collisions and areas with finished, detailed level art shouldn't co-exist within the same level.
* The whole level should stay as playable as possible at all times. If your art assets (even the temporary ones) result in hindering or preventing the level from being played, you shouldn't use them.

== Level Art Scheduling ==
* The time needed for the level art process is usually allocated as follows: The Base art takes 60%-70%, detailing 20%-30% and polishing 10%-20% of the time.
* Ideally, the time required to build a level from scratch to finish is roughly '''3 months (about 60 workdays)'''. It leaves enough time to commit the base art and polishes properly and tackle any surprise work that may emerge.
* If in a hurry, a level can be built as quickly as in '''2 months (about 40 workdays)'''. There's enough time to commit the base art and polishes adequately, but there's no room for errors or any surprises.
* There are multiple factors that can affect the level building duration, for example:
** The quality of the base art work (or any other art phase work, of course, but since the base art is the most important, fixing and fine-tuning it will take the longest)
** Changes in the level design schedules
** Sudden problems unrelated to the level artist/art team
** 3D assets missing/pending
** Changes in the gameplay design, requiring level art modifications
** Co-workers (designers, for example) needing to work on a level at a crucial time
** Sick leaves and personnel changes
** Unexpected and surprising issues

== Level Art Process Steps ==
# Before level art process starts: Familiarizing yourself with the '''references''' available and '''researching''' the topic
# Before level art process starts: '''level meetings''' with AD, 3D art lead and the level artists and designers that are/will be working on the level
# '''Preassembly''': No access to the actual map file yet, building the level art arrangements and asking for '''feedback from the AD'''
# '''Base art''': '''Preliminary lighting''' setup
# Base art: Blocking the level art, building a strong and working base that supports the gameplay, covering all the collisions - keeping it simple!
# Base art: '''Camera fix list''': adjusting the cameras to function as good as possible (considering both the gameplay and art), consulting designers
# Base art: '''AD's check''' and writing a fix list
# Base art: '''Fix list round''' where the base art is improved according to AD's feedback
# Base art: '''Lighting adjusting'''
# '''Detailing''': Adding details on the base art
# Detailing: '''AD's check''' and writing a fix list
# Detailing: '''Fix list round''' where the level art is improved according to AD's feedback
# '''Polish and optimizing''': Optimizing, adjusting lighting and fine-tuning level art until the time runs out. Multiple people can add more fix requests to the fix list when the content lock is approaching.

=== Example Art Schedule for One Level ===
* The timeframe for building levels is 65 workdays per level
* '''Some tasks can be done simultaneously''', including base art checks, camera fixes and lighting polishes. An example: Camera set-up can be pre-built for a different scene and then copied to the final level after the lighting polishes have been finished.
* You can keep editing the level during any AD's check since AD won't be saving anything.
* There are times when you can't access the level due to a co-worker editing it, but you can create a duplicate of the level and continue your work there. When the level file is available again, just copy and paste your work from the duplicate to the original level.
* When unable to access a certain level, you can also start working on another level.

* Colors explained:
** <span style="font-size:14px; color: #ea9b99"> '''Level artist'''</span> (Responsible of this level)
** <span style="font-size:14px; color: #a3d5a3"> '''Camera artist'''</span>
** <span style="font-size:14px; color: #d9b887"> '''Lighting artist'''</span> (Optional, there could be none or several level artists responsible of the lighting as a whole)
** <span style="font-size:14px; color: #bac0ec"> '''Art Director'''</span>

{| class="wikitable"
|-
! 20 days
! 2 days
! 4 days
! 20 days
! 3 days
! 10 days
! ?? days
! 5 days
! 1 day
! ?? days
|-

|-
|style="background-color:#feaeac"| Base art || || style="background-color:#ebc793"|Lighting polishing || style="background-color:#feaeac"| Base art fix and detailing || style="background-color:#ebc793"|Lighting polishing ||style="background-color:#feaeac"| Details fix || Wait for puzzle versions,<br>work on another level|| style="background-color:#feaeac"| Puzzle versions art || style="background-color:#feaeac"| Coop playtrough with level artists ||style="background-color:#feaeac"| Final polish
|-
| || ||style="background-color:#bef1be"|Camera fix|| || || || || || ||
|-
| ||style="background-color:#c9cfff"|Camera check||style="background-color:#c9cfff"|Base art check|| || style="background-color:#c9cfff"|Details check|| || || || ||style="background-color:#c9cfff"|Random checks
|-

|}

== Research and Reference ==
* All the developers need to work towards a common goal, and it's everyone's responsibility to keep that goal in mind.
* To help everyone to share the same vision and understand the project as a whole, there are tools available:
* When hopping aboard a new project, go through the reference materials to familiarize yourself with the overall vision, goals and tone of the project. Refer to these materials regularly during the project.
* If you're a level artist, study the basics of [[Public Level Art: Environmental Storytelling|Environmental Storytelling]].

=== Script ===
* Read the whole script at the beginning of the project.
* When beginning the level art process for a new level, go back to the script and read again the section describing that level.
* You should re-read (parts of) the script every now and then to make sure all the details and ideas are reflected in your level art.

=== Wiki and Concept Art ===
* When assigned to a new level, go through the wiki page for that level - and keep editing and reading the page during the level art work.

<gallery heights=350px mode="packed">
File:level_concept_examples_01.png|A level art wiki site contains all the concept art related to the level, maps, color and shape plans etc.
File:level_concept_examples_02.png|You want to study all the available materials carefully to get the big picture. After that, feel free to search for more reference images online.
</gallery>

== Preassembly ==
* Preassembly isn't usually scheduled, allowing the level artist to do it whenever there's time.
* Preassembly means working on the level art before you can access the actual collision-blocked map file with all the puzzles and design. The goal is to eliminate any idle waiting time.
* During the preassembly face, you should familiarize yourself with the level theme and assets without distractions.
* The most important preassembly work is creating a solid library of level art arrangements. Take your time and choose the arrangements that best suit the level: some assets in the library might be scrapped but most of them should end up in the final product.
* Use the preassembly time to try out your ideas. It's a perfect time to play around and experiment without paying any attention to the level geometry restrictions of the real level.
* You can quickly build rooms, backgrounds, focal point arrangements, gameplay platforms etc. without worrying where to place them exactly.
* Since preassembly creations are not integrated with the actual game collisions, it's much easier to edit them if something doesn't feel right.

=== How to Preassemble ===
* Gather a bunch of ideas by reading the script, familiarizing yourself with the level wiki site, browsing through the new level assets and possibly searching online reference images.
* With a head full of ideas, start building level art arrangements for the level. Begin with the necessary must-have objects needed in the level and create more as you go.
* While creating the preassembled arrangements, you'll probably start developing some kind of an idea concerning the structure of the level.
* Every level should have a focal point area in the beginning and in the end. Figuring out how those areas are executed is a great place to start.
* It's easiest to start with story areas described in the script, areas with existing concepts and/or areas you have a strong vision in mind for already.
* Be careful not to add too many details, as the detailing phase happens only after the preassembled arrangements are placed in the actual level map and the base art is satisfactory.
* Once you're happy with an arrangement, you can store it under the null (the null object in Editor) for easier handling.

=== Possible Pitfalls ===
* While it allows you to experiment freely with the level, there are some issues you may encounter during the preassembly phase:
* '''Incoherent and disjointed level flow''': The flow of the level needs to be coherent from the start to finish. Be careful when arranging separate pre-made blocks of art together and pay special attention to "in-between" transition areas. Keep the big picture in mind.
* '''Detached feel''': Copying the preassembled arrangements to an actual level may result in a feeling of not belonging. The pieces might look and feel like a separate backdrop floating behind the 2D game area (that's actually what they are, in fact, but they shouldn't feel like that). When adding your arrangements, integrate them seamlessly into the gameplay area.
* '''Under-optimization''': A seemingly small piece of extra geometry is multiplied rapidly when the arrangements are duplicated. To avoid repetition and clumsiness, optimize the use of your preassembled arrangements.
* '''Too many details''': The preassembly phase is followed by a base art phase. If the preassembled content is detailed and complex, it'll make the base art phase overly complicated and will slow the progress down.

<gallery heights=350px mode="packed">
File:level_art_preassembly_architecture_examples.jpg| Preassembled arrangements for the Trine 4 DLC Cornelius's Dream level
File:level_art_preassembly_organic_examples.jpg| Preassembled arrangements for the Trine 4 DLC Rudolfus's Dream level
</gallery>

== Base art ==
'''The first on the foremost purpose of level art is to support the gameplay and bring out the important game objects as well as possible.''' A visually pleasing game is an important goal on its own, but the level art must always submit to the gameplay. When the base art phase is over, there should be a fully playable level with both art and the gameplay functioning and complimenting each other.

'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

=== Cover and Match All the Collisions ===
* Once a designer is finished with a level, it's handed to a level artist. It's time for the base art phase.
* Base art phase is scheduled - it's important to fill the level with art as soon as possible.
* During the base art round, art elements are added to a level for the first time. Everything is built on top of the base art, so it's very important to get it right.
* Base art phase includes '''covering all the visible collisions'''.
** Note: If you match the collision areas and art carefully during the base at phase, it'll save a lot of time and the need to fix them later.
** Go through all the areas the player can interact with and check the collisions - remember not to consider only the characters but also the wizard's levitating objects.
** Pay attention to smaller things as well, like floating rope targets. The aim is to cover and support all gameplay elements with art so that the game can be played and enjoyed after the base art phase.
** Go through the level from start to finish. Play the level yourself with a character and make sure the collisions work as intended (AKA characters aren't floating or walking inside assets and characters or levitation objects won't get stuck on invisible collisions).

=== Focus on the Big Picture ===
* During the phase art base, '''do not add small details'''. If the base geometry goes through changes and level art needs to be altered, additional art details slow down the process a lot: checking the level, doing paint-overs and fixing the base level art is really difficult if there are a lot of details.
* After the art blocking phase '''the level should look and feel "complete", serving as a solid base to add things later on.'''
* Even if you must work with placeholder 3D assets, try to match the '''proportions''' from the start.
* Don't spend too much time creating intricate, highly detailed placeholder areas. Rather use temporary structures, instead, or, if you must, leave the area empty while waiting for assets.
* Divide your work into steps, to avoid spending all your time on a single finalized scene and neglecting other areas. Focus on '''a single run throughout the whole level'''.
* A safe place to start are the walls, ground, floor and other environmental elements making up the big objects.
* '''The backgrounds''' are an important part of the base art. They play a huge role in creating the big shapes and the visual flow.
* When working with outside locations, don't forget the sky - or you're missing out on a big part of the screen. Remember to add the clouds and weather elements etc. They are a very important part of the level's general flow.

<gallery heights=400px mode="packed">
File:base_art_and_detail_art_01.jpg| A great example of the base art done right: A simple setting, providing a great base to build on and add details. Also easy to modify, if needed.
File:base_art_and_detail_art_02.jpg| The base art looks good, though the door collision is yet uncovered. Allowing the unique gameplay asset (the snowball instructions in the background) collisions to go untouched is ok in this scene, as they will be replaced with new assets later.
File:base_art_and_detail_art_03.jpg| A good base art is simple enough - when the whole set could be changed, one shouldn't waste too much time with the base art.
File:base_art_and_detail_art_04.jpg| The base art is too detailed here - if there are any changes to the level geometry, a lot of work has been done in vain.
</gallery>

=== Basic art principles are present from the start ===
* [[Public Level Art: Composition]] The composition and flow guide the player through the level. Tip: Select the right materials for the shapes, and never use assets scaled too large, unless you can hide them well.
* [[Public Level Art: Color and Lighting]] Color and lighting can be used to guide the player as well. Tip: Use the values and contrasts so that the important things pop out and unimportant things blend in. Invite the player towards their intended path with lights and use darker tones for those parts of the screen the player is not supposed to stumble into.

=== Don't Let the Collisions Restrict You When it's Not Necessary ===
* The collisions are implemented by level designers - while they pay attention to art details as well, their job is designing the game, not making art.
* Never edit the collisions or gameplay objects without consulting the designers first - but don't be afraid to ask about the matter. Have a conversation with the designer about the changes you wish to make, and if they agree, proceed.
* The gameplay area is a narrow 2D plane, the width of it being only about 2 metres. The collision rules, for example, are applied only inside those two-meter borders. Your job is to blend the gameplay area into the surrounding 3D scene and to make it a believable part of the world (as opposed to an artificial, detached lane).
* As long as your foreground or background items don't distract the player from the important gameplay things, feel free to experiment and go wild.
* It's not necessary for the background and foreground areas surrounding the gameplay area to follow the general shape of it. On the contrary, they should be used to create depth and hide the fact that the actual game happens in a narrow, straight line.

=== Requesting New Pieces to 3D Asset Sets ===
* Level artist uses the 3D asset sets created by 3D artists to build levels - and figure out simultaneously how the various asset pieces work.
* Don't hesitate to give feedback to 3D artists and/or request art from them. Both you and the 3D artist benefit when useful and visually satisfying asset sets are created.
* The 3D artists create the assets and don't really build levels with them. To make full use of all assets and connect them together, it's likely you'll need to ask for more parts.
* If you need more asset pieces created, compile a list of your needs during the base art base and deliver it to the 3D art lead.
* For example, you might ask for more differently sized pieces to a wall set, if [[Public Level_Art:_Composition#Problems_created_by_scaling_3D_models_too_much|scaling the size of the old ones up]] or [[Public Level_Art:_Composition#Non-uniform_scaling|non-uniformly]] will result in the visual quality suffering.
** Note: It's fine to use the too-much-up-scaled or non-uniformly-scaled versions of the pieces for the first version of your base art. Request the new 3D pieces by the end of the base art phase and replace the old assets with new ones later.
** Tip: If possible, it's better to gather a list detailing all your needs than to ask for a new 3D set piece every day.
** Tip: When building temporary structures from currently available assets, write down their measurements and describe the shape that you want the new assets to be. Pass your notes along with your asset order list to the 3D artist who can use them as a reference.

=== Prioritize the focal point areas ===
* Start with the focal point areas (beginning, ending, story areas, special art areas etc.) and plan the rest of the base art around those scenes.
* The level start and end areas are usually focal point areas, as we want the first and last thing the players see to look extra nice.
* Not every single frame can be a focal point one, but there should be more general areas between instead. By alternating the various scene types it's easier to avoid player exhaustion, create rhythm and emphasize the special areas.
* Since the game project is on the clock, it's best to schedule and plan carefully before the actual work.
* 2D angled games (like Trine) face issues with matching the organic art to the straight collisions. To avoid that, you might feel tempted to create natural rock formations with perfectly straight 90-degree angles. Try keeping the rock formation as natural as possible, instead, while strictly following the gameplay collision areas and rules (the foreground and background area are not tied by the gameplay area rules). If a straight/90-degree surface must be included, you can use man-made constructions (brick, wood) rather than pursuing the "natural" rock look.

==== Focal points ====
* Focal points are very delicately planned and beautifully built areas inside the level.
* They can be impressive and unique hero assets or just small asset arrangements built out of ordinary assets (nicely composed and made look perfect for the specific camera angle).
* Most of the level should consist of the "basic environment"; focal points are located here and there to spike interest.
* You can also use carefully crafted small lighting scenarios as points of interest, like a warm ray of light emerging from a hole in the cave wall, illuminating some mushrooms/rocks/etc.
* In Trine games you should place the focal points between the puzzle areas. Scenes containing puzzles should be clear of any distractions, allowing the players to fully focus on solving the puzzle.
** The puzzle areas shouldn't look boring, either, but it's a good practice to build the various areas of the level to highlight their function.
* If there's not enough space for an important focal point area in the game, talk to the designer. Usually, they are willing to add the needed space to the level.
* Reference images are especially important when building focal point areas, so study and search for new images!
* Even if two levels share a theme, each level should have a unique feeling of its own.
* There should be something special and visually memorable in each level: A point that evokes feelings and makes the level remarkable. For example, a shark swimming by, a unique geological formation or the oldest classic - a breathtaking scenery point.

<gallery heights=200px mode="packed">
File:Trine 4 screenshot 17 1080p.png| A striking focal point features a unique wizard face sculpture asset specifically made for this spot.
File:Trine 4 screenshot 44 1080p.png| The dragon skull on the background, its strong silhouette against the sky, is an eye-catcher and a remarkable focal point.
File:Trine 4 screenshot 38 1080p.png| The statue on the left is highlighted with golden "god rays". The cave is full of angular forms, making the statue stand out.
File:Trine 4 screenshot 43 1080p.png| The bear statue adds a mysterious focal point to the more traditional forest scenery.
File:Trine 4 screenshot 40 1080p.png| Frozen dragon skeleton is framed with the diagonal "god rays" from the top and diagonal icicles from the bottom.
File:Trine 4 screenshot 25.png| The fiery planet draws eyes towards it. The shiny celestial body is surrounded by curved shapes emphasizing it even more.
File:Trine 4 toby's dream screenshot 02.png| The curved branch silhouette is a simple, yet effective focal point. The flow of the scene supports it nicely.

</gallery>

== Detailing ==
* When the detailing phase is reached, it's a race against the clock to get all the levels finished on time, thus making the detailing phase a tightly scheduled one.
* The level is already filled with functioning and pleasing visuals. Details are added for plausibility reasons, and to pique visual curiosity, to create depth and to add to the level's visual charm.
* The level base is optimized during the detailing phase to make sure there isn't any excess geometry left.
* Pay attention to the consistency of your art in a single level and of the whole game: there shouldn't be some areas filled with details while some are completely empty.
* Always iterate gradually. It's tempting to fill one area from top to the bottom with detailed and finished art - and then move on to the next one, but you might end up running out of time and ruining the coherent feel of the level.
* [[Public Level Art: Environmental Storytelling|Environmental storytelling]] should guide your work while detailing.
* The level design might change during the detailing phase, forcing you to consider and adjust your level art accordingly.
* When the detailing phase is over, each level of the game should be "good enough". The sooner the levels reach that state, the better.
* In theory, once the detailing phase ends, each level should be ready to ship (if, for some imaginary reason, there were no time or resources for any polishing). That means art is coherent and of good quality, supporting the gameplay. There shouldn't be any major visual issues. In reality, the Trine levels are always polished and fine-tuned.

== Polishing ==
* Usually not a scheduled phase, as the levels entering this stage have reached the "good enough" standard mentioned earlier.
* The remaining time (until the content lock day) is spent fine-tuning everything as much as possible.
* Polishing is done last to ensure the overall quality of all levels. Each level should reach the "good enough" state before any polishing on any level happens.
** Note: If you have gaps in your schedule during the earlier level art phases (while waiting for access to a certain level, for example) it's ok to do some polishing work as well.
* The Trine game levels are polished until the last possible moment, and none of the levels is considered "final" until the game launch day.
* Even when polishing you need to consider the general art quality and aim for coherence throughout the game: some levels can't look more polished than the others.
* New 3D assets might appear during the later stages of the project, and they are distributed evenly among the levels.
* Polishing phase entails minor detail fixes and also bigger base art level fixes. The development is a constant flux: some brilliant ideas come up late and some previously functioning concepts are abandoned during the later phases.
* While it's not recommended to implement any radical changes during the polishing phase, don't be afraid to speak up (no matter how close the deadline is), especially if your idea would elevate the quality of the whole level.

=== Polishing a Level Originally Created by Another Artist ===

* Polishing can be done by any of the level artists, no matter who originally created the base art and detailed art.
* It's beneficial for all the level artists to work on all the levels. That helps to keep the levels fresh and coherent and ensures the full potential of the art team is used.
* Nevertheless, some things should be considered when polishing a level made by another level artist:
** The artist responsible for a level's base/detail art might feel some degree of mental ownership of the level. Every other artist is encouraged, however, to suggest their ideas and execute changes. Nobody owns the level or the level art.
**However, the original artist has the best understanding of the level, granting them the chance to participate in the process and to voice their opinions and thoughts.
**The AD has the final say on which art version will be used, but they base their decisions on listening and reasoning, making sure each team member gets their voice heard. While the AD has the best grasp of levels as a whole, the level artist knows their level best.

* '''First, discuss with your AD and the original level artist'''
** Get a permission to start with the polishing work from your team lead.
** If you plan on executing radical changes, talk with the artist responsible for the base and detail art.
** The level might feature, for example, story-related elements that affect the level art. The original level artist can brief you about special details.
** Tip: Before making any changes, read the level art wiki site to understand the level.

* '''Smaller detail polish directly to the level, bigger base art polish to a copy of the level'''
** When you polish smaller details, not tampering with the base art radically, save your work to the actual level.
** When planning to make big changes, try them out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Keep the level of details coherent'''
** After reaching the "good enough" state, level art shouldn't revert back to any of the previous art stages even temporarily.
** When planning to make big changes or stripping a part of the level bare of the detailed level art, try the changes out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Before & after screenshots'''
* Take before/after screenshots of the changes
** If the changes are small, use the actual level
** With bigger changes, use a copy of the actual level
* Take screenshots before and after using the same camera positions.
* You need to be able to pinpoint the location and the exact nature of the changes.
*Tip: You can always return to the original version of the level to take the screenshots.

* '''Feedback'''
** When making larger changes: Show the changes made to the (copy of) level and the before/after screenshots to your AD and the original level artist. Discuss with them about the changes.
** When making smaller changes: Show the before/after screenshots to your AD to receive feedback, and fix the level art accordingly.

* '''Replacing old with new'''
** If the changes are approved by the AD, they can be commited to the actual level.

[[Category:Art]] [[Category:Art|Trine 4 Level Art]] [[Category:Trine 4 Art|Level Art]] [[Category:Level Art|Trine 4 Level Art]] [[Category:Trine 4 Level Art]]
[[Category:Level Art|Building a Level]]

Level Art: Level Art Related Gameplay Issues

2021-11-23T13:49:44Z

Tero Tirkkonen:

{{:Level Art}} 

= Level Art Should Support Gameplay =
* The purpose of the Level Art is to make the game beautiful - and also support the gameplay.
* This section of the Wiki contains general guidelines on how to avoid creating misleading level art causing gameplay issues.
* In the examples below, the level art obfuscates and misguides the player in both obvious and more subtle ways.
* The examples below are for educational purposes only - some of the cases are fictional and constructed to showcase level art issues. Some are from the early stages of development and do not represent the finalized product.
* Level artists should frequently '''play the level or scene''' they are working on. That helps to spot any gameplay issues the level art may cause. It's impossible to notice some errors while using the free Editor view only - that's not what the players see - so it's essential to play the game.

= Art Hides Something Important =
* Don't place the foreground art carelessly so that it covers something important, like puzzle elements or a ledge requiring the player to see exactly where the character is.
* The Player character should always be visible, so be mindful of your foreground art. For example, the camera should be adjusted so that the doorways in the gameplay area never hide the player character completely.
* Sometimes level art is intentionally used to hide gameplay elements, like XP and secret areas. On the other hand, if an item is essential for the player's progression, it should always be fully visible and in plain sight.
* The composition of the scene should emphasize important gameplay elements. Draw the player's eye towards things relevant to the gameplay.

<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_The_Dream_29.1.2019_hidden_button_1.jpg|The button needed to open the door is hidden behind the foreground visuals, namely the handrail. While the player might spot the button eventually, they are left confused and annoyed.
File:Trine 4 art vs gameplay visibility issue 30.1.2019.jpg|The player needs to levitate a wizard's box through a hole in the right. The branches and leaves obstruct the view too much, making the conveniently box-sized hole hard to see.
File:Trine 4 foreground art blocks the view 30.1.2019.jpg|The entrance to a secret cave remains a little too secretive due to a thick rock asset blocking the visibility.
File:Trine_4_Dream_10.2.2019_armchairs.jpg|There are too many assets and elements in front of the camera and blocking the view. The buttons on the ground are not visible enough.
File:Trine_4_Dream_10.2.2019_camera_blocked.jpg|Level art elements are placed confusingly, blocking the view. The player will likely run to their death before realizing there's a pit.
File:Trine_4_Nightmare_13.3.2019_bushes.jpg|The bushes are hiding a part of a ledge, likely causing the player to fall and die.
File:Trine_4_Nightmare_13.3.2019_moving_platform.jpg|The platform going down is hidden inside the floor, leaving the player confused and guessing where to go.
File:Trine_4_Thorny_14.4.2019_hidden_ledge.jpg|Covering a ledge with a flower vase may result in an unintentional falling down.
File:Fairy_forest_art_issue_3_player_hidden.jpg|While the airflow elevator is a fantastic element, the level art prevents the player from seeing their character for a (too) long time.
File:Trine_4_Nightmare_13.3.2019_leap_of_faith.jpg|While the intended progression route is simple enough to understand, proceeding requires a leap of faith, which might make some players uneasy. Solutions like this should be avoided.
File:Trine_4_Amadeus_13.4.2019_confusing_art.jpg|The rails at the right-side end of the seesaw plank are broken. It's hard to pinpoint where the platform area ends.
</gallery>

== Art Hides Something Important in Multiplayer ==
* Because the camera angles are often wider in multiplayer modes, you should be extra careful when placing the foreground elements.
* Typically, all players should always be in the same view.
* Vertical scenes are the most challenging to implement: When one player climbs up on a platform, they should be as visible as another player at the very bottom of the scene.

<gallery widths=500px heights=500px mode="nolines">
File:coop-07_the_dream-foreground_art_issue_01.jpg|Image A: The character standing on a balcony (higher area) is almost entirely obscured by the foreground artwork. See Image B to see how this was fixed.
File:coop-07_the_dream-foreground_art_issue_fix_01.jpg|Image B: Almost the entire balcony was removed to help the player to notice the character.
File:coop-07_the_dream-foreground_art_wide_angle_issue_01.jpg|Image C: When using very wide multiplayer camera angles, even the relatively small foreground assets can obscure the player characters. See Image D to see how this was fixed.
File:coop-07_the_dream-foreground_art_wide_angle_issue_fixed_01.jpg|Image D: The foreground area was moved very close to the playable area.
File:coop-07_the_dream-foreground_art_wide_angle_issue_fixed_02.jpg|All the fixes applied must work with both multiplayer and single-player camera angles. For example, multiplayer situations where the camera is moved closer to the player character might be tricky with the single-player mode.
File:coop-07_the_dream-foreground_art_tri_seesaw_issue_00.jpg|Image E: A vertical progression path and a wide camera angle aren't a good match, making it really hard to see the characters. See Image F to see how this was fixed.
File:coop-07_the_dream-foreground_art_tri_seesaw_issue_01.jpg|Image F: The foreground art was moved very close to the playable area to make the characters more visible.
</gallery>

== Fading Environment Objects in Trine ==
*The environment objects should be faded only when they're used as secrets.
*If something is faded out upon entering an area, it should be faded back in when the secret area is left.
*The fading effect should not be used, for example, to a wall facing the camera during a standard progression route.
*As the video shows, exceptions can be made, but only after setting up the cameras so that the character can't remain standing in the doorway.
*The situation depicted in the video showcases how the cameras and level art work together to create the desired effect. The camera doesn't go through the wall, but the level artist can plant a window on the camera's path. The player should feel safe when jumping to the unknown, so you might want to include another door or a window in the scene's foreground to show that the path continues to the other side.
[[File:no_fade_foreground_wall.mp4|550px]]
*Enable UseNoisedVisibility on modelcomponent of the object being faded to make the fading effect smooth and avoid flickering like shown on the video.
[[File:fade_bug.mp4|550px]]

= Collision Mismatches =
* The level art should always match collisions as closely as possible.
* If the collision is smaller than the art asset, the characters or levitated objects will clip through the art when interacting with the collision point.
* If the collision is bigger than the art asset, the characters or levitated objects will float in the air when interacting with the collision point.
* If the collision in a particular area is intended to be sharp, try to avoid round and edged art.
* Pay particularly close attention to the edges that are ledge-grabbable.
<gallery widths=500px heights=500px mode="nolines">
File:Trine 4 round edge art ledgegrab 30.1.2019.jpg|If you're struggling to create a 90-degree ledge with stone assets, try replacing them with a man-made structure instead.
File:Fairy forest art issue 12 clipping.jpg|The player characters aren't the only gameplay elements affected by the collision mismatches; they are also problematic for dynamic objects.
File:Trine_4_Amadeus_13.4.2019_invisible_and_inside.jpg|The Player character shouldn't be able to move inside the snowman art - also, the character seems to collide with an invisible collision on the left.
File:Trine_4_Rocky_Heath_14.4.2019_missing_collision.jpg|The centrepieces of these rotating puzzle elements are missing their collisions.
</gallery>

= Distracting Level Art =
* When a game combines a 2D gameplay with a 3D environment, it can be hard to differentiate the background items from the gameplay area. If the player doesn't have a clear understanding of the gameplay area, they get easily frustrated.
* At all times, the player should be able to differentiate the gameplay area from background and foreground areas.
* If the critical gameplay elements are lost amidst the background art, it'll disturb the smooth flow of the playing experience.
* The level geometry should be free from any confusing elements and easy enough to grasp with a single glance.
* Tip: Try to distance yourself from your work by shrinking the level to a very small size (you can use screenshots, for example) or take a step back and squint your eyes. If you can't instantly recognize the general shape of the level, there's probably something wrong with the visuals.
* You can learn more about fixing and (preferably) avoiding gameplay-related level art issues by studying [[Public Level_Art:_Color_and_Lighting#Value|the importance of values and contrast]]

<gallery widths=500px heights=500px mode="nolines">
File:Fairy forest art issue 11 confusing room.jpg| Since the gameplay area is unclear and lacks any guidance signs, the player wouldn't probably know where to go.
File:Trine_4_Mountains_10.2.2019_backgroundstuff.jpg| The background art is too close to the gameplay area, making it hard to differentiate the two. The art in the background draws the player's attention, whereas it should emphasize the actual gameplay area.
File:Trine_4_Dream_10.2.2019_dreamfog.jpg|There are so many decorative background objects in the scene that it's hard to understand which items are in the gameplay area and meant to double as platforms.
File:Trine_4_Dream_10.2.2019_toggle_button.jpg|Did you notice there is a vertical button located in the bottom left area? The art assets in the scene are hugging all the attention, making it hard to spot the actual gameplay elements.
File:Trine_4_issue_1_24.9.2019.jpg|It's difficult to see the spikes amidst all the other level art elements. Make sure to boost the visibility of the critical gameplay assets with the correct values and contrast.
File:Trine_4_Hedge_Maze_spikes_visibility.jpg|The spikes around the button on the top right corner should be clearly visible, as they are an essential part of the gameplay.
File:Trine_4_Nightmare_13.3.2019_floor_magnet.jpg|It's easy enough to mistake the circular magnetic area for a part of the floor.
File:Trine_4_Nightmare_13.3.2019_plank.jpg|The two circular magnetic plates on the wheel are hard to see - or understand their significance as gameplay elements. The middle part of the wheel draws attention instead. Don't use the same colour for decorative pieces and gameplay elements.
File:Trine_4_Amadeus_13.4.2019_effect.jpg|A bright yellow effect to signal a landing area for levitation objects was tested. However, the effect was easy enough to misinterpret to represent a collectable, a hidden door, a levitation object - to name but a few - rendering it more confusing than helpful.
File:Fairy forest art issue 6 secret w many issues.jpg|Even the very preliminary base art should always be created with the gameplay in mind.
File:Trine 4 background vs play area 30.1.2019.jpg|It's hard to tell where the gameplay area starts or stops. The confusion is caused by a mixture of unclear lighting and vague rock assets littered around the area.
File:Trine 4 background vs play area example 2 30.1.2019.jpg| The values selected are not in line with varying depth levels, resulting in a perplexing gameplay area. The background appears to be blending into the gameplay area.
</gallery>

= Gameplay Route Issues =
* If the player's intended progress route isn't clear enough, it's good to check the level art of the area.
* Level art may mislead the player into thinking that a route is safe, dangerous or somehow blocked when it actually isn't.
* The player should always know where to go and what's happening. To achieve that, the main path should always be obvious and easy to follow.
* If more than visual fixes are needed to highlight the main route, talk with the designer responsible for the level.
* Avoid planting hidden or obstructed entrances along the main path. The entries to hidden or secret areas should always be visually less tempting than the main path.

<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_Nightmare_13.3.2019_rock_pillar.jpg|The horizontal stone pillar seen through the magnetic field is problematic: It's too close to the play area, making it hard to differentiate from the platforms and the magnetic field itself.
File:Trine_4_Birch_16.3.2019_flower_light_3.jpg|Some of the large leaves depicted are gameplay elements, and some are purely decorative. The risk of a mix-up is evident.
File:Trine_4_Rocky_Heath_14.4.2019_background_art.jpg|While the hatch upwards has been opened and it's clear to proceed, the decorative crate art makes it hard to understand.
File:Trine_4_issue_2_24.9.2019.jpg|The gameplay elements should always stand out and direct the player. The large leaves are in the gameplay area and meant to act as platforms - while the branch underneath them is not. The player has no way of telling which platforms are safe. The tree branch should remain hidden in the shadows, preferably with a layer of fog camouflaging it more.

File:Trine_4_Nightmare_13.3.2019_rock_ledges.jpg|The rock ledges in the foreground are too close to the gameplay area and easy to mistake as gameplay elements.
File:Trine_4_Nightmare_13.3.2019_rotating_wheel.jpg|Especially with the camera set-up featured here, the player might assume the foreground structure near the bottom is a part of the gameplay area (while it's not).
File:Trine_4_Moonlit_14.4.2019_seesaw_asset.jpg| It's hard to say which parts of the bird-shaped platform asset, if any, are located in the gameplay area. Possible fixes include adjusting the lighting or editing the asset textures to highlight the gameplay platforms and making other parts of the asset less visible.

File:Trine_4_The_Dream_29.1.2019_hidden_door.jpg|The secret area on the top right corner looks like the main route, and the actual main route below it appears to be a secret passage with the bookshelf covering it.
File:Trine_4_Nightmare_13.3.2019_rock_ledges.jpg|The player should head downwards but is more likely tempted to progress to the right. Replacing the right side ledge with a solid wall could fix the problem. One should also pay attention to the warm light shining from the right - why invite the player to a place they can not go to?

</gallery>

= Fire Through vs Non-fire Through =
* It's wise to reserve iron bars, gratings and other gameplay area assets with holes in them to be used with fire-through collisions only.
* If the asset isn't supposed to pass the ammunition through, it should look solid.
<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_Hedge_Maze_non_fire_through_hatches.jpg| The player is tempted to try and shoot an arrow through the hatches - to no avail. While the actual solution to the puzzle requires the player to use the ice arrows to freeze one of the platforms, the level art should help them to understand how the bow and arrow can be utilized here.
File:Trine_4_Hedge_Maze_non_fire_through_t_platform.jpg| This platform doesn't look solid enough to be frozen with an ice arrow either.
</gallery>

= False Promise of Gameplay Function =
* Avoid planting permanently closed doors on the gameplay area since players will want to open them. Doors leading to background areas are more acceptable.
* If the player can't go to a particular area, that area shouldn't look accessible.

<gallery widths=500px heights=500px mode="nolines">

File:Fairy_forest_art_issue_7_invisible_wall.jpg| The opening on the left appears to be an entrance somewhere. Level art shouldn't invite the player to a place they can not enter.
File:Trine_4_The_Dream_29.1.2019_hidden_door.jpg|The bottom left door looks like an entrance to a secret room while it's just a decoration. Also, earlier during the level, the player could levitate a painting from the wall to reveal a stash of XP collectables. The painting on this scene, however, is just a decoration and can not be levitated. Inconsistencies can be extremely frustrating, and when faced with a situation like this, it's best to leave decorative assets, like paintings, outside the gameplay area completely.
File:Fairy forest art issue 15 fake secret.jpg|In the blue-toned surroundings, bright, warm lights will surely attract attention, while the actual gameplay element (the breakable wall near the lights) remains in the dark.
File:Fairy forest art issue 10 fake gameplay objects.jpg|If there's a ladder in the gameplay area, the player will want to climb it, no matter if the character actually can. It isn't enjoyable to bump into obvious gameplay elements - and be unable to use them. You should leave unique-looking but functionless gameplay objects out of the gameplay area and insert them sparingly in the background. Level art should always support the possible gameplay elements.
</gallery>

= Misleading Level Art =
== Fake Ledgegrabs ==
*Some art assets might look like ledge grab poles while they aren't. Be very careful not to place misleading art objects in areas that include actual ledge grab surfaces and objects.
*For example, it's not a good idea to set thin horizontal poles and real ledge-grabbable surfaces next to each other.
*Avoid sharp edges in spots where ledge-grabbing is not possible.
*Be extra careful when working on levels with detailed architecture: Visually distinct horizontal support beams, borders, and such can easily mix up with ledge grabs.
*Examples of structures that are easily confused as ledge grabs::
<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_The_Dream_29.1.2019_fake_ledgegrab.jpg|The wall geometry near the portal falsely suggests the player can ledge grab.
File:Trine_4_Nightmare_13.3.2019_fake_ledgegrab.jpg|The curved part of the right side ledge seems ledge-grabbable, while the actual ledge grab area slightly above it does not.
File:Trine_4_Nightmare_13.3.2019_rock_ledges.jpg|The rock ledges in the foreground are too close to the gameplay area and easily mistaken as grabbable.
</gallery>

== Fake Poles ==
* The poles have a very specific gameplay function: they are used to block objects so that the player can pass through.
* Avoid placing any non-gameplay poles on or too near the gameplay area.
<gallery widths=500px heights=500px mode="nolines">
File:Fairy forest art issue 8 art poles.jpg| There are two kinds of poles featured in the gameplay area: The vertical ones don't restrict the movement of dynamic objects, while the horizontal ones do. The horizontal poles have a gameplay function - they are needed to block the player from moving dynamic objects past them. However, the vertical poles are not gameplay objects and shouldn't be placed in the gameplay area at all.
</gallery>

== Fake Breakable Walls ==
* Breakable wall assets are meant to be used only when constructing breakable walls, not for anything else.
* Those art assets that look like breakable wall assets shouldn't be used for decorative purposes.
* No large wall chunks or any other noticeable debris should remain after the player has destroyed the wall. The player should know when the wall has been completely shattered and that there's nothing more to break.
* Trine 4 featured breakable crystal walls and used small crystal shards to indicate the moment the wall was destroyed. The right size and look for the crystals was found by tinkering with the contrast in size, saturation and value of the "decorative" crystal bits. The smaller crystal pieces blend into the background (at least more than the larger wall chunks).

<gallery widths=500px heights=500px mode="nolines">
File:Fairy forest art issue 9 fake crystal wall.jpg|Trine 4 crystal walls are always coloured purple to avoid mixing up the breakable walls with regular, non-breakable structures. A very similar-looking asset is likely to confuse the player, as seen here with the purple object. The level artist should never use interactive gameplay object assets (or even assets that look like them) as decorative assets.
File:Trine 4 Badger 23.2.2019 crystals.jpg| It's unclear whether there's still crystal pieces left to shatter or not. The "leftover" pieces should have their own distinct visual look that differs clearly from the breakable wall asset. You could try, for example, using a less covering, dull and desaturated colour that blends into the background for the small bits, while the actual breakable chunks are brighter and contrasted, standing out.
</gallery>

== Fake Gameplay Objects ==
* You shouldn't use gameplay assets for decorative purposes inside the gameplay area or in the immediate vicinity of it (background/foreground). The player must know which objects can they interact with.
* The dynamic gameplay assets should be kept separate from the decorative (non-interactive) level art assets, visually setting the two apart.
* Don't create similar-looking assets that sometimes function as dynamic gameplay assets and sometimes can't be interacted with.

<gallery widths=500px heights=500px mode="nolines">
File:Fairy forest art issue 10 fake gameplay objects.jpg
</gallery>

== Fake XP ==
* No other game art assets should look even remotely similar to the experience collectables.
<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_Hedge_Maze_fake_xp_flower.jpg|The flower buds in the foreground share their colouring with the XP collectables. The shape and size are also very similar.
</gallery>

== Fake Ropetarget Rings ==
* Avoid placing small, camera-facing rings near the gameplay area. Players will have a hard time differentiating them from rope targets.
[[File:Trine Art example confusing rings.mp4|550px]]

= Plausibility issues in 2.5D =
* When making a 2,5 D game, the level art plausibility concerns are usually focused on immersion and worldbuilding.
* However, sensible environmental planning benefits the gameplay as well. If the surroundings provide enough guidance and feel plausible, it reduces the risk of the player getting frustrated and blaming the gameplay for it.

== Platformer logic vs normal logic in Trine ==
* "Platformer logic" refers here to the concept of abandoning all the 3D tools and solutions in favour and because of the 2D gameplay. Platformer logic can be applied to many Trine art and gameplay design decisions.
* Since Trine is attempting to co-pilot a believable 3D approach on the side, platformer logic isn't always the best solution for all the problems.
* Mixing 3D and 2D can lead the player to various frustrating situations. These situations can be made more acceptable with carefully chosen level art:
** For example, wallhead scenarios often force the player to a potentially dangerous 2D route and face to face with the fire-spitting wallheads (while the player might feel the 3D approach should allow them to avoid the danger by simply choosing another path). Level artists, however, can make the other possible routes look less appealing or not available, thus justifying the "platformer logic".
**Doors, on the other hand, should be placed in spots where using them is the only sensible solution. If there's a heavy door at the end of a puzzle chamber and a huge hole in the stone wall next to it, you can't blame the player for wanting to jump through the hole and then getting frustrated when the 2D perspective gameplay stops them.
**Level art should leave the player satisfied for choosing the right path ( = the path that forwards the gameplay) even when the right path doesn't seem to be the most logical one.

[[File:scrshot_wallhead_rocky.png|500px]]

== Visual support for platforms and mechanisms ==
* You should consider the mass, weight and working mechanisms of the art object you're creating. Without proper support and volume to mirror the object's real-life properties, using it might feel unrealistic and not satisfying.
* This approach will also help in conveying the gameplay mechanisms to the player: A flimsy-looking support structure hints to the player that the platform might tip over. If the support structure looks strong, the player feels safer using it.

<gallery widths=500px heights=500px mode="nolines">
File:scrshot_bog_stickplatform.png
File:scrshot_throny_lift.png
</gallery>

== Path of least resistance should be on the 2D plane ==
* The Trine heroes like facing challenges, but most players will choose a more manageable path over the hard one.
* Generally, selecting the path with the least obstacles/resistance feels better. The player's gaze tends to turn naturally towards the route that feels safer and more sensible.
* It's your responsibility as a level artist to ensure that the 2D plane/route should always feel like the most logical one.
* Sometimes, especially with puzzle elements, the 2D gameplay might feel frustrating and arduous. The level art should soften the blow as much as possible and reaffirm the player's route.
* For example, solving a puzzle to open a door might feel annoying if there are plenty of possible 3D art asset solutions dangling nearby and the player is unable to use them due to the 2D gameplay.
* The most efficient path doesn't always get chosen: A fun 2D platforming route can be much more tempting than a staircase in the background.
* Venturing into the unknown is considered unpleasant, and the player might feel uncomfortable selecting an obscure background path. However, figuring out how to open the door to the unknown is exciting.
* A ledge invites the player to reach for it in the hopes of ledge-grabbing (instead of aiming for a platform with no ledge).
* Make sure the play area is the most tempting path for the player to take (instead of the other possible routes seen in the scene) and plan both the visual and geometrical routes accordingly.
* Make sure that the game play area has a clear contrast and that the player's intended path is prioritized visually.

== Examples of possible issues ==
* See below for example scenes where the player might feel like the 2D plane/route isn't the best or the most alluring way to continue
<gallery widths=500px heights=500px mode="nolines">
File:scrshot_birch_blockedpath.png
File:scrshot_lakes_goaround.png
File:scrshot_lakes_spikes.png
File:scrshot_moonlit_door.png
File:scrshot_mountains_glide.png
File:scrshot_mountains_wildcanyon.png
File:scrshot_thorny_goaround.png
File:scrshot_thorny_shrubbery.png
File:scrshot_dream_balcony.png
File:Trine_4_Amadeus_13.4.2019_blocks.jpg|It seems that the player could easily just walk in the foreground without actually solving the puzzle.
</gallery>

== Examples of non-problematic solutions or issues succesfully averted ==
* Here are some examples showing how the play area / 2D plane seems like plausible and the most satisfying way to go, while other route options seem illogical or un-tempting
<gallery widths=500px heights=500px mode="nolines">
File:scrshot_blueberry_log.png
File:scrshot_moonlit_mushroompit.png
File:scrshot_mountains_door.png
File:scrshot_fairy_plankplatforming.png
</gallery>

[[Category:Trine 4]] [[Category:Trine 4 Level Art]] [[Category:Trine 4 Design]]

Level Art: Ideas for New Levels

2021-11-23T13:49:37Z

Tero Tirkkonen:

Level Art: Environmental Storytelling

2021-11-23T13:49:30Z

Tero Tirkkonen:

Level Art: Composition

2021-11-23T13:49:24Z

Tero Tirkkonen:

Level Art: Color and Lighting

2021-11-23T13:49:09Z

Tero Tirkkonen:

{{:Level Art}} 

= Color is a combination of value, hue and saturation =
* Color is made of three things: '''VALUE, HUE''' and '''SATURATION'''
* Color is always relative and the context determines how colors are interpreted
* The most important aspect of color is the value of color, meaning the darkness or lightness of a color. This attribute will be seen even clearer if the image is turned into a grayscale mode
* Hue means the actual color, for example the hue of the color can be red, yellow, blue, orange, green, purple and anything between those
* The hue can be cold or warm, so there can be warm or cool temperature for the hue. This, as everything with colors, is always relative and depends on the other colors around the color in question. Colors always exist in some environment that affects them
* A hue can look warm next to a cooler hue or cool next to a warmer hue. A value can look darker next to a lighter value and lighter next to a darker value, and this is true for saturation too
* Saturation determines how vibrant the color is. A very saturated color is vibrant and desaturated color is muted and closer to gray
* Lighting and colors are always tied together. When designing a lighting, first determine what you want to achieve with the color choices and keep your intention in mind while building the lighting
* It's best to always think about the contrast. Where do you want to add contrast and guide the eye to look at using value, hue and saturation? And where do you want to keep attention away from with low contrast? Usually the answer is simply that we want to guide the player to the right direction and highlight important gameplay objects while fading the irrelevant things to the background. For transition areas between the puzzles we might also want to create beautiful visual focal points where the attention is completely directed at the art.
* We never want to create confusion or frustration by guiding the player to an area with nothing in there: For example by making an area that is difficult to reach look like there is an entrance to a secret and cause the player struggle to get there only to realize there's nothing in there after all.
* Here: [[Public Level_Art:_Level_Art_Related_Gameplay_Issues#Distracting_Level_Art|Level Art Related Gameplay Issues: Distracting Level Art]], are several examples of the issues dysfunctional colors and lighting can create for the player

[[File:color_wheel_hue_saturation_value.jpg|350px]]

== Gamut masking ==
* Gamut masking can be used to determine a color palette for a scene
* [https://www.youtube.com/watch?v=qfE4E5goEIc James Gurney: Gamut Masking]
* KGamut is a software that can be used to check the gamut mask of an image
* With KGamut you can for example compare the gamut mask of your level art screenshot with a gamut mask of a reference image to get closer to the reference image's lighting
* [http://cr10blog.blogspot.fi/2013/02/kgamut.html KGamut: a digital gamut mapping tool for Windows]
* [http://gurneyjourney.blogspot.fi/2013/02/digital-gamut-mapping-tool-for-windows.html KGamut info]
[[File:Kgamut beach 01 wide gamut.jpg |500px ]]
[[File:Kgamut beach 01 limited gamut.jpg |500px ]]

= Value =
With values you can create contrast or unity by using '''light and dark''' colors
* Some vocabulary:
** '''Value''' = the darkness/lightness, can be most clearly seen in a greyscale image but is present in a full color image as well
** '''Contrast''' = Relative difference between different values in an image. For example: there is a big (the biggest possible in fact) contrast between black and white and less contrast between gray and white
** '''Noise''' = small details with strong contrast that create visually noisy feeling
* With values (as well as other aspects of color) it is crucial to remember everything is relative! A value can look bright or dark depending on what value it is compared to
* When simplified, each image is just a bunch of different value blobs arranged into a composition
* The relative difference in the values between these blobs can be used to make things blend in or pop out
* To make things pop out doesn't always mean to make them super bright, because this won't work in a bright environment as everything else is bright as well. It's all relative to the surroundings so it's all about values and contrasts in each different context.
* If the difference between the values is big, then there is contrast which means that those things stand out more
* If the difference between values is small then there is no contrast and the things don't stand out but blend in instead
* Adjusting values in level art can be achieved with lighting, fog or albedo color or all of these
* In games we can guide the player's eye where we want, for example to concentrate on beautiful visual details or to important gameplay objects. At the same time we don't want the player to concentrate on irrelevant things.
* Irrelevant/background objects/areas should blend in
* Important objects/areas that need to be highlighted have to pop out by either being a dark object on a bright background or vice versa, simple as that!
* If the important object is surrounded by noisy irrelevant visuals it will be lost in the visual noise. So it's good to have clear surroundings for these important objects. That way the contrast can be controlled and adjusted to highlight the important objects and blend in the irrelevant things.

[[File:Visual noise contrast theory.jpg|400px]]
* A) The same level of detail and contrast everywhere creates a noisy feeling and it's hard to figure out where the focus should be
* B) Less detail and contrast in the environment and a higher level of detail and contrast in one area makes it much easier to decide where to focus

== How to check the true values of an image in Photoshop ==
* It's not as easy to see the different values and their relations while the image is in full color as the different hues and saturation can complicate things a lot
* It is crucial for any artist to be able to check the values of an image and the best way to do this is to look at the image in a grayscale mode
* The areas with most contrast between different values are the areas the eye catches first in an image
* If an image doesn't look good and clear in grayscale, it will not work in color mode either
* You might think that the hue/saturation adjustment or some other Photoshop grayscale adjustment works just fine but actually they don't

* To see the true values of an image in Photoshop use the proof color setup
** Select View -> Proof Setup -> Custom...
** "Device to Simulate: Dot Grain 20%", "Render Intent: Relative Colorimetric", "Black Point Compensation" checked
** Now you can switch between the basic color mode and the true greyscale mode to check the true values colors using CTRL+Y any time
** You can for example check a screenshot's values in Photoshop with this method when designing the lighting and colors or trying to find out how to make the scene clearer
[[File:True values.jpg|800px]]

== Guiding the player with values ==
* Simplify how you see forms and value. Everything you see is just blobs of value, it really isn't more complicated than that.
* It's either light or dark. A light colored thing pops out on a dark background, but blends in into a light background
* This is true for anything, any theme, foreground, gameplay area and background, for landscapes as well as characters
* What is the area with the most contrast in the scene? Is that where we want the player to look? If not, then the contrast is in the wrong place.
* Does the important thing lack contrast and blend in? Create contrast: if the thing is bright in value, put dark around it, if the thing is dark value, put bright around it.
* How to make the route clear? Guide the player with the values, have darker areas on the edges where the player is not supposed to go. Make sure the right path is clear and pops out.
* Pay attention to values and contrasts and use them to make important things pop out and unimportant things blend in

<gallery heights=400px mode="packed">
File:Owls dream overpaint 01.jpg| The gameplay route is same material and value as the background so it's hard to see the gameplay route
File:Cornelius dream overpaint 06.png| The background has noise so important things aren't highlighted enough and they are lost in the background
File:Gislans dream overpaint 11.png| The values are flat so they don't guide the player to the right direction
File:airy_fairy_overpaint_78.png| The values are random noise so they don't guide the player to the right direction

</gallery>

== Bring out the important gameplay objects with values ==
* Examples of situations where the gameplay area and objects aren't visible enough due to the value issues
<gallery heights=400px mode="packed">
File:Cornelius dream overpaint 04.png| The important gameplay items aren't clear as the values don't bring them out enough
File:Rudolfus dream overpaint 03.jpg|The spikes, the platforms and the gameplay area poles don't stand out enough. It could also be made clearer that the level doesn't continue to the left here.
File:Rudolfus dream overpaint 04.jpg|The chest and the gameplay area poles don't stand out enough. The background structures make the scene less clear.
File:Rudolfus dream overpaint 05.jpg|The lever, the platforms and the gameplay area poles don't stand out enough
</gallery>

== Create depth with values ==
* With values and contrasts you can create a sense of depth to a scene. Adding depth will make the general feeling less flat.
* A simple rule of thumb is that the closer a thing is, the more contrast it has and the further away it is the less contrast it has
* This is because of the atmosphere, the further away a thing is the more air with all sorts of dust particles, moisture etc. there is in between and they'll create "fog" that makes things blend together more and more the further they are. This fog can have its own hue too depending on the colors of the scene. For example if the sky is blue things get bluer the further away they are in the background.
* This is a powerful tool to create depth and separate the different layers of depth: foreground (can be several layers), game area and background (can be several layers) in the scene
* It's a common problem in level art that some things on the background appear as if they were on the gameplay area and this can be helped with clear levels of depth
[[File:Level art guide values and depth.jpg|1200px]]

= Hue =
With hues you can create contrast or unity by using '''warm and cool''' colors
* The understanding of the contrast between warm and cool hues is a great tool when building the color scheme of a scene
* For example The color of the light can be warm orange while the color of the shadows is cool blue, this creates an appealing contrast between the light and shadow areas
* The hues of the sunlight will change depending of the time of the day and also different seasons throughout the year affect the colors as well as the humidity or cleanliness of the air
* Do use real life as a reference for creating different lighting scenarios. Even though Trine world is a fantasy world we want to stick to believable real lighting scenarios that people recognize.
* We can take real world lighting and emphasize and exaggerate it, but everything should start from a deep understanding of realistic lighting
* Different light sources have different hues in them, normal fire has orange tones but different magical elements can turn lights into all the different hues. Magical mushrooms or crystals for example can glow in any hue!

[[File:color_theory_hue_temperature.jpg|1300px]]

== Hues Indicating Emotions ==
* For example many movies use a certain color to communicate a certain mood, you can observe this yourself though often it's done in a quite subtle way
* The different hues of colors can be used to create different types of mood and to communicate a certain emotion visually
* Any color can be chosen to communicate any mood as long as the colors chosen for the specific moods stay consistent throughout the game
* There are certain hues that tend to be used for certain moods more often depending on the cultural environment so using those stereotypes as is or turned on their head can be ways to use hues to indicate moods
* Here is just one example how the hues could work consistently supporting the mood and emotions of the story
[[File:Environment_design_colors_and_emotions_example.png|400px]]

== Examples of using hues to determine the mood ==
<gallery heights=200px mode="packed">
File:Trine 4 screenshot 01 1080p.png| Light pastel colors to establish a calm environment
File:Trine 4 screenshot 02 1080p.png| Warm and welcoming feeling with yellows and oranges
File:Trine 4 screenshot 06 1080p.png| A warm and cozy color scheme for the friendly Badger's home den
File:Trine 4 screenshot 05 1080p.png| Lush green calming environment
File:Trine 4 screenshot 39 1080p.png| This environment is meant to be uninviting and menacing so pale cool greenish blue hues are used to achieve that atmosphere
File:Trine 4 screenshot 20 1080p.png| Menacing mysterious feeling created with purple tones
File:Trine 4 screenshot 23 1080p.png| Calm and more friendly mysterious feeling created with blue tones

</gallery>

= Saturation =
With saturation you can create contrast or unity by using '''vibrant and muted''' colors

* Saturation means the purity of the hue
* With maximum saturation the color is purest and most vibrant and with less saturation the color turns more towards gray
* Just like with values and hue you can also use saturation to guide the eye of the player
* In a desaturated environment a saturated spot will grab your attention
* Trine series is known for its colorful environments but being colorful doesn't mean that every color has to be at the maximum saturation
* If everything is very saturated it can become visually overwhelming quickly so generally it's good to be mindful when deciding which areas should have a lot of saturation
* The saturation can also be explored using gamut masks mentioned earlier in this article

[[Category:Art|Level Art: Colors]] [[Category:Level Art|Colors]]

Level Art

2021-11-23T13:48:39Z

Tero Tirkkonen:

<onlyinclude>
<div style="float:right; width:40%; padding-left: 20px;">
'''Related sites'''
* [[Level Art]]
* [[Level Art: Color and Lighting]]
* [[Level Art: Composition]]
* [[Level Art: Environmental Storytelling]]
* [[Level Art: Ideas for New Levels]]
* [[Level Art: Level Art Related Gameplay Issues]]
* [[Level Art: The Level Art Phases]]

</div>
</onlyinclude>

== Level art workflow steps ==
[[File:level_art_wiki_header_banner_process.jpg]]
* Level artists create the visible game environment built on the collision block base created by designers.
* Level artists work with the Frozenbyte in-house engine and editor.

<br>
# '''The Idea''' - a mental image to work towards. The Idea is shaped and refined by reading the script, exploring the concept art and level wiki site and communicating with different team members like the AD, designers, the scriptwriter and/or other artists.
#* '''Outline meeting''' can occur before the design work has even started, gathering all the people working on a level to plan and discuss.
#* ''' Collecting reference''' includes researching the topic by searching inspirational reference images. Pinterest, for example, is a good online source for reference images.
#* ''' Level collision base meeting ''' takes place before the level art phase begins. The AD, level artists, designers and other related people working on the level are involved.
#* '''Preassembly''' can happen when a designer works on a level file, making it impossible for a level artist to access the same level. The artist can build level art arrangements to a separate file, requesting feedback from the AD during the preassembly.
# '''Base art''' - The Base art phase includes establishing a preliminary lighting setup, blocking the level art and building a strong and working base supporting the gameplay. Base art should be kept simple, concentrating only on the big forms and covering all the bare collisions.
#* '''AD's camera check''', done in collaboration with the designers, is followed by a camera fix list. It guides to adjust the cameras so that their positions are optimal for both the gameplay and art.
#* '''AD's base art check''' results in a fix list that may include paint-overs advising on how to improve the base art.
#* '''Base art fix round''' includes optimizing the camera positions and improving base art according to the feedback of the AD.
#* '''Lighting adjustments'''
# '''Detailing''' - Once the base art meets the requirements, details are added.
#* '''AD's details check''' results in a fix list that may include paint-overs advising on how to improve the level art.
#* '''Details art fix list round''' has the artist improving the level art based on the AD's feedback.
# '''Polish''' - Polishing happens at the end of the project when there's spare time. It consists of improving the level art by, for example, adding new 3D assets, documenting significant changes with before and after screenshots and consulting the AD.
#* '''Polish and optimizing''' includes general level art polishes, lighting adjustments and optimizing things.
#* '''Playing the game''': should be a daily level artist routine. Only by playing the levels you can evaluate the quality of the level art and make sure the level art supports the gameplay as much as possible. The level artists should play the game together in co-op, as well, to observe level art in a multiplayer mode and share ideas. <br>

=== Things to consider ===
* Working with the level art is '''an iterative process''': Art is created layer by layer, starting from the crude, bigger forms and ending with the detailed, final art.
* The aim is to keep the whole level at '''a consistent state at all times''' and only add finer details once the big forms are satisfactory.
* Level art is a process of continuous development. Nothing is final after the first round, and sometimes whole level areas might be reworked entirely. Large, creative projects always involve some degree of adjustments and alterations, but there are several reasons why level art can be subjected to a change:
**'''All the assets might not be available''' during the initial level art work, forcing the level artist to use temporary assets. They need to be replaced with new ones later, which can be time-consuming.
**'''The design can change''', also affecting the level art.
**'''A new and better visual idea for a scene might emerge''' at any point during the development.
**'''Technical changes''' sometimes require level art reworking.

=== Additional tips about the creating process ===
* '''Play the game''' It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game!
**The level artist's responsibility is to ensure that the level art supports the gameplay in each part of the level.
**The player can only see what the in-game cameras are showing, making play testing the level even more important.
*It's essential to get '''the scale''' of the environment right as early as possible. '''Always have a game character model as a scale reference''' when you start blocking the level art.
** Generally, the assets in the background of a level tend to look smaller than you might expect, and you might have to scale up those assets slightly to make them look better in the game. Commonly, in-game assets are bulkier and larger than their real-life counterparts since that helps them stand out in the game. However, you should be careful when scaling assets, as the texel density (texture resolution) and geometry get easily incoherent.
** How to nail the right scale: [http://www.neilblevins.com/art_lessons/details_make_big/details_make_big.htm Using Details To Make Something Look Big By Neil Blevins]
* ''' Flexible level art work'''
**Sometimes you might be in a hurry to finish the level art, but the design is unfinished, leaving you unable to work on the level file.
** In a situation like this, it's best to communicate with the designer to determine whether some areas of the level are already finished. You can create a copy of the level to start your level design work, and when the design is complete, just copy and paste the level art to the actual level.

* ''' Links for learning'''
<div class="toccolours mw-collapsible mw-collapsed" style="background-color: #e6f2ff; border-width:2px; border-radius:10px; margin: 5px;">
Some general art fundamentals tips that are useful for any game artist:
<div class="mw-collapsible-content">

'''Lighting'''
* [http://gurneyjourney.blogspot.com/search/label/Color%20and%20Light%20Book Color theory: James Gurney's blog]
* [http://www.itchy-animation.co.uk/tutorials/light01.htm Lighting Fundamentals for Artists]
* [https://www.youtube.com/watch?v=MVafJfV5xhI Nathan Fowkes 'Better Options for Color Vibrance' ]

'''Composition'''
* [http://www.neilblevins.com/art_lessons/areas_of_visual_rest/areas_of_visual_rest.htm Neil Blevis: Areas Of Visual Detail, Areas Of Visual Rest]
* [http://www.neilblevins.com/art_lessons/clumping/clumping.htm Neil Blevis: Clumping and Grouping]
* [http://www.neilblevins.com/art_lessons/compositional_weight/compositional_weight.htm Neil Blevis: Compositional Weight]
* [http://www.neilblevins.com/art_lessons/composition_contrasts/composition_contrasts.htm Neil Blevis: Contrasts In Composition]
* [http://www.neilblevins.com/art_lessons/foreground_midground_background/foreground_midground_background.htm Neil Blevis: Foreground, Midground, Background]
* [http://www.neilblevins.com/art_lessons/layers_of_light_and_dark/layers_of_light_and_dark.htm Neil Blevis: Layers Of Light And Dark]
* [http://www.neilblevins.com/art_lessons/primary_secondary_and_tertiary_shapes/primary_secondary_and_tertiary_shapes.htm Neil Blevis: Primary, Secondary and Tertiary Shapes]
* [http://www.neilblevins.com/art_lessons/details_make_big/details_make_big.htm Neil Blevis: Using Details To Make Something Look Big]
* [http://www.neilblevins.com/art_lessons/tangents/tangents.htm Neil Blevis: What is a Tangent? And How To Solve Them]

* [https://www.deviantart.com/lulie/art/The-Secret-to-Composition-272036625 The secret to composition]
* [https://twitter.com/eyecager Composition tips etc by Amber Blade Jones]
* [https://www.youtube.com/watch?v=qMH_J_vcoqE&feature=youtu.be&list=PLa1F2ddGya_9XER0wnFS6Mgnp3T-hgSZO Gleb Alexandrov's presentation about balance and composition of elements in creating appealing works]
* [https://youtu.be/GZ99gAb4T0o The Importance of Nothing: Using Negative Space in Level Design]

'''Environmental storytelling'''
* [https://www.youtube.com/watch?v=iemcI0t096I Sam Nielson's lecture about environment design]
* [https://www.youtube.com/watch?v=griCsvvRTQM Sam Nielson's lecture about atmosphere]
* [https://youtu.be/FeUL-5wfj0U?t=3m29s The Art of Environment Storytelling for Video Games GNOMON]
* [https://vimeo.com/165693758 Mike Hill's lecture about Spielberg's Subtext]

'''General creative development'''
* [http://www.neilblevins.com/art_lessons/art_lessons.htm Neil Blevis: Various art tips]
* [https://www.youtube.com/channel/UCbdyjrrJAjDIACjCsjAGFAA Feng Zhu design school videos. All kinds of stuff about painting/design/color etc.]
* [http://wiki.polycount.com/wiki/Polycount Polycount wiki. Basically everything you need to know about game art is found here]
* [https://www.youtube.com/user/McBacon1337/videos Game Maker's Toolkit. Interesting and well-made videos about game mechanics in different games by Mike Brown.]

</div>
</div>

= Building a Level =
== Ideas for New Levels ==
[[Public Level Art: Ideas for New Levels]]<br>
[[File:level_art_wiki_header_banner_ideas_for_new_levels.jpg|800px]]

== The Level Art Phases ==
[[Public Level Art: The Level Art Phases]]<br>
[[File:level_art_wiki_header_banner_level_art_phases.jpg|800px]]

== Environmental Storytelling ==
[[Public Level Art: Environmental Storytelling]]<br>
[[File:level_art_wiki_header_banner_environmental_storytelling.jpg|800px]]

== Level Art Related Gameplay Issues ==
[[Public Level Art: Level Art Related Gameplay Issues]]<br>
[[File:level_art_wiki_header_banner_gameplay_issues.jpg|800px]]

= Level Art Fundamentals =

== Composition ==
[[Public Level Art: Composition]]<br>
[[File:level_art_wiki_header_banner_composition.jpg|800px]]

== Color and Lighting ==
[[Public Level Art: Color and Lighting]]<br>
[[File:level_art_wiki_header_banner_color_and_lighting.jpg|800px]]

[[Category:Editor|Level Art]] [[Category:Art|Level Art]] [[Category:Level Art|Level Art]]

Level Art: The Level Art Phases

2021-11-23T13:48:17Z

Tero Tirkkonen: Tero Tirkkonen moved page Public Level Art: The Level Art Phases to Level Art: The Level Art Phases without leaving a redirect

{{:Public Level Art}} 

= The Level Art Phases =
'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

* The level art process in a nutshell:
** 1) Reference and Research
** 2) Preassembly
** 3) Base Art Blocking
** 4) Detailing
** 5) Polishing & Optimizing
** + Feedback. The level artist receives feedback during the whole level art process.

* Communication is important. Talk with AD, asset artists, other level artists and designers. These conversations should happen often; constant communication is needed throughout the whole level art process.
* Base art is the most important part of the level art process. If the base art is lacking, nothing works - no matter how many pretty details you stamp over it.
* The level art work is done iteratively, keeping the state of the art coherent throughout the whole level constantly. In other words, unfinished areas with bare collisions and areas with finished, detailed level art shouldn't co-exist within the same level.
* The whole level should stay as playable as possible at all times. If your art assets (even the temporary ones) result in hindering or preventing the level from being played, you shouldn't use them.

== Level Art Scheduling ==
* The time needed for the level art process is usually allocated as follows: The Base art takes 60%-70%, detailing 20%-30% and polishing 10%-20% of the time.
* Ideally, the time required to build a level from scratch to finish is roughly '''3 months (about 60 workdays)'''. It leaves enough time to commit the base art and polishes properly and tackle any surprise work that may emerge.
* If in a hurry, a level can be built as quickly as in '''2 months (about 40 workdays)'''. There's enough time to commit the base art and polishes adequately, but there's no room for errors or any surprises.
* There are multiple factors that can affect the level building duration, for example:
** The quality of the base art work (or any other art phase work, of course, but since the base art is the most important, fixing and fine-tuning it will take the longest)
** Changes in the level design schedules
** Sudden problems unrelated to the level artist/art team
** 3D assets missing/pending
** Changes in the gameplay design, requiring level art modifications
** Co-workers (designers, for example) needing to work on a level at a crucial time
** Sick leaves and personnel changes
** Unexpected and surprising issues

== Level Art Process Steps ==
# Before level art process starts: Familiarizing yourself with the '''references''' available and '''researching''' the topic
# Before level art process starts: '''level meetings''' with AD, 3D art lead and the level artists and designers that are/will be working on the level
# '''Preassembly''': No access to the actual map file yet, building the level art arrangements and asking for '''feedback from the AD'''
# '''Base art''': '''Preliminary lighting''' setup
# Base art: Blocking the level art, building a strong and working base that supports the gameplay, covering all the collisions - keeping it simple!
# Base art: '''Camera fix list''': adjusting the cameras to function as good as possible (considering both the gameplay and art), consulting designers
# Base art: '''AD's check''' and writing a fix list
# Base art: '''Fix list round''' where the base art is improved according to AD's feedback
# Base art: '''Lighting adjusting'''
# '''Detailing''': Adding details on the base art
# Detailing: '''AD's check''' and writing a fix list
# Detailing: '''Fix list round''' where the level art is improved according to AD's feedback
# '''Polish and optimizing''': Optimizing, adjusting lighting and fine-tuning level art until the time runs out. Multiple people can add more fix requests to the fix list when the content lock is approaching.

=== Example Art Schedule for One Level ===
* The timeframe for building levels is 65 workdays per level
* '''Some tasks can be done simultaneously''', including base art checks, camera fixes and lighting polishes. An example: Camera set-up can be pre-built for a different scene and then copied to the final level after the lighting polishes have been finished.
* You can keep editing the level during any AD's check since AD won't be saving anything.
* There are times when you can't access the level due to a co-worker editing it, but you can create a duplicate of the level and continue your work there. When the level file is available again, just copy and paste your work from the duplicate to the original level.
* When unable to access a certain level, you can also start working on another level.

* Colors explained:
** <span style="font-size:14px; color: #ea9b99"> '''Level artist'''</span> (Responsible of this level)
** <span style="font-size:14px; color: #a3d5a3"> '''Camera artist'''</span>
** <span style="font-size:14px; color: #d9b887"> '''Lighting artist'''</span> (Optional, there could be none or several level artists responsible of the lighting as a whole)
** <span style="font-size:14px; color: #bac0ec"> '''Art Director'''</span>

{| class="wikitable"
|-
! 20 days
! 2 days
! 4 days
! 20 days
! 3 days
! 10 days
! ?? days
! 5 days
! 1 day
! ?? days
|-

|-
|style="background-color:#feaeac"| Base art || || style="background-color:#ebc793"|Lighting polishing || style="background-color:#feaeac"| Base art fix and detailing || style="background-color:#ebc793"|Lighting polishing ||style="background-color:#feaeac"| Details fix || Wait for puzzle versions,<br>work on another level|| style="background-color:#feaeac"| Puzzle versions art || style="background-color:#feaeac"| Coop playtrough with level artists ||style="background-color:#feaeac"| Final polish
|-
| || ||style="background-color:#bef1be"|Camera fix|| || || || || || ||
|-
| ||style="background-color:#c9cfff"|Camera check||style="background-color:#c9cfff"|Base art check|| || style="background-color:#c9cfff"|Details check|| || || || ||style="background-color:#c9cfff"|Random checks
|-

|}

== Research and Reference ==
* All the developers need to work towards a common goal, and it's everyone's responsibility to keep that goal in mind.
* To help everyone to share the same vision and understand the project as a whole, there are tools available:
* When hopping aboard a new project, go through the reference materials to familiarize yourself with the overall vision, goals and tone of the project. Refer to these materials regularly during the project.
* If you're a level artist, study the basics of [[Public Level Art: Environmental Storytelling|Environmental Storytelling]].

=== Script ===
* Read the whole script at the beginning of the project.
* When beginning the level art process for a new level, go back to the script and read again the section describing that level.
* You should re-read (parts of) the script every now and then to make sure all the details and ideas are reflected in your level art.

=== Wiki and Concept Art ===
* When assigned to a new level, go through the wiki page for that level - and keep editing and reading the page during the level art work.

<gallery heights=350px mode="packed">
File:level_concept_examples_01.png|A level art wiki site contains all the concept art related to the level, maps, color and shape plans etc.
File:level_concept_examples_02.png|You want to study all the available materials carefully to get the big picture. After that, feel free to search for more reference images online.
</gallery>

== Preassembly ==
* Preassembly isn't usually scheduled, allowing the level artist to do it whenever there's time.
* Preassembly means working on the level art before you can access the actual collision-blocked map file with all the puzzles and design. The goal is to eliminate any idle waiting time.
* During the preassembly face, you should familiarize yourself with the level theme and assets without distractions.
* The most important preassembly work is creating a solid library of level art arrangements. Take your time and choose the arrangements that best suit the level: some assets in the library might be scrapped but most of them should end up in the final product.
* Use the preassembly time to try out your ideas. It's a perfect time to play around and experiment without paying any attention to the level geometry restrictions of the real level.
* You can quickly build rooms, backgrounds, focal point arrangements, gameplay platforms etc. without worrying where to place them exactly.
* Since preassembly creations are not integrated with the actual game collisions, it's much easier to edit them if something doesn't feel right.

=== How to Preassemble ===
* Gather a bunch of ideas by reading the script, familiarizing yourself with the level wiki site, browsing through the new level assets and possibly searching online reference images.
* With a head full of ideas, start building level art arrangements for the level. Begin with the necessary must-have objects needed in the level and create more as you go.
* While creating the preassembled arrangements, you'll probably start developing some kind of an idea concerning the structure of the level.
* Every level should have a focal point area in the beginning and in the end. Figuring out how those areas are executed is a great place to start.
* It's easiest to start with story areas described in the script, areas with existing concepts and/or areas you have a strong vision in mind for already.
* Be careful not to add too many details, as the detailing phase happens only after the preassembled arrangements are placed in the actual level map and the base art is satisfactory.
* Once you're happy with an arrangement, you can store it under the null (the null object in Editor) for easier handling.

=== Possible Pitfalls ===
* While it allows you to experiment freely with the level, there are some issues you may encounter during the preassembly phase:
* '''Incoherent and disjointed level flow''': The flow of the level needs to be coherent from the start to finish. Be careful when arranging separate pre-made blocks of art together and pay special attention to "in-between" transition areas. Keep the big picture in mind.
* '''Detached feel''': Copying the preassembled arrangements to an actual level may result in a feeling of not belonging. The pieces might look and feel like a separate backdrop floating behind the 2D game area (that's actually what they are, in fact, but they shouldn't feel like that). When adding your arrangements, integrate them seamlessly into the gameplay area.
* '''Under-optimization''': A seemingly small piece of extra geometry is multiplied rapidly when the arrangements are duplicated. To avoid repetition and clumsiness, optimize the use of your preassembled arrangements.
* '''Too many details''': The preassembly phase is followed by a base art phase. If the preassembled content is detailed and complex, it'll make the base art phase overly complicated and will slow the progress down.

<gallery heights=350px mode="packed">
File:level_art_preassembly_architecture_examples.jpg| Preassembled arrangements for the Trine 4 DLC Cornelius's Dream level
File:level_art_preassembly_organic_examples.jpg| Preassembled arrangements for the Trine 4 DLC Rudolfus's Dream level
</gallery>

== Base art ==
'''The first on the foremost purpose of level art is to support the gameplay and bring out the important game objects as well as possible.''' A visually pleasing game is an important goal on its own, but the level art must always submit to the gameplay. When the base art phase is over, there should be a fully playable level with both art and the gameplay functioning and complimenting each other.

'''It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game! It's your responsibility to ensure that the level art supports the gameplay in each part of the level. The player can only see what the in-game cameras are showing, making playtesting the level even more important.'''

=== Cover and Match All the Collisions ===
* Once a designer is finished with a level, it's handed to a level artist. It's time for the base art phase.
* Base art phase is scheduled - it's important to fill the level with art as soon as possible.
* During the base art round, art elements are added to a level for the first time. Everything is built on top of the base art, so it's very important to get it right.
* Base art phase includes '''covering all the visible collisions'''.
** Note: If you match the collision areas and art carefully during the base at phase, it'll save a lot of time and the need to fix them later.
** Go through all the areas the player can interact with and check the collisions - remember not to consider only the characters but also the wizard's levitating objects.
** Pay attention to smaller things as well, like floating rope targets. The aim is to cover and support all gameplay elements with art so that the game can be played and enjoyed after the base art phase.
** Go through the level from start to finish. Play the level yourself with a character and make sure the collisions work as intended (AKA characters aren't floating or walking inside assets and characters or levitation objects won't get stuck on invisible collisions).

=== Focus on the Big Picture ===
* During the phase art base, '''do not add small details'''. If the base geometry goes through changes and level art needs to be altered, additional art details slow down the process a lot: checking the level, doing paint-overs and fixing the base level art is really difficult if there are a lot of details.
* After the art blocking phase '''the level should look and feel "complete", serving as a solid base to add things later on.'''
* Even if you must work with placeholder 3D assets, try to match the '''proportions''' from the start.
* Don't spend too much time creating intricate, highly detailed placeholder areas. Rather use temporary structures, instead, or, if you must, leave the area empty while waiting for assets.
* Divide your work into steps, to avoid spending all your time on a single finalized scene and neglecting other areas. Focus on '''a single run throughout the whole level'''.
* A safe place to start are the walls, ground, floor and other environmental elements making up the big objects.
* '''The backgrounds''' are an important part of the base art. They play a huge role in creating the big shapes and the visual flow.
* When working with outside locations, don't forget the sky - or you're missing out on a big part of the screen. Remember to add the clouds and weather elements etc. They are a very important part of the level's general flow.

<gallery heights=400px mode="packed">
File:base_art_and_detail_art_01.jpg| A great example of the base art done right: A simple setting, providing a great base to build on and add details. Also easy to modify, if needed.
File:base_art_and_detail_art_02.jpg| The base art looks good, though the door collision is yet uncovered. Allowing the unique gameplay asset (the snowball instructions in the background) collisions to go untouched is ok in this scene, as they will be replaced with new assets later.
File:base_art_and_detail_art_03.jpg| A good base art is simple enough - when the whole set could be changed, one shouldn't waste too much time with the base art.
File:base_art_and_detail_art_04.jpg| The base art is too detailed here - if there are any changes to the level geometry, a lot of work has been done in vain.
</gallery>

=== Basic art principles are present from the start ===
* [[Public Level Art: Composition]] The composition and flow guide the player through the level. Tip: Select the right materials for the shapes, and never use assets scaled too large, unless you can hide them well.
* [[Public Level Art: Color and Lighting]] Color and lighting can be used to guide the player as well. Tip: Use the values and contrasts so that the important things pop out and unimportant things blend in. Invite the player towards their intended path with lights and use darker tones for those parts of the screen the player is not supposed to stumble into.

=== Don't Let the Collisions Restrict You When it's Not Necessary ===
* The collisions are implemented by level designers - while they pay attention to art details as well, their job is designing the game, not making art.
* Never edit the collisions or gameplay objects without consulting the designers first - but don't be afraid to ask about the matter. Have a conversation with the designer about the changes you wish to make, and if they agree, proceed.
* The gameplay area is a narrow 2D plane, the width of it being only about 2 metres. The collision rules, for example, are applied only inside those two-meter borders. Your job is to blend the gameplay area into the surrounding 3D scene and to make it a believable part of the world (as opposed to an artificial, detached lane).
* As long as your foreground or background items don't distract the player from the important gameplay things, feel free to experiment and go wild.
* It's not necessary for the background and foreground areas surrounding the gameplay area to follow the general shape of it. On the contrary, they should be used to create depth and hide the fact that the actual game happens in a narrow, straight line.

=== Requesting New Pieces to 3D Asset Sets ===
* Level artist uses the 3D asset sets created by 3D artists to build levels - and figure out simultaneously how the various asset pieces work.
* Don't hesitate to give feedback to 3D artists and/or request art from them. Both you and the 3D artist benefit when useful and visually satisfying asset sets are created.
* The 3D artists create the assets and don't really build levels with them. To make full use of all assets and connect them together, it's likely you'll need to ask for more parts.
* If you need more asset pieces created, compile a list of your needs during the base art base and deliver it to the 3D art lead.
* For example, you might ask for more differently sized pieces to a wall set, if [[Public Level_Art:_Composition#Problems_created_by_scaling_3D_models_too_much|scaling the size of the old ones up]] or [[Public Level_Art:_Composition#Non-uniform_scaling|non-uniformly]] will result in the visual quality suffering.
** Note: It's fine to use the too-much-up-scaled or non-uniformly-scaled versions of the pieces for the first version of your base art. Request the new 3D pieces by the end of the base art phase and replace the old assets with new ones later.
** Tip: If possible, it's better to gather a list detailing all your needs than to ask for a new 3D set piece every day.
** Tip: When building temporary structures from currently available assets, write down their measurements and describe the shape that you want the new assets to be. Pass your notes along with your asset order list to the 3D artist who can use them as a reference.

=== Prioritize the focal point areas ===
* Start with the focal point areas (beginning, ending, story areas, special art areas etc.) and plan the rest of the base art around those scenes.
* The level start and end areas are usually focal point areas, as we want the first and last thing the players see to look extra nice.
* Not every single frame can be a focal point one, but there should be more general areas between instead. By alternating the various scene types it's easier to avoid player exhaustion, create rhythm and emphasize the special areas.
* Since the game project is on the clock, it's best to schedule and plan carefully before the actual work.
* 2D angled games (like Trine) face issues with matching the organic art to the straight collisions. To avoid that, you might feel tempted to create natural rock formations with perfectly straight 90-degree angles. Try keeping the rock formation as natural as possible, instead, while strictly following the gameplay collision areas and rules (the foreground and background area are not tied by the gameplay area rules). If a straight/90-degree surface must be included, you can use man-made constructions (brick, wood) rather than pursuing the "natural" rock look.

==== Focal points ====
* Focal points are very delicately planned and beautifully built areas inside the level.
* They can be impressive and unique hero assets or just small asset arrangements built out of ordinary assets (nicely composed and made look perfect for the specific camera angle).
* Most of the level should consist of the "basic environment"; focal points are located here and there to spike interest.
* You can also use carefully crafted small lighting scenarios as points of interest, like a warm ray of light emerging from a hole in the cave wall, illuminating some mushrooms/rocks/etc.
* In Trine games you should place the focal points between the puzzle areas. Scenes containing puzzles should be clear of any distractions, allowing the players to fully focus on solving the puzzle.
** The puzzle areas shouldn't look boring, either, but it's a good practice to build the various areas of the level to highlight their function.
* If there's not enough space for an important focal point area in the game, talk to the designer. Usually, they are willing to add the needed space to the level.
* Reference images are especially important when building focal point areas, so study and search for new images!
* Even if two levels share a theme, each level should have a unique feeling of its own.
* There should be something special and visually memorable in each level: A point that evokes feelings and makes the level remarkable. For example, a shark swimming by, a unique geological formation or the oldest classic - a breathtaking scenery point.

<gallery heights=200px mode="packed">
File:Trine 4 screenshot 17 1080p.png| A striking focal point features a unique wizard face sculpture asset specifically made for this spot.
File:Trine 4 screenshot 44 1080p.png| The dragon skull on the background, its strong silhouette against the sky, is an eye-catcher and a remarkable focal point.
File:Trine 4 screenshot 38 1080p.png| The statue on the left is highlighted with golden "god rays". The cave is full of angular forms, making the statue stand out.
File:Trine 4 screenshot 43 1080p.png| The bear statue adds a mysterious focal point to the more traditional forest scenery.
File:Trine 4 screenshot 40 1080p.png| Frozen dragon skeleton is framed with the diagonal "god rays" from the top and diagonal icicles from the bottom.
File:Trine 4 screenshot 25.png| The fiery planet draws eyes towards it. The shiny celestial body is surrounded by curved shapes emphasizing it even more.
File:Trine 4 toby's dream screenshot 02.png| The curved branch silhouette is a simple, yet effective focal point. The flow of the scene supports it nicely.

</gallery>

== Detailing ==
* When the detailing phase is reached, it's a race against the clock to get all the levels finished on time, thus making the detailing phase a tightly scheduled one.
* The level is already filled with functioning and pleasing visuals. Details are added for plausibility reasons, and to pique visual curiosity, to create depth and to add to the level's visual charm.
* The level base is optimized during the detailing phase to make sure there isn't any excess geometry left.
* Pay attention to the consistency of your art in a single level and of the whole game: there shouldn't be some areas filled with details while some are completely empty.
* Always iterate gradually. It's tempting to fill one area from top to the bottom with detailed and finished art - and then move on to the next one, but you might end up running out of time and ruining the coherent feel of the level.
* [[Public Level Art: Environmental Storytelling|Environmental storytelling]] should guide your work while detailing.
* The level design might change during the detailing phase, forcing you to consider and adjust your level art accordingly.
* When the detailing phase is over, each level of the game should be "good enough". The sooner the levels reach that state, the better.
* In theory, once the detailing phase ends, each level should be ready to ship (if, for some imaginary reason, there were no time or resources for any polishing). That means art is coherent and of good quality, supporting the gameplay. There shouldn't be any major visual issues. In reality, the Trine levels are always polished and fine-tuned.

== Polishing ==
* Usually not a scheduled phase, as the levels entering this stage have reached the "good enough" standard mentioned earlier.
* The remaining time (until the content lock day) is spent fine-tuning everything as much as possible.
* Polishing is done last to ensure the overall quality of all levels. Each level should reach the "good enough" state before any polishing on any level happens.
** Note: If you have gaps in your schedule during the earlier level art phases (while waiting for access to a certain level, for example) it's ok to do some polishing work as well.
* The Trine game levels are polished until the last possible moment, and none of the levels is considered "final" until the game launch day.
* Even when polishing you need to consider the general art quality and aim for coherence throughout the game: some levels can't look more polished than the others.
* New 3D assets might appear during the later stages of the project, and they are distributed evenly among the levels.
* Polishing phase entails minor detail fixes and also bigger base art level fixes. The development is a constant flux: some brilliant ideas come up late and some previously functioning concepts are abandoned during the later phases.
* While it's not recommended to implement any radical changes during the polishing phase, don't be afraid to speak up (no matter how close the deadline is), especially if your idea would elevate the quality of the whole level.

=== Polishing a Level Originally Created by Another Artist ===

* Polishing can be done by any of the level artists, no matter who originally created the base art and detailed art.
* It's beneficial for all the level artists to work on all the levels. That helps to keep the levels fresh and coherent and ensures the full potential of the art team is used.
* Nevertheless, some things should be considered when polishing a level made by another level artist:
** The artist responsible for a level's base/detail art might feel some degree of mental ownership of the level. Every other artist is encouraged, however, to suggest their ideas and execute changes. Nobody owns the level or the level art.
**However, the original artist has the best understanding of the level, granting them the chance to participate in the process and to voice their opinions and thoughts.
**The AD has the final say on which art version will be used, but they base their decisions on listening and reasoning, making sure each team member gets their voice heard. While the AD has the best grasp of levels as a whole, the level artist knows their level best.

* '''First, discuss with your AD and the original level artist'''
** Get a permission to start with the polishing work from your team lead.
** If you plan on executing radical changes, talk with the artist responsible for the base and detail art.
** The level might feature, for example, story-related elements that affect the level art. The original level artist can brief you about special details.
** Tip: Before making any changes, read the level art wiki site to understand the level.

* '''Smaller detail polish directly to the level, bigger base art polish to a copy of the level'''
** When you polish smaller details, not tampering with the base art radically, save your work to the actual level.
** When planning to make big changes, try them out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Keep the level of details coherent'''
** After reaching the "good enough" state, level art shouldn't revert back to any of the previous art stages even temporarily.
** When planning to make big changes or stripping a part of the level bare of the detailed level art, try the changes out in a copy of the original level. The actual level should stay playable and detailed at all times.

* '''Before & after screenshots'''
* Take before/after screenshots of the changes
** If the changes are small, use the actual level
** With bigger changes, use a copy of the actual level
* Take screenshots before and after using the same camera positions.
* You need to be able to pinpoint the location and the exact nature of the changes.
*Tip: You can always return to the original version of the level to take the screenshots.

* '''Feedback'''
** When making larger changes: Show the changes made to the (copy of) level and the before/after screenshots to your AD and the original level artist. Discuss with them about the changes.
** When making smaller changes: Show the before/after screenshots to your AD to receive feedback, and fix the level art accordingly.

* '''Replacing old with new'''
** If the changes are approved by the AD, they can be commited to the actual level.

[[Category:Art]] [[Category:Art|Trine 4 Level Art]] [[Category:Trine 4 Art|Level Art]] [[Category:Level Art|Trine 4 Level Art]] [[Category:Trine 4 Level Art]]
[[Category:Level Art|Building a Level]]

Level Art: Level Art Related Gameplay Issues

2021-11-23T13:48:09Z

Tero Tirkkonen: Tero Tirkkonen moved page Public Level Art: Level Art Related Gameplay Issues to Level Art: Level Art Related Gameplay Issues without leaving a redirect

{{:Public Level Art}} 

= Level Art Should Support Gameplay =
* The purpose of the Level Art is to make the game beautiful - and also support the gameplay.
* This section of the Wiki contains general guidelines on how to avoid creating misleading level art causing gameplay issues.
* In the examples below, the level art obfuscates and misguides the player in both obvious and more subtle ways.
* The examples below are for educational purposes only - some of the cases are fictional and constructed to showcase level art issues. Some are from the early stages of development and do not represent the finalized product.
* Level artists should frequently '''play the level or scene''' they are working on. That helps to spot any gameplay issues the level art may cause. It's impossible to notice some errors while using the free Editor view only - that's not what the players see - so it's essential to play the game.

= Art Hides Something Important =
* Don't place the foreground art carelessly so that it covers something important, like puzzle elements or a ledge requiring the player to see exactly where the character is.
* The Player character should always be visible, so be mindful of your foreground art. For example, the camera should be adjusted so that the doorways in the gameplay area never hide the player character completely.
* Sometimes level art is intentionally used to hide gameplay elements, like XP and secret areas. On the other hand, if an item is essential for the player's progression, it should always be fully visible and in plain sight.
* The composition of the scene should emphasize important gameplay elements. Draw the player's eye towards things relevant to the gameplay.

<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_The_Dream_29.1.2019_hidden_button_1.jpg|The button needed to open the door is hidden behind the foreground visuals, namely the handrail. While the player might spot the button eventually, they are left confused and annoyed.
File:Trine 4 art vs gameplay visibility issue 30.1.2019.jpg|The player needs to levitate a wizard's box through a hole in the right. The branches and leaves obstruct the view too much, making the conveniently box-sized hole hard to see.
File:Trine 4 foreground art blocks the view 30.1.2019.jpg|The entrance to a secret cave remains a little too secretive due to a thick rock asset blocking the visibility.
File:Trine_4_Dream_10.2.2019_armchairs.jpg|There are too many assets and elements in front of the camera and blocking the view. The buttons on the ground are not visible enough.
File:Trine_4_Dream_10.2.2019_camera_blocked.jpg|Level art elements are placed confusingly, blocking the view. The player will likely run to their death before realizing there's a pit.
File:Trine_4_Nightmare_13.3.2019_bushes.jpg|The bushes are hiding a part of a ledge, likely causing the player to fall and die.
File:Trine_4_Nightmare_13.3.2019_moving_platform.jpg|The platform going down is hidden inside the floor, leaving the player confused and guessing where to go.
File:Trine_4_Thorny_14.4.2019_hidden_ledge.jpg|Covering a ledge with a flower vase may result in an unintentional falling down.
File:Fairy_forest_art_issue_3_player_hidden.jpg|While the airflow elevator is a fantastic element, the level art prevents the player from seeing their character for a (too) long time.
File:Trine_4_Nightmare_13.3.2019_leap_of_faith.jpg|While the intended progression route is simple enough to understand, proceeding requires a leap of faith, which might make some players uneasy. Solutions like this should be avoided.
File:Trine_4_Amadeus_13.4.2019_confusing_art.jpg|The rails at the right-side end of the seesaw plank are broken. It's hard to pinpoint where the platform area ends.
</gallery>

== Art Hides Something Important in Multiplayer ==
* Because the camera angles are often wider in multiplayer modes, you should be extra careful when placing the foreground elements.
* Typically, all players should always be in the same view.
* Vertical scenes are the most challenging to implement: When one player climbs up on a platform, they should be as visible as another player at the very bottom of the scene.

<gallery widths=500px heights=500px mode="nolines">
File:coop-07_the_dream-foreground_art_issue_01.jpg|Image A: The character standing on a balcony (higher area) is almost entirely obscured by the foreground artwork. See Image B to see how this was fixed.
File:coop-07_the_dream-foreground_art_issue_fix_01.jpg|Image B: Almost the entire balcony was removed to help the player to notice the character.
File:coop-07_the_dream-foreground_art_wide_angle_issue_01.jpg|Image C: When using very wide multiplayer camera angles, even the relatively small foreground assets can obscure the player characters. See Image D to see how this was fixed.
File:coop-07_the_dream-foreground_art_wide_angle_issue_fixed_01.jpg|Image D: The foreground area was moved very close to the playable area.
File:coop-07_the_dream-foreground_art_wide_angle_issue_fixed_02.jpg|All the fixes applied must work with both multiplayer and single-player camera angles. For example, multiplayer situations where the camera is moved closer to the player character might be tricky with the single-player mode.
File:coop-07_the_dream-foreground_art_tri_seesaw_issue_00.jpg|Image E: A vertical progression path and a wide camera angle aren't a good match, making it really hard to see the characters. See Image F to see how this was fixed.
File:coop-07_the_dream-foreground_art_tri_seesaw_issue_01.jpg|Image F: The foreground art was moved very close to the playable area to make the characters more visible.
</gallery>

== Fading Environment Objects in Trine ==
*The environment objects should be faded only when they're used as secrets.
*If something is faded out upon entering an area, it should be faded back in when the secret area is left.
*The fading effect should not be used, for example, to a wall facing the camera during a standard progression route.
*As the video shows, exceptions can be made, but only after setting up the cameras so that the character can't remain standing in the doorway.
*The situation depicted in the video showcases how the cameras and level art work together to create the desired effect. The camera doesn't go through the wall, but the level artist can plant a window on the camera's path. The player should feel safe when jumping to the unknown, so you might want to include another door or a window in the scene's foreground to show that the path continues to the other side.
[[File:no_fade_foreground_wall.mp4|550px]]
*Enable UseNoisedVisibility on modelcomponent of the object being faded to make the fading effect smooth and avoid flickering like shown on the video.
[[File:fade_bug.mp4|550px]]

= Collision Mismatches =
* The level art should always match collisions as closely as possible.
* If the collision is smaller than the art asset, the characters or levitated objects will clip through the art when interacting with the collision point.
* If the collision is bigger than the art asset, the characters or levitated objects will float in the air when interacting with the collision point.
* If the collision in a particular area is intended to be sharp, try to avoid round and edged art.
* Pay particularly close attention to the edges that are ledge-grabbable.
<gallery widths=500px heights=500px mode="nolines">
File:Trine 4 round edge art ledgegrab 30.1.2019.jpg|If you're struggling to create a 90-degree ledge with stone assets, try replacing them with a man-made structure instead.
File:Fairy forest art issue 12 clipping.jpg|The player characters aren't the only gameplay elements affected by the collision mismatches; they are also problematic for dynamic objects.
File:Trine_4_Amadeus_13.4.2019_invisible_and_inside.jpg|The Player character shouldn't be able to move inside the snowman art - also, the character seems to collide with an invisible collision on the left.
File:Trine_4_Rocky_Heath_14.4.2019_missing_collision.jpg|The centrepieces of these rotating puzzle elements are missing their collisions.
</gallery>

= Distracting Level Art =
* When a game combines a 2D gameplay with a 3D environment, it can be hard to differentiate the background items from the gameplay area. If the player doesn't have a clear understanding of the gameplay area, they get easily frustrated.
* At all times, the player should be able to differentiate the gameplay area from background and foreground areas.
* If the critical gameplay elements are lost amidst the background art, it'll disturb the smooth flow of the playing experience.
* The level geometry should be free from any confusing elements and easy enough to grasp with a single glance.
* Tip: Try to distance yourself from your work by shrinking the level to a very small size (you can use screenshots, for example) or take a step back and squint your eyes. If you can't instantly recognize the general shape of the level, there's probably something wrong with the visuals.
* You can learn more about fixing and (preferably) avoiding gameplay-related level art issues by studying [[Public Level_Art:_Color_and_Lighting#Value|the importance of values and contrast]]

<gallery widths=500px heights=500px mode="nolines">
File:Fairy forest art issue 11 confusing room.jpg| Since the gameplay area is unclear and lacks any guidance signs, the player wouldn't probably know where to go.
File:Trine_4_Mountains_10.2.2019_backgroundstuff.jpg| The background art is too close to the gameplay area, making it hard to differentiate the two. The art in the background draws the player's attention, whereas it should emphasize the actual gameplay area.
File:Trine_4_Dream_10.2.2019_dreamfog.jpg|There are so many decorative background objects in the scene that it's hard to understand which items are in the gameplay area and meant to double as platforms.
File:Trine_4_Dream_10.2.2019_toggle_button.jpg|Did you notice there is a vertical button located in the bottom left area? The art assets in the scene are hugging all the attention, making it hard to spot the actual gameplay elements.
File:Trine_4_issue_1_24.9.2019.jpg|It's difficult to see the spikes amidst all the other level art elements. Make sure to boost the visibility of the critical gameplay assets with the correct values and contrast.
File:Trine_4_Hedge_Maze_spikes_visibility.jpg|The spikes around the button on the top right corner should be clearly visible, as they are an essential part of the gameplay.
File:Trine_4_Nightmare_13.3.2019_floor_magnet.jpg|It's easy enough to mistake the circular magnetic area for a part of the floor.
File:Trine_4_Nightmare_13.3.2019_plank.jpg|The two circular magnetic plates on the wheel are hard to see - or understand their significance as gameplay elements. The middle part of the wheel draws attention instead. Don't use the same colour for decorative pieces and gameplay elements.
File:Trine_4_Amadeus_13.4.2019_effect.jpg|A bright yellow effect to signal a landing area for levitation objects was tested. However, the effect was easy enough to misinterpret to represent a collectable, a hidden door, a levitation object - to name but a few - rendering it more confusing than helpful.
File:Fairy forest art issue 6 secret w many issues.jpg|Even the very preliminary base art should always be created with the gameplay in mind.
File:Trine 4 background vs play area 30.1.2019.jpg|It's hard to tell where the gameplay area starts or stops. The confusion is caused by a mixture of unclear lighting and vague rock assets littered around the area.
File:Trine 4 background vs play area example 2 30.1.2019.jpg| The values selected are not in line with varying depth levels, resulting in a perplexing gameplay area. The background appears to be blending into the gameplay area.
</gallery>

= Gameplay Route Issues =
* If the player's intended progress route isn't clear enough, it's good to check the level art of the area.
* Level art may mislead the player into thinking that a route is safe, dangerous or somehow blocked when it actually isn't.
* The player should always know where to go and what's happening. To achieve that, the main path should always be obvious and easy to follow.
* If more than visual fixes are needed to highlight the main route, talk with the designer responsible for the level.
* Avoid planting hidden or obstructed entrances along the main path. The entries to hidden or secret areas should always be visually less tempting than the main path.

<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_Nightmare_13.3.2019_rock_pillar.jpg|The horizontal stone pillar seen through the magnetic field is problematic: It's too close to the play area, making it hard to differentiate from the platforms and the magnetic field itself.
File:Trine_4_Birch_16.3.2019_flower_light_3.jpg|Some of the large leaves depicted are gameplay elements, and some are purely decorative. The risk of a mix-up is evident.
File:Trine_4_Rocky_Heath_14.4.2019_background_art.jpg|While the hatch upwards has been opened and it's clear to proceed, the decorative crate art makes it hard to understand.
File:Trine_4_issue_2_24.9.2019.jpg|The gameplay elements should always stand out and direct the player. The large leaves are in the gameplay area and meant to act as platforms - while the branch underneath them is not. The player has no way of telling which platforms are safe. The tree branch should remain hidden in the shadows, preferably with a layer of fog camouflaging it more.

File:Trine_4_Nightmare_13.3.2019_rock_ledges.jpg|The rock ledges in the foreground are too close to the gameplay area and easy to mistake as gameplay elements.
File:Trine_4_Nightmare_13.3.2019_rotating_wheel.jpg|Especially with the camera set-up featured here, the player might assume the foreground structure near the bottom is a part of the gameplay area (while it's not).
File:Trine_4_Moonlit_14.4.2019_seesaw_asset.jpg| It's hard to say which parts of the bird-shaped platform asset, if any, are located in the gameplay area. Possible fixes include adjusting the lighting or editing the asset textures to highlight the gameplay platforms and making other parts of the asset less visible.

File:Trine_4_The_Dream_29.1.2019_hidden_door.jpg|The secret area on the top right corner looks like the main route, and the actual main route below it appears to be a secret passage with the bookshelf covering it.
File:Trine_4_Nightmare_13.3.2019_rock_ledges.jpg|The player should head downwards but is more likely tempted to progress to the right. Replacing the right side ledge with a solid wall could fix the problem. One should also pay attention to the warm light shining from the right - why invite the player to a place they can not go to?

</gallery>

= Fire Through vs Non-fire Through =
* It's wise to reserve iron bars, gratings and other gameplay area assets with holes in them to be used with fire-through collisions only.
* If the asset isn't supposed to pass the ammunition through, it should look solid.
<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_Hedge_Maze_non_fire_through_hatches.jpg| The player is tempted to try and shoot an arrow through the hatches - to no avail. While the actual solution to the puzzle requires the player to use the ice arrows to freeze one of the platforms, the level art should help them to understand how the bow and arrow can be utilized here.
File:Trine_4_Hedge_Maze_non_fire_through_t_platform.jpg| This platform doesn't look solid enough to be frozen with an ice arrow either.
</gallery>

= False Promise of Gameplay Function =
* Avoid planting permanently closed doors on the gameplay area since players will want to open them. Doors leading to background areas are more acceptable.
* If the player can't go to a particular area, that area shouldn't look accessible.

<gallery widths=500px heights=500px mode="nolines">

File:Fairy_forest_art_issue_7_invisible_wall.jpg| The opening on the left appears to be an entrance somewhere. Level art shouldn't invite the player to a place they can not enter.
File:Trine_4_The_Dream_29.1.2019_hidden_door.jpg|The bottom left door looks like an entrance to a secret room while it's just a decoration. Also, earlier during the level, the player could levitate a painting from the wall to reveal a stash of XP collectables. The painting on this scene, however, is just a decoration and can not be levitated. Inconsistencies can be extremely frustrating, and when faced with a situation like this, it's best to leave decorative assets, like paintings, outside the gameplay area completely.
File:Fairy forest art issue 15 fake secret.jpg|In the blue-toned surroundings, bright, warm lights will surely attract attention, while the actual gameplay element (the breakable wall near the lights) remains in the dark.
File:Fairy forest art issue 10 fake gameplay objects.jpg|If there's a ladder in the gameplay area, the player will want to climb it, no matter if the character actually can. It isn't enjoyable to bump into obvious gameplay elements - and be unable to use them. You should leave unique-looking but functionless gameplay objects out of the gameplay area and insert them sparingly in the background. Level art should always support the possible gameplay elements.
</gallery>

= Misleading Level Art =
== Fake Ledgegrabs ==
*Some art assets might look like ledge grab poles while they aren't. Be very careful not to place misleading art objects in areas that include actual ledge grab surfaces and objects.
*For example, it's not a good idea to set thin horizontal poles and real ledge-grabbable surfaces next to each other.
*Avoid sharp edges in spots where ledge-grabbing is not possible.
*Be extra careful when working on levels with detailed architecture: Visually distinct horizontal support beams, borders, and such can easily mix up with ledge grabs.
*Examples of structures that are easily confused as ledge grabs::
<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_The_Dream_29.1.2019_fake_ledgegrab.jpg|The wall geometry near the portal falsely suggests the player can ledge grab.
File:Trine_4_Nightmare_13.3.2019_fake_ledgegrab.jpg|The curved part of the right side ledge seems ledge-grabbable, while the actual ledge grab area slightly above it does not.
File:Trine_4_Nightmare_13.3.2019_rock_ledges.jpg|The rock ledges in the foreground are too close to the gameplay area and easily mistaken as grabbable.
</gallery>

== Fake Poles ==
* The poles have a very specific gameplay function: they are used to block objects so that the player can pass through.
* Avoid placing any non-gameplay poles on or too near the gameplay area.
<gallery widths=500px heights=500px mode="nolines">
File:Fairy forest art issue 8 art poles.jpg| There are two kinds of poles featured in the gameplay area: The vertical ones don't restrict the movement of dynamic objects, while the horizontal ones do. The horizontal poles have a gameplay function - they are needed to block the player from moving dynamic objects past them. However, the vertical poles are not gameplay objects and shouldn't be placed in the gameplay area at all.
</gallery>

== Fake Breakable Walls ==
* Breakable wall assets are meant to be used only when constructing breakable walls, not for anything else.
* Those art assets that look like breakable wall assets shouldn't be used for decorative purposes.
* No large wall chunks or any other noticeable debris should remain after the player has destroyed the wall. The player should know when the wall has been completely shattered and that there's nothing more to break.
* Trine 4 featured breakable crystal walls and used small crystal shards to indicate the moment the wall was destroyed. The right size and look for the crystals was found by tinkering with the contrast in size, saturation and value of the "decorative" crystal bits. The smaller crystal pieces blend into the background (at least more than the larger wall chunks).

<gallery widths=500px heights=500px mode="nolines">
File:Fairy forest art issue 9 fake crystal wall.jpg|Trine 4 crystal walls are always coloured purple to avoid mixing up the breakable walls with regular, non-breakable structures. A very similar-looking asset is likely to confuse the player, as seen here with the purple object. The level artist should never use interactive gameplay object assets (or even assets that look like them) as decorative assets.
File:Trine 4 Badger 23.2.2019 crystals.jpg| It's unclear whether there's still crystal pieces left to shatter or not. The "leftover" pieces should have their own distinct visual look that differs clearly from the breakable wall asset. You could try, for example, using a less covering, dull and desaturated colour that blends into the background for the small bits, while the actual breakable chunks are brighter and contrasted, standing out.
</gallery>

== Fake Gameplay Objects ==
* You shouldn't use gameplay assets for decorative purposes inside the gameplay area or in the immediate vicinity of it (background/foreground). The player must know which objects can they interact with.
* The dynamic gameplay assets should be kept separate from the decorative (non-interactive) level art assets, visually setting the two apart.
* Don't create similar-looking assets that sometimes function as dynamic gameplay assets and sometimes can't be interacted with.

<gallery widths=500px heights=500px mode="nolines">
File:Fairy forest art issue 10 fake gameplay objects.jpg
</gallery>

== Fake XP ==
* No other game art assets should look even remotely similar to the experience collectables.
<gallery widths=500px heights=500px mode="nolines">
File:Trine_4_Hedge_Maze_fake_xp_flower.jpg|The flower buds in the foreground share their colouring with the XP collectables. The shape and size are also very similar.
</gallery>

== Fake Ropetarget Rings ==
* Avoid placing small, camera-facing rings near the gameplay area. Players will have a hard time differentiating them from rope targets.
[[File:Trine Art example confusing rings.mp4|550px]]

= Plausibility issues in 2.5D =
* When making a 2,5 D game, the level art plausibility concerns are usually focused on immersion and worldbuilding.
* However, sensible environmental planning benefits the gameplay as well. If the surroundings provide enough guidance and feel plausible, it reduces the risk of the player getting frustrated and blaming the gameplay for it.

== Platformer logic vs normal logic in Trine ==
* "Platformer logic" refers here to the concept of abandoning all the 3D tools and solutions in favour and because of the 2D gameplay. Platformer logic can be applied to many Trine art and gameplay design decisions.
* Since Trine is attempting to co-pilot a believable 3D approach on the side, platformer logic isn't always the best solution for all the problems.
* Mixing 3D and 2D can lead the player to various frustrating situations. These situations can be made more acceptable with carefully chosen level art:
** For example, wallhead scenarios often force the player to a potentially dangerous 2D route and face to face with the fire-spitting wallheads (while the player might feel the 3D approach should allow them to avoid the danger by simply choosing another path). Level artists, however, can make the other possible routes look less appealing or not available, thus justifying the "platformer logic".
**Doors, on the other hand, should be placed in spots where using them is the only sensible solution. If there's a heavy door at the end of a puzzle chamber and a huge hole in the stone wall next to it, you can't blame the player for wanting to jump through the hole and then getting frustrated when the 2D perspective gameplay stops them.
**Level art should leave the player satisfied for choosing the right path ( = the path that forwards the gameplay) even when the right path doesn't seem to be the most logical one.

[[File:scrshot_wallhead_rocky.png|500px]]

== Visual support for platforms and mechanisms ==
* You should consider the mass, weight and working mechanisms of the art object you're creating. Without proper support and volume to mirror the object's real-life properties, using it might feel unrealistic and not satisfying.
* This approach will also help in conveying the gameplay mechanisms to the player: A flimsy-looking support structure hints to the player that the platform might tip over. If the support structure looks strong, the player feels safer using it.

<gallery widths=500px heights=500px mode="nolines">
File:scrshot_bog_stickplatform.png
File:scrshot_throny_lift.png
</gallery>

== Path of least resistance should be on the 2D plane ==
* The Trine heroes like facing challenges, but most players will choose a more manageable path over the hard one.
* Generally, selecting the path with the least obstacles/resistance feels better. The player's gaze tends to turn naturally towards the route that feels safer and more sensible.
* It's your responsibility as a level artist to ensure that the 2D plane/route should always feel like the most logical one.
* Sometimes, especially with puzzle elements, the 2D gameplay might feel frustrating and arduous. The level art should soften the blow as much as possible and reaffirm the player's route.
* For example, solving a puzzle to open a door might feel annoying if there are plenty of possible 3D art asset solutions dangling nearby and the player is unable to use them due to the 2D gameplay.
* The most efficient path doesn't always get chosen: A fun 2D platforming route can be much more tempting than a staircase in the background.
* Venturing into the unknown is considered unpleasant, and the player might feel uncomfortable selecting an obscure background path. However, figuring out how to open the door to the unknown is exciting.
* A ledge invites the player to reach for it in the hopes of ledge-grabbing (instead of aiming for a platform with no ledge).
* Make sure the play area is the most tempting path for the player to take (instead of the other possible routes seen in the scene) and plan both the visual and geometrical routes accordingly.
* Make sure that the game play area has a clear contrast and that the player's intended path is prioritized visually.

== Examples of possible issues ==
* See below for example scenes where the player might feel like the 2D plane/route isn't the best or the most alluring way to continue
<gallery widths=500px heights=500px mode="nolines">
File:scrshot_birch_blockedpath.png
File:scrshot_lakes_goaround.png
File:scrshot_lakes_spikes.png
File:scrshot_moonlit_door.png
File:scrshot_mountains_glide.png
File:scrshot_mountains_wildcanyon.png
File:scrshot_thorny_goaround.png
File:scrshot_thorny_shrubbery.png
File:scrshot_dream_balcony.png
File:Trine_4_Amadeus_13.4.2019_blocks.jpg|It seems that the player could easily just walk in the foreground without actually solving the puzzle.
</gallery>

== Examples of non-problematic solutions or issues succesfully averted ==
* Here are some examples showing how the play area / 2D plane seems like plausible and the most satisfying way to go, while other route options seem illogical or un-tempting
<gallery widths=500px heights=500px mode="nolines">
File:scrshot_blueberry_log.png
File:scrshot_moonlit_mushroompit.png
File:scrshot_mountains_door.png
File:scrshot_fairy_plankplatforming.png
</gallery>

[[Category:Trine 4]] [[Category:Trine 4 Level Art]] [[Category:Trine 4 Design]]

Level Art: Ideas for New Levels

2021-11-23T13:48:01Z

Tero Tirkkonen: Tero Tirkkonen moved page Public Level Art: Ideas for New Levels to Level Art: Ideas for New Levels without leaving a redirect

{{:Public Level Art}} 
* How to get visual ideas to kickstart a new level?
* All Trine levels have their own theme, but there is a lot of variation and different areas inside levels as well
* Searching for ideas, inspiration and reference images is always beneficial when determining the themes for the level you are working on
* Creating mood boards and collecting a reference image library will help you during the creative process
* Reference images are super important in the process of forming a clear vision of the level you want to create
* Sure, you can come up with cool stuff off the top of your head, but why not use the fantastic resources available to get even better results?

= Idea & Concept Process =
* The lead artist will combine preliminary references for different level themes that indicate what kind of mood and theme are wanted
* The concept artist might make some kind of concept art to further flesh out the ideas. However these concepts are often quite vague and focus more on the big general picture, so the level artist needs to come up with most of the details
* Once the level artist starts working on the level they should go through the materials already available internally: The script, level wiki site, concepts and existing reference images
* Communicating with the AD/art lead and designers, the writer and possibly with the 3D artists is important
* Consider all the materials and start thinking about how the level could look like
* Based on the existing materials, search for your own reference images online and save the best ones to the shared level reference image folders
* Use the best ideas from your reference images and your imagination and combine everything in your unique level. Don't directly copy and paste stuff from reference images, but add your own touch.
* You can go back to the reference images at any point during the level art process.
* You might even forget some great ideas along the way, so refreshing your brain by returning to the reference once in a while is a good practice.
* If you feel stuck with a scene at any point when creating the level, you can just find a reference image or two with cool-looking ideas and try utilizing them in your design.
* The level art process is an iterative process. There is no need to get everything placed perfectly from the get-go, as that's very seldom how our creative processes work. The process takes a lot of experimenting, trial and error.
* In some cases it might be best to rework a scene completely to find something better.

<gallery widths=400px heights=400px mode="nolines">

File:Lakes and rivers preview.png
File:WIP_RiversAndLakes_concept_220817_v2.png
File:LakesAndRivers rocks concept 160817.png
File:WIP Lakes concept levelStructure 110518.png

</gallery>

= Where to Get the Best References =
* You can find ideas everywhere, from '''movies''', '''documentaries''' or even your '''daily bus trips''' to work
* '''Look around you''', study the formations of nature, geography and architecture with a level artist's point of view!
* There are tons of photo and art references online but don't forget you can also do some '''fieldwork''' yourself and take your own reference photos. When stumbling into an interesting location in your real life, don't forget to take in the place with all your senses, this you can't do with online materials.
* '''[https://www.pinterest.com Pinterest]''' is an excellent reference image site. You'll get a bunch of related images for each good reference image, and it's easy to end up with an impressive amount of open tabs brimming with reference ideas. The only downside is that you have to be logged in to use the site, which can be annoying, but still worth it.
* '''[https://www.artstation.com/ Artstation]''' is another absolutely inspiring site for ideas. It's full of amazing art. Of course, with other people's art, it's very important to not copy stuff directly, but that should go without saying when using any reference. Make it your own!

== Something to consider when using references ==
* Reference images from online are never a perfect representation of what is wanted for the final asset/level/product.
* For example, if the AD offers some reference images, they are meant to flesh out the general idea and point you in the right direction, but never to be copied directly.
* This can be a bit tricky sometimes, as everybody will probably pick out different things from the same reference image.
* If we used already existing reference material as it is, there would be no need for concept art, nor as much space for our own imagination or creativity. Most likely the end result wouldn't be very coherent and unique either.
* Consider reference images as vague pointers and concepts, rather than pieces designed specifically for Trine games.
* Trine games are meant to be unique-looking - that needs original ideas, so it's never good practice to copy anything straight from a reference image.
* It's an important skill to know how to use the reference creatively to support your own imagination instead of letting the reference determine everything for you.

[[File:trine_4_lakes_and_rivers_reference_photos_by_charlotta_tiuri.jpg|800px]]

[[Category:Level Art|Ideas for New Levels]]

Level Art: Environmental Storytelling

2021-11-23T13:47:53Z

Tero Tirkkonen: Tero Tirkkonen moved page Public Level Art: Environmental Storytelling to Level Art: Environmental Storytelling without leaving a redirect

{{:Public Level Art}} 

= What is Environmental Storytelling? =

* An environment is an imagined space where the player moves inside.
* Even though the environment is virtual, it creates boundaries and limitations for the player and guides them through using tools such as lighting and art.
* As the player moves around in the virtual world and passes through the different rooms and scenes, they're given context through carefully placed props and objects.
* Every asset in a scene has a purpose, every character is placed there for a reason and every piece of background art has a history.
* Environmental details mirror and expand the lore of the world, offer additional information about locations or characters, and deepen the player's understanding of the story.
* In other words, the player's view of the world and understanding of the narrative is shaped by where they find themselves in that world.
* The rich environmental details supported by the narrative and supporting the narrative help the player see the game world as one whole (even when it's separated in levels like in Trine).
* To achieve immersion careful planning and much work are needed: placing all props carefully, designing NPC looks and locations to reflect their personalities, occupations and residence, creating areas where the mood and the atmosphere complement each other - essentially, making all the elements of the game work together.
* Once the immersion is achieved, everything seems in place, and all things belong. The player can't help but to feel that things make sense, however curious or outlandish the various elements might be.
* In an immersive game, barriers in the environment need to make sense within the game world - to the point that players will never even question why they can't get past an obstacle.

= How does Environmental Storytelling work? =
* It's a mixture of direct references and more vague things.
* When inserting an apparent story reference, you should always consult the writer to ensure the environmental storytelling aligns with the screenplay.
* Environmental storytelling works better the more freedom the player has. Trine is usually focused on linear exploration, but that doesn't mean it can't benefit from environmental storytelling.
* Each and every scene is distinctive while at the same time retaining the style of the level, both design- and art-wise.
* This makes it easier for the player to build a mental map of the level and imagine how things work outside their immediate view.
* When building the levels, you don't need to think about making them more realistic, but simply remember how Trine's fictional world works and use it as a springboard.
* Things that don't make sense in real life could make perfect sense in Trine's land of fantasy.
* The exploration process wheels more organic when a player receives the expository information through their eyes and ears and via the world itself (as opposed to just listening and reading it from text boxes, dialogues or cutscenes).
* When the story is perceived through observation, the narration is reinforced. The game world feels more believable and alive to the player.

== Examples of Environmental Storytelling ==
* How environmental storytelling translates to both the environment itself and into gameplay:

<gallery widths=500px heights=500px mode="nolines">
File:ES_astral_nightmare.png|
</gallery>
* This scene set in The Astral Nightmare is a good example of successful environmental storytelling.
* On one side are the wizards, scared and angry. On the other side, there's the true form of The Nightmare Prince.
* Even though the player hasn't met the Nightmare Prince, they have a clear idea of what the wizards were like towards Selius. The scene also foreshadows what will happen later, namely the Selius transformation during the game finale.
* It serves as a sort of an Easter egg for those people playing the game a second time.
* The visuals connect nicely to the main narrative, showing us Astral Academy (Selius's personal purgatory) and the main character

<gallery widths=500px heights=500px mode="nolines">
File:9P_elves_hotpools.png|
</gallery>
* Elves have never been mentioned in the Trineverse, but this level has statues depicting them.
* Players noticing the statues and other remains of the elvish culture learn more about the Trineverse world & can immerse themselves in the world.
* The elven statues aren't connected to the main narrative itself, since the elves play no role in it. Their "presence" in the environment, however, helps to develop and expand the world and lore.

<gallery widths=500px heights=500px mode="nolines">
File:T4_selius_nightmares_es.jpg|
</gallery>
* This scene shows a family portrait of the Heatherwood family, but it's been ruined by one of Selius's Nightmares.
* A book found later in the level reveals that Selius was bullied by his brothers. Players probably see the painting in a new light, especially since the part of the painting depicting Selius's brothers is badly damaged.

== Environmental Storytelling and Design ==

* It's crucial to communicate constantly with the designers. When creating level art, the gameplay and design aspects need to be considered. Sometimes it means trying to match far-out and crazy gameplay ideas to the overall visuals as seamlessly as possible.
* Due to Trine's 2.5D nature, players don't have a lot of freedom deciding where to go and what to interact with. It's the level artist's job to make sure that the only route the players can take feels like the obvious and tempting choice and not a forced necessity.
* That's been achieved by making the background and foreground areas (where the players can not move) seem uninviting, too hard to navigate, or outright dangerous.
* It's also very important to add art assets to puzzle elements to tie them together with the surroundings and the level.

[[File:T4_enchanted_vines_es.mp4|550px]]
* Here's how the environmental storytelling translates to the gameplay: instead of having a wooden gate the slides to the side, a strong grip of the enchanted vines has been chosen to break the stone wall.
* This doesn't seem out of place in the context of the level and makes both the story and the gameplay more coherent.

<gallery widths=500px heights=500px mode="nolines">
File:T4_seal_es_example.jpg|
</gallery>
* The Seal in T4 is a fantastic example of the art, story and gameplay blending together.
* It appears throughout the whole lake level and helps the heroes. In return, the heroes assist The Seal. Later, it's mentioned by Elodea when we meet her.
* All pieces are connected and work beautifully together, giving the Seal a greater purpose in the game world (rather than being just a bouncy gameplay prop).

= In Conclusion =

* Environmental storytelling is a great way to make the game's story more interesting.
* As there is a whole Trineverse world featured in several games, it's important to make the games feel connected, even if each entry to the series is a stand-alone game.
* The players are already familiar with the world and its characters, so adding emotional impact will make them even more immersed in the game world.
* With future projects, we can revisit the old Trineverse locations, creating a wonderful sense of nostalgia (art, music, feel), while keeping things new and fresh.

[[Category:Art]] [[Category:Level Art|Level Art]]
[[Category:Level Art|Environmental Storytelling]]

Level Art: Composition

2021-11-23T13:47:45Z

Tero Tirkkonen: Tero Tirkkonen moved page Public Level Art: Composition to Level Art: Composition without leaving a redirect

{{:Public Level Art}} 

= Composition and Forms =
* Composition means the arrangement of shapes and forms in a scene, so to put it simply composition is just arranging different value shapes in a picture
* The composition should of course look nice but also guide the player to the right direction and support the gameplay
* The gameplay area in 2.5 style Trine games is quite narrow and the geometry of the gameplay area is mostly determined by the designers
* The the most visual impact within level art is in the background and foreground forms and with those everything is possible as it doesn't affect the gameplay
* As usual with Trine art style, overpowering straight lines and 90-degree angles in the big forms of the levels should be avoided
* The forms of the levels should be flowing in big arches with a clear flow trough the environment
* The aim is to achieve a dynamic and organic end result that guides the eye smoothly across the scenery and towards the direction where the player should be heading
* Break the 2D plane with overlapping elements and flows also leading into the depth (meaning the background)

<br>
[[File:trine_level_art_composition_guide_general_tips.jpg|1000px]]<br>
[[File:trine_level_art_composition_guide.jpg|1000px]]

== Base collisions have to support both gameplay and art ==
* Level artists can't edit the collisions made by designers without discussing with them first but sometimes they need to be edited in order to make the level art work properly
* Here is an example of a spot that worked for gameplay but didn't work at all for the art. The whole idea was to have a wide open scenery and without artist intervening this would have ended up looking crammed and the feeling of space wouldn't have been achieved
[[File:Nightmare 20190225 improvement needing spots 55-56.png|500px]] Final result -> [[File:Trine 4 screenshot 25.png|500px]]
* Here is another example of how important it is that the artists are proactive with the base art changes to get the best out of the collision base, sometimes you just have to do big changes to make it work! Before the statue head was placed on the background of a puzzle and there was not enough space for this important focal point, so the end part of the level was moved to create space here and make this part work. The puzzle area was moved to the right so it comes after the statue.
[[File:Nightmare 20190225 improvement needing spots 50.png|500px]] Final result -> [[File:Trine 4 screenshot 17 1080p.png|500px]]

== The right materials for the specific shapes ==
* Things don't always need to be realistic but they should be believable in the context of the world they exist in
* Pay attention to the materials you use for different areas for a believable result
* Heavy stone/rock/brick elements need enough support visually
* Big and heavy rock elements look even heavier floating on top of the player. Unless it's a cave these should be replaced with lighter structures like tree foliage
* Use different materials to differentiate areas, if the floor and walls are rock, use for example wooden materials for the gameplay related pillars so they stand out better
* Avoid 90 degree angles when possible
* Of course the level design is often blocky and unnatural looking to perfectly match with the level art theme, but there are ways to fool the eye and add organic feeling while maintaining the collision forms necessary for the gameplay
* Don't make weird rock shapes, in nature rocks can't be narrow flat walls nor 90 degree angled structures (or if they can that still isn't what we aim for)
* For very unnatural and even shapes use something '''man made''' looking, like bricks or change the material completely and use wooden structures etc.
* '''Only the gameplay area needs to follow the collisions exactly''' so you can have more organic shapes all around to smooth down some unnatural shapes on the gameplay area
* In most cases you can also use '''vegetation''' to make things more organic by kind of hiding the angular collision shapes under it
* Artist should never edit the collision without '''consulting the designers first''', but in some cases editing is needed as some forms might not matter so much to the gameplay while they could be changed for the better from the art point of view. Still, always discuss with the designer first

<gallery widths=400px heights=400px mode="nolines">

File:Rudolfus dream overpaint 03.jpg|It's hard to see the gameplay area poles as they are the same material as everything else around them. Also wooden material feels more natural for the long narrow shape.
File:Gislans dream overpaint 14.png|An example of unnatural rock shapes that have been smoothed out with man made structures and vegetation in the overpaint
File:Gislans dream overpaint 04.png|In this case the big structure on the top area works much better as vegetation instead of the heavy rock material as it doesn't have enough visual support to make sense as a rock material
File:Gislans dream overpaint 17.png|An example of an unnatural narrow rock wall that would work much better as a wooden wall for example
</gallery>

= Flow =

* Generally the level beginnings and level endings should have this type of composition to guide the player to the right direction visually
* The composition is formed from all the assets and value blobs on the screen, so it should work as a whole and not just for individual separate objects
[[File:level_beginning_composition.png|1000px]]
* Think about the big shapes as just shapes in the first blocking phases. The shapes include everything visible, not only ground and assets on the ground, but also far away background objects like mountains and sky with clouds etc.
[[File:Level art composition guide direction and flow.jpg|1000px]]
* Here is a screenshot and an overpaint based on it from the Trine 4 Rocky Heath level. It's the beginning of the level so it should look exciting and guide the player to start the level. Now it seems like any general view from the level. The beginning and ending of a level should always be special and a focal point area to mark the beginning and ending.
* [[File:Rocky heath level art fixes 01.png|500px]] [[File:Rocky heath level art fixes 01 flow.png|500px]]
* [[File:Rocky heath level art fixes 02.png|500px]] [[File:Rocky heath level art fixes 02 flow.png|500px]]
* [[File:Rocky heath level art fixes 03.png|500px]] [[File:Rocky heath level art fixes 03 flow.png|500px]]

== Gameplay area 2D plane ==
* We want to create a feeling of real world with depth and hide the fact that the whole game is actually just a narrow 2D plane and one straight road from left to right
* Only the collisions on the narrow gameplay affect gameplay, everywhere else (which is a much larger area) anything that art wants can be done! Of course everything should still support the gameplay as well as possible.
* Let's not let the design's collision blocks limit our creativity and possibility to make the level more organic and flowing
* Sometimes art can follow the 2D plane and it works but usually we want to break it and create an illusion of a vast world that is more than just the 2m wide gameplay path
* Problems that can occur when we don't question the original collisions:
** Highlighting the 2D plane where it's not needed: adding a road/houses/walls exactly aligned with the 2D plane
** Having obstacles or structures only 2m wide, so they do cover the gameplay area but look like a staged obstacle course that you could just walk past if the artificial 2D gameplay restriction wasn't present
** Adding necessary art to the gameplay area while leaving the background separate, which can work, but usually it's best to tie the different levels of depth together, blurring the line between the background, foreground and gameplay area
** Leaving the foreground empty or not paying the same amount of attention to the scene as a whole but just getting the "necessary" things filled

<gallery heights=400px mode="packed">

File:adding_depth_to_2D_game_3.jpg | Visually separate background and everything aligned with the 2D plane
File:adding_depth_to_2D_game_4.jpg | Everything aligned with the gameplay area makes the scene feel flat
File:adding_depth_to_2D_game_5.jpg | In the level ending area it's often a nice looking trick to make the road bend into the depth
File:adding_depth_to_2D_game_1.jpg| Examples of adding depth with roads that break the 2D plane
File:adding_depth_to_2D_game_2.jpg| Even though most of the structure will not be visible it helps to think the scene as a 3D building instead of the 2m wide 2D area
</gallery>

=== Too long straight walls perpendicular to the 2D plane ===
* Another 2D plane related thing is when long walls continue to the foreground, they can seem too long and too close to the camera so they should be avoided and instead curved walls etc. should be used
<gallery widths=400px heights=400px mode="nolines">
File:2D_perpendicular_walls_issue_2.jpg| An example of how to fix the too long 2D perpendicular walls
File:2D_perpendicular_walls_issue_3.jpg| The issue explained in more detail
File:2D_perpendicular_walls_issue_1.jpg| Another example of how to fix the too long 2D perpendicular walls
File:2D_perpendicular_walls_issue_4.jpg| Also a gap like this has a similar issue as the wall has: too long straight 2D perpendicular shape. Doorways and windows or organic "holes" are a much better option. There should also be some gaps (window/broken areas etc) where the camera moves trough so that it doesn't go through the wall.
</gallery>

= Variation =
* It's important to have variation and contrasts in the shapes in all kinds of environments
* Especially with natural environments you should make sure to get the organic feeling across
* Areas that continue in a similar pattern for too long feel unnatural, monotonous and boring
* The rhythm of the area should not be repeating itself
* This principle can be used for terrain shapes, light and asset placement, everything really!

<gallery widths=600px heights=600px mode="nolines">
File:Rythym tundra 01 03.jpg|too similar and repeating shapes, too straight lines
File:Rythym tundra 01 04.jpg|more variation in shapes and sizes, breaking the straight lines
File:Gislans dream overpaint 39.jpg|Too perfect circular shape with just small detail to break it, adding unevenness and having also mid sized shapes helps to make it more organic and interesting

</gallery>

== Avoid Repetition ==

* This applies to pretty much everything: textures, asset design (silhouette of the asset, details of the asset), level art etc.
* In Trine the aim is to avoid repetition. For example wall tiles are not just simple tiling of same shape, instead individual tiles vary in shape and orientation
* Repetition might mean for example detail placement and size variation on the object
* Placing objects in a "grid" looks repetitive, but scattering objects seemingly randomly can look repetitive too, if the objects are still placed about a same distance of each other and the objects are approximately same shape and size
* Have primary, secondary, and tertiary shapes meaning that primary shapes stand out most and can be immediately noticed on the first glance, followed by secondary and tertiary shapes
* Have large, medium, and small shapes. Have variety to the size of shapes in each of the three categories.
* Make sure these details are placed somewhat chaotically to avoid obvious patterns
* And make sure there are areas with lots of details, and areas of almost no details. Empty areas are as important as detailed areas in the big picture!
* [http://www.neilblevins.com/art_lessons/composition_contrasts/composition_contrasts.htm Neil Blevins: Contrasts In Composition]

[[File:Repetition.jpg]]

= Scale and Proportions =
* [http://www.neilblevins.com/art_lessons/details_make_big/details_make_big.htm Neil Blevins: Using Details To Make Something Look Big]
* To avoid problems with scale use the characters as size reference at all times and see how an environment looks in game by playing and observing it often
* In levels it's important that the scale of objects compared to the characters makes sense and everything is consistent and logical
* Game worlds often have problems with scale, things might look too big or too small and that breaks the believability of the world, making the game feel substandard
* Generally you should trust your eye, and if something looks off, fix it. If something works even though it's scaled a lot, it's okay
* Basically everything is allowed as long as it looks good and optimal enough for the performance, but scale can sometimes be hard to get right, so here are some clear tips for that
* If an existing asset looks low quality (for example has a low texture detail) think carefully how to use it properly. It might be okay to place in an area where texture details are not that visible anyways. Otherwise ask the 3D art department for a possibility of getting a new asset.

== Scaling assets ==
* It's generally okay to scale any 3D asset up or down 20% of its original scale (you can see if the asset has been scaled or is in its original scale from the model component "Scale VC3(1, 1, 1)". If the scale has been modified it is something else than 1)
* If you are planning to scale more, you should consider carefully whether there will be problems with too much detail or too little detail in the geometry or the textures of the model
* If an asset is scaled up, the texture will become more low-quality. When an asset is scaled down, it can become too detailed or high-quality compared to the other assets around it

== Problems created by scaling 3D models too much ==
* Scaling an asset too much is relative to the case
* If an asset is for example far away in the background, surrounded by fog or dark, it might be ok to scale up a lot, but the silhouette and textures should still look good for it to work in the context
* When you scale an asset in editor its polycount and texture resolution won't magically follow along
* Assets are made in a specific texel density (basically the texture resolution) and it will only work nicely in the original scale of the asset. The more it's scaled the worse and less consistent with the other 3D models it'll look
* Texel density information:
** [[Modo#Texel density Toolkit|Public Modo Texel density Toolkit]]
** [[3D Asset Workflow: Retopo and UVs#Optimizing the UVs|Public 3D Asset Workflow: Retopo and UVs Optimizing the UVs]]

=== Scaling up too much ===
* The texture resolution of the asset may end up being too low and blurry, and thus not cohesive with the rest of the assets in the same scene
* For the PC version of a game the scaled up asset's textures might look okay, but for example for a console version, where all the texture images might automatically be downsized, the textures can end up looking really pixelated, as everything has a lower resolution
* The polycount of the asset will not match the scale of the asset any longer and the asset starts to look more low-poly and angular
* A 3D asset is made with a specific polycount so that it has enough polygons to look smooth and nice in its intended size. A too large polycount isn't optimal either as that could affect performance
* The more the asset is scaled up, the worse and more low-poly and blocky its silhouette will look
* Even if a scaled asset's texture looks okay in the far away background, its silhouette can reveal it's been scaled

=== Scaling down too much ===
* The optimization will suffer as there will be way too many polygons, which will affect performance
* When a big asset is scaled to very small, the texture size will become too large compared to the scale
* The texture resolution may look too sharp and not coherent with the rest of the assets in the same scene

[[File:Level art guide scale 3d model texel density.png |700px]]

== Non-uniform scaling ==
* Non-uniform scaling is usually a big no-no, but there are some cases where it can be a better option than uniform scaling
* Non-uniform scaling means that when scaling the object the X, Y and Z axes will not stay the same. For example X:1, Y:1, Z:2, so the object will lose its original proportions and become stretched
* Things that should never be scaled in a non-uniform way: Round shapes, object’s geometry or texture having more than one directions, textures with patterns or images that don’t work stretched.
* If an asset has a clear direction and no specific (for example circular) shapes on its texture it might be okay to scale it along that direction
* Example case: If you need a slightly wider platform but uniform scaling will result in an asset looking too big. In this case the non-uniform scaling is not noticeable, even though the asset is stretched, and it can be seen in the UV visualization
* However, if the object's geometry has more than one direction, or small patterns in it (for example circular shapes), the non-uniform scaling doesn’t work

[[File:Level art guide non uniform scale 3d model texel density.png|1300px]]

[[Category:Art]]

Level Art: Color and Lighting

2021-11-23T13:47:35Z

Tero Tirkkonen: Tero Tirkkonen moved page Public Level Art: Color and Lighting to Level Art: Color and Lighting without leaving a redirect

{{:Public Level Art}} 

= Color is a combination of value, hue and saturation =
* Color is made of three things: '''VALUE, HUE''' and '''SATURATION'''
* Color is always relative and the context determines how colors are interpreted
* The most important aspect of color is the value of color, meaning the darkness or lightness of a color. This attribute will be seen even clearer if the image is turned into a grayscale mode
* Hue means the actual color, for example the hue of the color can be red, yellow, blue, orange, green, purple and anything between those
* The hue can be cold or warm, so there can be warm or cool temperature for the hue. This, as everything with colors, is always relative and depends on the other colors around the color in question. Colors always exist in some environment that affects them
* A hue can look warm next to a cooler hue or cool next to a warmer hue. A value can look darker next to a lighter value and lighter next to a darker value, and this is true for saturation too
* Saturation determines how vibrant the color is. A very saturated color is vibrant and desaturated color is muted and closer to gray
* Lighting and colors are always tied together. When designing a lighting, first determine what you want to achieve with the color choices and keep your intention in mind while building the lighting
* It's best to always think about the contrast. Where do you want to add contrast and guide the eye to look at using value, hue and saturation? And where do you want to keep attention away from with low contrast? Usually the answer is simply that we want to guide the player to the right direction and highlight important gameplay objects while fading the irrelevant things to the background. For transition areas between the puzzles we might also want to create beautiful visual focal points where the attention is completely directed at the art.
* We never want to create confusion or frustration by guiding the player to an area with nothing in there: For example by making an area that is difficult to reach look like there is an entrance to a secret and cause the player struggle to get there only to realize there's nothing in there after all.
* Here: [[Public Level_Art:_Level_Art_Related_Gameplay_Issues#Distracting_Level_Art|Level Art Related Gameplay Issues: Distracting Level Art]], are several examples of the issues dysfunctional colors and lighting can create for the player

[[File:color_wheel_hue_saturation_value.jpg|350px]]

== Gamut masking ==
* Gamut masking can be used to determine a color palette for a scene
* [https://www.youtube.com/watch?v=qfE4E5goEIc James Gurney: Gamut Masking]
* KGamut is a software that can be used to check the gamut mask of an image
* With KGamut you can for example compare the gamut mask of your level art screenshot with a gamut mask of a reference image to get closer to the reference image's lighting
* [http://cr10blog.blogspot.fi/2013/02/kgamut.html KGamut: a digital gamut mapping tool for Windows]
* [http://gurneyjourney.blogspot.fi/2013/02/digital-gamut-mapping-tool-for-windows.html KGamut info]
[[File:Kgamut beach 01 wide gamut.jpg |500px ]]
[[File:Kgamut beach 01 limited gamut.jpg |500px ]]

= Value =
With values you can create contrast or unity by using '''light and dark''' colors
* Some vocabulary:
** '''Value''' = the darkness/lightness, can be most clearly seen in a greyscale image but is present in a full color image as well
** '''Contrast''' = Relative difference between different values in an image. For example: there is a big (the biggest possible in fact) contrast between black and white and less contrast between gray and white
** '''Noise''' = small details with strong contrast that create visually noisy feeling
* With values (as well as other aspects of color) it is crucial to remember everything is relative! A value can look bright or dark depending on what value it is compared to
* When simplified, each image is just a bunch of different value blobs arranged into a composition
* The relative difference in the values between these blobs can be used to make things blend in or pop out
* To make things pop out doesn't always mean to make them super bright, because this won't work in a bright environment as everything else is bright as well. It's all relative to the surroundings so it's all about values and contrasts in each different context.
* If the difference between the values is big, then there is contrast which means that those things stand out more
* If the difference between values is small then there is no contrast and the things don't stand out but blend in instead
* Adjusting values in level art can be achieved with lighting, fog or albedo color or all of these
* In games we can guide the player's eye where we want, for example to concentrate on beautiful visual details or to important gameplay objects. At the same time we don't want the player to concentrate on irrelevant things.
* Irrelevant/background objects/areas should blend in
* Important objects/areas that need to be highlighted have to pop out by either being a dark object on a bright background or vice versa, simple as that!
* If the important object is surrounded by noisy irrelevant visuals it will be lost in the visual noise. So it's good to have clear surroundings for these important objects. That way the contrast can be controlled and adjusted to highlight the important objects and blend in the irrelevant things.

[[File:Visual noise contrast theory.jpg|400px]]
* A) The same level of detail and contrast everywhere creates a noisy feeling and it's hard to figure out where the focus should be
* B) Less detail and contrast in the environment and a higher level of detail and contrast in one area makes it much easier to decide where to focus

== How to check the true values of an image in Photoshop ==
* It's not as easy to see the different values and their relations while the image is in full color as the different hues and saturation can complicate things a lot
* It is crucial for any artist to be able to check the values of an image and the best way to do this is to look at the image in a grayscale mode
* The areas with most contrast between different values are the areas the eye catches first in an image
* If an image doesn't look good and clear in grayscale, it will not work in color mode either
* You might think that the hue/saturation adjustment or some other Photoshop grayscale adjustment works just fine but actually they don't

* To see the true values of an image in Photoshop use the proof color setup
** Select View -> Proof Setup -> Custom...
** "Device to Simulate: Dot Grain 20%", "Render Intent: Relative Colorimetric", "Black Point Compensation" checked
** Now you can switch between the basic color mode and the true greyscale mode to check the true values colors using CTRL+Y any time
** You can for example check a screenshot's values in Photoshop with this method when designing the lighting and colors or trying to find out how to make the scene clearer
[[File:True values.jpg|800px]]

== Guiding the player with values ==
* Simplify how you see forms and value. Everything you see is just blobs of value, it really isn't more complicated than that.
* It's either light or dark. A light colored thing pops out on a dark background, but blends in into a light background
* This is true for anything, any theme, foreground, gameplay area and background, for landscapes as well as characters
* What is the area with the most contrast in the scene? Is that where we want the player to look? If not, then the contrast is in the wrong place.
* Does the important thing lack contrast and blend in? Create contrast: if the thing is bright in value, put dark around it, if the thing is dark value, put bright around it.
* How to make the route clear? Guide the player with the values, have darker areas on the edges where the player is not supposed to go. Make sure the right path is clear and pops out.
* Pay attention to values and contrasts and use them to make important things pop out and unimportant things blend in

<gallery heights=400px mode="packed">
File:Owls dream overpaint 01.jpg| The gameplay route is same material and value as the background so it's hard to see the gameplay route
File:Cornelius dream overpaint 06.png| The background has noise so important things aren't highlighted enough and they are lost in the background
File:Gislans dream overpaint 11.png| The values are flat so they don't guide the player to the right direction
File:airy_fairy_overpaint_78.png| The values are random noise so they don't guide the player to the right direction

</gallery>

== Bring out the important gameplay objects with values ==
* Examples of situations where the gameplay area and objects aren't visible enough due to the value issues
<gallery heights=400px mode="packed">
File:Cornelius dream overpaint 04.png| The important gameplay items aren't clear as the values don't bring them out enough
File:Rudolfus dream overpaint 03.jpg|The spikes, the platforms and the gameplay area poles don't stand out enough. It could also be made clearer that the level doesn't continue to the left here.
File:Rudolfus dream overpaint 04.jpg|The chest and the gameplay area poles don't stand out enough. The background structures make the scene less clear.
File:Rudolfus dream overpaint 05.jpg|The lever, the platforms and the gameplay area poles don't stand out enough
</gallery>

== Create depth with values ==
* With values and contrasts you can create a sense of depth to a scene. Adding depth will make the general feeling less flat.
* A simple rule of thumb is that the closer a thing is, the more contrast it has and the further away it is the less contrast it has
* This is because of the atmosphere, the further away a thing is the more air with all sorts of dust particles, moisture etc. there is in between and they'll create "fog" that makes things blend together more and more the further they are. This fog can have its own hue too depending on the colors of the scene. For example if the sky is blue things get bluer the further away they are in the background.
* This is a powerful tool to create depth and separate the different layers of depth: foreground (can be several layers), game area and background (can be several layers) in the scene
* It's a common problem in level art that some things on the background appear as if they were on the gameplay area and this can be helped with clear levels of depth
[[File:Level art guide values and depth.jpg|1200px]]

= Hue =
With hues you can create contrast or unity by using '''warm and cool''' colors
* The understanding of the contrast between warm and cool hues is a great tool when building the color scheme of a scene
* For example The color of the light can be warm orange while the color of the shadows is cool blue, this creates an appealing contrast between the light and shadow areas
* The hues of the sunlight will change depending of the time of the day and also different seasons throughout the year affect the colors as well as the humidity or cleanliness of the air
* Do use real life as a reference for creating different lighting scenarios. Even though Trine world is a fantasy world we want to stick to believable real lighting scenarios that people recognize.
* We can take real world lighting and emphasize and exaggerate it, but everything should start from a deep understanding of realistic lighting
* Different light sources have different hues in them, normal fire has orange tones but different magical elements can turn lights into all the different hues. Magical mushrooms or crystals for example can glow in any hue!

[[File:color_theory_hue_temperature.jpg|1300px]]

== Hues Indicating Emotions ==
* For example many movies use a certain color to communicate a certain mood, you can observe this yourself though often it's done in a quite subtle way
* The different hues of colors can be used to create different types of mood and to communicate a certain emotion visually
* Any color can be chosen to communicate any mood as long as the colors chosen for the specific moods stay consistent throughout the game
* There are certain hues that tend to be used for certain moods more often depending on the cultural environment so using those stereotypes as is or turned on their head can be ways to use hues to indicate moods
* Here is just one example how the hues could work consistently supporting the mood and emotions of the story
[[File:Environment_design_colors_and_emotions_example.png|400px]]

== Examples of using hues to determine the mood ==
<gallery heights=200px mode="packed">
File:Trine 4 screenshot 01 1080p.png| Light pastel colors to establish a calm environment
File:Trine 4 screenshot 02 1080p.png| Warm and welcoming feeling with yellows and oranges
File:Trine 4 screenshot 06 1080p.png| A warm and cozy color scheme for the friendly Badger's home den
File:Trine 4 screenshot 05 1080p.png| Lush green calming environment
File:Trine 4 screenshot 39 1080p.png| This environment is meant to be uninviting and menacing so pale cool greenish blue hues are used to achieve that atmosphere
File:Trine 4 screenshot 20 1080p.png| Menacing mysterious feeling created with purple tones
File:Trine 4 screenshot 23 1080p.png| Calm and more friendly mysterious feeling created with blue tones

</gallery>

= Saturation =
With saturation you can create contrast or unity by using '''vibrant and muted''' colors

* Saturation means the purity of the hue
* With maximum saturation the color is purest and most vibrant and with less saturation the color turns more towards gray
* Just like with values and hue you can also use saturation to guide the eye of the player
* In a desaturated environment a saturated spot will grab your attention
* Trine series is known for its colorful environments but being colorful doesn't mean that every color has to be at the maximum saturation
* If everything is very saturated it can become visually overwhelming quickly so generally it's good to be mindful when deciding which areas should have a lot of saturation
* The saturation can also be explored using gamut masks mentioned earlier in this article

[[Category:Art|Level Art: Colors]] [[Category:Level Art|Colors]]

Level Art

2021-11-23T13:47:22Z

Tero Tirkkonen: Tero Tirkkonen moved page Public Level Art to Level Art without leaving a redirect

<onlyinclude>
<div style="float:right; width:40%; padding-left: 20px;">
'''Related sites'''
* [[Public Level Art]]
* [[Public Level Art: Color and Lighting]]
* [[Public Level Art: Composition]]
* [[Public Level Art: Environmental Storytelling]]
* [[Public Level Art: Ideas for New Levels]]
* [[Public Level Art: Level Art Related Gameplay Issues]]
* [[Public Level Art: The Level Art Phases]]

</div>
</onlyinclude>

== Level art workflow steps ==
[[File:level_art_wiki_header_banner_process.jpg]]
* Level artists create the visible game environment built on the collision block base created by designers.
* Level artists work with the Frozenbyte in-house engine and editor.

<br>
# '''The Idea''' - a mental image to work towards. The Idea is shaped and refined by reading the script, exploring the concept art and level wiki site and communicating with different team members like the AD, designers, the scriptwriter and/or other artists.
#* '''Outline meeting''' can occur before the design work has even started, gathering all the people working on a level to plan and discuss.
#* ''' Collecting reference''' includes researching the topic by searching inspirational reference images. Pinterest, for example, is a good online source for reference images.
#* ''' Level collision base meeting ''' takes place before the level art phase begins. The AD, level artists, designers and other related people working on the level are involved.
#* '''Preassembly''' can happen when a designer works on a level file, making it impossible for a level artist to access the same level. The artist can build level art arrangements to a separate file, requesting feedback from the AD during the preassembly.
# '''Base art''' - The Base art phase includes establishing a preliminary lighting setup, blocking the level art and building a strong and working base supporting the gameplay. Base art should be kept simple, concentrating only on the big forms and covering all the bare collisions.
#* '''AD's camera check''', done in collaboration with the designers, is followed by a camera fix list. It guides to adjust the cameras so that their positions are optimal for both the gameplay and art.
#* '''AD's base art check''' results in a fix list that may include paint-overs advising on how to improve the base art.
#* '''Base art fix round''' includes optimizing the camera positions and improving base art according to the feedback of the AD.
#* '''Lighting adjustments'''
# '''Detailing''' - Once the base art meets the requirements, details are added.
#* '''AD's details check''' results in a fix list that may include paint-overs advising on how to improve the level art.
#* '''Details art fix list round''' has the artist improving the level art based on the AD's feedback.
# '''Polish''' - Polishing happens at the end of the project when there's spare time. It consists of improving the level art by, for example, adding new 3D assets, documenting significant changes with before and after screenshots and consulting the AD.
#* '''Polish and optimizing''' includes general level art polishes, lighting adjustments and optimizing things.
#* '''Playing the game''': should be a daily level artist routine. Only by playing the levels you can evaluate the quality of the level art and make sure the level art supports the gameplay as much as possible. The level artists should play the game together in co-op, as well, to observe level art in a multiplayer mode and share ideas. <br>

=== Things to consider ===
* Working with the level art is '''an iterative process''': Art is created layer by layer, starting from the crude, bigger forms and ending with the detailed, final art.
* The aim is to keep the whole level at '''a consistent state at all times''' and only add finer details once the big forms are satisfactory.
* Level art is a process of continuous development. Nothing is final after the first round, and sometimes whole level areas might be reworked entirely. Large, creative projects always involve some degree of adjustments and alterations, but there are several reasons why level art can be subjected to a change:
**'''All the assets might not be available''' during the initial level art work, forcing the level artist to use temporary assets. They need to be replaced with new ones later, which can be time-consuming.
**'''The design can change''', also affecting the level art.
**'''A new and better visual idea for a scene might emerge''' at any point during the development.
**'''Technical changes''' sometimes require level art reworking.

=== Additional tips about the creating process ===
* '''Play the game''' It's crucial to play the game as often as possible and during the whole level art process. Only by playing you can confirm that everything works as intended and see how the art looks in the game!
**The level artist's responsibility is to ensure that the level art supports the gameplay in each part of the level.
**The player can only see what the in-game cameras are showing, making play testing the level even more important.
*It's essential to get '''the scale''' of the environment right as early as possible. '''Always have a game character model as a scale reference''' when you start blocking the level art.
** Generally, the assets in the background of a level tend to look smaller than you might expect, and you might have to scale up those assets slightly to make them look better in the game. Commonly, in-game assets are bulkier and larger than their real-life counterparts since that helps them stand out in the game. However, you should be careful when scaling assets, as the texel density (texture resolution) and geometry get easily incoherent.
** How to nail the right scale: [http://www.neilblevins.com/art_lessons/details_make_big/details_make_big.htm Using Details To Make Something Look Big By Neil Blevins]
* ''' Flexible level art work'''
**Sometimes you might be in a hurry to finish the level art, but the design is unfinished, leaving you unable to work on the level file.
** In a situation like this, it's best to communicate with the designer to determine whether some areas of the level are already finished. You can create a copy of the level to start your level design work, and when the design is complete, just copy and paste the level art to the actual level.

* ''' Links for learning'''
<div class="toccolours mw-collapsible mw-collapsed" style="background-color: #e6f2ff; border-width:2px; border-radius:10px; margin: 5px;">
Some general art fundamentals tips that are useful for any game artist:
<div class="mw-collapsible-content">

'''Lighting'''
* [http://gurneyjourney.blogspot.com/search/label/Color%20and%20Light%20Book Color theory: James Gurney's blog]
* [http://www.itchy-animation.co.uk/tutorials/light01.htm Lighting Fundamentals for Artists]
* [https://www.youtube.com/watch?v=MVafJfV5xhI Nathan Fowkes 'Better Options for Color Vibrance' ]

'''Composition'''
* [http://www.neilblevins.com/art_lessons/areas_of_visual_rest/areas_of_visual_rest.htm Neil Blevis: Areas Of Visual Detail, Areas Of Visual Rest]
* [http://www.neilblevins.com/art_lessons/clumping/clumping.htm Neil Blevis: Clumping and Grouping]
* [http://www.neilblevins.com/art_lessons/compositional_weight/compositional_weight.htm Neil Blevis: Compositional Weight]
* [http://www.neilblevins.com/art_lessons/composition_contrasts/composition_contrasts.htm Neil Blevis: Contrasts In Composition]
* [http://www.neilblevins.com/art_lessons/foreground_midground_background/foreground_midground_background.htm Neil Blevis: Foreground, Midground, Background]
* [http://www.neilblevins.com/art_lessons/layers_of_light_and_dark/layers_of_light_and_dark.htm Neil Blevis: Layers Of Light And Dark]
* [http://www.neilblevins.com/art_lessons/primary_secondary_and_tertiary_shapes/primary_secondary_and_tertiary_shapes.htm Neil Blevis: Primary, Secondary and Tertiary Shapes]
* [http://www.neilblevins.com/art_lessons/details_make_big/details_make_big.htm Neil Blevis: Using Details To Make Something Look Big]
* [http://www.neilblevins.com/art_lessons/tangents/tangents.htm Neil Blevis: What is a Tangent? And How To Solve Them]

* [https://www.deviantart.com/lulie/art/The-Secret-to-Composition-272036625 The secret to composition]
* [https://twitter.com/eyecager Composition tips etc by Amber Blade Jones]
* [https://www.youtube.com/watch?v=qMH_J_vcoqE&feature=youtu.be&list=PLa1F2ddGya_9XER0wnFS6Mgnp3T-hgSZO Gleb Alexandrov's presentation about balance and composition of elements in creating appealing works]
* [https://youtu.be/GZ99gAb4T0o The Importance of Nothing: Using Negative Space in Level Design]

'''Environmental storytelling'''
* [https://www.youtube.com/watch?v=iemcI0t096I Sam Nielson's lecture about environment design]
* [https://www.youtube.com/watch?v=griCsvvRTQM Sam Nielson's lecture about atmosphere]
* [https://youtu.be/FeUL-5wfj0U?t=3m29s The Art of Environment Storytelling for Video Games GNOMON]
* [https://vimeo.com/165693758 Mike Hill's lecture about Spielberg's Subtext]

'''General creative development'''
* [http://www.neilblevins.com/art_lessons/art_lessons.htm Neil Blevis: Various art tips]
* [https://www.youtube.com/channel/UCbdyjrrJAjDIACjCsjAGFAA Feng Zhu design school videos. All kinds of stuff about painting/design/color etc.]
* [http://wiki.polycount.com/wiki/Polycount Polycount wiki. Basically everything you need to know about game art is found here]
* [https://www.youtube.com/user/McBacon1337/videos Game Maker's Toolkit. Interesting and well-made videos about game mechanics in different games by Mike Brown.]

</div>
</div>

= Building a Level =
== Ideas for New Levels ==
[[Public Level Art: Ideas for New Levels]]<br>
[[File:level_art_wiki_header_banner_ideas_for_new_levels.jpg|800px]]

== The Level Art Phases ==
[[Public Level Art: The Level Art Phases]]<br>
[[File:level_art_wiki_header_banner_level_art_phases.jpg|800px]]

== Environmental Storytelling ==
[[Public Level Art: Environmental Storytelling]]<br>
[[File:level_art_wiki_header_banner_environmental_storytelling.jpg|800px]]

== Level Art Related Gameplay Issues ==
[[Public Level Art: Level Art Related Gameplay Issues]]<br>
[[File:level_art_wiki_header_banner_gameplay_issues.jpg|800px]]

= Level Art Fundamentals =

== Composition ==
[[Public Level Art: Composition]]<br>
[[File:level_art_wiki_header_banner_composition.jpg|800px]]

== Color and Lighting ==
[[Public Level Art: Color and Lighting]]<br>
[[File:level_art_wiki_header_banner_color_and_lighting.jpg|800px]]

[[Category:Editor|Level Art]] [[Category:Art|Level Art]] [[Category:Level Art|Level Art]]

Level Art: Composition

2021-11-23T12:04:14Z

Tero Tirkkonen: /* Problems created by scaling 3D models too much */

Level Art: The Level Art Phases

2021-11-23T12:01:35Z

Tero Tirkkonen: Created page with "{{:Public Level Art}}  = The Level Art Phases = '''It's crucial to play the game as often as possible and during the w..."

Level Art: Level Art Related Gameplay Issues

2021-11-23T12:00:02Z

Tero Tirkkonen: Created page with "{{:Public Level Art}}  = Level Art Should Support Gameplay = * The purpose of the Level Art is to make the game beautif..."

Level Art: Ideas for New Levels

2021-11-23T11:51:47Z

Tero Tirkkonen: Created page with "{{:Public Level Art}}  * How to get visual ideas to kickstart a new level? * All Trine levels have their own theme, but..."

Level Art: Environmental Storytelling

2021-11-23T11:51:02Z

Tero Tirkkonen: Created page with "{{:Public Level Art}}  = What is Environmental Storytelling? = * An environment is an imagined space where the player..."

{{:Public Level Art}} 

= What is Environmental Storytelling? =

* An environment is an imagined space where the player moves inside.
* Even though the environment is virtual, it creates boundaries and limitations for the player and guides them through using tools such as lighting and art.
* As the player moves around in the virtual world and passes through the different rooms and scenes, they're given context through carefully placed props and objects.
* Every asset in a scene has a purpose, every character is placed there for a reason and every piece of background art has a history.
* Environmental details mirror and expand the lore of the world, offer additional information about locations or characters, and deepen the player's understanding of the story.
* In other words, the player's view of the world and understanding of the narrative is shaped by where they find themselves in that world.
* The rich environmental details supported by the narrative and supporting the narrative help the player see the game world as one whole (even when it's separated in levels like in Trine).
* To achieve immersion careful planning and much work are needed: placing all props carefully, designing NPC looks and locations to reflect their personalities, occupations and residence, creating areas where the mood and the atmosphere complement each other - essentially, making all the elements of the game work together.
* Once the immersion is achieved, everything seems in place, and all things belong. The player can't help but to feel that things make sense, however curious or outlandish the various elements might be.
* In an immersive game, barriers in the environment need to make sense within the game world - to the point that players will never even question why they can't get past an obstacle.

= How does Environmental Storytelling work? =
* It's a mixture of direct references and more vague things.
* When inserting an apparent story reference, you should always consult the writer to ensure the environmental storytelling aligns with the screenplay.
* Environmental storytelling works better the more freedom the player has. Trine is usually focused on linear exploration, but that doesn't mean it can't benefit from environmental storytelling.
* Each and every scene is distinctive while at the same time retaining the style of the level, both design- and art-wise.
* This makes it easier for the player to build a mental map of the level and imagine how things work outside their immediate view.
* When building the levels, you don't need to think about making them more realistic, but simply remember how Trine's fictional world works and use it as a springboard.
* Things that don't make sense in real life could make perfect sense in Trine's land of fantasy.
* The exploration process wheels more organic when a player receives the expository information through their eyes and ears and via the world itself (as opposed to just listening and reading it from text boxes, dialogues or cutscenes).
* When the story is perceived through observation, the narration is reinforced. The game world feels more believable and alive to the player.

== Examples of Environmental Storytelling ==
* How environmental storytelling translates to both the environment itself and into gameplay:

<gallery widths=500px heights=500px mode="nolines">
File:ES_astral_nightmare.png|
</gallery>
* This scene set in The Astral Nightmare is a good example of successful environmental storytelling.
* On one side are the wizards, scared and angry. On the other side, there's the true form of The Nightmare Prince.
* Even though the player hasn't met the Nightmare Prince, they have a clear idea of what the wizards were like towards Selius. The scene also foreshadows what will happen later, namely the Selius transformation during the game finale.
* It serves as a sort of an Easter egg for those people playing the game a second time.
* The visuals connect nicely to the main narrative, showing us Astral Academy (Selius's personal purgatory) and the main character

<gallery widths=500px heights=500px mode="nolines">
File:9P_elves_hotpools.png|
</gallery>
* Elves have never been mentioned in the Trineverse, but this level has statues depicting them.
* Players noticing the statues and other remains of the elvish culture learn more about the Trineverse world & can immerse themselves in the world.
* The elven statues aren't connected to the main narrative itself, since the elves play no role in it. Their "presence" in the environment, however, helps to develop and expand the world and lore.

<gallery widths=500px heights=500px mode="nolines">
File:T4_selius_nightmares_es.jpg|
</gallery>
* This scene shows a family portrait of the Heatherwood family, but it's been ruined by one of Selius's Nightmares.
* A book found later in the level reveals that Selius was bullied by his brothers. Players probably see the painting in a new light, especially since the part of the painting depicting Selius's brothers is badly damaged.

== Environmental Storytelling and Design ==

* It's crucial to communicate constantly with the designers. When creating level art, the gameplay and design aspects need to be considered. Sometimes it means trying to match far-out and crazy gameplay ideas to the overall visuals as seamlessly as possible.
* Due to Trine's 2.5D nature, players don't have a lot of freedom deciding where to go and what to interact with. It's the level artist's job to make sure that the only route the players can take feels like the obvious and tempting choice and not a forced necessity.
* That's been achieved by making the background and foreground areas (where the players can not move) seem uninviting, too hard to navigate, or outright dangerous.
* It's also very important to add art assets to puzzle elements to tie them together with the surroundings and the level.

[[File:T4_enchanted_vines_es.mp4|550px]]
* Here's how the environmental storytelling translates to the gameplay: instead of having a wooden gate the slides to the side, a strong grip of the enchanted vines has been chosen to break the stone wall.
* This doesn't seem out of place in the context of the level and makes both the story and the gameplay more coherent.

<gallery widths=500px heights=500px mode="nolines">
File:T4_seal_es_example.jpg|
</gallery>
* The Seal in T4 is a fantastic example of the art, story and gameplay blending together.
* It appears throughout the whole lake level and helps the heroes. In return, the heroes assist The Seal. Later, it's mentioned by Elodea when we meet her.
* All pieces are connected and work beautifully together, giving the Seal a greater purpose in the game world (rather than being just a bouncy gameplay prop).

= In Conclusion =

* Environmental storytelling is a great way to make the game's story more interesting.
* As there is a whole Trineverse world featured in several games, it's important to make the games feel connected, even if each entry to the series is a stand-alone game.
* The players are already familiar with the world and its characters, so adding emotional impact will make them even more immersed in the game world.
* With future projects, we can revisit the old Trineverse locations, creating a wonderful sense of nostalgia (art, music, feel), while keeping things new and fresh.

[[Category:Art]] [[Category:Art|Trine 4 Level Art]] [[Category:Trine 4 Art|Level Art]] [[Category:Level Art|Trine 4 Level Art]] [[Category:Trine 4 Level Art]]
[[Category:Level Art|Environmental Storytelling]]