Typeform’s intuitive creation process

What happens when you mix data collection with beautiful visual design? You get Typeform, an online form building tool that lets users create slick, interactive forms and surveys without any code.

Here’s how easy it is to create a project in the Typeform app:

After a short and simple sign-up process, new users are taken directly to Typeform’s template gallery page to get started. At the top-right corner of the page, users have the option to create their form from a blank canvas by clicking the “Start from scratch” button.

Users who opt to create a form without a template are taken to the “New typeform” dashboard, where a modal window pops up to offer guidance before getting started. In the modal, users also name their project and select the type of project they’d like to create and its purpose.

Filling out the modal form takes users right to the workspace. The next four images demonstrate how a user can simply create their first form.

As users add new text or elements to their typeform on the right side of the workspace, the left side of the workspace shows a live preview of each change as it occurs.

When users on the tool’s free plan revisit the platform, Typeform displays a push-to-paid banner at the top of the page. Within the workspace, users can also see how much of the free plan usage they have available.

What makes this really good UX:

• The Typeform workspace has a clean design without any unnecessary page elements that could distract users as they build their forms.
• The live preview on the right of the page is a great way to show users that they’re in control of the design process. They can see changes as they happen and fix any errors immediately. There’s no need to open up a preview page in a new tab and constantly refresh the workspace page to see changes.
• Bonus points to Typeform for taking advantage of an upsell opportunity via the push-to-paid banner that shows up for returning users on the free plan. The banner serves as a subtle reminder that the user’s access to the product is limited and better features await them once they upgrade.  

What would make this UX better:

• Because it’s so easy to use, Typeform doesn’t offer new users a guided tour of the product or any tooltips upfront. There is, however, a little help icon on the bottom-right corner of the page that takes users to additional resources. It would be great to give users at least one tooltip to point out the help button, since there’s no other guidance offered.

‍