How to use the New Unity Prefab Workflow

The new prefab workflow is here! Rejoice and find out how to make the most of prefab overriding, nesting and variants in Unity’s new prefab workflow.

Version

  • C#4, Unity 2018.3, Unity

One of the most requested features in Unity was having the ability to create nested prefabs. With nested prefabs, you can parent prefabs to each other as individual modules, similar to the concept of inheritance in classes in object-oriented programming.

Since Unity 2018.3 this is finally possible! You can access the new prefab mode editor which lets you edit prefabs in isolation.

Because this new prefab workflow is much faster than the previous way of editing prefabs where you had to drag the prefab into the scene, make changes and then remove it from the scene again each time you want to modify something, you can expect to save hours in development time.

In this tutorial, you’ll learn how to work with prefabs and the new prefab editing workflow, specifically:

  1. Prefab mode.
  2. Nested prefabs.
  3. Prefab variants.

Prerequisites

To load the starter project and work through this tutorial, you’ll need Unity version 2018.3 or newer. If you don’t have it installed, you can download it from unity3d.com or via the Unity Hub.

Note: This tutorial is intended for users who are comfortable with the Unity editor and basic scripting . If you’re new to Unity, you can check out our beginner tutorials at https://www.raywenderlich.com/unity.

Once you have everything set up, download the starter project using the Download Materials link at the top or bottom or this tutorial, and open the StarterProject folder with Unity.

Look at the folder structure in the Project window:

Here’s what each folder contains:

  • Materials: The necessary materials required for this tutorial.
  • Models: The models required for this tutorial.
  • Prefabs: All of the prefabs for the tutorial are in this folder.
  • Presets: The Furniture Model Importing settings preset file.
  • Scenes: The Furniture scene is in this folder.
  • Scripts: The scripts for the project.
  • Sprites: The sprite for the UI buttons.
  • Textures: The main textures for the project.

Overview of Scene

Open the Factory scene in the Assets \ RW \ Scenes \ Factory folder.

In this scene, there’s a small section of a factory where random furniture pieces enter from one spot and are transported to another using a conveyor belt.

You can also see two UI buttons that Increase or Decrease the spawning speed and conveyor belt speed.

Click the Play button to run the scene.

Notice the conveyor belts are moving and the buttons are working, but the objects aren’t spawning.

The piece that gets spawned is randomly selected from a list of predefined GameObjects, which you can check in the Inspector by selecting Furniture from the Hierarchy and looking at the Furniture Prefabs list in the Furniture Spawner component. This component spawns a furniture prefab randomly after a number of seconds based on the value of timeBetweenSpawns.

Now that you have a broad understanding of the scene, it’s time to look at the core ideas the new prefabs workflow brings, and how they’ll make your development life easier.

Creating a Prefab

Prefabs in Unity are pre-configured reusable GameObjects that you create in the scene and store in the project.

To make a prefab, you create the GameObject in its desired configuration in the scene using whatever components you need. You then drag it into the Project window to save it as a prefab in your project. Once created, you can instantiate and clone your prefabs (i.e., create an instance of them at runtime). Prefabs have many uses and are a vital part of development in Unity.

Once created, the text color of your GameObject and its icon turns blue indicating that it’s been converted into a prefab.

Here’s an example from the project:

  • Open the Assets \ RW \ Prefabs \ Furniture \ Pieces \ Chair folder. Notice there are a number of variations for the different pieces that make up a chair.
  • In the Hierarchy, create an empty GameObject named NewChair.
  • Select pieces from the open Project window and drag them onto the newly created, empty GameObject. Now, arrange the pieces to make it look like a chair. When you’re done, you should end up with something like this:
  • Add a Box Collider and a Rigidbody component to NewChair so it can sit on top of the conveyor belt in the scene.
  • You’ll notice that the green outline that shows the Box Collider might not fit the actual dimensions of the chair exactly. To fix this, with the NewChair GameObject selected, select Tools > Fit collider to children.
  • You can see that the collider now fits the boundaries of the chair perfectly. You can check how this is done by checking out the nifty FitColliderToMeshes.cs script in the Assets / RW / Scripts / Editor folder. Feel free to use this script in your own projects!
  • At this point, NewChair is just another GameObject that exists in the current scene. To convert it into a prefab, drag and drop it into the Prefabs folder in the Project window.
  • The icon color changes to blue in the Hierarchy to indicate that NewChair is now a prefab.

Once you’ve made a prefab, you can delete it from the Hierarchy and use it anywhere within your Unity project.

  • Delete the NewChair prefab from the Hierarchy.
  • Now select Furniture from the Hierarchy. In the Inspector, you can see that Furniture Prefabs is a public list of the GameObject type .
  • Select the NewChair prefab you just made from the Project window and add it the Furniture Prefabs list. Add a few more already made prefabs (Chair 1, Table 1, etc.) from the Project window for good measure.

Play the scene. Notice that one of the prefabs you just added spawns and moves on the conveyor belt from left to right.

Now that you know how to make a basic prefab, you’re ready to explore the new core features of the prefab workflows.

Prefab Mode

