refs #40: "Getting Started" section on GUIs is complete and should in…

…troduce new users to the main concepts.

docs/src/getting-started/creating-a-game-stub/conclusions.md

@@ -1,5 +1,5 @@
 ---
-weight: 1570
+weight: 1580
 ---
 
 ## Conclusions

docs/src/getting-started/creating-a-game-stub/create-characters.md

@@ -60,21 +60,26 @@ Fixing this is as simple as selecting the **Sprite2D** node in the character sce
 
     In the case of floating characters (ghosts, fairies, anti-gravity-powered mad scientists, etc), you should leave some vertical space between the scene's center and your character. Try to envision the scene line as the "floor" and decide how high above the floor the character should float.
 
-The last thing to do is to position the place where the dialog text will be shown for the talking character. Popochiu can be customized to show dialog lines in many different positions or fashions, but its default is to show the dialogue lines somewhere above the character's head. Since the engine doesn't know how high your sprite is (see "Under the hood" note below), that's for you to decide.
+The last thing to do is to position the place where the dialog text will be shown for the talking character. Popochiu can be customized to show dialog lines in many different positions or fashions.  
+The GUI template we selected shows the dialog lines as a caption at the bottom of the screen, but other ones show the dialogue lines somewhere above the character's head. We are going to see how to position the text for those interfaces that use the _over head_ dialogues style.
 
