Trying conversational forms

Just recently I found about this tool — it’s developed by SPACE10. They recently published an introductory article about conversational forms.

Simply report your problem, as over the phone.

Idea background

I thought I could make a small demo about a project I worked few years ago, that could benefit from having quick conversation about a topic, rather than filling in a form. The project was called and was developed by few people from a non-profit organisation Obshtestvo. The idea of the project was that anyone can be a user of this platform for reporting problems encountered in city life. Fast-forward, the platform grew into another site (as far as I know) which servers similar purpose.

User Story

A user scenario involves a person to login in an app/website, fill in a form with his name, location, problem picture and details, in order for the local municipality to have awareness of the issues. Normally, this is a task for building a form with the corresponding fields, which could look like this:

The interesting part comes after clicking on the “Conversation input” link near the title, which transforms the form into a chat-like conversation between the user and the form.

Notice that in this example implementation the file attachment is made in a way to facilitate the user to upload the image of the issue and its short description by an input placeholder.

Technical implementation

With the basics I tried, it was pretty straight-forward — as described in the documentation, it’s based on using `cf-` namespace attributes and the conversation is created by a constructor or by a jQuery plugin style. The official example demonstrates a mix.

Basically, the implementation could be as simple as:

(() => {
document.getElementById("toggle-conversation").onclick = () => {
if (!window.ConversationalForm) {
window.ConversationalForm = new cf.ConversationalForm({
formEl: document.getElementById("problem-report"),
context: document.getElementById("problem-report-wrapper")

Further thoughts

This small project demonstrates enough basis for good impressions by conversational-form. I believe it could be used for any application which requires fast and effective user interaction, focused on collecting structured information by leading the user step by step. This tool transforms your form in a true wizard ;)

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.