As part of a wider customer experience (CX) initiative; ‘to be easier to do business with’, our team undertook a review of critical forms on the corporate website. My role was to research the user’s experience, define form UI solutions integrating with the organisations CRM, test prototypes with end users to affirm a risk-free launch. We saw a dramatic rise in customer satisfaction, a significant reduction in customer service calls, and increased completion rates – all contributing to a positive impact on our key performance indicators.
After investigation into customer experience metrics, some key forms on the website were causing customers significant frustration due to manual processes and broken user journeys.
Using a new framework for form UI, digitally transform the most harmful user flow to improve customer satisfaction and retain market share following disruption in the pandemic.
User experience designer and user researcher
The project commenced with a series of in-depth, face-to-face interviews with customer service representatives (CSRs) and customer experience (CX) analysts. This qualitative research aimed to gain a comprehensive understanding of user pain points and common frustrations encountered when interacting with our customer service forms.
The research findings were documented in a comprehensive report for the scrum team. Through collaborative discussion, we identified two critical service areas with the most significant impact on customer experience:
#1 Certificate Services: This service provides users with replacement certificates or amendments to their personal details.
#2 Examiner Recruitment Services: This service displayed vacancies for examiners and facilitated applications. Critical for meeting the business need to grade papers and mark results.
Focusing on these high-impact services as a Minimum Viable Product (MVP) allowed for a faster initial rollout and ensured we addressed the most pressing user needs.
To gain a deeper understanding of the operational workflows and potential technical constraints, I collaborated with key stakeholders across various departments. This included experts from operations, security, and marketing. By forming a dedicated working group, we fostered a collaborative environment conducive to defining a well-rounded MVP that addressed user needs while aligning with business requirements.
With a clear understanding of user needs and the chosen MVPs in mind, the design phase kicked off! Here's how we brought the vision to life:
First things first – user flow diagrams. These visual maps became my compass, charting the user's entire journey through the forms. Every step, every decision point was meticulously documented, helping me pinpoint potential friction points that could trip users up.
Collaboration is key! Workshops brought together stakeholders from various departments to brainstorm and sketch low-fidelity wireframes. The focus here was on the branching logic within the forms, ensuring users wouldn't get lost in a maze of questions. These rough sketches served as a springboard for further refinement.
Once the overall structure was clear, it was time to refine the details. I created detailed design specifications for each form UI component, from basic input fields to more complex search interactions. These specifications ensured pixel-perfect consistency and a user-friendly experience across the board.
The design wasn't complete until it was interactive! An interactive prototype became our testing weapon. Users could navigate the forms, click through buttons, and experience the process firsthand. This prototype was then used for both stakeholder validation – ensuring alignment with business goals – and user testing, where we observed real users interacting with the design and gathered valuable feedback for further iteration.
To ensure a smooth handover to development, I meticulously documented the improved form UI with a comprehensive data dictionary, acting as a single source of truth for consistent implementation. Complex forms were further elucidated through interactive prototypes that explained user flows and communicated design specifications clearly. This collaborative approach minimized launch risks as I actively participated in QA testing, advising on optimizing workflows and identifying potential issues pre-launch. Finally, the successful launch, a testament to teamwork, was a moment of celebration for the entire team.
Post-launch efforts focused on measuring success and ensuring long-term usability. I tracked key performance indicators (KPIs) like form completion rates and customer satisfaction, reporting regularly to the wider business. User behavior was continuously monitored through subsequent development cycles, allowing for ongoing iteration and improvement. Additionally, I collaborated with operational teams to adapt workflows to accommodate potential changes in service demand driven by the improved user experience. Finally, I championed data privacy by supporting our legal team in ensuring all forms and website processes adhered to GDPR regulations.
#1 Think of everything as a system — An unexpected outcome of the redesigned forms was a significant increase in demand for replacement certificates. Although the front-end was performant, the operations team needed additional resource to meet the demand. We later improved the readability of the form XML output so the operations teams could more efficiently priortise requests by perceived urgency.
#2 Design one thing per page — Building forms as single-page applications allowed us to initially split the form across multiple screens. Breaking down questions and decisions helped the users to understand what they were being asked to do and focus on the task without feeling overwhelmed.
#3 Iterate for Continuous Improvement — The project didn't end with launch. Tracking KPIs, monitoring user behavior, and collaborating with operational teams allowed for ongoing iteration and improvement of the forms. The examiner recruitment form is now on it's 4th iteration.
