MLK_DAY_BAN1.9.jpg

Web Form Redesign

We wanted to decrease the number of abandoned search, increase online registrations and improve interactive program elements. The focus was on getting kids to participate in community service projects and activate student volunteerism in grades K-8. 

Problem

A high percentage of attendees weren't registering online, which made planning difficult. The organizers also weren't able to provide information or follow-up for future events, measure impact, or gain data and feedback for program improvements.

COPYWRITING | NAMING SYSTEMSDESIGN RESEARCH,USABILITY TESTINGWIREFRAMING

Process

To learn more about what the user journey was, I recruited participants through a screening survey, managed logistics, and wrote the test script for the study. I conducted the test sessions, and a colleague took notes. We synthesized our observations and evaluated the web form using design and communication best practices.

I created a wireframe of my design recommendations and presented these with our findings to stakeholders.

A-ha! moment

In each usability test, people skimmed the form and missed key information, which led to mistakes.

The form was cluttered with explanations and caveats. Also, a negative tone decreased people’s willingness to absorb the content.

Outcome

We reported our findings to stakeholders, and I made design and language changes based on the data and best practices for form design.

The redesigned web form was implemented in 2017. Successful online registrations increased by 90% with nearly all attendees registering online.

10 Best Practices for Web Forms

  1. Succinct, clear labels
  2. Contextual on-task instructions
  3. Status indicators to help users complete forms
  4. Ability to save data
  5. Autofill capabilities
  6. Confirmation of successful completion 
  7. Minimal input requirements (email, name vs. name, phone, address etc)
  8. Qualifying elements
  9. Identifying factors (which school, kids ages)
  10. User feelings (what would you do, rate this process)