The new prefab mode is a dedicated prefab editing mode that allows you to open and edit prefabs in isolation.
Compared to the older method where you had to bring a prefab into a scene and then edit it, the new prefab mode saves you a lot of time and hassle.

There are two ways to enter prefab mode:

  1. Double click a prefab in the Project Window.
  2. If your prefab is part of the current scene, you’ll see a small arrow next to the Gameobject in the Hierarchy. Clicking that also enters prefab mode.

Use either of the methods mentioned above to open the prefab mode within the Scene window. Notice that the Hierarchy only shows the GameObjects that are part of the prefab you selected.

Now exit the prefab mode by clicking the left pointing arrow located to the left of the root GameObject in the Hierarchy. As you can see, it’s pretty easy and fast to jump in and out of prefab mode.

Auto Saving in Prefab Mode

Back in the scene, select Furniture in the Hierarchy, and clear all items in the Furniture Prefabs list from the Inspector window by setting its Size to 0.

Drag a Table 1 prefab from Assets \ RW \ Prefabs \ Furniture onto the list to add it.

Play the scene. Notice that only instances of Table 1 are spawning onto the conveyor belt in the Game window now.

With the scene still running, double-click Table 1 from the Project window to open it in prefab mode. Now, increase or decrease the scale of the object while the scene is running.

You’ll notice that as you adjust the properties of the prefab, the changes are reflected in real-time with each new spawned GameObject in the Game window.

These live updates are possible thanks to the new Auto Save feature available within the new prefab mode; you can toggle this feature on or off as per your requirement with the checkbox at the top of the Scene view.

Overriding Prefabs

In addition to the convenient Auto Save feature, the new prefab workflow allows you to override prefabs.
A prefab instance can have overrides, which are modifications that are unique to that specific prefab instance and are not part of its corresponding prefab asset.

With property overrides, it’s possible to create prefabs that share common characteristics yet also differ in specific ways in specific contexts.

In other words, overrides allow you to change the properties of a prefab instance and preserve those changes while allowing unchanged properties to be updated and kept in sync with changes in the prefab asset.

Here’s an example of how you can override prefabs:

  • Create an instance of the Table 1 prefab from Assets \ RW \ Prefabs \ Furniture by dragging it from the Project window to the Hierarchy. Click on the arrow next to it to open it in the Prefab editor and toggle the Auto Save option off.
  • Select the child GameObject TableTop. In the Inspector, expand the Material options and change the Shader Material color to Green.
  • You’ve just created a prefab override of the Table 1 asset. With the tabletop piece selected, look at the Inspector window. You’ll notice a little blue line before the name of the property that’s been modified, in this case, the Materials property. When a property changes, the text is bold and a blue vertical line appears beside it in the Inspector, indicating a property override. It also makes it easy to revert specific changes that you’ve made without having to undo all the way back.
  • This change is now local to the prefab instance and all changes to prefab instances can be managed via the Overrides dropdown (shown in the figure below). Click it to see the list of the properties that have been modified.
  • Clicking on a GameObject or a component in the list opens up the Comparison Window, which shows the values from the prefab asset on the left, and the overridden values on the prefab instance on the right.
  • Within this dropdown you can review, apply or revert changes made to a prefab. Or you can click on Apply All to save all of the changes. For now, do not apply any changes.
  • Now, navigate to Assets \ RW \ Prefabs \ Furniture, select Table 1 and double-click to open it in prefab mode.
  • Next, select Tabletop and change the color of the material to blue. You’ll notice that the color of Tabletop currently in the scene doesn’t change, because you have overridden the property in the instance.
  • However, if you change the Scale property of Tabletop asset — the one currently open in prefab editing mode — and click Save, the changes will also get reflected in the instance of the prefab instantiated in the scene.

That’s an example of how you can override prefabs in your scene.

Whenever you want to have an instance of a GameObject in your scene, and you want to make changes to some very specific properties of a prefab, you can do so without breaking the entire prefab instance in the scene.

Before moving on to the next section, delete Table 1 from the Hierarchy.

Nested Prefabs

Nested prefabs allow you to include prefab instances as children inside of other prefabs while still maintaining a connection to their own prefab asset.
They’re are super useful in game development workflows as they allow you to make your game more modular.

Here’s how to nest prefabs within each other:

  1. Navigate to Assets \ RW \ Prefabs \ Furniture in the Project window and open Table 1 in prefab mode like you did earlier.
  2. In the same folder you’ll also see a TableCloth prefab. Drag and drop the TableCloth prefab into the Hierarchy as a child of the main Table 1 prefab. Adjust the X Rotation value to 90, and set the Y Position value so that the Tablecloth sits just above the tabletop. Click Save to save the prefab. You should now have something like this:
  3. Open Table 2 in prefab mode, add the TableCloth prefab as a child and change its Transform values to position it nicely on top of the table. Save this one too.
  4. Create an instance of both Table 1 and Table 2 by bringing them into the current scene by dragging and dropping them into the Hierarchy. Adjust their Transform value so they’re properly visible in the Game window.
  5. Finally, open TableCloth in prefab editing mode by double-clicking it in the Project window. Now, increase or decrease its Scale value.

