Weavely is a form building plugin for Figma, meaning that in one click you can turn your Figma design into a working form. For that, you just need to select pre-configured form elements from the Weavely component library, style the form, and publish it straight away. Weavely automatically turns your design into a working online form that collects and stores responses from users. But what form elements are there available to create good looking and smart forms? Actually, quite a few!
In the following sections you can find an overview of all the form components Weavely offers.
Basic Form Elements
The foundation lies in the basic form elements. These essential building blocks, including inputs, paragraphs, radio buttons, checkboxes, and dropdowns, are the core of every effective form. And of course, they are also at the core of Weavely's functionality.
Selection Elements
When you need users to make selections from predefined options, Radio buttons and Checkbox buttons offer a user-friendly way to do just that. Customise the choices, and let users pick their preferences effortlessly.
For lists of options that need to be condensed into a single selection, the Dropdown element is the perfect solution. It simplifies user choices and streamlines your forms.
Input Elements
The ability to gather user input efficiently is one of the key steps towards successful response collection. Our Short Answer and Paragraph fields ensure you can collect everything from quick responses to more detailed descriptive comments with ease.
Input elements like Date/Time/Email/Link streamline collection of specific information, and automatically validate that information has been provided in the right format. Users can provide their email addresses, choose dates, and specify times with precision. The form element Date lets your respondents select a date from the calendar, while the Time component can come in handy for appointment scheduling. In the latter case users can choose specific time from the digital clock. Using the form field Email ensures accurate email submissions by restricting input format. Same applies to the Link component, as respondents will not be able to submit the form if the link format is invalid.
Numerical input is yet another quite basic but really useful form element. The Number field is an excellent addition for collecting numeric data. From ages to quantities, you can now ensure that your form can handle a wide range of numerical inputs.
Rating and Ranking Elements
These elements are the most significant to businesses and organisations that collect feedback on a regular basis. Whether it's evaluating customer satisfaction, product performance, or employee engagement, rating & ranking elements enable structured data gathering and data-driven decision making.
In the Weavely component library you can find different elements to rate and rank items.
Star Rating is a widely recognised and user-friendly form element. It is one of the most visually appealing elements and is often used for getting quick feedback from respondents.
When you need to find out respondents' preferences, Ranking is the best form component to do so. Respondents can simply prioritise items by arranging them in a specific order.
Scale rating is the most suitable if you're conducting a survey. Scale ratings offer precision in user feedback and allow for valid statistical analysis. For example, you can use this form element to implement Likert scale questions. You can also easily customise the Scale rating component by defining the scale range yourself.
Slider is a dynamic and engaging addition to form design. It allows users to provide input by sliding a visual marker along a scale. This makes it ideal for tasks like setting preferences, adjusting values, or indicating levels. And it is actually one of our favourite form fields! Using a slider, you can make your form truly stand out. Remember that you can style your form elements in any possible way, making your form looks super custom and unique.
Advanced form elements
The Signature form element captures handwritten signatures directly in your forms. This way, you can build agreements and consent forms with Weavely. Users can easily sign with a mouse, stylus, or touch screen.
For any scenario where location data is valuable, Weavely has a unique form element Location on Map. It allows respondents to pinpoint a specific location directly on a map and gives a clear visual reference within the form.
GPS Location, on the other hand, automatically captures the exact GPS coordinates of respondents. This form element useful for surveys, deliveries, and field data collection. This element ensures accurate location tracking without manual input, saving time and minimising errors.
Embed form elements
These embedding options give you the freedom to create richer, more engaging forms that go beyond simple text and fields — something many other form builders simply don’t offer.
Add audio clips directly into your forms with the Embed audio form element. Perfect for providing instructions, adding context and creating a more engaging experience.
Embed video allows you to include videos into forms. For example, a YouTube video or a video uploaded to the cloud. Videos can guide respondents through the form, explain complex questions, or simply make the form more dynamic and engaging.
Integrate custom HTML code into your form with the Embed HTML form feature. From custom widgets to interactive content and prototypes, the HTML embed allows you to push the boundaries of what’s possible within your forms.
To sum up
These form elements are designed to give you more flexibility and efficiency in creating forms in Figma that suit your unique requirements. Whether you're collecting data, feedback, or preferences, Weavely has you covered. Stay tuned for more updates as we continue to enhance your form-building experience :)
