Improve starters v25

articles/getting-started/starters/index.adoc

@@ -3,43 +3,12 @@ title: Starters
 page-title: Different ways of starting a Vaadin project
 description: Learn about different ways to start a Vaadin project.
 meta-description: Discover different ways to start a Vaadin project, including non-Spring Boot starters and different setup methods beyond the recommended approach.
-layout: tabbed-page
-tab-title: Overview
 order: 20
 ---
 
 
 = Different Ways of Starting a Vaadin Project
 
-
-== Vaadin Start
-
-The recommended way to start a Vaadin project is by using https://start.vaadin.com[Vaadin Start], which generates a ready-to-run Spring Boot and Maven based project.
-
-link:https://start.vaadin.com/[Open Vaadin Start, role="button primary water"]   
-
-You can choose to include a sample view or create an empty project.
-
-
-== IDE Plugins
-
-If you have <<../dev-environment/install-ide#,installed the Vaadin plugin for your IDE>>, you can create a new Vaadin project directly from the IDE. Under the hood, the IDE plugin uses Vaadin Start to generate the project. This means you can choose to include a sample view or create an empty project.
-
-
-== Non-Spring Boot Templates
-
-If you prefer a different technology stack than Spring Boot and Maven, you can find _Hello World_ starter templates for other frameworks here:
-
-* https://github.com/vaadin/skeleton-starter-flow[Flow / Java, Maven, and Jetty]
-* https://github.com/vaadin/base-starter-flow-quarkus[Flow / Java, Maven, and Quarkus]
-* https://github.com/vaadin/base-starter-spring-gradle[Flow / Java, Gradle, and Spring Boot]
-* https://github.com/vaadin/skeleton-starter-kotlin-spring[Flow / Kotlin, Maven, and Spring Boot]
-* https://github.com/vaadin/skeleton-starter-hilla-react-gradle[Hilla / React, Gradle, and Spring Boot]
-
-
-[IMPORTANT]
-Some guides, such as <<{articles}/getting-started#,Getting Started>> and <<{articles}/building-apps#,Building Apps>>, may not fully apply to projects that are not based on Spring Boot and Maven.
-
-== Other Ways to Start a Project
+You can create a new Vaadin project in several ways:
 
 section_outline::[]

articles/getting-started/starters/start/index.adoc

@@ -0,0 +1,26 @@
+---
+title: Vaadin Start
+page-title: Create a Project with Vaadin Start
+description: The recommended way to start a Vaadin project.
+meta-description: How to create a Vaadin project using Vaadin Start, the recommended way to start a Vaadin project.
+order: 1
+---
+
+= Create a Project with Vaadin Start
+
+The recommended way to start a Vaadin project is by using https://start.vaadin.com[Vaadin Start], which generates a ready-to-run Spring Boot and Maven based project:
+
+[.device]
+image::images/start.png[Vaadin Start]
+
+link:https://start.vaadin.com/[Open Vaadin Start, role="button primary water"]   
+
+You can choose to include a sample view or create an empty project.
+
+By expanding the *Configure Project Settings* section, you can customize the project settings:
+
+* Select Vaadin version
+* Select Java version
+* Specify Maven group ID and artifact ID
+
+When you click the [guibutton]*Download* button, a ZIP file containing the generated project is downloaded to your computer. You can then extract the ZIP file and <</getting-started/dev-environment/import#,open the project in your favorite IDE>>.

articles/getting-started/starters/start/playground/index.adoc

@@ -0,0 +1,70 @@
+---
+title: Playground
+page-title: Create a new Vaadin project using Vaadin Start Playground
+order: 20
+description: Description of possibilities with Vaadin Start Playground.
+meta-description: Create a Vaadin project using Vaadin Start Playground, a tool that allows you to visually create a custom Spring Boot based Vaadin Flow or Hilla app starter.
+---
+
+
+= The Vaadin Start Playground
+
+The Vaadin Start Playground online interface allows you to manage, configure and download the core of functional Vaadin projects. You can use them as a starting point to create your own Vaadin applications. Even more so, they allow you to do several fundamental things, easily.
+
+image::_images/example-project.png[Project Built with Vaadin Start Playground UI]
+
+https://start.vaadin.com?preset=latest[Open Vaadin Start Playground, role="button primary water"]
+
+
+== Manage Projects
+
+With Vaadin Start Playground, you can work on multiple projects. You can find a list of your projects in the `My Projects` section. You can download your project from there, directly.
+
+.Projects List
+image::_images/my-projects.png[height=75%, width=75%, List of Projects]
+
+
+== Add Views
+
+Vaadin Start Playground allows you to add several views to your project. You can select the initial content of each view from a list of more than fifteen Flow and Hilla templates. For example, you can include views based on the Master-Detail template, which can be used to manage an entity's data.
+
+The screenshot here shows the Vaadin Start Playground UI with the Add View dialog open, showing the Master-Detail template selected:
+
+.Master-Detail Template
+image::_images/master-detail-template.png[Vaadin Start Playground UI with Master-Detail Template Selected]
+
+You can then add and modify JPA entities. These entities are downloaded with the generated project, along with their corresponding Spring Data classes, such as the [classname]`Repository` and [classname]`Service`. You can see the relevant parts highlighted in the screenshots here:
+
+.Edit Data Entity
+[.fill.white]
+image::_images/edit-entity.png[Edit Entities, width=100%]
+
+
+== Login & Access Control
+
+You can also configure security and control access. A login view is added if you configure one or more views that require a logged-in user.
+
+In this screenshot, you can see the Vaadin Start Playground UI with the view details popover open, showing the options for the View Access control:
+
+.View Access Control Setup
+image::_images/security-setup.png[Vaadin Start Playground UI with View Access Controls, width=60%]
+
+
+== Customize Theme
+
+Vaadin Start Playground lets you easily change the look and feel of the application. Specifically, you can adjust the application's colors, typography, style, sizing, and spacing.
+
+This next screenshot shows the Vaadin Start Playground UI with the Theme sidebar active, showing the color palette options:
+
+.Theme Customization
+image::_images/customize-theming.png[Vaadin Start Playground UI with Theme Color Palettes, width=40%]
+
+
+== Technical Configuration
+
+You can also add helpful project settings. For example, you can generate the deployment files for Docker, and Kubernetes. Or you can select between H2 and PostgreSQL as the database to use for the project.
+
+This screenshot shows the Vaadin Start Playground UI with the Download Project dialog open, with all of the project settings shown:
+
+.Download Project Dialog
+image::_images/download-dialog.png[Vaadin Start Playground UI with Download Project Dialog]

