Skip to content

Commit d37db40

Browse files
committed
doc: Crunch images and minor copy changes.
1 parent c4e8acc commit d37db40

14 files changed

+16
-8
lines changed

VisualPinball.Unity/Documentation~/creators-guide/tutorials/realistic-backglass/1-prepare-artwork.md

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ description: How to prepare the backglass artwork in Photoshop
66

77
# Finding Artwork
88

9-
Perhaps the most challenging aspect to making a working backglass is finding good artwork. The best possible art is a direct scan of the backglass but that is not always possible. There are backglass images that can be found online but it takes a fair amount of time to clean these up and remove any artifact from them. Another possibility is to get artwork online and use that as a basis for a total redraw.
9+
Perhaps the most challenging aspect to making a working backglass is finding good artwork. The best possible art is a direct scan of the backglass but that is not always possible. There are backglass images that can be found online but it takes a fair amount of time to clean these up and remove any artifacts from them. Another possibility is to get artwork online and use that as a basis for a total redraw.
1010

1111
## Create the Color Map
1212

@@ -18,10 +18,12 @@ Once you have your artwork secured save this as a PNG file. We'll name it `Backg
1818

1919
<img src="photo-backside.jpg" width="300" class="img-responsive pull-right" style="margin-left: 15px">
2020

21-
To block the passage of light through the backglass we need to make a thickness map layer. This layer consists of pure white `(255,255,255)` for the areas that are opaque and pure black `(0,0,0)` for the areas that are transparent. If you have physical access to the backglass then you can scan the backside to get this mask. Otherwise, you'll have to trace what's visible on the front, and try to reconstruct elements that aren't.
21+
To block the passage of light through the backglass we need to make a thickness map layer. This layer consists of pure white for the areas that are opaque and pure black for the areas that are transparent. If you have physical access to the backglass then you can scan the backside to get this mask. Otherwise, you'll have to trace what's visible on the front, and try to reconstruct elements that aren't.
2222

2323
Elements that aren't visible are often scores that aren't part of the actual artwork. In this case, your best bet is to find a similar font to the original art and eyeball where it goes. A helpful site is [WhatTheFont](https://www.myfonts.com/WhatTheFont/), which helps you identify the font in an image.
2424

2525
![Thickness Mask Edit](ps-thickness.png)
2626

27-
Save this as a grayscale PNG file without transparency named `Backglass Thickness.png`. You're now ready to [create a backglass mesh](xref:tutorial_backglass_2).
27+
Save this as a grayscale PNG file without transparency named `Backglass Thickness.png`.
28+
29+
You're now ready to [create a backglass mesh](xref:tutorial_backglass_2).

VisualPinball.Unity/Documentation~/creators-guide/tutorials/realistic-backglass/2-create-mesh.md

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,7 @@ description: How to create a backglass mesh in Blender
66

77
# Create a Backglass Mesh
88

9-
We're now going to edit Blender's *default cube* and unwrap it to fit the backglass artwork.
10-
11-
*Note: this might be the only tutorial on the internet that actually uses the default cube ;)*
9+
We're now going to edit Blender's *default cube* and unwrap it to fit the backglass artwork. Note: this might be the only tutorial on the internet that actually uses the default cube ;)
1210

1311
## Create the Geometry
1412

VisualPinball.Unity/Documentation~/creators-guide/tutorials/realistic-backglass/3-import-into-unity.md

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ Open your scene in Unity and copy the `Backglass.fbx` into your models folder, a
1313
> [!note]
1414
> We recommend storing models at `Assets/<Table Name>/Models`, textures at `Assets/<Table Name>/Textures`, and materials at `Assets/<Table Name>/Materials`.
1515
16-
![Copy assets into your Unity project](unity-imported.jpg)
16+
![Copy assets into your Unity project](unity-imported.png)
1717

1818
## Add the Backglass to the Scene
1919

@@ -31,6 +31,7 @@ Ouch, that's too large and not oriented correctly. Let's fix that. In the inspec
3131

3232
In the *Project* window, navigate to your `Materials` folder, right click, select *Create -> Material*, and name the new material `Backglass`. Set the following properties:
3333

34+
- Enable *Alpha Clipping* to make the score reels visible through the transparent areas.
3435
- *Material Type* to *Translucent*
3536
- *Base Map* to `Backglass Albedo` (use the small target icon to search)
3637
- *Smoothness* to something high like `0.97`
@@ -44,10 +45,14 @@ Then, in the *Project* window, navigate back to your materials, drag and drop th
4445

4546
![Material applied](unity-material-applied.png)
4647

48+
Voilà!
49+
4750
To test the thickness mask, place a light source behind the backglass and move it around:
4851

4952

5053
![Moving light](unity-backglass-light-source.webp)
5154

55+
Finally, in the *Hierarchy* window, move the *Backglass* game object from the root into your table structure. Best practice is to create a `Back Box` parent where you keep all your game objects that are part of the back box.
56+
5257

5358
Congratulations! You have now made a backglass that will transmit light through the color overlay and block light in any of the masked area.
-223 KB
Loading
-152 KB
Loading

VisualPinball.Unity/Documentation~/creators-guide/tutorials/realistic-backglass/index.md

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,13 @@ The result of this workflow is a pinball backglass that is properly sized and co
1919
## Prerequisites
2020

2121
- While we provide some guidelines for the artwork, we won't go into detail how to produce it. So, we assume that you have your artwork ready.
22-
- You should know your way around in Blender. This tutorial will show how to size and unwrap the mesh for import into Unity.
22+
- You should have a entry level skills in Blender.
2323

2424
## Workflow
2525

2626
1. [Prepare Artwork](xref:tutorial_backglass_1)
2727
2. [Create mesh in Blender](xref:tutorial_backglass_2)
2828
3. [Import mesh into Unity](xref:tutorial_backglass_3)
29+
30+
> [!note]
31+
> We don't provide guidelines how to go about the light sources behind the translite, although we might will in a future tutorial.
-3.35 MB
Loading
-138 KB
Loading
-2.06 MB
Loading
-1.41 MB
Loading

0 commit comments

Comments
 (0)