Objectives

To improve the event registration module and improve client satisfaction throughout the product.

My Part

Qualitative & Qualitative Research, Competitive Analysis, UI/UX Design, User Flows, Mockup Designs, HTML & CSS Prototypes

Team

UI/UX Designer (me), Product Owner & Ten Overseas Developers (Bolivia)

Timeline

10 months doing the Agile Methodology with 2 week sprints

netFORUM Pro SaaS software provides a complete set of membership management features, easy to use reporting and enhanced tools to allow associations to easily interact with members and strengthen member engagement.

What Is The Problem We Are Trying To Solve?

Our customers where complaining that the product's registration module used to sign up people at trade show or conversations was too long and not easy to follow. How do we reduce the number of steps so people can easily compete the process?

Key Goals That Need To Be Achieved

The main goals of this project where to:

  • Reduce a 12 step registration process and help increase our customer's conversion rates.
  • Update the UI so it would match the new Abila Brand Standards
  • Improve general UX within the application

My Role & Responsibility

As the UX/UI designer for this project, my role was to collaborate with product owner and design the new workflow of the module.

I worked closely with our development team to determine what strategy would be best to improve the registration module.


The Process


What Methodology to use? Hmmm...

I picked the Lean UX approach because it focuses on the experience under design and is less focused on deliverables than traditional UX This way I could obtain feedback as early as possible. It required a greater level of collaboration with the entire team and being the only designer, I needed to speak with the developers as much as possible. Also, Lean UX mimics the Agile life cycle we were in the beginning process of adapting to, so it fit perfectly.

Discovering Our User’s Journey

My first step was to map out the current event registration flow in order to identify friction and how I might be able to simply it.

The old workflow shows a very long process that users had to complete to finish their task.

A heuristic evaluation was performed by defining criteria to identify weaknesses and strengths of the application. The results showed we had three large problems in:

Navigation

  • Inconsistence with the navigation
  • Hyperlink font is to small and bit difficult to read
  • Pop-up windows sometimes worked and other times not
  • Number of steps to complete a task is to many
  • Contextual navigation aids are not following standardizations

Architecture

  • Language and phrases were not familiar to user. Some labels are hard to understand
  • Organizes screen information in a natural and logical order was sometimes not present
  • There was some assistance for novice users (tooltips, helper text, inline help, etc.) without slowing down experienced users.

Interaction

  • There is no aided data entry for example word completion, pre-selected defaults, or automatic correction
  • Error messages are very small and appear in inconsistence places
  • No real-time data validation of entry fields involving data that needs a specific format
  • Most of the entry boxes have a strange skeuomorphic gradient that needs to be removed or reduced to 1 or 2 pixels
  • Contextual navigation aids are not following standardizations

Next, I performed remote interviews on 8 current customers of the application. The interviews took approximately 30 minutes and use usability scripts that I wrote with open ended questions I felt would help me understand their concerns. The scripts gave the users a series of task to perform. The goal was to see how well they completed the tasks and then I would ask if they were excepting that action or what are your thoughts on the layout.

80%

Found the workflow to register people to long and cumbersome

75%

Wanted a newer look to the product

25%

Found the flow to be ok but needed some improvements

Who is our user?

Based on the research two personas emerged; the Database Manager and the Membership Manager.

Pamela

DATABASE MANAGER

“I appreciate an application that is easy to use and can be customized for specific user types or roles.”

Bio
  • 52 year’s old, female
  • 3 and half years of experience working at a medium-sized nonprofit
  • Volunteers a minimum of 8 hours a week with her organization’s external events
  • Bachelors Degree in Information Systems
Goals
  • A robust reporting tool that is flexible, customizable, yet easy to pull reports
  • A product that limits a user from entering invalid data and offers error-prevention
  • Software that is very intuitive to limit the learning curve and training needed for new employees
  • Software that has reliable import and integration capabilities
Behaviors
  • Responsible for establishing job specific workflows to keep staff on track
  • Pulls comprehensive, on-the-fly reports often requested by her coworkers
  • Runs monthly, quarterly, and annual reports so management can review the overall health of their organization
  • Ensures that all data entered is accurate, up-to-date, and easily accessible

Sara

MEMBERSHIP MANAGER

“I need confidence that the system is accurately capturing and reporting my data because I put a lot of time and effort into it.”

Bio
  • 40 year old, female
  • 5 years of experience as a Membership Manager of an association
  • Graduate Degree
  • Using netFORUM Pro for 4 years
Goals
  • Accurate membership billing
  • Membership retention
  • Up to date membership reporting and trends
Behaviors
  • Handles daily processing and inquiries
  • Wears multiple hats to accomplish all necessary tasks
  • Performs repetitive and tedious daily tasks

Keeping in mind Sara the Membership Manager, Pamela the Database Manager and how their customers use the application I began to develop a new workflow that would reduce the amount of steps a user would need to go through to register for an event.

One of the many whiteboarding session I had to come up with a new solution.

Behold after much whitboarding, working with our product owner I came up with a solution that took the registration workflow steps from 12 down to 4! Pamela, Sara and their customers are going to be so excited when they use this new process.

With the new workflow both Pamala and Sara can easily see what steps they are in and what they need to complete. Also, if the need to register a group it is easier to complete.

With the new workflow finalized, and a list of other enhancements that we received from the heuristic review it was time to start the wireframing process. During this process I also did some user testing and discovered users enjoyed the new process but were still getting suck on a few things. This helped me to go back to the whiteboard to see how I could create a solution for these new issues.

With the new registration workflow Pamela:

  • Can have less columns to index in the database
  • Can pull reports on registrants with less time
  • Has database enhancements that where made by the developers

With the new registration workflow Sara:

  • Has the knowledge that her members will have a higher conversion rate for registering events
  • Can retain memberships easier
  • Will not have agree members complaining about not completing tasks
A few of the wireframes the detail the new Four Step Workflow.

Final Design

Understanding how Sara and Pamela use the application lead me to designed an interface that was clean and simple to navigate. Making sure they and their customers don’t have to think about how to use it was a priority.

A detail view of Step 2 and how a user selects a session for themselves and guests in the new design.
The old UI/UX of the Registration Workflow (Yuck!)

Let’s test our solution with users

When we launched the new release I did more user testing to see if user where finishing the new workflow. Here was my approach and results from the testing.

Methods

  • Usertesting.com
  • One on one interviews with users

Techniques

  • Survey
  • A/B testing of the new user flow

Results

  • We discovered that the users enjoyed the new UI and user flow of the module.
  • Testing also revealed that they were getting suck in the middle of the new flow. We analyzed our findings and found a new solution. With redesigned and testing the user was getting through the new workflow with ease.
Chart showing improvment results with the new registration workflow

What did we learn today?

  • Research is VERY important: The user survey revealed unexpected information and made it possible to adapt the product to users’ needs.
  • Personas are powerful: Being aware of users’ needs helped me to create a seamless experience for our users.
  • The user is always right: Conducting user testing and evaluating users’ feedback at various stages helped me to discover and eliminate issues during the process.

What is Next?

The team will continue to do user testing and surveys with our users to find new enhancements and any other issues they might come across.