If the Auto Save is toggled on, you’ll notice that the scale of the table cloth on both Table 1 and Table 2, which are separate prefabs, changes. This is because both of them inherit the same TableCloth prefab.

Back in the Hierarchy, delete all prefabs (Table 1, Table 2, and TableCloth GameObjects) from the scene to keep the project nice and clean.

Here’s another example:

  1. Navigate to Assets \ RW \ Prefabs \ UI. You’ll see that there are IncreaseButton and DecreaseButton prefabs; these are UI buttons that are used in the scene.
  2. Open IncreaseButton in prefab mode, and drag and drop the Assets \ RW \ Prefabs \ Arrow prefab as a child and change it’s Position to (X:150, Y:0, Z:0).
  3. Do the same with DecreaseButton, but change the Position to (X:-130, Y:0, Z:0) and the Z Rotation value of the arrow to 180.
  4. Finally, open the Arrow prefab in prefab mode, then increase it’s Scale to (X:0.75, Y:0.75, Z:1.0) (or anything larger than it’s current scale on X and Y). As expected, the scale of the arrow in both IncreaseButton and DecreaseButton prefab instances is reflected instantly.

Delete the unnecessary Arrow prefab instances from the Hierarchy to keep the project clean.

That was a quick overview of how nested prefabs work in the new Unity prefab workflow.
Before this update, if a single prefab was part of a large number of GameObjects, you would have to manually select all of those instances of the prefab for the changes to reflect.

The ability to create nested prefabs allows you to make individual modules, which can be added as children of other prefabs, and only the main prefab would have to be edited once for the changes to reflect all over the project.

Prefab Variants

Variants allow you to create a new prefab from another prefab asset.

The prefab that the prefab variant is based on is referred to as the base. The prefab variant can contain overrides to the base prefab but still receive updates to properties which are not overridden.

In the previous section about prefab overrides, you learned how to override specific properties of a prefab instance in your scene. However, there might be times where you want to create two or more variants of a prefab which can be accessed throughout the project but differ from the base prefab in a small number of properties, a material for example.

To do that, you can create Variants of prefabs that inherit all of the properties of a base prefab but can be customized in specific select properties.

Currently, the UI buttons IncreaseButton and DecreaseButton are two separate prefabs, but they share a lot of common properties, and creating a variant of one from the other would be easier to maintain.

  1. Select DecreaseButton from the Hierarchy, and delete it. Also, Navigate to Assets \ RW \ Prefabs \ UI and delete the DecreaseButton asset.
  2. Create a variant of the IncreaseButton asset by right-clicking on it (in the Project window) and selecting Create > Prefab Variant option from the context menu. A prefab variant has a unique icon with two arrows indicating that it is a prefab variant. When selected, you can also see the base prefab that it inherits in the Inspector window. Rename the variant to DecreaseButton.
  3. Now, create an Instance of DecreaseButton by dragging and dropping it as a child of Canvas in the Hierarchy. Set its position to (X:-390, Y:144, Z:0)
  4. Open the DecreaseButton prefab in prefab editing mode and toggle the Auto Save option off. Select the child GameObject Text, and set its text to Decrease. Also, select the child GameObject Arrow and set its Z Rotation value to 180 and it’s X Position value to -150.
  5. Click Save in the Scene window to save changes. Now you have DecreaseButton as a prefab variant of IncreaseButton with the Text and Arrow GameObjects varying in some properties.

You can look at the properties that DecreaseButton overrides over the base prefab by clicking the Overrides dropdown from the Inspector window.

Changes that you have not overridden in the variant are still updated as changes are made in the base prefab. To demonstrate this:

  1. Open IncreaseButton in prefab editing mode and change the Text to something random like Increase 123 and click Save, you’ll notice that the changes do not reflect in the DecreaseButton prefab.
  2. However, if you change the Font size of Text in the IncreaseButton prefab to 38, the changes are reflected in the DecreaseButton prefab as well, since the font size property was not overridden in the prefab variant DecreaseButton.

Exit the prefab editing mode and delete any unnecessary DecreaseButton prefabs from the Hierarchy. With the Furniture GameObject selected, add NewChair, Table 2 and Chair 1 prefabs to the Furniture Prefabs list, and click Play.

Where to Go From Here?

Congratulations on making it to the end of this quick overview of the new prefab workflows introduced in Unity 2018.3. If you’ve worked on a prefab-heavy project in the past, I bet you’re dancing right now. :]

You can find the final project using the Download Materials link at the top or bottom or this tutorial.

To solidify what you just learned, play around with the project and try out different combinations of the techniques picked up in this tutorial.
Here’s a final recap of what you learned in this tutorial :

  • The new prefab mode is a dedicated editing mode that allows you to open and edit prefabs in isolation.
  • Nested prefabs allow you to parent prefabs to each other. This helps to increase the modularity of your project
  • Prefab variants allow you to create prefabs that are derived from other prefabs and can inherit specific properties of those prefabs, while also allowing you the ability to override some features of the prefab as per your requirements.

To learn more, you can check out these links :

If you have any questions or comments, or you want to show what you experimented with by using this tutorial, join the discussion below!

Contributors

Comments