Merge pull request #19354 from unoplatform/mergify/bp/release/stable/…

…5.6/pr-19324

docs: Update Hot Design Documentation (backport #19324)

build/cSpell.json

@@ -115,7 +115,8 @@
 	"Haptics",
 	"autoplay",
 	"Xcodes",
-	"Raygun"
+	"Raygun",
+	"waitlist"
   ],
   "ignoreWords": [
 	"ADAL",

doc/articles/get-started-wizard.md

@@ -7,15 +7,15 @@ uid: Uno.GetStarted.Wizard
 
 Create a simple cross-platform Counter application.
 
-Choose one of the 4 variants of the Counter tutorial, combining markup language (XAML or C# Markup) and presentation framework (MVVM or MVUX).
+Choose one of the 4 variants of the Counter tutorial, combining markup language (XAML or C# Markup) and presentation framework (MVVM or MVUX). Also, you can build the Counter tutorial using our visual designer, Hot Design.
 
 <!-- markdownlint-disable MD001 -->
 
 <br/>
 
 <div class="row">
 
-<div class="col-md-6 col-xs-12 ">
+<div class="col-md-6 col-xs-12">
 <a href="getting-started/counterapp/get-started-counter-xaml-mvux.md">
 <div class="alert alert-info alert-hover">
 
@@ -27,7 +27,7 @@ Use XAML for layout and MVUX for state management
 </a>
 </div>
 
-<div class="col-md-6 col-xs-12 ">
+<div class="col-md-6 col-xs-12">
 <a href="getting-started/counterapp/get-started-counter-xaml-mvvm.md">
 <div class="alert alert-info alert-hover">
 
@@ -39,7 +39,7 @@ Use XAML for layout and MVVM for state management
 </a>
 </div>
 
-<div class="col-md-6 col-xs-12 ">
+<div class="col-md-6 col-xs-12">
 <a href="getting-started/counterapp/get-started-counter-csharp-mvux.md">
 <div class="alert alert-info alert-hover">
 
@@ -51,7 +51,7 @@ Use C# Markup for layout and MVUX for state management
 </a>
 </div>
 
-<div class="col-md-6 col-xs-12 ">
+<div class="col-md-6 col-xs-12">
 <a href="getting-started/counterapp/get-started-counter-csharp-mvvm.md">
 <div class="alert alert-info alert-hover">
 
@@ -65,6 +65,21 @@ Use C# Markup for layout and MVVM for state management
 
 </div>
 
+<!-- Centered last item -->
+<div class="row" style="display: flex; justify-content: center; align-items: center;">
+<div class="col-md-6 col-xs-12">
+<a href="studio/Hot Design/hot-design-getstarted-counter-tutorial.md">
+<div class="alert alert-info alert-hover">
+
+#### Hot Design
+
+Use a visual designer to design and develop the app
+
+</div>
+</a>
+</div>
+</div>
+
 <br/>
 
 [!include[getting-help](includes/getting-help.md)]

doc/articles/getting-started/counterapp/get-started-counter.md

@@ -12,11 +12,11 @@ The Counter tutorial will walk you through creating a simple cross-platform coun
   <img src="Assets/counter-app.png" alt="Screenshot of an Uno Platform app showing a counter" />
 </p>
 
-There are four variants of the Counter tutorial, combining markup language (XAML or C# Markup) and presentation framework (MVVM or MVUX).
+There are four variants of the Counter tutorial, combining markup language (XAML or C# Markup) and presentation framework (MVVM or MVUX). Also, you can build the Counter tutorial using our visual designer, Hot Design.
 
 <div class="row">
 
-<div class="col-md-6 col-xs-12 ">
+<div class="col-md-6 col-xs-12">
 <a href="get-started-counter-xaml-mvux.md">
 <div class="alert alert-info alert-hover">
 
@@ -28,7 +28,7 @@ Use XAML for layout and MVUX for state management
 </a>
 </div>
 
-<div class="col-md-6 col-xs-12 ">
+<div class="col-md-6 col-xs-12">
 <a href="get-started-counter-xaml-mvvm.md">
 <div class="alert alert-info alert-hover">
 
@@ -40,7 +40,7 @@ Use XAML for layout and MVVM for state management
 </a>
 </div>
 
-<div class="col-md-6 col-xs-12 ">
+<div class="col-md-6 col-xs-12">
 <a href="get-started-counter-csharp-mvux.md">
 <div class="alert alert-info alert-hover">
 
@@ -52,7 +52,7 @@ Use C# Markup for layout and MVUX for state management
 </a>
 </div>
 
-<div class="col-md-6 col-xs-12 ">
+<div class="col-md-6 col-xs-12">
 <a href="get-started-counter-csharp-mvvm.md">
 <div class="alert alert-info alert-hover">
 
@@ -66,6 +66,21 @@ Use C# Markup for layout and MVVM for state management
 
 </div>
 
+<!-- Centered last item -->
+<div class="row" style="display: flex; justify-content: center; align-items: center;">
+<div class="col-md-6 col-xs-12">
+<a href="../../studio/Hot Design/hot-design-getstarted-counter-tutorial.md">
+<div class="alert alert-info alert-hover">
+
+#### Hot Design
+
+Use a visual designer to design and develop the app
+
+</div>
+</a>
+</div>
+</div>
+
 <br/>
 
 ---

doc/articles/studio/Hot Design/hot-design-getstarted-counter-tutorial.md

@@ -21,15 +21,11 @@ This tutorial will guide you through using Hot Design to create a simple counter
 > Additionally, as a general note, Hot Design can be used without selecting a specific architectural pattern, such as MVVM or MVUX, making it a versatile tool for various projects. For this particular tutorial, however, we will focus on using MVUX as an example.
 >
 > [!IMPORTANT]
-> **Hot Design™** is currently in beta. Sign up to the [wait list](https://platform.uno/waitlist/) to get early access and be the first to try it out!
+> **Hot Design™** is currently in beta. Sign up to the [waitlist](https://platform.uno/waitlist/) to get early access and be among the first to try it out!
 >
-> [!IMPORTANT]
-> Currently, **Hot Design** is not supported with C# Markup at this time and is only available with XAML.
->
-> [!IMPORTANT]
-> At the current stage of the **Hot Design™** beta, **only the Desktop platform is supported**. Other platforms are undergoing stabilization for Hot Design support and will be available in future updates.
->
-> For now, you can use the **Desktop** platform to create your UI with the runtime visual designer. Once you’re satisfied with your design, you can test the app on other platforms by launching it as you would normally.
+> - Hot Design is now available on all platforms in beta, with the Desktop platform (`-desktop` target framework) currently offering the most stable and reliable experience. Other platforms are still undergoing stabilization.
+> - Hot Design does not support C# Markup and is only available with XAML. Additionally, Hot Design is not supported for the WinAppSDK target framework at this time.
+> - Your input matters! Share your thoughts and help us improve Hot Design. [Find out how to provide feedback here](xref:Uno.Platform.Studio.Feedback).
 
 ## Set Up Your Environment for Hot Design
 
@@ -116,7 +112,7 @@ First, we need to add the image file to the application. Download this [SVG imag
 
 ## Run the app
 
-Before you run the application, switch the target platform to **Desktop** (net8.0-desktop) to enable Hot Design during debugging. For more information on how to switch the target platform, visit the documentation page for your IDE:
+Before you run the application, switch the target platform to **Desktop** (`net9.0-desktop`) to enable Hot Design during debugging. For more information on how to switch the target platform, visit the documentation page for your IDE:
 
 - [Visual Studio](xref:Uno.GettingStarted.CreateAnApp.VS2022#debug-the-app)
 - [VS Code](xref:Uno.GettingStarted.CreateAnApp.VSCode#debug-the-app)
@@ -127,13 +123,10 @@ Before you run the application, switch the target platform to **Desktop** (net8.
 - [Rider](xref:Uno.GettingStarted.CreateAnApp.Rider#debug-the-app)
 
 > [!IMPORTANT]
-> At the current stage of the **Hot Design™** beta, **only the Desktop platform is supported**. Other platforms are undergoing stabilization for Hot Design support and will be available in future updates.
->
-> For now, you can use the **Desktop** platform to create your UI with the runtime visual designer. Once you’re satisfied with your design, you can test the app on other platforms by launching it as you would normally.
 >
-> [!IMPORTANT]
-> If you're using Visual Studio, you can choose to start it with or without debugging.  
-> If you're using VS Code or Rider, start the app **without the debugger**.
+> - If you're using Visual Studio, you can choose to start it with or without debugging.  
+> - If you're using VS Code or Rider, start the app **without the debugger**.
+> - **Hot Design** is now available on all platforms in beta, with the **Desktop** platform (`-desktop` target framework) currently offering the most stable and reliable experience. Other platforms are still undergoing stabilization.
 
 Now, let's run the app.
 

doc/articles/studio/Hot Design/hot-design-getstarted-guide.md

@@ -13,15 +13,11 @@ Use this guide to set up Hot Design and start creating and refining user interfa
 ## Set Up Your Environment for Hot Design
 
 > [!IMPORTANT]
-> **Hot Design™** is currently in beta. Sign up to the [wait list](https://platform.uno/waitlist/) to get early access and be the first to try it out!
+> **Hot Design™** is currently in beta. Sign up to the [waitlist](https://platform.uno/waitlist/) to get early access and be among the first to try it out!
 >
-> [!IMPORTANT]
-> Currently, **Hot Design** is not supported with C# Markup at this time and is only available with XAML.
->
-> [!IMPORTANT]
-> At the current stage of the **Hot Design™** beta, **only the Desktop platform is supported**. Other platforms are undergoing stabilization for Hot Design support and will be available in future updates.
->
-> For now, you can use the **Desktop** platform to create your UI with the runtime visual designer. Once you’re satisfied with your design, you can test the app on other platforms by launching it as you would normally.
+> - Hot Design is now available on all platforms in beta, with the Desktop platform (`-desktop` target framework) currently offering the most stable and reliable experience. Other platforms are still undergoing stabilization.
+> - Hot Design does not support C# Markup and is only available with XAML. Additionally, Hot Design is not supported for the WinAppSDK target framework at this time.
+> - Your input matters! Share your thoughts and help us improve Hot Design. [Find out how to provide feedback here](xref:Uno.Platform.Studio.Feedback).
 >
 > [!IMPORTANT]
 > If you're new to developing with Uno Platform, make sure to set up your environment by [following our getting started guide](xref:Uno.GetStarted).

doc/articles/studio/Hot Design/hot-design-overview.md

@@ -5,15 +5,11 @@ uid: Uno.HotDesign.Overview
 # Hot Design™ Overview
 
 > [!IMPORTANT]
-> **Hot Design™** is currently in beta. Sign up to the [wait list](https://platform.uno/waitlist/) to get early access and be the first to try it out!
+> **Hot Design™** is currently in beta. Sign up to the [waitlist](https://platform.uno/waitlist/) to get early access and be among the first to try it out!
 >
-> [!IMPORTANT]
-> Currently, **Hot Design** is not supported with C# Markup at this time and is only available with XAML.
->
-> [!IMPORTANT]
-> At the current stage of the **Hot Design™** beta, **only the Desktop platform is supported**. Other platforms are undergoing stabilization for Hot Design support and will be available in future updates.
->
-> For now, you can use the **Desktop** platform to create your UI with the runtime visual designer. Once you’re satisfied with your design, you can test the app on other platforms by launching it as you would normally.
+> - Hot Design is now available on all platforms in beta, with the Desktop platform (`-desktop` target framework) currently offering the most stable and reliable experience. Other platforms are still undergoing stabilization.
+> - Hot Design does not support C# Markup and is only available with XAML. Additionally, Hot Design is not supported for the WinAppSDK target framework at this time.
+> - Your input matters! Share your thoughts and help us improve Hot Design. [Find out how to provide feedback here](xref:Uno.Platform.Studio.Feedback).
 
 Welcome to **Hot Design**, a next-generation runtime visual designer for cross-platform .NET applications!
 

doc/articles/studio/hot-design-beta-feedback.md

@@ -0,0 +1,48 @@
+---
+uid: Uno.Platform.Studio.Feedback
+---
+
+# Providing Feedback for Uno Platform Studio
+
+We deeply value your feedback for **Uno Platform Studio** and its tools ([**Hot Design™**](xref:Uno.HotDesign.Overview), [**Hot Reload**](xref:Uno.Platform.Studio.HotReload.Overview), and [**Design-to-Code**](xref:Uno.Figma.GetStarted)) to ensure we can deliver the best possible experience.
+
+Here’s how you can share your feedback:
+
+## 1. GitHub Feedback
+
+Navigate to the [Uno Platform Studio GitHub repository](https://github.com/unoplatform/studio) to:
+
+- **Report issues or bugs**: Share any unexpected behavior or issues you encounter with the tools or documentation.
+- **Propose enhancements**: Suggest features or improvements to enhance Uno Platform Studio, its tools, and its documentation.
+- **Start discussions**: Engage in conversations about Uno Platform Studio and its tools.
+
+For more details, refer to the [feedback guidelines](https://github.com/unoplatform/studio/blob/main/README.md).
+
+## 2. Hot Design Feedback Menu
+
+You can also provide feedback directly while using **Hot Design** in a live, running application. Use the **Feedback** menu to:
+
+- **Report an issue/bug**
+- **Suggest a feature**
+- **Ask a question**
+
+Follow these steps to access the feedback menu:
+
+1. Click on the three-dot button in the [Hot Design Toolbar](xref:Uno.HotDesign.GetStarted.Guide#toolbar).
+2. Navigate to **Help** > **Feedback**.
+3. Choose one of the following options:
+   - **Report an issue/bug**
+   - **Suggest a feature**
+   - **Ask a question**
+
+Refer to the image below for guidance:
+
+![Hot Design Feedback Menu](Hot%20Design/Assets/hot-design-feedback-menu.png)
+
+## Additional Support
+
+For further assistance, visit our [Discord Server](https://platform.uno/uno-discord), where our engineering team and community will be happy to assist you.
+
+For organizations seeking a deeper level of support beyond our community support, please [contact us](https://platform.uno/contact).
+
+We look forward to your feedback and thank you for helping us improve Uno Platform Studio and its tools!

doc/articles/toc.yml

@@ -86,6 +86,8 @@
         href: xref:Uno.Workshop.Counter.CSharp.MVUX
       - name: C# Markup + MVVM
         href: xref:Uno.Workshop.Counter.CSharp.MVVM
+      - name: Hot Design
+        href: xref:Uno.HotDesign.GetStarted.CounterTutorial
     - name: Simple Calc
       topicHref: xref:Workshop.SimpleCalc.Overview
       href: external/workshops/simple-calc/toc.yml
@@ -437,6 +439,8 @@
         href: xref:Uno.HotDesign.GetStarted.CounterTutorial
     - name: Design-to-Code
       href: external/figma-docs/toc.yml
+    - name: Feedback
+      href: xref:Uno.Platform.Studio.Feedback
 
 - name: Reference
   items: