Do you need to empower your product owners or domain experts to help design a UI for a Java application? Are you prototyping new views to share internally or externally? Do you want a head start on developing a new app or a screen? The Visual View Builder is an effective solution for all of these questions.
As a low-code tool, it enables both developers and non-developers to collaborate on the UI design of your application. Anyone can design a custom view by dragging and dropping UI components, from simple buttons to grids to complex text editors, into place. You can even customize the appearance to your liking, i.e., changing the color of components or using a dark theme variant. Share the results with your team or your users for feedback.
Once you are happy with the view, you can generate and download the code with just the push of a button. The views are bundled into a pre-configured latest version Vaadin Flow application that is ready to run and can be further developed.
The low-code Vaadin Visual View Builder is built into the Vaadin Start online interface where you can create, download, and share Vaadin applications, arguably the fastest and easiest way to create a Vaadin Flow app with custom views. Visual View Builder is currently available in free preview and can be accessed by anyone with a Vaadin account.
Log in and go to start.vaadin.com if you’re eager to get started!
How does it work?
The simple steps are:
- Go to Vaadin Start
- Select the Views tab
- Click + Add view
- Select Visual View Builder
You can find details in the documentation, but it's easy enough to just try it out. It’s the best way to test out the low-code approach and see how you can use it with your organization. Please note that Visual View Builder is in Preview and you can submit feedback if you run into issues by submitting a ticket.
What’s the next step?
Once you’ve built your view, you can share a link to your work so that others can collaborate. Share a link in view-only mode, or use edit mode if you want them to be able to make changes to the app.
To enable others to collaborate on further development, publish the code to a GitHub repository. You can also download the application as a ZIP archive, extract the files, and run the application locally.
You can run a Vaadin application directly from your command line with ./mvnw for Windows or .\mvnw for Linux and Mac. Alternatively, you can import the application to your IDE of choice and run the main method.
Depending on what you want to do next, the Vaadin Docs contains articles from business logic to cloud deployment.
The big picture
Low-code is bridging the gap between designers and developers: Tools like Visual View Builder can be utilized by both personas to build something a user can try without creating a standalone click-through prototype or spending time creating a user-friendly interface for code.
We constantly strive to improve your developer experience by minimizing routine toil so that you can focus on what matters most: your users. We recently released two other low-code tools that can help you develop faster. The Visual Theme Editor enables you to customize the look and feel of your application through a visual interface, without the tedious work of tweaking CSS. Additionally, the Component Locator opens the corresponding code in your IDE when you select a component in view. Please give them a try and share your feedback with us. We value your input, and it will help us further improve them and enhance your experience;
Try Visual View Builder
Enough talk; go to https://start.vaadin.com already!