Skip to content

Commit 980b1c9

Browse files
agneszitteagneszitte
authored
Merge pull request #19354 from unoplatform/mergify/bp/release/stable/5.6/pr-19324
docs: Update Hot Design Documentation (backport #19324)
2 parents a2fe61d + e3185ad commit 980b1c9

File tree

9 files changed

+110
-42
lines changed

9 files changed

+110
-42
lines changed

‎build/cSpell.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,8 @@
115115
"Haptics",
116116
"autoplay",
117117
"Xcodes",
118-
"Raygun"
118+
"Raygun",
119+
"waitlist"
119120
],
120121
"ignoreWords": [
121122
"ADAL",

‎doc/articles/get-started-wizard.md

Lines changed: 20 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,15 +7,15 @@ uid: Uno.GetStarted.Wizard
77

88
Create a simple cross-platform Counter application.
99

10-
Choose one of the 4 variants of the Counter tutorial, combining markup language (XAML or C# Markup) and presentation framework (MVVM or MVUX).
10+
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.
1111

1212
<!-- markdownlint-disable MD001 -->
1313

1414
<br/>
1515

1616
<div class="row">
1717

18-
<div class="col-md-6 col-xs-12 ">
18+
<div class="col-md-6 col-xs-12">
1919
<a href="getting-started/counterapp/get-started-counter-xaml-mvux.md">
2020
<div class="alert alert-info alert-hover">
2121

@@ -27,7 +27,7 @@ Use XAML for layout and MVUX for state management
2727
</a>
2828
</div>
2929

30-
<div class="col-md-6 col-xs-12 ">
30+
<div class="col-md-6 col-xs-12">
3131
<a href="getting-started/counterapp/get-started-counter-xaml-mvvm.md">
3232
<div class="alert alert-info alert-hover">
3333

@@ -39,7 +39,7 @@ Use XAML for layout and MVVM for state management
3939
</a>
4040
</div>
4141

42-
<div class="col-md-6 col-xs-12 ">
42+
<div class="col-md-6 col-xs-12">
4343
<a href="getting-started/counterapp/get-started-counter-csharp-mvux.md">
4444
<div class="alert alert-info alert-hover">
4545

@@ -51,7 +51,7 @@ Use C# Markup for layout and MVUX for state management
5151
</a>
5252
</div>
5353

54-
<div class="col-md-6 col-xs-12 ">
54+
<div class="col-md-6 col-xs-12">
5555
<a href="getting-started/counterapp/get-started-counter-csharp-mvvm.md">
5656
<div class="alert alert-info alert-hover">
5757

@@ -65,6 +65,21 @@ Use C# Markup for layout and MVVM for state management
6565

6666
</div>
6767

68+
<!-- Centered last item -->
69+
<div class="row" style="display: flex; justify-content: center; align-items: center;">
70+
<div class="col-md-6 col-xs-12">
71+
<a href="studio/Hot Design/hot-design-getstarted-counter-tutorial.md">
72+
<div class="alert alert-info alert-hover">
73+
74+
#### Hot Design
75+
76+
Use a visual designer to design and develop the app
77+
78+
</div>
79+
</a>
80+
</div>
81+
</div>
82+
6883
<br/>
6984

7085
[!include[getting-help](includes/getting-help.md)]

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

Lines changed: 20 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,11 +12,11 @@ The Counter tutorial will walk you through creating a simple cross-platform coun
1212
<img src="Assets/counter-app.png" alt="Screenshot of an Uno Platform app showing a counter" />
1313
</p>
1414

15-
There are four variants of the Counter tutorial, combining markup language (XAML or C# Markup) and presentation framework (MVVM or MVUX).
15+
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.
1616

1717
<div class="row">
1818

19-
<div class="col-md-6 col-xs-12 ">
19+
<div class="col-md-6 col-xs-12">
2020
<a href="get-started-counter-xaml-mvux.md">
2121
<div class="alert alert-info alert-hover">
2222

@@ -28,7 +28,7 @@ Use XAML for layout and MVUX for state management
2828
</a>
2929
</div>
3030

31-
<div class="col-md-6 col-xs-12 ">
31+
<div class="col-md-6 col-xs-12">
3232
<a href="get-started-counter-xaml-mvvm.md">
3333
<div class="alert alert-info alert-hover">
3434

@@ -40,7 +40,7 @@ Use XAML for layout and MVVM for state management
4040
</a>
4141
</div>
4242

43-
<div class="col-md-6 col-xs-12 ">
43+
<div class="col-md-6 col-xs-12">
4444
<a href="get-started-counter-csharp-mvux.md">
4545
<div class="alert alert-info alert-hover">
4646

@@ -52,7 +52,7 @@ Use C# Markup for layout and MVUX for state management
5252
</a>
5353
</div>
5454

55-
<div class="col-md-6 col-xs-12 ">
55+
<div class="col-md-6 col-xs-12">
5656
<a href="get-started-counter-csharp-mvvm.md">
5757
<div class="alert alert-info alert-hover">
5858

@@ -66,6 +66,21 @@ Use C# Markup for layout and MVVM for state management
6666

6767
</div>
6868

69+
<!-- Centered last item -->
70+
<div class="row" style="display: flex; justify-content: center; align-items: center;">
71+
<div class="col-md-6 col-xs-12">
72+
<a href="../../studio/Hot Design/hot-design-getstarted-counter-tutorial.md">
73+
<div class="alert alert-info alert-hover">
74+
75+
#### Hot Design
76+
77+
Use a visual designer to design and develop the app
78+
79+
</div>
80+
</a>
81+
</div>
82+
</div>
83+
6984
<br/>
7085

7186
---

‎doc/articles/studio/Hot Design/Assets/hot-design-feedback-menu.png

12.4 KB
Loading

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

Lines changed: 8 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -21,15 +21,11 @@ This tutorial will guide you through using Hot Design to create a simple counter
2121
> 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.
2222
>
2323
> [!IMPORTANT]
24-
> **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!
24+
> **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!
2525
>
26-
> [!IMPORTANT]
27-
> Currently, **Hot Design** is not supported with C# Markup at this time and is only available with XAML.
28-
>
29-
> [!IMPORTANT]
30-
> 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.
31-
>
32-
> 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.
26+
> - 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.
27+
> - 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.
28+
> - Your input matters! Share your thoughts and help us improve Hot Design. [Find out how to provide feedback here](xref:Uno.Platform.Studio.Feedback).
3329
3430
## Set Up Your Environment for Hot Design
3531

@@ -116,7 +112,7 @@ First, we need to add the image file to the application. Download this [SVG imag
116112
117113
## Run the app
118114

119-
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:
115+
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:
120116

121117
- [Visual Studio](xref:Uno.GettingStarted.CreateAnApp.VS2022#debug-the-app)
122118
- [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.
127123
- [Rider](xref:Uno.GettingStarted.CreateAnApp.Rider#debug-the-app)
128124

129125
> [!IMPORTANT]
130-
> 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.
131-
>
132-
> 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.
133126
>
134-
> [!IMPORTANT]
135-
> If you're using Visual Studio, you can choose to start it with or without debugging.
136-
> If you're using VS Code or Rider, start the app **without the debugger**.
127+
> - If you're using Visual Studio, you can choose to start it with or without debugging.
128+
> - If you're using VS Code or Rider, start the app **without the debugger**.
129+
> - **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.
137130
138131
Now, let's run the app.
139132

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

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -13,15 +13,11 @@ Use this guide to set up Hot Design and start creating and refining user interfa
1313
## Set Up Your Environment for Hot Design
1414

1515
> [!IMPORTANT]
16-
> **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!
16+
> **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!
1717
>
18-
> [!IMPORTANT]
19-
> Currently, **Hot Design** is not supported with C# Markup at this time and is only available with XAML.
20-
>
21-
> [!IMPORTANT]
22-
> 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.
23-
>
24-
> 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.
18+
> - 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.
19+
> - 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.
20+
> - Your input matters! Share your thoughts and help us improve Hot Design. [Find out how to provide feedback here](xref:Uno.Platform.Studio.Feedback).
2521
>
2622
> [!IMPORTANT]
2723
> 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

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,11 @@ uid: Uno.HotDesign.Overview
55
# Hot Design™ Overview
66

77
> [!IMPORTANT]
8-
> **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!
8+
> **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!
99
>
10-
> [!IMPORTANT]
11-
> Currently, **Hot Design** is not supported with C# Markup at this time and is only available with XAML.
12-
>
13-
> [!IMPORTANT]
14-
> 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.
15-
>
16-
> 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.
10+
> - 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.
11+
> - 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.
12+
> - Your input matters! Share your thoughts and help us improve Hot Design. [Find out how to provide feedback here](xref:Uno.Platform.Studio.Feedback).
1713
1814
Welcome to **Hot Design**, a next-generation runtime visual designer for cross-platform .NET applications!
1915

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

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
---
2+
uid: Uno.Platform.Studio.Feedback
3+
---
4+
5+
# Providing Feedback for Uno Platform Studio
6+
7+
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.
8+
9+
Here’s how you can share your feedback:
10+
11+
## 1. GitHub Feedback
12+
13+
Navigate to the [Uno Platform Studio GitHub repository](https://github.com/unoplatform/studio) to:
14+
15+
- **Report issues or bugs**: Share any unexpected behavior or issues you encounter with the tools or documentation.
16+
- **Propose enhancements**: Suggest features or improvements to enhance Uno Platform Studio, its tools, and its documentation.
17+
- **Start discussions**: Engage in conversations about Uno Platform Studio and its tools.
18+
19+
For more details, refer to the [feedback guidelines](https://github.com/unoplatform/studio/blob/main/README.md).
20+
21+
## 2. Hot Design Feedback Menu
22+
23+
You can also provide feedback directly while using **Hot Design** in a live, running application. Use the **Feedback** menu to:
24+
25+
- **Report an issue/bug**
26+
- **Suggest a feature**
27+
- **Ask a question**
28+
29+
Follow these steps to access the feedback menu:
30+
31+
1. Click on the three-dot button in the [Hot Design Toolbar](xref:Uno.HotDesign.GetStarted.Guide#toolbar).
32+
2. Navigate to **Help** > **Feedback**.
33+
3. Choose one of the following options:
34+
- **Report an issue/bug**
35+
- **Suggest a feature**
36+
- **Ask a question**
37+
38+
Refer to the image below for guidance:
39+
40+
![Hot Design Feedback Menu](Hot%20Design/Assets/hot-design-feedback-menu.png)
41+
42+
## Additional Support
43+
44+
For further assistance, visit our [Discord Server](https://platform.uno/uno-discord), where our engineering team and community will be happy to assist you.
45+
46+
For organizations seeking a deeper level of support beyond our community support, please [contact us](https://platform.uno/contact).
47+
48+
We look forward to your feedback and thank you for helping us improve Uno Platform Studio and its tools!

‎doc/articles/toc.yml

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -86,6 +86,8 @@
8686
href: xref:Uno.Workshop.Counter.CSharp.MVUX
8787
- name: C# Markup + MVVM
8888
href: xref:Uno.Workshop.Counter.CSharp.MVVM
89+
- name: Hot Design
90+
href: xref:Uno.HotDesign.GetStarted.CounterTutorial
8991
- name: Simple Calc
9092
topicHref: xref:Workshop.SimpleCalc.Overview
9193
href: external/workshops/simple-calc/toc.yml
@@ -437,6 +439,8 @@
437439
href: xref:Uno.HotDesign.GetStarted.CounterTutorial
438440
- name: Design-to-Code
439441
href: external/figma-docs/toc.yml
442+
- name: Feedback
443+
href: xref:Uno.Platform.Studio.Feedback
440444

441445
- name: Reference
442446
items:

0 commit comments

Comments
 (0)