Boston-based Product Designer
Editor-Light-2.jpg

Custom form builder

 

Case study

building custom forms

TOWERIQ | LEAD DESIGNER | 2019-20

Leventhal-Editor-Optimized.jpg
 

Background

The backbone of insurance is forms. In addition to the standard ACORD forms, each broker and carrier may have their own set of questions for prospective clients. This leads to prospects filling out a deluge of forms for one simple transaction, oftentimes re-filling the same information across forms—creating opportunities for errors and omissions that slow down the process or even expose companies to liability.

We saw a way to streamline this process by building a WYSIWYG editor that would allow brokers to recreate their forms digitally, and then compile them into comprehensive applications to send out.

The process

01: discovery

Technical scope: Our engineering team had designed a bare bones editor for internal use, but it was difficult to use. I worked with the engineers to document the existing features and how they worked.

User needs: I worked with our C-suite and customer success team to define what functionality the average broker would need, their workflows, and who our core audiences would be.

Early planning for core editor features

Early planning for core editor features

Internal feedback: I conducted sessions with internal V1 editor users to better understand their workflow and gather feedback. Internal users of the existing editor expressed that, in order to easily create forms, they needed a cleaner user interface with a user-friendly layout. They needed to easily preview forms to see what it would look like for clients, and to switch between basic and advanced options.

 “I need to constantly switch back to see what I'm putting in. Also, on a screen of my size, having to pull the bottom part up and down to see is annoying.” 

“It took me forever to find how to add a logo, and then I was like, ‘How do I get it on the screen? Why is there text under it? Why is it so big?’ I looked everywhere for how to make it bigger and smaller. It’s ginormous. Also, the title is showing up? I have no idea why it’s here.”


02: STRATEGY

With the information from our discovery phase, we focused on two distinct audiences for this tool.

Internal editor users

  • Goal: Quickly build 100+ forms for our initial form library

  • Priorities: Speed and advanced form and publishing options

  • Size: Smaller share of users once major task is completed

  • Characteristics: Very tech-confident; used to towerIQ platform

External editor users

  • Goal: Easily build their smaller library of custom forms and add business logic

  • Priorities: Easy to use and better than current process

  • Size: Eventually a larger share of users

  • Characteristics: Less tech-confident; will quickly abandon a new tool if it doesn’t make sense and/or immediately show value to process


03: Exploration & iteration

Base.png

Early exploration of editor

This was one of the first “full-screen experiences” in towerIQ, so I tried a different layout that would be visually linked to the rest of the platform but leave more room for functionality.

Feedback: We scrapped the top navigation for extra space. Overall a positive direction, but needed to be cleaned up for accessibility, contrast, etc.

Final visual deliverables