JotForm Inbox
Case Study

PROJECT

JotForm Inbox

DISCIPLINES

Research
User Interface
User Experience
Product Owner

INFO

JotForm is an online forms platform that helps customers across roles and industries create custom online forms and collect data, all without needing to write a line of code. Enjoyed by more than 5 million users worldwide, JotForm is a B2B SaaS productivity tool that helps people, teams, and companies automate data collection and streamline processes.

jotform-inbox-herojotform-inbox-hero

Background

JotForm Inbox is exactly what it sounds like — an email-esque inbox that gives users more control over how they view and sort their form submissions.

My Role

I was responsible for user research with the UXR team, user experience design, wireframes, visual design, interactive prototypes and leading the team of developers with the ownership of the product.

Objective

Our primary role was simple, change the way users search, organize, and manage their form submissions with a proposed design solution and validation.

designthinkingdesignthinking

Empathize

Problem

JotForm is used by more than 5 million users. That leads us to different kind of customers. When I joined the company, I started to empathize with users. I saw some problems in the old submissions page. For defining these problems, we started to interview with our users, and we started to identify different problem statements.

Old Submissions Page

jotform-old-submissions-page-bigjotform-old-submissions-page-big

Old Submission Page
- Known Problems

  1. Difficult to see list
  2. Hard to search in submissions
  3. Hard to differentiate unread submissions
  4. There is a flag button which has a negative state
  5. Hard to understand the new submissions
  6. Printing a document is a problem

    Bonus: Users want to change their question order to see what they need immediately.
    They want to change their question order and separate from the form layout.


After conducting many user interviews, usability tests and tracking various metrics across the board for quite a while, with the help of full story that we can see users' behaviors, it was clear that the experience of seeing a submission was essentially time-consuming and not responsive at all. Which they lead to looking at only from the notification emails.

Define

User Overview

In the process of building JotForm Inbox, me and our user research team interviewed several beta users to learn how they were incorporating submissions into their workflow. What we discovered is a diverse collection of organizations using JotForm forms in entirely different ways but bound by a single need: to see and manage data easily. Marketing Managers: to support marketing efforts HR Managers: to simplify the hiring process Sales Representatives: to keep track of orders Supporters: to collect feedback data and monitor

Findings

At this stage, I did a bit of brainstorming and came up with a few ideas aimed at resolving the issues that were uncovered during my interaction with the users at the interview stage. We’ve built features in our new Inbox tool to provide several different types of user profiles:

- Users who want to see their submissions various device
- Users who take out their submissions print away
- Users who want to collect, tag and monitor their data easily

jf-findingsjf-findings

Ideate

Design Strategy

Although JotForm Inbox was born out of a desire to improve our old submissions page, conversations with people who used our product prompted us to rethink our approach. Therefore, I established our design strategy on these 3 pillars:

- Aim for a low barrier of entry and learning curve by increasing the discoverability and findability of features, as well as utilizing progressive disclosure.
- Achieve consistency through standardization of interaction patterns and the creation of a UI Framework.
- Allow people to see submissions anywhere, anytime so that reading submissions can become an important part of the daily workflow, like spreadsheets or word processors.

01

User Journeys

Based on their sharing, I have 2 simple user journeys to map their process of reading data and taking action on the data. These journeys I use for further understanding of their hard time doing it. Some observations from their behaviors when performing tasks in these flows and their feedbacks let me define their pain points.

02

Proposed Solutions

Straightforward as it sounds, solutions come from reasons. Solving submissions list straight to the point as users feel painful because they cannot find submissions easier.

As users know the time they could read the submissions purposely, I came up with add some sort of new read/unread visual to make submissions more seeable.

03

Wireframes

At this stage, I tried to still limit my focus to the flow and functionality of the product while also including some interface details to give more clarity to the purpose of each screen. This allowed me to rapidly test and improve my ideas before moving on to design the interface properly. To do this I tried to include this page into the new Sheets project.

04

User Testing, Feedback & Iteration

I tested the wireframes with a different set of users and made a few notes which were largely reflected in the hi-fidelity designs except the whole idea itself. The key updates I made to the design based on the feedback and observations I made while testing the wireframes.

User testing and feedbacks show me that I'm on the right path to focusing on the new product idea and design.

Make reading easier.
Familiar look.
Speeds up workflow.
Easy to skim.
Simple search.
Mobile compatibility.
Elegant look.

Make Reading Easier

A new design of the submission view reading area is like a paper to make reading easier.

Familiar Look

There is a shallow learning curve to using the new product — it mirrors an email inbox, which makes the UX feel familiar to users

Mobile Compatibility

Users can easily check their inbox on a mobile device or tablet and access all of the same features they have on a desktop computer

Easy to Skim

This tool allows users to easily scan and skim their submissions.

Simple Search

Users can effortlessly search for and find specific submissions with zero hassle.

Speeds Up Workflow

Users can simply flip through each submission and see them at a glance.

User Interfaces

jotform-inbox-new-layoutjotform-inbox-new-layout
jotform-inbox-replyjotform-inbox-reply
jotform-inbox-advanced-filterjotform-inbox-advanced-filter
jotform-inbox-no-headerjotform-inbox-no-header
jotform-inbox-alignment-viewsjotform-inbox-alignment-views
jotform-inbox-unreadjotform-inbox-unread
jotform-inbox-mobile-primaryjotform-inbox-mobile-primary
jotform-inbox-mobile-secondaryjotform-inbox-mobile-secondary

Key Takeaways

To support marketing efforts.

Christian Clansky directs a marketing department at nonprofit Independent Sector, and his team uses JotForm to collect applications for event programming, webinars, and more.

“I really like the fact that I can scroll through all the submissions instead of trying to click. The design and UX are great. What I like the most is that it mirrors an email inbox — it’s intuitive and functions in a familiar way. Everyone on my team would know what to do here.”

—Christian Clansky, Independent Sector

To simplify the hiring process.

With tons of applications to sift through and vet, hiring can be a pain. But one of our HR director users, Darren Brooke, from Clay County Minnesota has figured out a way to streamline this process.

“The new tab is better to see every submission in one really quick way. It’s nice to see how many applicants we get.”

—Darren Brooke, Clay County Minnesota

To keep track of orders.

Taking orders and receiving payments isn’t easy unless you have a powerful tool to rely on. Peyton Ortiz is a manager at Active RV Upholstery Center. She oversees her company’s orders and collects customer information. 

"I rely on JotForm Inbox when I need to pull up information quickly, saving my from spending time searching for submissions. I also love the spacious and clean look of JotForm Inbox."

—Peyton Ortiz, Active RV Upholstery Center