[Port] [6000.5] Document template search, filtering, and sorting options for Shader Graph and VFX Graph

Author: sebastienduverne

Packages/com.unity.shadergraph/Documentation~/Create-Shader-Graph.md

@@ -55,3 +55,5 @@ You can now open the asset and edit the graph in the [Shader Graph window](Shade
 * [Shader Graph template browser](template-browser.md)
 * [Create a custom shader graph template](template-browser.md#create-a-custom-shader-graph-template)
 * [Shader Graph window](Shader-Graph-Window.md)
+* [Shader Graph Asset reference](Shader-Graph-Asset.md)
+

Packages/com.unity.shadergraph/Documentation~/images/template-browser.png

@@ -4,17 +4,20 @@ The Shader Graph template browser allows you to create a new shader graph from a
 
 To access the Shader Graph template browser, right-click in your Project window and select **Create** > **Shader Graph** > **From Template**.
 
+**Note**: The template browser displays only templates that are compatible with the current project.
+
 ![The template browser](images/template-browser.png)
 
 | Label | Name | Description |
 | :--- | :--- | :--- |
 | **A** | Template list | Lists all the available templates you can select and start from to create a new shader graph. |
 | **B** | Template details | Displays a picture and description of the selected template. |
-| **C** | Action buttons | Finish the asset creation flow. The options are:<ul><li>**Create**: Creates a new shader graph asset based on the selected template.</li><li>**Cancel**: Closes the window and cancels the shader graph asset creation.</li></ul> |
-
-**Note**: The template browser displays only templates that are compatible with the current project.
+| **C** | Search and filtering tool | Filters the template list using the [Unity Search](https://docs.unity3d.com/Manual/search-overview.html) functionality. Type text to search templates by name or select **Add** (+) to filter templates based on specific characteristics.<br/>In addition to some of the default Unity Search options, Shader Graph includes the following filters:<ul><li>**Category**: Filters by template grouping category.</li><li>**material**: Filters by the target material type.</li><li>**renderpipeline**: Filters by render pipeline.</li><li>**vfx**: Filters by Visual Effect Graph support.</li></ul> |
+| **D** | Sorting tool | Sorts the templates within their respective categories. The categories remain listed in alphabetical order. The options are:<ul><li>**Sort By Name**: Lists templates in alphabetical order.</li><li>**Sort By Order**: Lists templates in Shader Graph's default order. </li><li>**Sort By Modification Date**: Lists the last modified templates first.</li><li>**Sort By Last Used**: Lists the last used templates first.</li><li>**Sort By Favorite**: Lists templates marked as favorites first.</li></ul>**Note**: To mark a template as a favorite, hover over the template in the list and select the gray star that appears. To remove a template as a favorite, select the star again. |
+| **E** | **Cancel** | Closes the window and cancels the shader graph asset creation. |
+| **F** | **Create** | Creates a new shader graph asset based on the selected template. |
 
-### Create a custom shader graph template
+## Create a custom shader graph template
 
 You can create your own shader graph templates to have them available in the template browser. You can share these templates with your team to maintain consistency across shaders, for example in projects with unique lighting setups or specific shader requirements.
 
@@ -34,3 +37,4 @@ To create a custom shader graph template, follow these steps:
 ## Additional resources
 
 * [Create a new shader graph](Create-Shader-Graph.md)
+* [Shader Graph Asset reference](Shader-Graph-Asset.md)

Packages/com.unity.shadergraph/Documentation~/template-browser.md

@@ -11,12 +11,12 @@ For information on system requirements for the Visual Effect Graph, see [Require
 To install the Visual Effect Graph package:
 
 1. Open a Unity project.
-1. Open the **Package Manager** window (**Window > Package Manager**).
+1. Open the **Package Manager** window (**Window** > **Package Manager**).
 1. In the Package Manager window, in the **Packages** field, select **Unity Registry**.
 1. Select **Visual Effect Graph** from the list of packages.
 1. In the bottom right corner of the Package Manager window, select **Install**. Unity installs Visual Effect Graph into your Project.
 
-__Note:__ When using [HDRP](https://docs.unity3d.com/Packages/com.unity.render-pipelines.high-definition@17.0/manual/index.html), VFX Graph is included with  [HDRP Package](https://docs.unity3d.com/Packages/com.unity.render-pipelines.high-definition@17.0/manual/install-hdrp.html#install-the-high-definition-rp-package) and doesn't need to be manually installed
+**Note:** When using [HDRP](https://docs.unity3d.com/Packages/com.unity.render-pipelines.high-definition@17.0/manual/index.html), VFX Graph is included with  [HDRP Package](https://docs.unity3d.com/Packages/com.unity.render-pipelines.high-definition@17.0/manual/install-hdrp.html#install-the-high-definition-rp-package) and doesn't need to be manually installed
 
 ### Using the correct version of Visual Effect Graph
 Every Visual Effect Graph package works with a Scriptable Render Pipeline package of the same version. If you want to upgrade the Visual Effect Graph package, you must also upgrade the render pipeline package that you’re using.
@@ -25,28 +25,28 @@ For example, the Visual Effect Graph package version 6.5.3-preview in Package Ma
 version 6.5.3-preview.
 
 ## Creating Visual Effect Graphs
-To use Visual Effect Graph, you must first create a [Visual Effect Graph Asset](VisualEffectGraphAsset.md) .
 
-To create a Visual Effect Graph Asset:
+To use Visual Effect Graph, you must first create a [Visual Effect Graph asset](VisualEffectGraphAsset.md).
 
-1. In Unity, click __Assets__ > __Create__ > __Visual Effects__ > __Visual Effect Graph__.
-1. Select a Template as a starting point for your new visual effect.
-1. Click the Create button in the bottom right corner.
+### From the Editor menu
 
-It is also possible to create a Visual Effect Graph Asset from a [GameObject](https://docs.unity3d.com/Manual/class-GameObject.html) in the scene:
-1. Select the GameObject and add a [Visual Effect Component](VisualEffectComponent.md).
-1. Click on the "New" button next to the Asset Template field.
-1. Select a Template as a starting point for your new visual effect and click the create button.
+1. From the main menu, select **Assets** > **Create** > **Visual Effects** > **Visual Effect Graph**.
+1. Select a template as a starting point for your new visual effect.
+1. Select **Create**.
 
-Finally, you can create a new Visual Effect Asset from the Visual Effect Graph window.
-1. Open the Visual Effect Graph window in __Window__ > __Visual Effect__ > __Visual Effect Graph__.
-1. Click on the __Create New Visual Effect Graph__ button. 
-1. Select a Template as a starting point for your new visual effect and click the create button.
+### From a GameObject
 
-To make a copy of a Visual Effect Graph Asset:
+1. Select the GameObject and add a [Visual Effect component](VisualEffectComponent.md).
+1. Next to the **Asset Template** property, Select **New**.
+1. Select a template as a starting point for your new visual effect.
+1. Select **Create**.
 
-1. In the Project window, select the Visual Effect Asset you want to make a copy of.
-2. In the top navigation bar, select __Edit__ > __Duplicate__.  You’ve now created a copy.
+### From the Visual Effect Graph window
+
+1. From the main menu, select **Window** > **Visual Effect** > **Visual Effect Graph** to open the Visual Effect Graph window.
+1. Select the **Create New Visual Effect Graph** button. 
+1. Select a template as a starting point for your new visual effect.
+1. Select **Create**.
 
 ## Using Visual Effect Graphs in Scenes
 
@@ -62,9 +62,9 @@ If you created a Visual Effect Asset directly from the Visual Effect Component i
 ## Editing a Visual Effect Graph
 To edit Visual Effect Graph Assets in the  [Visual Effect Graph window](VisualEffectGraphWindow.md) :
 
-* Open the Visual Effect Graph window (menu: __Window__ > __Visual Effects__) with an empty graph. This prompts you to open a Visual Effect Graph Asset.
-* Select an existing Visual Effect Graph Asset, and click the __Edit__ button in the Inspector. This opens the Visual Effect Graph window with the graph contained in this Asset.
-* Select the Visual Effect component (menu: next to the Asset template, click __Edit__). This opens the Visual Effect Graph window and with the graph contained in the referenced Asset.
+* Open the Visual Effect Graph window (menu: **Window** > **Visual Effects**) with an empty graph. This prompts you to open a Visual Effect Graph Asset.
+* Select an existing Visual Effect Graph Asset, and click the **Edit** button in the Inspector. This opens the Visual Effect Graph window with the graph contained in this Asset.
+* Select the Visual Effect component (menu: next to the Asset template, click **Edit**). This opens the Visual Effect Graph window and with the graph contained in the referenced Asset.
 
 ## Previewing a graph’s effect
 To preview an effect, you can:
@@ -82,8 +82,8 @@ When you attach a Visual Effect in your scene to the current graph, you can use
 This also allows Unity to display the correct gizmos in the scene, which makes some aspects of your effect easier to edit. 
 
 To attach a Visual Effect to the opened graph, you can either select the GameObject in the hierarchy, or follow these steps:
-1. In the matching graph, open the __Auto Attach Panel__ from the [Toolbar](VisualEffectGraphWindow.md#Toolbar). 
-1. Click on the **Select a target** field to select a compatible GameObject that exists in the current open scene.
+1. In the matching graph, open the **Auto Attach Panel** from the [Toolbar](VisualEffectGraphWindow.md#Toolbar). 
+1. Click on the**Select a target** field to select a compatible GameObject that exists in the current open scene.
 
 ## Manipulating graph elements
 When you open an Asset inside the Visual Effect Graph window, you can see and edit the graph for that specific Asset.
@@ -95,9 +95,15 @@ When you link several Blocks together, these form a Context. For more informatio
 Every change you make to a graph has immediate consequences on the behavior of your effect, and you can preview the changes in real time. Every time you add, remove, or connect a Node, the graph recompiles all the elements that have changed, and restarts the effect. However, changing values (for example, editing a curve) does not make Unity recompile anything and affects the simulation in real time.
 To add Nodes, you can either:
 
-* Right-click in the graph, and select __Create Node__.
+* Right-click in the graph, and select **Create Node**.
 * Press the spacebar on your keyboard.
 * Click and drag an edge from an existing port, and release the click in an empty space.
 * Drag and drop an element from the [Blackboard](Blackboard.md) into the graph.
 
-When you do any of the above actions, the __Create Node__ menu appears. Here, you can see the Nodes, Blocks, and Contexts that are compatible with that specific location in the graph.
+When you do any of the above actions, the **Create Node** menu appears. Here, you can see the Nodes, Blocks, and Contexts that are compatible with that specific location in the graph.
+
+## Additional resources
+
+* [VFX Graph template window reference](Templates-window.md)
+* [Visual Effect Graph window reference](VisualEffectGraphWindow.md)
+* [Visual Effect Graph Asset reference](VisualEffectGraphAsset.md)

Packages/com.unity.visualeffectgraph/Documentation~/GettingStarted.md

@@ -1,41 +1,68 @@
-# VFX Graph Templates window
-Use the template window to create a VFX Graph asset with a predefined effect. You can use these templates as a starting point for your own effects.
-Each template has a description and an image to describe its behavior.    
-This window is displayed when you create a new Visual Effect Graph from the `Create` context menu in the project browser.
+# VFX Graph template window
 
-![Template-Window](Images/templates-window.png)
+The VFX Graph template window allows you to create a new VFX graph from an existing template with a predefined effect. You can use these templates as a starting point for your own effects.
+
+There are multiple ways to [access the VFX Graph template window](#access-the-vfx-graph-template-window).
+
+**Note**: The template browser displays only templates that are compatible with the current project.
+
+![The template window](Images/templates-window.png)
+
+| Label | Name | Description |
+| :--- | :--- | :--- |
+| **A** | Template list | Lists all the available templates you can select and start from to create a new VFX graph.<br/><br/>**Note**: the **Install Learning Templates** button imports the [Learning Templates sample](sample-learningTemplates.md) from the Visual Effect Graph package. |
+| **B** | Template details | Displays a picture and description of the selected template. |
+| **C** | Search and filtering tool | Filters the template list using the [Unity Search](https://docs.unity3d.com/Manual/search-overview.html) functionality. Type text to search templates by name or select **Add** (+) to filter templates based on specific characteristics.<br/>In addition to some of the default Unity Search options, Visual Effect Graph allows you to filter the list by template grouping using **Category**. |
+| **D** | Sorting tool | Sorts the templates within their respective categories. The categories remain listed in alphabetical order. The options are:<ul><li>**Sort By Name**: Lists templates in alphabetical order.</li><li>**Sort By Order**: Lists templates in VFX Graph's default order. </li><li>**Sort By Modification Date**: Lists the last modified templates first.</li><li>**Sort By Last Used**: Lists the last used templates first.</li><li>**Sort By Favorite**: Lists templates marked as favorites first.</li></ul>**Note**: To mark a template as a favorite, hover over the template in the list and select the gray star that appears. To remove a template as a favorite, select the star again. |
+| **E** | **Cancel** | Closes the window and cancels the VFX graph asset creation. |
+| **F** | **Create** | Creates a new VFX graph asset based on the selected template. |
+
+## Access the VFX Graph template window
+
+### From the Project window
+
+1. Right-click in your Project window.
+
+1. Select **Create** > **Visual Effects** > **Visual Effect Graph**.
+
+### From the VFX Graph editor toolbar
 
-## Open from VFX Graph editor toolbar
 ![toolbar](Images/templates-window-toolbar.png)
 
-You can open the templates window from the **Add** (+) button in the VFX Graph editor toolbar. This button includes a drop-down to either `insert` a template in the current graph, or `create` a new asset file from a template.
+1. In the VFX Graph window's toolbar, select the drop-down arrow besides the **Add** (+) button.
 
-When you insert a template, Unity places it at the center of the screen.    
+1. Select one of the available options:
+    * **Create from template** to create a new asset file from a template.
+    * **Insert template** to insert a template in the current graph.
+
+Once you complete a template insertion, Unity places it at the center of the VFX Graph window's workspace.    
 
 > [!TIP]
-> If you hold the `CTRL` key while you click on the **Add** (+) button, the templates window opens to create a new VFX asset.
+> To create a new VFX graph asset, you can also hold the `CTRL` key while you directly select **Add** (+) in the toolbar.
+
+### From the VFX Graph workspace
+
+1. Right-click in the VFX Graph window's workspace.
+
+1. Select **Insert template**.
+
+Once you complete the VFX graph asset creation, Unity inserts the template at the right-click position.
+
+## Create a custom VFX graph template
+
+You can create your own VFX graph templates to have them available in the template browser.
+
+To create a custom VFX graph template, follow these steps:
 
-## Open from the VFX Graph context menu
-When you right click in the VFX Graph editor window, the context menu shows the **Insert template** option, which inserts the template at the mouse position.
+1. In the **Project** window, select the VFX graph asset you want to use as a template.
 
-## Search and filter templates
-The template window includes a search field to filter templates according to various criteria.
-The search field works the same way as with the main [Unity search window](https://docs.unity3d.com/Manual/search-window-reference.html), although there are fewer filters available.
+1. In the **Inspector** window, select **Use as Template**.
 
-## Sort templates
-Next to the search field, a dropdown allows to sort templates by:
-- Name
-- Order
-- Modification date
-- Last used
-- Favorite
+1. Expand the **Template** section.
 
-> [!NOTE]
-> The sorting is applied inside each category, but categories are always sorted by name.
+1. Optional: Set the metadata that describes the template in the template browser: **Name**, **Category**, **Description**, **Icon**, and **Thumbnail**.
 
-## VFX Graph template Editor
+## Additional resources
 
-When you select a [Visual Effect Asset](VisualEffectGraphAsset.md) in the Project window, the inspector displays a section dedicated to template description.
-To make a Visual Effect asset become a template, activate the **Use as Template** option.
-By default the template name is the asset name, but you can override it by editing the `Name` field.
-The description, icon and thumbnail fields are optional, but can help to understand the purpose of the template when browsing in the template window.
+* [Create a new VFX graph](GettingStarted.md)
+* [Visual Effect Graph Asset reference](VisualEffectGraphAsset.md)