The Process
The application framework was built on Material Design + React. The design system utilizes Material Components that were customized to align with the company’s branding guidelines. Wireframes, mockups and prototypes were completed with Adobe XD.
Research & Workflow
I partnered with the Sales and Change Management Teams to interview internal users about the email and phone assistance provided by users having issues. The interviews revealed that the instructions were misleading. I also researched the users in action by using LogRocket to analyze user sessions. The sessions showed the majority of drop-offs occurring on one particular step in the workflow. This caused me to take a deeper look at the copy used to instruct the users during each step of the process.
The Solution
In addition to the copy edits, I adjusted the workflow order. In its initial iteration, the password was created in the first step and then the user was instructed to log in to complete additional steps, but this message wasn’t a focal point and could easily be missed. This gave users a false impression that their activation was complete and they could log in at their convenience. After reordering the flow, the password was created in the last step. Once the password was created, the activation was complete and the user could elect to log in. Following these modifications, the new flow and copy provided much-needed clarity and activation workflow completions increased by 90%.
The first release contained headers that were vague and uninformative. The copy instructed the user to log in, but didn’t clearly indicate that the activation process would be incomplete without performing this step.
First, it was crucial to clean up the copy so that the header of each step in the workflow was aligned with the action performed on the page. To alleviate the user’s confusion, I edited the body copy to clearly define the action taken and the user’s stage in the activation process.
