🤯Concepts

Overview

Tutim provides a powerful structure for working with wizards and data. We understand that everyone has their own way of describing wizards, so we want to introduce you to the terminology we've developed.

This guide will walk you through the core concepts and entities on our platform, as well as their relation to each other. Tutim is an API-first platform, meaning every entity described below can be accessed with an API endpoint.

Form

Also referred sometimes as Wizard, to emphasize the focus on multi-step forms.

Forms are a list of submissions, an API endpoint, and a set of form fields.

We refer to this set of fields as the schema of the form

The form schema is in JSON format, and can be built using the form builder or by writing it from scratch

Every wizard on Tutim is publicly available at a unique URL tutim.io. In addition, wizard schemas can be fetched through our API and then rendered natively into your application or website using our SDK.

Field

A field is an element of a form (like a question).

In Tutim there are multiple field types, referred also as input types.

Field examples are Text, Select, Date, etc.

All fields have a key and a display name.

Fields have few global properties (props) such as their initial visibility, whether it is required or not, its default value, etc.

Some fields may also have specific props that are relevant only to that kind of field.

Field is a major component. Find more details about it:

Keys

Each field also has a key that is used to represent the answer to it in each submission with your form and API integrations. Like always, try to choose an informative key for your field so you can easily recognize it later.

When you add a field to a form in the Tutim Builder, Tutim will attempt to generate this key for you once you're done typing the question title.

When you change a question key, do it with caution, as new submissions with an answer to that question will use the new key, but old submissions will remain as they were with the old one.

Validations

Validate that an input stands in a certain rule.

Validations examples are isRequired, minLength, regEx pattern, etc

For each validation, you can define the error message to display to the respondent, to make it easier to fix.

Styling

As a headless components library, Tutim let you easily configure the wizard UI to your preferred style.

A default MaterialUI design system is used for fast visualized output and can be easily replaced through Tailwind CSS

Use your own design system through the following implementation:

Templates

Tutim provides a forms templates library so you don't have to start from scratch.

Need a feedback survey? We have it ready for you.

After you cloned the template, feel free to make any customizations you need

Last updated