articles/tools/start/view-builder/index.adoc → articles/getting-started/starters/start/playground/view-builder/index.adoc

@@ -2,26 +2,26 @@
 title: Editable Views
 page-title: How to create custom views with Visual View Builder | Vaadin
 description: Visual View Builder enables you to create new views with custom layouts and components without touching code.
-meta-description: Discover how to use Visual View Builder in Vaadin Start to design custom views with drag-and-drop functionality.
+meta-description: Discover how to use Visual View Builder in Vaadin Start playground to design custom views with drag-and-drop functionality.
 ---
 
 
 = Visual View Builder
 
-Visual View Builder is a tool in the Vaadin Start application generator. It allows you to assemble custom views by dragging and dropping items into place. When you're done, you can download and run the application locally, or share a preview with others.
+Visual View Builder is a tool in the Vaadin Start playground application generator. It allows you to assemble custom views by dragging and dropping items into place. When you're done, you can download and run the application locally, or share a preview with others.
 
 Visual View Builder generates the required code declarations, configurations, and sample data for your application.
 
 .Theming & Other Features
 [TIP]
-Visual View Builder is part of Vaadin Start. You can customize the application theme, settings (e.g., Java version), and more before downloading or sharing the application.
+Visual View Builder is part of the Vaadin Start playground. You can customize the application theme, settings (e.g., Java version), and more before downloading or sharing the application.
 
 
 == Creating a Project with Custom View
 
-Go to `https://start.vaadin.com` and start new project. After opening a project, click [guibutton]*+ Add View*. Then choose [guilabel]*Layout with Content Areas* from the list and confirm. This opens View Builder.
+Go to `https://start.vaadin.com` and start new project in the playground. After opening a project, click [guibutton]*+ Add View*. Then choose [guilabel]*Layout with Content Areas* from the list and confirm. This opens View Builder.
 
-image::images/view-builder-start.png[Add New View Builder View to a Vaadin Start Project]
+image::images/view-builder-start.png[Add New View Builder View to a Vaadin Start playground Project]
 
 
 === Building a View

articles/getting-started/starters/templates.adoc

@@ -0,0 +1,22 @@
+---
+title: Templates
+page-title: Vaadin Project Templates
+description: Clone a template project to create a Vaadin application with a different technology stack.
+meta-description: How to create a Vaadin project by cloning a template for a different technology stack.
+order: 2
+---
+
+
+= Create a Project by Cloning a Template
+
+If you prefer a different technology stack than Spring Boot and Maven, you can find _Hello World_ starter templates for other frameworks here:
+
+* https://github.com/vaadin/skeleton-starter-flow[Flow / Java, Maven, and Jetty]
+* https://github.com/vaadin/base-starter-flow-quarkus[Flow / Java, Maven, and Quarkus]
+* https://github.com/vaadin/base-starter-spring-gradle[Flow / Java, Gradle, and Spring Boot]
+* https://github.com/vaadin/skeleton-starter-kotlin-spring[Flow / Kotlin, Maven, and Spring Boot]
+* https://github.com/vaadin/skeleton-starter-hilla-react-gradle[Hilla / React, Gradle, and Spring Boot]
+
+
+[IMPORTANT]
+Some guides, such as <</getting-started#,Getting Started>> and <</building-apps#,Building Apps>>, may not fully apply to projects that are not based on Spring Boot and Maven.

articles/hilla/lit/reference/gradle.adoc

@@ -255,7 +255,7 @@ gradlew hillaGenerate
 
 .Vaadin Gradle Plugin Has Other Tasks
 [NOTE]
-Note that there are other tasks provided by the Vaadin Gradle plugin such as `vaadinPrepareFrontend` and `vaadinBuildFrontend`, and as they are not Hilla specific tasks that are not covered in this tutorial. For more information, please see <<{articles}/getting-started/alternatives/gradle#, Starting a Vaadin Project with Gradle>>.
+Note that there are other tasks provided by the Vaadin Gradle plugin such as `vaadinPrepareFrontend` and `vaadinBuildFrontend`, and as they are not Hilla specific tasks that are not covered in this tutorial. For more information, please see <<{articles}/getting-started/starters/gradle#, Starting a Vaadin Project with Gradle>>.
 
 [#_all_options]
 == Plugin Configuration Options

articles/tools/index.adoc

@@ -26,16 +26,6 @@ Edit your application directly in the browser yourself or ask the AI copilot to
 <<{tools-path-prefix}copilot#,See Copilot>>
 
 
-[.card.large]
-=== Start
-
-Kickstart your Vaadin project with ready-made view templates and get the project up and running without manual configuration.
-
-[.sr-only]
-<<{tools-path-prefix}start#,See Start>>
-
-
-
 [.cards.large.quiet]
 == Acceleration Kits