-Just select the **DialogPos** node in the scene tree (_11_). A small cross will be highlighted in the scene's origin. Drag it somewhere above the character's head (or wherever makes sense to you).
+Since the engine doesn't know how high your sprite is (see "Under the hood" note below), that's for you to decide.
+
+For this, select the character's rood node in the scene tree, and you will see a small purple square at the scene's origin. Drag it somewhere above the character's head (or wherever makes sense to you). As you see the square is labeled and connects to the element it refers to.
+
+If you see no square, make sure the **Dialogue Position Gizmo** is visible by checking the state of the button in the toolbar (_11_).
 
 ![Correct Character's text position](../../assets/images/getting-started/game_stub-character-10-set_dialog_position.png "Position the dialogue where it's more convenient")
 
-This may require a bit of experimentation, but for now, this will do.
+Finding the best positioning for the "voice" of each character may require a bit of trial and error, but for now, this will do.
 
 !!! info "Under the hood"
-    You may be wondering how exactly the text is positioned in relation to the **DialogPos** node. Here is an explanation of how Popochiu decides how your text is rendered.
+    You may be wondering how exactly the text is positioned in relation to the **Dialog Position** gizmo. Here is an explanation of how Popochiu decides how your text is rendered.
 
-    1. The baseline of the text will always match the vertical position of **DialogPos**, so the text will be rendered vertically **right above** that point.
-    2. The dialog line length is calculated and the text is centered on the horizontal position of **DialogPos**, so the text will be rendered horizontally **around** that point.
+    1. The baseline of the text will always match the vertical position identified by the gizmo, so the text will be rendered vertically **right above** that point.
+    2. The dialog line length is calculated and the text is centered on the horizontal position of gizmo, so the text will be rendered horizontally **around** that point.
     3. If the text spans multiple lines, Popochiu will expand it **towards the top**, so that it doesn't cover your character (this means if you want your text under the character for some reason, multiple lines will cover your character).
-    4. If the character is near the window or screen border, the text will be repositioned so that it will be entirely visible, so you don't have to worry about it becoming unreadable. This is true both for horizontal and vertical coordinates.
+    4. If the character is near the window or screen border, the text will be repositioned so that it will be entirely visible, so you don't have to worry about it becoming unreadable. This is true both for horizontal and vertical coordinates. Of course, long texts may overlap the character sprint in that case, but it's for good.
 
 ### Add another character
 

docs/src/getting-started/creating-a-game-stub/create-the-first-room.md

@@ -81,22 +81,24 @@ In the Room tab of Popochiu dock, click the **Create walkable area** button (_16
 
 In the popup window, just name your new walkable area "_Floor_" (or whatever you find descriptive enough). Click **OK** and a new element will be added to the scene.
 
-![A new walkable area in the scene tree](../../assets/images/getting-started/game_stub-room-8-wa_scene_tree.png "Select the Perimeter node to edit the area shape")
+![A new walkable area in the scene tree](../../assets/images/getting-started/game_stub-room-8-wa_scene_tree.png "Click the Edit Polygon button to edit the area shape")
 
-Selecting the **Perimeter** node in the scene tree (_17_) to highlight a squared polygon in the center of the scene. Now you have to adjust the vertices of that polygon (_18_) to whatever makes sense.
+Click the **Edit Polygon** button in the toolbar (_17_) to highlight a squared polygon in the center of the scene. Now you have to adjust the vertices of that polygon (_18_) to whatever makes sense.
 
 !!! tip
     To adjust the polygon, just click and drag the vertice handles around.  
     It's quite intuitive, but you can add vertices to the polygon by clicking anywhere along a segment.
 
 When you have adjusted your walkable area, it should look something like this:
 
-![The polygon for the floor is over](../../assets/images/getting-started/game_stub-room-9-wa_bake_polygon.png "Click 'Bake NavigationPolygon' to complete the walkable area")
+![The polygon for the floor is over](../../assets/images/getting-started/game_stub-room-9-wa_bake_polygon.png "Click "Edit Polygon" again to complete the walkable area")
+
+Click the **Edit Polygon** button again (_19_)to stop editing the perimeter of the floor.
 
 Save the project and run your game. Your character should now be able to move around the room, without leaving the area you defined.
 
 !!! note
-    If you aren't new to Godot, you may think we forgot to mention the **Bake** NavigationPolygon** button in the toolbar (_19_). That's not the case, Popochiu bakes the polygon for you.
+    If you aren't new to Godot, you may think we forgot to mention the **Bake NavigationPolygon** button in the toolbar (_19_). That's not the case, Popochiu bakes the polygon for you.
 
 !!! tip
     You usually don't want your walkable area to cover the entire floor that you painted, or your character will be able to stand on the very border of it, too near the wall, creating a terrible effect.  
@@ -139,8 +141,8 @@ Let's draw a shape around the window on the wall:
 
 No need to be too precise or polished, rough edges won't be perceivable while playing your game. You just need to avoid, if possible, overlapping with other hotspots (see "_Baseline_" below, to understand how polygon overlapping works).
 
-Another important property of the hotspot is the "_Walk to point", which is the coordinates that the character will reach when you click over the hotspot.  
-You can set these coordinates interactively by clicking and dragging the "_Walk To point_" gizmo wherever you want in the room. You will see that the property with the same name in the inspector will update to reflect the coordinates.
+Another important property of the hotspot is the "_Walk to point_", which is the coordinates that the character will reach when you click over the hotspot.  
+You can set these coordinates interactively by clicking and dragging the **Walk To point** gizmo wherever you want in the room. You will see that the property with the same name in the inspector will update to reflect the coordinates.
 
 For our example room, we'll set the following coordinates for the `Window` hotspot:
 
@@ -156,7 +158,7 @@ The last property that you want to set is the _Baseline_. The baseline is simply
 
     That's not the case at all. If you don't set your baseline the right way, the polygon-delimited area of the hotspot may remain clickable even when the character is in front of it; or the other way around, a hotspot that should always be in front of the scene, may be covered by your character, making it unreachable. So, **always** set your baseline.
 
-Our window is in the back of the room and the main character has no way to be placed behind it, so just click the baseline gizmo handler (the square in the middle of the line) and drag it at the very top so that the baseline is "as high as the scene" (or more). The character has no way to walk so high.  
+Our window is in the back of the room and the main character has no way to be placed behind it, so just click the **Baseline** gizmo handler (the square in the middle of the line) and drag it at the very top so that the baseline is "as high as the scene" (or more). The character has no way to walk so high.  
 
 !!! info
     You can set the baseline even to negative values. This is what Popochiu automatically does when you name your prop `Background` or `bg`, to make sure your background is always at the very back of the scene. Keep this in mind too, if you change the baseline of other elements programmatically (via a script).